From 1ae39f10164f5f2b9b33dad68ca045738d71dcdc Mon Sep 17 00:00:00 2001 From: gurusainath Date: Wed, 13 Dec 2023 11:24:05 +0530 Subject: [PATCH] dev: optimised the issue fetching in issue base store --- .../roots/project-layout-root.tsx | 14 +++- web/hooks/use-store-issues.tsx | 4 -- web/store/issue/issue.store.ts | 65 ++++++------------- web/store/issue/project/issue.store.ts | 4 +- 4 files changed, 34 insertions(+), 53 deletions(-) diff --git a/web/components/issues/issue-layouts/roots/project-layout-root.tsx b/web/components/issues/issue-layouts/roots/project-layout-root.tsx index 938a3e75c..cb2e20e21 100644 --- a/web/components/issues/issue-layouts/roots/project-layout-root.tsx +++ b/web/components/issues/issue-layouts/roots/project-layout-root.tsx @@ -5,7 +5,7 @@ import useSWR from "swr"; // mobx store import { useMobxStore } from "lib/mobx/store-provider"; // TODO: update this -// import useStoreIssues from "hooks/use-store-issues"; +import useStoreIssues from "hooks/use-store-issues"; // components import { ListLayout, @@ -38,7 +38,12 @@ export const ProjectLayoutRoot: React.FC = observer(() => { // TODO: update this // const { - // issues: { loader: issueLoader, getIssuesIds: issueGetIssuesIds, fetchIssues: issueFetchIssues }, + // issues: { + // loader: issueLoader, + // getIssues: issueGetIssues, + // getIssuesIds: issueGetIssuesIds, + // fetchIssues: issueFetchIssues, + // }, // issuesFilter: { issueFilters: issueIssueFilters, fetchFilters: issueFetchFilters }, // } = useStoreIssues("project"); @@ -49,6 +54,11 @@ export const ProjectLayoutRoot: React.FC = observer(() => { // } // }); + // console.log("---"); + // console.log("issueGetIssuesIds", issueGetIssuesIds); + // console.log("issueGetIssues", issueGetIssues); + // console.log("---"); + const activeLayout = issueFilters?.displayFilters?.layout; return ( diff --git a/web/hooks/use-store-issues.tsx b/web/hooks/use-store-issues.tsx index 2482a06f2..8a48801b6 100644 --- a/web/hooks/use-store-issues.tsx +++ b/web/hooks/use-store-issues.tsx @@ -1,7 +1,6 @@ // issue store provider import { useMobxIssueStore } from "lib/mobx/store-issues-provider"; // types -import { IIssueStore } from "store/issue/issue.store"; import { IWorkspaceIssues, IWorkspaceIssuesFilter } from "store/issue/workspace"; import { IProfileIssues, IProfileIssuesFilter } from "store/issue/profile"; import { IProjectIssues, IProjectIssuesFilter } from "store/issue/project"; @@ -21,7 +20,6 @@ interface IStoreIssues { // issuesFilter: IProfileIssuesFilter; // }; project: { - allIssues: IIssueStore; issues: IProjectIssues; issuesFilter: IProjectIssuesFilter; }; @@ -86,7 +84,6 @@ const useStoreIssues = (issueSpace: keyof IStoreIssues) => { // issuesFilter: profileIssuesFilter, // }, project: { - allIssues: issues, issues: projectIssues, issuesFilter: projectIssuesFilter, }, @@ -113,7 +110,6 @@ const useStoreIssues = (issueSpace: keyof IStoreIssues) => { }; return { - allIssues: storeIssues[issueSpace].allIssues, issues: storeIssues[issueSpace].issues, issuesFilter: storeIssues[issueSpace].issuesFilter, }; diff --git a/web/store/issue/issue.store.ts b/web/store/issue/issue.store.ts index 57f4a5e04..d28eb5e47 100644 --- a/web/store/issue/issue.store.ts +++ b/web/store/issue/issue.store.ts @@ -1,3 +1,4 @@ +import get from "lodash/get"; // store import { action, makeObservable, observable, runInAction } from "mobx"; import { IIssueRootStore } from "./root.store"; @@ -5,21 +6,18 @@ import { IIssueRootStore } from "./root.store"; import { IIssue } from "types"; export interface IIssueStore { - issues: { [key: string]: IIssue }; + allIssues: { [key: string]: IIssue }; // actions addIssue(issues: IIssue[]): void; updateIssue(issueId: string, issue: Partial): void; removeIssue(issueId: string): void; // helper Methods getIssueById(id: string): undefined | IIssue; - getIssuesByWorkspace(workspaceSlug: string): undefined | { [key: string]: IIssue }; - getIssuesByProject(projectId: string): undefined | { [key: string]: IIssue }; - getIssuesByCycle(cycleId: string): undefined | { [key: string]: IIssue }; - getIssuesByModule(moduleId: string): undefined | { [key: string]: IIssue }; + getIssuesByKey(issueKey: string, value: string): undefined | { [key: string]: IIssue }; } export class IssueStore implements IIssueStore { - issues: { [key: string]: IIssue } = {}; + allIssues: { [key: string]: IIssue } = {}; // root store rootStore: IIssueRootStore; @@ -28,7 +26,7 @@ export class IssueStore implements IIssueStore { makeObservable(this, { // observable - issues: observable, + allIssues: observable.ref, // actions addIssue: action, updateIssue: action, @@ -39,68 +37,43 @@ export class IssueStore implements IIssueStore { addIssue = (issues: IIssue[]) => { if (issues && issues.length <= 0) return; - const _issues = { ...this.issues }; + const _issues = { ...this.allIssues }; issues.forEach((issue) => { _issues[issue.id] = issue; }); + runInAction(() => { - this.issues = _issues; + this.allIssues = _issues; }); }; updateIssue = (issueId: string, issue: Partial) => { - if (!issue || !issueId || !this.issues[issueId]) return; - this.issues[issueId] = { ...this.issues[issueId], ...issue }; + if (!issue || !issueId || !this.allIssues[issueId]) return; + this.allIssues[issueId] = { ...this.allIssues[issueId], ...issue }; }; removeIssue = (issueId: string) => { if (issueId) return; - delete this.issues[issueId]; + delete this.allIssues[issueId]; }; // helper methods getIssueById = (id: string) => { if (!id) return undefined; - return this.issues[id]; + return this.allIssues[id]; }; - getIssuesByWorkspace = (workspaceSlug: string) => { - if (!workspaceSlug || !this.issues) return undefined; - const projectIssues = Object.values(this.issues).filter((issue) => issue?.workspace === workspaceSlug); + getIssuesByKey = (issueKey: keyof IIssue, value: string) => { + if (!issueKey || !value || !this.allIssues) return undefined; const filteredIssues: { [key: string]: IIssue } = {}; - projectIssues.map((issue) => { - filteredIssues[issue.id] = issue; - }); - return filteredIssues; - }; - getIssuesByProject = (projectId: string) => { - if (!projectId || !this.issues) return undefined; - const projectIssues = Object.values(this.issues).filter((issue) => issue?.project === projectId); - const filteredIssues: { [key: string]: IIssue } = {}; - projectIssues.map((issue) => { - filteredIssues[issue.id] = issue; + Object.values(this.allIssues).forEach((issue) => { + const issueKeyValue = get(issue, issueKey); + if (issueKeyValue == value) { + filteredIssues[issue.id] = issue; + } }); - return filteredIssues; - }; - getIssuesByCycle = (projectId: string) => { - if (!projectId || !this.issues) return undefined; - const projectIssues = Object.values(this.issues).filter((issue) => issue?.project === projectId); - const filteredIssues: { [key: string]: IIssue } = {}; - projectIssues.map((issue) => { - filteredIssues[issue.id] = issue; - }); - return filteredIssues; - }; - - getIssuesByModule = (projectId: string) => { - if (!projectId || !this.issues) return undefined; - const projectIssues = Object.values(this.issues).filter((issue) => issue?.project === projectId); - const filteredIssues: { [key: string]: IIssue } = {}; - projectIssues.map((issue) => { - filteredIssues[issue.id] = issue; - }); return filteredIssues; }; } diff --git a/web/store/issue/project/issue.store.ts b/web/store/issue/project/issue.store.ts index a6180a46a..063a6990e 100644 --- a/web/store/issue/project/issue.store.ts +++ b/web/store/issue/project/issue.store.ts @@ -20,6 +20,7 @@ export interface IProjectIssues { loader: TLoader; issues: { [project_id: string]: string[] }; // computed + getIssues: { [issue_id: string]: IIssue } | undefined; getIssuesIds: IGroupedIssues | ISubGroupedIssues | TUnGroupedIssues | undefined; // action fetchIssues: (workspaceSlug: string, projectId: string, loadType: TLoader) => Promise; @@ -46,6 +47,7 @@ export class ProjectIssues extends IssueHelperStore implements IProjectIssues { loader: observable.ref, issues: observable, // computed + getIssues: computed, getIssuesIds: computed, // action fetchIssues: action, @@ -65,7 +67,7 @@ export class ProjectIssues extends IssueHelperStore implements IProjectIssues { const projectId = this.rootStore?.projectId; if (!projectId) return undefined; - const _issues = this.rootStore.issues.getIssuesByProject(projectId); + const _issues = this.rootStore.issues.getIssuesByKey("project", projectId); if (!_issues) return undefined; return _issues;