[WEB-1724] fix: initial pages list loading. (#4939)

* [WEB-1724] fix: inital page loading.

* chore: update getPageById action.

* fix: lint error

web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/[pageId]/page.tsx

@@ -27,7 +27,7 @@ const PageDetailsPage = observer(() => {
   // fetch page details
   const { error: pageDetailsError } = useSWR(
     pageId ? `PAGE_DETAILS_${pageId}` : null,
-    pageId ? () => getPageById(pageId.toString()) : null,
+    pageId ? () => getPageById(workspaceSlug?.toString(), projectId?.toString(), pageId.toString()) : null,
     {
       revalidateIfStale: false,
       revalidateOnFocus: false,

web/core/components/inbox/root.tsx

@@ -31,7 +31,7 @@ export const InboxIssueRoot: FC<TInboxIssueRoot> = observer((props) => {
   useEffect(() => {
     if (!inboxAccessible || !workspaceSlug || !projectId) return;
     if (navigationTab && navigationTab !== currentTab) {
-      handleCurrentTab(navigationTab);
+      handleCurrentTab(workspaceSlug, projectId, navigationTab);
     } else {
       fetchInboxIssues(workspaceSlug.toString(), projectId.toString());
     }

web/core/components/inbox/sidebar/root.tsx

@@ -75,7 +75,7 @@ export const InboxSidebar: FC<IInboxSidebarProps> = observer((props) => {
               )}
               onClick={() => {
                 if (currentTab != option?.key) {
-                  handleCurrentTab(option?.key);
+                  handleCurrentTab(workspaceSlug, projectId, option?.key);
                   router.push(`/${workspaceSlug}/projects/${projectId}/inbox?currentTab=${option?.key}`);
                 }
               }}

web/core/components/pages/pages-list-view.tsx

@@ -18,7 +18,10 @@ export const PagesListView: React.FC<TPageView> = observer((props) => {
   // store hooks
   const { isAnyPageAvailable, getAllPages } = useProjectPages();
   // fetching pages list
-  useSWR(projectId ? `PROJECT_PAGES_${projectId}` : null, projectId ? () => getAllPages(pageType) : null);
+  useSWR(
+    projectId ? `PROJECT_PAGES_${projectId}` : null,
+    projectId ? () => getAllPages(workspaceSlug, projectId, pageType) : null
+  );
 
   // pages loader
   return (

web/core/hooks/use-auto-save.tsx

@@ -4,7 +4,7 @@ import { debounce } from "lodash";
 const AUTO_SAVE_TIME = 10000;
 
 const useAutoSave = (handleSaveDescription: (forceSync?: boolean, yjsAsUpdate?: Uint8Array) => void) => {
-  const intervalIdRef = useRef<NodeJS.Timeout | null>(null);
+  const intervalIdRef = useRef<any>(null);
   const handleSaveDescriptionRef = useRef(handleSaveDescription);
 
   // Update the ref to always point to the latest handleSaveDescription

web/core/store/inbox/project-inbox.store.ts

@@ -54,7 +54,7 @@ export interface IProjectInboxStore {
   ) => Partial<Record<keyof TInboxIssueFilter, string>>;
   createOrUpdateInboxIssue: (inboxIssues: TInboxIssue[], workspaceSlug: string, projectId: string) => void;
   // actions
-  handleCurrentTab: (tab: TInboxIssueCurrentTab) => void;
+  handleCurrentTab: (workspaceSlug: string, projectId: string, tab: TInboxIssueCurrentTab) => void;
   handleInboxIssueFilters: <T extends keyof TInboxIssueFilter>(key: T, value: TInboxIssueFilter[T]) => void; // if user sends me undefined, I will remove the value from the filter key
   handleInboxIssueSorting: <T extends keyof TInboxIssueSorting>(key: T, value: TInboxIssueSorting[T]) => void; // if user sends me undefined, I will remove the value from the filter key
   fetchInboxIssues: (workspaceSlug: string, projectId: string, loadingType?: TLoader) => Promise<void>;
@@ -216,7 +216,7 @@ export class ProjectInboxStore implements IProjectInboxStore {
   };
 
   // actions
-  handleCurrentTab = (tab: TInboxIssueCurrentTab) => {
+  handleCurrentTab = (workspaceSlug: string, projectId: string, tab: TInboxIssueCurrentTab) => {
     runInAction(() => {
       set(this, "currentTab", tab);
       set(this, "inboxFilters", undefined);
@@ -227,7 +227,6 @@ export class ProjectInboxStore implements IProjectInboxStore {
       if (tab === "closed") set(this, ["inboxFilters", "status"], [-1, 1, 2]);
       else set(this, ["inboxFilters", "status"], [-2]);
     });
-    const { workspaceSlug, projectId } = this.store.router;
     if (workspaceSlug && projectId) this.fetchInboxIssues(workspaceSlug, projectId, "filter-loading");
   };
 

web/core/store/pages/project-page.store.ts

@@ -31,8 +31,12 @@ export interface IProjectPageStore {
   updateFilters: <T extends keyof TPageFilters>(filterKey: T, filterValue: TPageFilters[T]) => void;
   clearAllFilters: () => void;
   // actions
-  getAllPages: (pageType: TPageNavigationTabs) => Promise<TPage[] | undefined>;
-  getPageById: (pageId: string) => Promise<TPage | undefined>;
+  getAllPages: (
+    workspaceSlug: string,
+    projectId: string,
+    pageType: TPageNavigationTabs
+  ) => Promise<TPage[] | undefined>;
+  getPageById: (workspaceSlug: string, projectId: string, pageId: string) => Promise<TPage | undefined>;
   createPage: (pageData: Partial<TPage>) => Promise<TPage | undefined>;
   removePage: (pageId: string) => Promise<void>;
 }
@@ -148,9 +152,8 @@ export class ProjectPageStore implements IProjectPageStore {
   /**
    * @description fetch all the pages
    */
-  getAllPages = async (pageType: TPageNavigationTabs) => {
+  getAllPages = async (workspaceSlug: string, projectId: string, pageType: TPageNavigationTabs) => {
     try {
-      const { workspaceSlug, projectId } = this.store.router;
       if (!workspaceSlug || !projectId) return undefined;
 
       const currentPageIds = this.getCurrentProjectPageIds(pageType);
@@ -182,9 +185,8 @@ export class ProjectPageStore implements IProjectPageStore {
    * @description fetch the details of a page
    * @param {string} pageId
    */
-  getPageById = async (pageId: string) => {
+  getPageById = async (workspaceSlug: string, projectId: string, pageId: string) => {
     try {
-      const { workspaceSlug, projectId } = this.store.router;
       if (!workspaceSlug || !projectId || !pageId) return undefined;
 
       const currentPageId = this.pageById(pageId);