fix: project issues using layouts

web/components/issues/issue-layouts/roots/project-layout-root.tsx

@@ -22,15 +22,12 @@ export const ProjectLayoutRoot: React.FC = observer(() => {
 
   const { issue: issueStore, issueFilter: issueFilterStore } = useMobxStore();
 
-  const { isLoading } = useSWR(
+  useSWR(workspaceSlug && projectId ? `PROJECT_FILTERS_AND_ISSUES_${projectId.toString()}` : null, async () => {
-    workspaceSlug && projectId ? `PROJECT_FILTERS_AND_ISSUES_${projectId.toString()}` : null,
+    if (workspaceSlug && projectId) {
-    async () => {
+      await issueFilterStore.fetchUserProjectFilters(workspaceSlug.toString(), projectId.toString());
-      if (workspaceSlug && projectId) {
+      await issueStore.fetchIssues(workspaceSlug.toString(), projectId.toString());
-        await issueFilterStore.fetchUserProjectFilters(workspaceSlug.toString(), projectId.toString());
-        await issueStore.fetchIssues(workspaceSlug.toString(), projectId.toString());
-      }
     }
-  );
+  });
 
   const activeLayout = issueFilterStore.userDisplayFilters.layout;
 

web/services/issue/issue.service.ts

@@ -32,6 +32,14 @@ export class IssueService extends APIService {
       });
   }
 
+  async getV2Issues(workspaceSlug: string, projectId: string): Promise<IIssue[]> {
+    return this.get(`/api/v2/workspaces/${workspaceSlug}/projects/${projectId}/issues/`)
+      .then((response) => response?.data)
+      .catch((error) => {
+        throw error?.response?.data;
+      });
+  }
+
   async getIssuesWithParams(
     workspaceSlug: string,
     projectId: string,

web/store/issue/issue-v2.store.ts

@@ -0,0 +1,83 @@
+import { observable, action, computed, makeObservable, runInAction, autorun } from "mobx";
+// store
+import { RootStore } from "../root";
+// types
+import { IIssue } from "types";
+// services
+import { IssueService } from "services/issue";
+import { sortArrayByDate, sortArrayByPriority } from "constants/kanban-helpers";
+import { IBlockUpdateData } from "components/gantt-chart";
+
+export type IIssueType = "grouped" | "groupWithSubGroups" | "ungrouped";
+export type IIssueGroupedStructure = { [group_id: string]: IIssue[] };
+export type IIssueGroupWithSubGroupsStructure = {
+  [group_id: string]: {
+    [sub_group_id: string]: IIssue[];
+  };
+};
+export type IIssueUnGroupedStructure = IIssue[];
+
+export interface IIssueStore {
+  loader: boolean;
+  error: any | null;
+  // issues
+  issues: {
+    [project_id: string]: IIssue[];
+  };
+  // computed
+  getIssueType: IIssueType | null;
+  getIssues: IIssueGroupedStructure | IIssueGroupWithSubGroupsStructure | IIssueUnGroupedStructure | null;
+  getIssuesCount: number;
+  // action
+  fetchIssues: (workspaceSlug: string, projectId: string) => Promise<any>;
+  updateIssueStructure: (group_id: string | null, sub_group_id: string | null, issue: IIssue) => void;
+  removeIssueFromStructure: (group_id: string | null, sub_group_id: string | null, issue: IIssue) => void;
+  deleteIssue: (group_id: string | null, sub_group_id: string | null, issue: IIssue) => void;
+  updateGanttIssueStructure: (workspaceSlug: string, issue: IIssue, payload: IBlockUpdateData) => void;
+}
+
+export class IssueStore implements IIssueStore {
+  loader: boolean = false;
+  error: any | null = null;
+  issues: {
+    [project_id: string]: IIssue[];
+  } = {};
+  // service
+  issueService;
+  rootStore;
+
+  constructor(_rootStore: RootStore) {
+    makeObservable(this, {
+      // observable
+      loader: observable.ref,
+      error: observable.ref,
+      issues: observable.ref,
+      // computed
+      getIssues: computed,
+      // actions
+      fetchIssues: action,
+    });
+
+    this.rootStore = _rootStore;
+    this.issueService = new IssueService();
+  }
+
+  fetchIssues = async (workspaceSlug: string, projectId: string) => {
+    try {
+      const issues = await this.issueService.getV2Issues(workspaceSlug, projectId);
+      runInAction(() => {
+        this.issues = {
+          ...this.issues,
+          [projectId]: issues,
+        };
+      });
+    } catch (error) {
+      throw error;
+    }
+  };
+
+  get getIssues() {
+    const displayProperties = this.rootStore.issueFilter.userDisplayProperties;
+    return;
+  }
+}