Merge branch 'feat/pagination' of github.com:makeplane/plane into feat/pagination

This commit is contained in:
pablohashescobar 2024-03-22 19:40:39 +05:30
commit b4416b9172
19 changed files with 173 additions and 106 deletions

View File

@ -119,6 +119,20 @@ export const BaseCalendarRoot = observer((props: IBaseCalendarRoot) => {
[fetchNextIssues]
);
const getPaginationData = useCallback(
(groupId: string | undefined) => {
return issues?.getPaginationData(groupId, undefined);
},
[issues?.getPaginationData]
);
const getGroupIssueCount = useCallback(
(groupId: string | undefined) => {
return issues?.getGroupIssueCount(groupId, undefined, false);
},
[issues?.getGroupIssueCount]
);
return (
<IssueLayoutHOC storeType={storeType} layout={EIssueLayoutTypes.CALENDAR}>
<div className="h-full w-full overflow-hidden bg-custom-background-100 pt-4">
@ -145,8 +159,8 @@ export const BaseCalendarRoot = observer((props: IBaseCalendarRoot) => {
/>
)}
loadMoreIssues={loadMoreIssues}
getPaginationData={issues.getPaginationData}
getGroupIssueCount={issues.getGroupIssueCount}
getPaginationData={getPaginationData}
getGroupIssueCount={getGroupIssueCount}
addIssuesToView={addIssuesToView}
quickAddCallback={issues.quickAddIssue}
viewId={viewId}

View File

@ -49,7 +49,7 @@ export const BaseGanttRoot: React.FC<IBaseGanttRoot> = observer((props: IBaseGan
});
const issuesIds = (issues.groupedIssueIds?.[ALL_ISSUES] as string[]) ?? [];
const nextPageResults = issues.getPaginationData(ALL_ISSUES)?.nextPageResults;
const nextPageResults = issues.getPaginationData(undefined, undefined)?.nextPageResults;
const { enableIssueCreation } = issues?.viewFlags || {};

View File

@ -44,7 +44,7 @@ export const IssueLayoutHOC = observer((props: Props) => {
return <ActiveLoader layout={layout} />;
}
if (issues.getGroupIssueCount(ALL_ISSUES) === 0) {
if (issues.getGroupIssueCount(undefined, undefined, false) === 0) {
return <IssueLayoutEmptyState storeType={storeType} />;
}

View File

@ -2,6 +2,7 @@ import { MutableRefObject, memo } from "react";
//types
import { KanbanIssueBlock } from "components/issues";
import { TIssue, IIssueDisplayProperties, IIssueMap } from "@plane/types";
import { observer } from "mobx-react";
// components
interface IssueBlocksListProps {
@ -21,7 +22,7 @@ interface IssueBlocksListProps {
isDragStarted?: boolean;
}
const KanbanIssueBlocksListMemo: React.FC<IssueBlocksListProps> = (props) => {
export const KanbanIssueBlocksList: React.FC<IssueBlocksListProps> = observer((props) => {
const {
sub_group_id,
columnId,
@ -71,6 +72,4 @@ const KanbanIssueBlocksListMemo: React.FC<IssueBlocksListProps> = (props) => {
) : null}
</>
);
};
export const KanbanIssueBlocksList = memo(KanbanIssueBlocksListMemo);
});

View File

@ -34,8 +34,12 @@ import { KanbanStoreType } from "./base-kanban-root";
export interface IGroupByKanBan {
issuesMap: IIssueMap;
groupedIssueIds: TGroupedIssues | TSubGroupedIssues;
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getPaginationData: (groupId: string | undefined) => TPaginationData | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined;
displayProperties: IIssueDisplayProperties | undefined;
sub_group_by: string | null;
group_by: string | null;
@ -113,7 +117,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
if (!list) return null;
const groupWithIssues = list.filter((_list) => (getGroupIssueCount(_list.id) ?? 0) > 0);
const groupWithIssues = list.filter((_list) => (getGroupIssueCount(_list.id, undefined, false) ?? 0) > 0);
const groupList = showEmptyGroup ? list : groupWithIssues;
@ -149,7 +153,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
column_id={_list.id}
icon={_list.icon}
title={_list.name}
count={getGroupIssueCount(_list.id) ?? 0}
count={getGroupIssueCount(_list.id, undefined, false) ?? 0}
issuePayload={_list.payload}
disableIssueCreation={disableIssueCreation || isGroupByCreatedBy}
storeType={storeType}
@ -196,8 +200,12 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
export interface IKanBan {
issuesMap: IIssueMap;
groupedIssueIds: TGroupedIssues | TSubGroupedIssues;
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getPaginationData: (groupId: string | undefined) => TPaginationData | undefined;
getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
displayProperties: IIssueDisplayProperties | undefined;
sub_group_by: string | null;
group_by: string | null;

View File

@ -22,8 +22,12 @@ interface IKanbanGroup {
issuesMap: IIssueMap;
peekIssueId?: string;
groupedIssueIds: TGroupedIssues | TSubGroupedIssues;
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getPaginationData: (groupId: string | undefined) => TPaginationData | undefined;
getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
displayProperties: IIssueDisplayProperties | undefined;
sub_group_by: string | null;
group_by: string | null;
@ -135,14 +139,14 @@ export const KanbanGroup = observer((props: IKanbanGroup) => {
const isSubGroup = !!sub_group_id && sub_group_id !== "null";
const issueIds = isSubGroup
? (groupedIssueIds as TSubGroupedIssues)[groupId][sub_group_id]
: (groupedIssueIds as TGroupedIssues)[groupId];
? (groupedIssueIds as TSubGroupedIssues)?.[groupId]?.[sub_group_id]
: (groupedIssueIds as TGroupedIssues)?.[groupId];
const groupIssueCount = isSubGroup ? getGroupIssueCount(sub_group_id) : getGroupIssueCount(groupId);
if (!issueIds) return null;
const nextPageResults = isSubGroup
? getPaginationData(sub_group_id)?.nextPageResults
: getPaginationData(groupId)?.nextPageResults;
const groupIssueCount = getGroupIssueCount(groupId, sub_group_id, false);
const nextPageResults = getPaginationData(groupId, sub_group_id)?.nextPageResults;
const shouldLoadMore =
nextPageResults === undefined && groupIssueCount !== undefined

View File

@ -11,7 +11,6 @@ import {
IIssueMap,
TSubGroupedIssues,
TIssueKanbanFilters,
TGroupedIssueCount,
TPaginationData,
} from "@plane/types";
import { getGroupByColumns } from "../utils";
@ -23,7 +22,11 @@ import { KanbanStoreType } from "./base-kanban-root";
// constants
interface ISubGroupSwimlaneHeader {
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
sub_group_by: string | null;
group_by: string | null;
list: IGroupByColumn[];
@ -32,42 +35,40 @@ interface ISubGroupSwimlaneHeader {
storeType: KanbanStoreType;
}
const SubGroupSwimlaneHeader: React.FC<ISubGroupSwimlaneHeader> = ({
getGroupIssueCount,
sub_group_by,
group_by,
storeType,
list,
kanbanFilters,
handleKanbanFilters,
}) => (
<div className="relative flex h-max min-h-full w-full items-center gap-2">
{list &&
list.length > 0 &&
list.map((_list: IGroupByColumn) => (
<div key={`${sub_group_by}_${_list.id}`} className="flex w-[350px] flex-shrink-0 flex-col">
<HeaderGroupByCard
sub_group_by={sub_group_by}
group_by={group_by}
column_id={_list.id}
icon={_list.icon}
title={_list.name}
count={getGroupIssueCount(_list?.id) ?? 0}
kanbanFilters={kanbanFilters}
handleKanbanFilters={handleKanbanFilters}
issuePayload={_list.payload}
storeType={storeType}
/>
</div>
))}
</div>
const SubGroupSwimlaneHeader: React.FC<ISubGroupSwimlaneHeader> = observer(
({ getGroupIssueCount, sub_group_by, group_by, storeType, list, kanbanFilters, handleKanbanFilters }) => (
<div className="relative flex h-max min-h-full w-full items-center gap-2">
{list &&
list.length > 0 &&
list.map((_list: IGroupByColumn) => (
<div key={`${sub_group_by}_${_list.id}`} className="flex w-[350px] flex-shrink-0 flex-col">
<HeaderGroupByCard
sub_group_by={sub_group_by}
group_by={group_by}
column_id={_list.id}
icon={_list.icon}
title={_list.name}
count={getGroupIssueCount(_list?.id, undefined, false) ?? 0}
kanbanFilters={kanbanFilters}
handleKanbanFilters={handleKanbanFilters}
issuePayload={_list.payload}
storeType={storeType}
/>
</div>
))}
</div>
)
);
interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
issuesMap: IIssueMap;
groupedIssueIds: TGroupedIssues | TSubGroupedIssues;
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getPaginationData: (groupId: string | undefined) => TPaginationData | undefined;
getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
showEmptyGroup: boolean;
displayProperties: IIssueDisplayProperties | undefined;
updateIssue:
@ -123,7 +124,7 @@ const SubGroupSwimlane: React.FC<ISubGroupSwimlane> = observer((props) => {
{list &&
list.length > 0 &&
list.map((_list: any) => {
const issueCount = getGroupIssueCount(_list.id) ?? 0;
const issueCount = getGroupIssueCount(undefined, _list.id, true) ?? 0;
return (
<div key={_list.id} className="flex flex-shrink-0 flex-col">
<div className="sticky top-[50px] z-[1] flex w-full items-center bg-custom-background-90 py-1">
@ -178,8 +179,12 @@ const SubGroupSwimlane: React.FC<ISubGroupSwimlane> = observer((props) => {
export interface IKanBanSwimLanes {
issuesMap: IIssueMap;
groupedIssueIds: TGroupedIssues | TSubGroupedIssues;
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getPaginationData: (groupId: string | undefined) => TPaginationData | undefined;
getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
displayProperties: IIssueDisplayProperties | undefined;
sub_group_by: string | null;
group_by: string | null;

View File

@ -105,6 +105,20 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
[fetchNextIssues]
);
const getPaginationData = useCallback(
(groupId?: string) => {
return issues?.getPaginationData(groupId, undefined);
},
[issues?.getPaginationData]
);
const getGroupIssueCount = useCallback(
(groupId?: string) => {
return issues?.getGroupIssueCount(groupId, undefined, false);
},
[issues?.getGroupIssueCount]
);
return (
<IssueLayoutHOC storeType={storeType} layout={EIssueLayoutTypes.LIST}>
<div className={`relative h-full w-full bg-custom-background-90`}>
@ -118,8 +132,8 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
loadMoreIssues={loadMoreIssues}
showEmptyGroup={showEmptyGroup}
viewId={viewId}
getPaginationData={issues.getPaginationData}
getGroupIssueCount={issues.getGroupIssueCount}
getPaginationData={getPaginationData}
getGroupIssueCount={getGroupIssueCount}
quickAddCallback={issues?.quickAddIssue}
enableIssueQuickAdd={!!enableQuickAdd}
canEditProperties={canEditProperties}

View File

@ -161,7 +161,7 @@ export const AllIssueLayoutRoot: React.FC = observer(() => {
}
const issueIds = groupedIssueIds[ALL_ISSUES];
const nextPageResults = getPaginationData(ALL_ISSUES)?.nextPageResults;
const nextPageResults = getPaginationData(ALL_ISSUES, undefined)?.nextPageResults;
const emptyStateType =
(workspaceProjectIds ?? []).length > 0 ? `workspace-${globalViewId}` : EmptyStateType.WORKSPACE_NO_PROJECTS;

View File

@ -74,7 +74,7 @@ export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => {
);
const issueIds = issues.groupedIssueIds?.[ALL_ISSUES] ?? [];
const nextPageResults = issues.getPaginationData(ALL_ISSUES)?.nextPageResults;
const nextPageResults = issues.getPaginationData(ALL_ISSUES, undefined)?.nextPageResults;
const handleDisplayFiltersUpdate = useCallback(
(updatedDisplayFilter: Partial<IIssueDisplayFilterOptions>) => {

View File

@ -83,7 +83,7 @@ export class ArchivedIssues extends BaseIssuesStore implements IArchivedIssues {
};
fetchNextIssues = async (workspaceSlug: string, projectId: string, groupId?: string, subGroupId?: string) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -135,7 +135,7 @@ export class CycleIssues extends BaseIssuesStore implements ICycleIssues {
groupId?: string,
subGroupId?: string
) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -80,7 +80,7 @@ export class DraftIssues extends BaseIssuesStore implements IDraftIssues {
};
fetchNextIssues = async (workspaceSlug: string, projectId: string, groupId?: string, subGroupId?: string) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -58,8 +58,12 @@ export interface IBaseIssuesStore {
issueDisplayFiltersDefaultData(groupBy: string | null): string[];
issuesSortWithOrderBy(issueIds: string[], key: Partial<TIssueOrderByOptions>): string[];
getGroupArray(value: boolean | number | string | string[] | null, isDate?: boolean): string[];
getPaginationData(groupId: string | undefined): TPaginationData | undefined;
getGroupIssueCount: (groupId: string | undefined) => number | undefined;
getPaginationData(groupId: string | undefined, subGroupId: string | undefined): TPaginationData | undefined;
getGroupIssueCount: (
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
) => number | undefined;
}
const ISSUE_FILTER_DEFAULT_DATA: Record<TIssueDisplayFilterOptions, keyof TIssue> = {
@ -144,14 +148,20 @@ export class BaseIssuesStore implements IBaseIssuesStore {
const displayFilters = this.issueFilterStore?.issueFilters?.displayFilters;
if (!displayFilters) return;
return displayFilters?.group_by;
const layout = displayFilters?.layout;
return layout === "calendar"
? "target_date"
: ["list", "kanban"]?.includes(layout)
? displayFilters?.group_by
: undefined;
}
get subGroupBy() {
const displayFilters = this.issueFilterStore?.issueFilters?.displayFilters;
if (!displayFilters || displayFilters.group_by === displayFilters.sub_group_by) return;
return displayFilters?.sub_group_by;
return displayFilters?.layout === "kanban" ? displayFilters?.sub_group_by : undefined;
}
get issueGroupKey() {
@ -208,19 +218,22 @@ export class BaseIssuesStore implements IBaseIssuesStore {
const issueGroupCount = groupedIssueCount[ALL_ISSUES];
const issuesPath = [groupId];
if (!subGroupId) {
set(this.groupedIssueCount, [groupId], issueGroupCount);
}
if (subGroupId) issuesPath.push(subGroupId);
set(this.groupedIssueCount, [this.getGroupKey(groupId, subGroupId)], issueGroupCount);
this.updateIssueGroup(issueGroup, issuesPath);
return;
}
set(this.groupedIssueCount, [ALL_ISSUES], groupedIssueCount[ALL_ISSUES]);
for (const groupId in groupedIssues) {
const issueGroup = groupedIssues[groupId];
const issueGroupCount = groupedIssueCount[groupId];
set(this.groupedIssueCount, [groupId], issueGroupCount);
const shouldContinue = this.updateIssueGroup(issueGroup, [groupId]);
if (shouldContinue) continue;
@ -228,7 +241,7 @@ export class BaseIssuesStore implements IBaseIssuesStore {
const issueSubGroup = (issueGroup as TGroupedIssues)[subGroupId];
const issueSubGroupCount = groupedIssueCount[subGroupId];
set(this.groupedIssueCount, [subGroupId], issueSubGroupCount);
set(this.groupedIssueCount, [this.getGroupKey(groupId, subGroupId)], issueSubGroupCount);
this.updateIssueGroup(issueSubGroup, [groupId, subGroupId]);
}
}
@ -421,22 +434,23 @@ export class BaseIssuesStore implements IBaseIssuesStore {
updateIssueCount(path: string[], increment: number) {
const [groupId, subGroupId] = path;
if (subGroupId) {
const subGroupIssueCount = get(this.groupedIssueCount, [subGroupId]);
if (subGroupId && groupId) {
const groupKey = this.getGroupKey(groupId, subGroupId);
const subGroupIssueCount = get(this.groupedIssueCount, groupKey);
set(this.groupedIssueCount, [subGroupId], subGroupIssueCount + increment);
set(this.groupedIssueCount, groupKey, subGroupIssueCount + increment);
}
if (groupId) {
const groupIssueCount = get(this.groupedIssueCount, [groupId]);
set(this.groupedIssueCount, [groupId], groupIssueCount + increment);
set(this.groupedIssueCount, groupId, groupIssueCount + increment);
}
if (groupId !== ALL_ISSUES) {
const totalIssueCount = get(this.groupedIssueCount, [ALL_ISSUES]);
set(this.groupedIssueCount, [ALL_ISSUES], totalIssueCount + increment);
set(this.groupedIssueCount, ALL_ISSUES, totalIssueCount + increment);
}
}
@ -909,6 +923,8 @@ export class BaseIssuesStore implements IBaseIssuesStore {
const groupedIssues: TGroupedIssues | TSubGroupedIssues = {};
const groupedIssueCount: TGroupedIssueCount = {};
set(groupedIssueCount, [ALL_ISSUES], issueResponse.total_count);
for (const groupId in issueResult) {
const groupIssuesObject = issueResult[groupId];
const groupIssueResult = groupIssuesObject?.results;
@ -933,7 +949,7 @@ export class BaseIssuesStore implements IBaseIssuesStore {
if (!subGroupIssueResult) continue;
set(groupedIssueCount, [subGroupId], subGroupIssuesObject.total_results);
set(groupedIssueCount, [this.getGroupKey(groupId, subGroupId)], subGroupIssuesObject.total_results);
if (Array.isArray(subGroupIssueResult)) {
issueList.push(...subGroupIssueResult);
@ -964,32 +980,39 @@ export class BaseIssuesStore implements IBaseIssuesStore {
nextPageResults,
};
if (groupId && subGroupId) {
set(this.issuePaginationData, [subGroupId], cursorObject);
return;
}
if (groupId) {
set(this.issuePaginationData, [groupId], cursorObject);
return;
}
set(this.issuePaginationData, [ALL_ISSUES], cursorObject);
set(this.issuePaginationData, [this.getGroupKey(groupId, subGroupId)], cursorObject);
}
getPaginationData = computedFn((groupId: string | undefined): TPaginationData | undefined => {
if (groupId) {
return get(this.issuePaginationData, [groupId]);
getGroupKey(groupId?: string, subGroupId?: string) {
if (groupId && subGroupId) return `${groupId}_${subGroupId}`;
if (groupId) return groupId;
return ALL_ISSUES;
}
getPaginationData = computedFn(
(groupId: string | undefined, subGroupId: string | undefined): TPaginationData | undefined => {
return get(this.issuePaginationData, [this.getGroupKey(groupId, subGroupId)]);
}
);
return get(this.issuePaginationData, [ALL_ISSUES]);
});
getGroupIssueCount = computedFn(
(
groupId: string | undefined,
subGroupId: string | undefined,
isSubGroupCumulative: boolean
): number | undefined => {
if (isSubGroupCumulative && subGroupId) {
const groupIssuesKeys = Object.keys(this.groupedIssueCount);
let subGroupCumulativeCount = 0;
getGroupIssueCount = computedFn((groupId: string | undefined): number | undefined => {
if (groupId) {
return get(this.groupedIssueCount, [groupId]);
for (const groupKey of groupIssuesKeys) {
if (groupKey.includes(subGroupId)) subGroupCumulativeCount += this.groupedIssueCount[groupKey];
}
}
return get(this.groupedIssueCount, [this.getGroupKey(groupId, subGroupId)]);
}
return get(this.groupedIssueCount, [ALL_ISSUES]);
});
);
}

View File

@ -135,7 +135,7 @@ export class ModuleIssues extends BaseIssuesStore implements IModuleIssues {
groupId?: string,
subGroupId?: string
) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -122,7 +122,7 @@ export class ProfileIssues extends BaseIssuesStore implements IProfileIssues {
};
fetchNextIssues = async (workspaceSlug: string, userId: string, groupId?: string, subGroupId?: string) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -79,7 +79,7 @@ export class ProjectViewIssues extends BaseIssuesStore implements IProjectViewIs
};
fetchNextIssues = async (workspaceSlug: string, projectId: string, groupId?: string, subGroupId?: string) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -82,7 +82,7 @@ export class ProjectIssues extends BaseIssuesStore implements IProjectIssues {
};
fetchNextIssues = async (workspaceSlug: string, projectId: string, groupId?: string, subGroupId?: string) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";

View File

@ -81,7 +81,7 @@ export class WorkspaceIssues extends BaseIssuesStore implements IWorkspaceIssues
};
fetchNextIssues = async (workspaceSlug: string, viewId: string, groupId?: string, subGroupId?: string) => {
const cursorObject = this.getPaginationData(subGroupId ?? groupId);
const cursorObject = this.getPaginationData(groupId, subGroupId);
if (!this.paginationOptions || (cursorObject && !cursorObject?.nextPageResults)) return;
try {
this.loader = "pagination";