diff --git a/web/components/core/views/inline-issue-create-wrapper.tsx b/web/components/core/views/inline-issue-create-wrapper.tsx index feed64209..b474cb74c 100644 --- a/web/components/core/views/inline-issue-create-wrapper.tsx +++ b/web/components/core/views/inline-issue-create-wrapper.tsx @@ -176,7 +176,7 @@ export const InlineCreateIssueFormWrapper: React.FC = (props) => { reset({ ...defaultValues }); await (!isDraftIssues - ? issueService.createIssues(workspaceSlug.toString(), projectId.toString(), formData, user) + ? issueService.createIssue(workspaceSlug.toString(), projectId.toString(), formData, user) : issueDraftService.createDraftIssue(workspaceSlug.toString(), projectId.toString(), formData) ) .then(async (res) => { diff --git a/web/components/gantt-chart/sidebar.tsx b/web/components/gantt-chart/sidebar.tsx index 86e086790..4b0b654f2 100644 --- a/web/components/gantt-chart/sidebar.tsx +++ b/web/components/gantt-chart/sidebar.tsx @@ -1,13 +1,11 @@ import { useRouter } from "next/router"; -// react-beautiful-dnd import { DragDropContext, Draggable, DropResult } from "react-beautiful-dnd"; import StrictModeDroppable from "components/dnd/StrictModeDroppable"; +import { MoreVertical } from "lucide-react"; // hooks import { useChart } from "./hooks"; // ui import { Loader } from "@plane/ui"; -// icons -import { MoreVertical } from "lucide-react"; // helpers import { findTotalDaysInRange } from "helpers/date-time.helper"; // types @@ -124,8 +122,8 @@ export const GanttSidebar: React.FC = (props) => { className="rounded p-0.5 text-custom-sidebar-text-200 flex flex-shrink-0 opacity-0 group-hover:opacity-100" {...provided.dragHandleProps} > - - + + )}
diff --git a/web/components/issues/draft-issue-modal.tsx b/web/components/issues/draft-issue-modal.tsx index 842ddb1a0..535b77abc 100644 --- a/web/components/issues/draft-issue-modal.tsx +++ b/web/components/issues/draft-issue-modal.tsx @@ -304,7 +304,7 @@ export const CreateUpdateDraftIssueModal: React.FC = observer( if (!workspaceSlug || !activeProject) return; await issueService - .createIssues(workspaceSlug as string, activeProject ?? "", payload, user) + .createIssue(workspaceSlug as string, activeProject ?? "", payload, user) .then(async (res) => { mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(activeProject ?? "", params)); if (payload.cycle && payload.cycle !== "") await addIssueToCycle(res.id, payload.cycle); diff --git a/web/components/issues/form.tsx b/web/components/issues/form.tsx index 8c983ce5c..d85151485 100644 --- a/web/components/issues/form.tsx +++ b/web/components/issues/form.tsx @@ -1,6 +1,9 @@ import React, { FC, useState, useEffect, useRef } from "react"; import { useRouter } from "next/router"; +import { observer } from "mobx-react-lite"; import { Controller, useForm } from "react-hook-form"; +// mobx store +import { useMobxStore } from "lib/mobx/store-provider"; // services import { AIService } from "services/ai.service"; import { FileService } from "services/file.service"; @@ -26,7 +29,7 @@ import { Button, Input, ToggleSwitch } from "@plane/ui"; // icons import { LayoutPanelTop, Sparkle, X } from "lucide-react"; // types -import type { IUser, IIssue, ISearchIssueResponse } from "types"; +import type { IIssue, ISearchIssueResponse } from "types"; // components import { RichTextEditorWithRef } from "@plane/rich-text-editor"; @@ -55,7 +58,6 @@ export interface IssueFormProps { setCreateMore: React.Dispatch>; handleDiscardClose: () => void; status: boolean; - user: IUser | undefined; handleFormDirty: (payload: Partial | null) => void; fieldsToShow: ( | "project" @@ -77,7 +79,7 @@ export interface IssueFormProps { const aiService = new AIService(); const fileService = new FileService(); -export const IssueForm: FC = (props) => { +export const IssueForm: FC = observer((props) => { const { handleFormSubmit, initialData, @@ -87,7 +89,6 @@ export const IssueForm: FC = (props) => { setCreateMore, handleDiscardClose, status, - user, fieldsToShow, handleFormDirty, } = props; @@ -105,6 +106,10 @@ export const IssueForm: FC = (props) => { const router = useRouter(); const { workspaceSlug } = router.query; + const { user: userStore } = useMobxStore(); + + const user = userStore.currentUser; + const { setToastAlert } = useToast(); const { @@ -174,7 +179,7 @@ export const IssueForm: FC = (props) => { }; const handleAutoGenerateDescription = async () => { - if (!workspaceSlug || !projectId) return; + if (!workspaceSlug || !projectId || !user) return; setIAmFeelingLucky(true); @@ -251,13 +256,13 @@ export const IssueForm: FC = (props) => { isOpen={stateModal} handleClose={() => setStateModal(false)} projectId={projectId} - user={user} + user={user ?? undefined} /> setLabelModal(false)} projectId={projectId} - user={user} + user={user ?? undefined} onSuccess={(response) => { setValue("labels", [...watch("labels"), response.id]); setValue("labels_list", [...watch("labels_list"), response.id]); @@ -605,4 +610,4 @@ export const IssueForm: FC = (props) => { ); -}; +}); diff --git a/web/components/issues/issue-layouts/kanban/headers/priority.tsx b/web/components/issues/issue-layouts/kanban/headers/priority.tsx index d77b93632..1dda5f587 100644 --- a/web/components/issues/issue-layouts/kanban/headers/priority.tsx +++ b/web/components/issues/issue-layouts/kanban/headers/priority.tsx @@ -1,6 +1,4 @@ -// mobx import { observer } from "mobx-react-lite"; -// lucide icons import { AlertCircle, SignalHigh, SignalMedium, SignalLow, Ban } from "lucide-react"; // components import { HeaderGroupByCard } from "./group-by-card"; @@ -44,35 +42,35 @@ const Icon = ({ priority }: any) => (
); -export const PriorityHeader: React.FC = observer( - ({ column_id, sub_group_by, group_by, header_type, issues_count, kanBanToggle, handleKanBanToggle }) => { - const priority = column_id && issuePriorityByKey(column_id); +export const PriorityHeader: React.FC = observer((props) => { + const { column_id, sub_group_by, group_by, header_type, issues_count, kanBanToggle, handleKanBanToggle } = props; - return ( - <> - {priority && - (sub_group_by && header_type === "sub_group_by" ? ( - } - title={priority?.key || ""} - count={issues_count} - kanBanToggle={kanBanToggle} - handleKanBanToggle={handleKanBanToggle} - /> - ) : ( - } - title={priority?.key || ""} - count={issues_count} - kanBanToggle={kanBanToggle} - handleKanBanToggle={handleKanBanToggle} - /> - ))} - - ); - } -); + const priority = column_id && issuePriorityByKey(column_id); + + return ( + <> + {priority && + (sub_group_by && header_type === "sub_group_by" ? ( + } + title={priority?.title || ""} + count={issues_count} + kanBanToggle={kanBanToggle} + handleKanBanToggle={handleKanBanToggle} + /> + ) : ( + } + title={priority?.title || ""} + count={issues_count} + kanBanToggle={kanBanToggle} + handleKanBanToggle={handleKanBanToggle} + /> + ))} + + ); +}); diff --git a/web/components/issues/issue-layouts/list/headers/priority.tsx b/web/components/issues/issue-layouts/list/headers/priority.tsx index 4a7576882..340cee82c 100644 --- a/web/components/issues/issue-layouts/list/headers/priority.tsx +++ b/web/components/issues/issue-layouts/list/headers/priority.tsx @@ -1,6 +1,5 @@ import { FC } from "react"; import { observer } from "mobx-react-lite"; -// lucide icons import { AlertCircle, SignalHigh, SignalMedium, SignalLow, Ban } from "lucide-react"; // components import { HeaderGroupByCard } from "./group-by-card"; @@ -45,7 +44,11 @@ export const PriorityHeader: FC = observer((props) => { return ( <> {priority && ( - } title={priority?.key || ""} count={issues_count} /> + } + title={priority?.title || ""} + count={issues_count} + /> )} ); diff --git a/web/components/issues/modal.tsx b/web/components/issues/modal.tsx index c8ba2ef46..b10d16ab4 100644 --- a/web/components/issues/modal.tsx +++ b/web/components/issues/modal.tsx @@ -9,29 +9,14 @@ import { useMobxStore } from "lib/mobx/store-provider"; import { ModuleService } from "services/module.service"; import { IssueService, IssueDraftService } from "services/issue"; // hooks -import useUser from "hooks/use-user"; -import useIssuesView from "hooks/use-issues-view"; import useToast from "hooks/use-toast"; -import useMyIssues from "hooks/my-issues/use-my-issues"; import useLocalStorage from "hooks/use-local-storage"; // components import { IssueForm, ConfirmIssueDiscard } from "components/issues"; // types import type { IIssue } from "types"; // fetch-keys -import { - PROJECT_ISSUES_DETAILS, - USER_ISSUE, - SUB_ISSUES, - PROJECT_ISSUES_LIST_WITH_PARAMS, - CYCLE_ISSUES_WITH_PARAMS, - MODULE_ISSUES_WITH_PARAMS, - CYCLE_DETAILS, - MODULE_DETAILS, - VIEW_ISSUES, - PROJECT_DRAFT_ISSUES_LIST_WITH_PARAMS, - GLOBAL_VIEW_ISSUES, -} from "constants/fetch-keys"; +import { PROJECT_ISSUES_DETAILS, USER_ISSUE, SUB_ISSUES } from "constants/fetch-keys"; export interface IssuesModalProps { data?: IIssue | null; @@ -79,19 +64,21 @@ export const CreateUpdateIssueModal: React.FC = observer((prop const [prePopulateData, setPreloadedData] = useState>({}); const router = useRouter(); - const { workspaceSlug, projectId, cycleId, moduleId, viewId, globalViewId } = router.query; + const { workspaceSlug, projectId, cycleId, moduleId } = router.query; - const { project: projectStore } = useMobxStore(); + const { + project: projectStore, + issue: issueStore, + issueDetail: issueDetailStore, + cycleIssue: cycleIssueStore, + moduleIssue: moduleIssueStore, + user: userStore, + } = useMobxStore(); + + const user = userStore.currentUser; const projects = workspaceSlug ? projectStore.projects[workspaceSlug.toString()] : undefined; - const { displayFilters, params } = useIssuesView(); - const { ...viewGanttParams } = params; - - const { user } = useUser(); - - const { groupedIssues, mutateMyIssues } = useMyIssues(workspaceSlug?.toString()); - const { setValue: setValueInLocalStorage, clearValue: clearLocalStorageValue } = useLocalStorage( "draftedIssue", {} @@ -192,118 +179,55 @@ export const CreateUpdateIssueModal: React.FC = observer((prop }, [activeProject, data, projectId, projects, isOpen]); const addIssueToCycle = async (issueId: string, cycleId: string) => { - if (!workspaceSlug || !activeProject) return; + if (!workspaceSlug || !activeProject || !user) return; await issueService .addIssueToCycle( - workspaceSlug as string, - activeProject ?? "", + workspaceSlug.toString(), + activeProject, cycleId, { issues: [issueId], }, user ) - .then(() => { - if (cycleId) { - mutate(CYCLE_ISSUES_WITH_PARAMS(cycleId, params)); - mutate(CYCLE_DETAILS(cycleId as string)); - } - }); + .then(() => cycleIssueStore.fetchIssues(workspaceSlug.toString(), activeProject, cycleId)); }; const addIssueToModule = async (issueId: string, moduleId: string) => { - if (!workspaceSlug || !activeProject) return; + if (!workspaceSlug || !activeProject || !user) return; await moduleService .addIssuesToModule( - workspaceSlug as string, - activeProject ?? "", - moduleId as string, + workspaceSlug.toString(), + activeProject, + moduleId, { issues: [issueId], }, user ) - .then(() => { - if (moduleId) { - mutate(MODULE_ISSUES_WITH_PARAMS(moduleId as string, params)); - mutate(MODULE_DETAILS(moduleId as string)); - } - }); + .then(() => moduleIssueStore.fetchIssues(workspaceSlug.toString(), activeProject, moduleId)); }; - const workspaceIssuesPath = [ - { - params: { - sub_issue: false, - }, - path: "workspace-views/all-issues", - }, - { - params: { - assignees: user?.id ?? undefined, - sub_issue: false, - }, - path: "workspace-views/assigned", - }, - { - params: { - created_by: user?.id ?? undefined, - sub_issue: false, - }, - path: "workspace-views/created", - }, - { - params: { - subscriber: user?.id ?? undefined, - sub_issue: false, - }, - path: "workspace-views/subscribed", - }, - ]; - - const currentWorkspaceIssuePath = workspaceIssuesPath.find((path) => router.pathname.includes(path.path)); - - const ganttFetchKey = cycleId - ? CYCLE_ISSUES_WITH_PARAMS(cycleId.toString()) - : moduleId - ? MODULE_ISSUES_WITH_PARAMS(moduleId.toString()) - : viewId - ? VIEW_ISSUES(viewId.toString(), viewGanttParams) - : PROJECT_ISSUES_LIST_WITH_PARAMS(activeProject?.toString() ?? ""); - const createIssue = async (payload: Partial) => { - if (!workspaceSlug || !activeProject) return; + if (!workspaceSlug || !activeProject || !user) return; - await issueService - .createIssues(workspaceSlug as string, activeProject ?? "", payload, user) + await issueDetailStore + .createIssue(workspaceSlug.toString(), activeProject, payload, user) .then(async (res) => { - mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(activeProject ?? "", params)); + issueStore.fetchIssues(workspaceSlug.toString(), activeProject); + if (payload.cycle && payload.cycle !== "") await addIssueToCycle(res.id, payload.cycle); if (payload.module && payload.module !== "") await addIssueToModule(res.id, payload.module); - if (displayFilters.layout === "gantt_chart") - mutate(ganttFetchKey, { - start_target_date: true, - order_by: "sort_order", - }); - if (groupedIssues) mutateMyIssues(); - setToastAlert({ type: "success", title: "Success!", message: "Issue created successfully.", }); - if (payload.assignees_list?.some((assignee) => assignee === user?.id)) - mutate(USER_ISSUE(workspaceSlug as string)); - if (payload.parent && payload.parent !== "") mutate(SUB_ISSUES(payload.parent)); - - if (globalViewId) mutate(GLOBAL_VIEW_ISSUES(globalViewId.toString())); - - if (currentWorkspaceIssuePath) mutate(GLOBAL_VIEW_ISSUES(workspaceSlug.toString())); }) .catch(() => { setToastAlert({ @@ -326,9 +250,6 @@ export const CreateUpdateIssueModal: React.FC = observer((prop await issueDraftService .createDraftIssue(workspaceSlug as string, activeProject ?? "", payload) .then(() => { - mutate(PROJECT_DRAFT_ISSUES_LIST_WITH_PARAMS(activeProject ?? "", params)); - if (groupedIssues) mutateMyIssues(); - setToastAlert({ type: "success", title: "Success!", @@ -364,7 +285,6 @@ export const CreateUpdateIssueModal: React.FC = observer((prop mutate(PROJECT_ISSUES_DETAILS, (prevData) => ({ ...prevData, ...res }), false); } else { if (payload.parent) mutate(SUB_ISSUES(payload.parent.toString())); - mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(activeProject ?? "", params)); } if (payload.cycle && payload.cycle !== "") addIssueToCycle(res.id, payload.cycle); @@ -456,7 +376,6 @@ export const CreateUpdateIssueModal: React.FC = observer((prop projectId={activeProject ?? ""} setActiveProject={setActiveProject} status={data ? true : false} - user={user} fieldsToShow={fieldsToShow} handleFormDirty={handleFormDirty} /> diff --git a/web/layouts/auth-layout/user-wrapper.tsx b/web/layouts/auth-layout/user-wrapper.tsx index f839bae0a..e9dcb1f74 100644 --- a/web/layouts/auth-layout/user-wrapper.tsx +++ b/web/layouts/auth-layout/user-wrapper.tsx @@ -1,8 +1,6 @@ import { FC, ReactNode } from "react"; import { useRouter } from "next/router"; import useSWR from "swr"; -// services -import { UserService } from "services/user.service"; // ui import { Spinner } from "@plane/ui"; // store @@ -19,7 +17,7 @@ export const UserAuthWrapper: FC = (props) => { // router const router = useRouter(); // fetching user information - const { data: currentUser, error } = useSWR("CURRENT_USER", () => userStore.fetchCurrentUser()); + const { data: currentUser, error } = useSWR("CURRENT_USER_DETAILS", () => userStore.fetchCurrentUser()); // fetching user settings useSWR("CURRENT_USER_SETTINGS", () => userStore.fetchCurrentUserSettings()); diff --git a/web/lib/mobx/store-init.tsx b/web/lib/mobx/store-init.tsx index b4a4d90ba..f72e72276 100644 --- a/web/lib/mobx/store-init.tsx +++ b/web/lib/mobx/store-init.tsx @@ -13,6 +13,7 @@ const MobxStoreInit = observer(() => { user: userStore, workspace: workspaceStore, project: projectStore, + cycle: cycleStore, module: moduleStore, globalViews: globalViewsStore, projectViews: projectViewsStore, @@ -24,7 +25,7 @@ const MobxStoreInit = observer(() => { const { setTheme } = useTheme(); // router const router = useRouter(); - const { workspaceSlug, projectId, moduleId, globalViewId, viewId, inboxId } = router.query; + const { workspaceSlug, projectId, cycleId, moduleId, globalViewId, viewId, inboxId } = router.query; // const dom = useMemo(() => window && window.document?.querySelector("[data-theme='custom']"), [document]); @@ -52,6 +53,7 @@ const MobxStoreInit = observer(() => { useEffect(() => { if (workspaceSlug) workspaceStore.setWorkspaceSlug(workspaceSlug.toString()); if (projectId) projectStore.setProjectId(projectId.toString()); + if (cycleId) cycleStore.setCycleId(cycleId.toString()); if (moduleId) moduleStore.setModuleId(moduleId.toString()); if (globalViewId) globalViewsStore.setGlobalViewId(globalViewId.toString()); if (viewId) projectViewsStore.setViewId(viewId.toString()); @@ -59,12 +61,14 @@ const MobxStoreInit = observer(() => { }, [ workspaceSlug, projectId, + cycleId, moduleId, globalViewId, viewId, inboxId, workspaceStore, projectStore, + cycleStore, moduleStore, globalViewsStore, projectViewsStore, diff --git a/web/services/issue/issue.service.ts b/web/services/issue/issue.service.ts index 135f811ec..11703e792 100644 --- a/web/services/issue/issue.service.ts +++ b/web/services/issue/issue.service.ts @@ -13,7 +13,7 @@ export class IssueService extends APIService { super(API_BASE_URL); } - async createIssues(workspaceSlug: string, projectId: string, data: any, user: IUser | undefined): Promise { + async createIssue(workspaceSlug: string, projectId: string, data: any, user: IUser | undefined): Promise { return this.post(`/api/workspaces/${workspaceSlug}/projects/${projectId}/issues/`, data) .then((response) => { trackEventService.trackIssueEvent(response.data, "ISSUE_CREATE", user as IUser); diff --git a/web/store/cycle/cycle_issue.store.ts b/web/store/cycle/cycle_issue.store.ts index 8ab84f0ae..1e0092e42 100644 --- a/web/store/cycle/cycle_issue.store.ts +++ b/web/store/cycle/cycle_issue.store.ts @@ -1,4 +1,4 @@ -import { observable, action, computed, makeObservable, runInAction } from "mobx"; +import { observable, action, computed, makeObservable, runInAction, autorun } from "mobx"; // store import { RootStore } from "../root"; // types @@ -69,8 +69,24 @@ export class CycleIssueStore implements ICycleIssueStore { fetchIssues: action, updateIssueStructure: action, }); + this.rootStore = _rootStore; this.cycleService = new CycleService(); + + autorun(() => { + const workspaceSlug = this.rootStore.workspace.workspaceSlug; + const projectId = this.rootStore.project.projectId; + const cycleId = this.rootStore.cycle.cycleId; + + if ( + workspaceSlug && + projectId && + cycleId && + this.rootStore.cycleIssueFilter.cycleFilters && + this.rootStore.issueFilter.userDisplayFilters + ) + this.fetchIssues(workspaceSlug, projectId, cycleId); + }); } get getIssueType() { @@ -156,10 +172,6 @@ export class CycleIssueStore implements ICycleIssueStore { this.loader = true; this.error = null; - this.rootStore.workspace.setWorkspaceSlug(workspaceSlug); - this.rootStore.project.setProjectId(projectId); - this.rootStore.cycle.setCycleId(cycleId); - const params = this.rootStore?.cycleIssueFilter?.appliedFilters; const issueResponse = await this.cycleService.getCycleIssuesWithParams(workspaceSlug, projectId, cycleId, params); diff --git a/web/store/global-view/global_view_issues.store.ts b/web/store/global-view/global_view_issues.store.ts index 1b2893933..dc8e9717b 100644 --- a/web/store/global-view/global_view_issues.store.ts +++ b/web/store/global-view/global_view_issues.store.ts @@ -1,4 +1,4 @@ -import { observable, action, makeObservable, runInAction } from "mobx"; +import { observable, action, makeObservable, runInAction, autorun } from "mobx"; // services import { ProjectService } from "services/project"; import { WorkspaceService } from "services/workspace.service"; @@ -55,9 +55,21 @@ export class GlobalViewIssuesStore implements IGlobalViewIssuesStore { }); this.rootStore = _rootStore; - this.projectService = new ProjectService(); this.workspaceService = new WorkspaceService(); + + autorun(() => { + const workspaceSlug = this.rootStore.workspace.workspaceSlug; + const globalViewId = this.rootStore.globalViews.globalViewId; + + if ( + workspaceSlug && + globalViewId && + this.rootStore.globalViewFilters.storedFilters[globalViewId] && + this.rootStore.issueFilter.userDisplayFilters + ) + this.fetchViewIssues(workspaceSlug, globalViewId, this.rootStore.globalViewFilters.storedFilters[globalViewId]); + }); } computedFilter = (filters: any, filteredParams: any) => { diff --git a/web/store/issue/issue.store.ts b/web/store/issue/issue.store.ts index dfef99dc4..37a971b97 100644 --- a/web/store/issue/issue.store.ts +++ b/web/store/issue/issue.store.ts @@ -1,4 +1,4 @@ -import { observable, action, computed, makeObservable, runInAction } from "mobx"; +import { observable, action, computed, makeObservable, runInAction, autorun } from "mobx"; // store import { RootStore } from "../root"; // types @@ -68,8 +68,22 @@ export class IssueStore implements IIssueStore { fetchIssues: action, updateIssueStructure: action, }); + this.rootStore = _rootStore; this.issueService = new IssueService(); + + autorun(() => { + const workspaceSlug = this.rootStore.workspace.workspaceSlug; + const projectId = this.rootStore.project.projectId; + + if ( + workspaceSlug && + projectId && + this.rootStore.issueFilter.userFilters && + this.rootStore.issueFilter.userDisplayFilters + ) + this.fetchIssues(workspaceSlug, projectId); + }); } get getIssueType() { diff --git a/web/store/issue/issue_detail.store.ts b/web/store/issue/issue_detail.store.ts index a1886012d..d49ed5700 100644 --- a/web/store/issue/issue_detail.store.ts +++ b/web/store/issue/issue_detail.store.ts @@ -27,7 +27,7 @@ export interface IIssueDetailStore { // fetch issue details fetchIssueDetails: (workspaceSlug: string, projectId: string, issueId: string) => void; // creating issue - createIssue: (workspaceSlug: string, projectId: string, data: Partial, user: IUser) => void; + createIssue: (workspaceSlug: string, projectId: string, data: Partial, user: IUser) => Promise; // updating issue updateIssue: ( workspaceId: string, @@ -125,7 +125,7 @@ export class IssueDetailStore implements IIssueDetailStore { this.error = null; }); - const response = await this.issueService.createIssues(workspaceSlug, projectId, data, user); + const response = await this.issueService.createIssue(workspaceSlug, projectId, data, user); runInAction(() => { this.loader = false; @@ -135,10 +135,13 @@ export class IssueDetailStore implements IIssueDetailStore { [response.id]: response, }; }); + + return response; } catch (error) { this.loader = false; this.error = error; - return error; + + throw error; } }; diff --git a/web/store/module/module_issue.store.ts b/web/store/module/module_issue.store.ts index 3d59fd5ec..8b361b1fd 100644 --- a/web/store/module/module_issue.store.ts +++ b/web/store/module/module_issue.store.ts @@ -1,4 +1,4 @@ -import { observable, action, computed, makeObservable, runInAction } from "mobx"; +import { observable, action, computed, makeObservable, runInAction, autorun } from "mobx"; // store import { RootStore } from "../root"; // types @@ -69,8 +69,24 @@ export class ModuleIssueStore implements IModuleIssueStore { fetchIssues: action, updateIssueStructure: action, }); + this.rootStore = _rootStore; this.moduleService = new ModuleService(); + + autorun(() => { + const workspaceSlug = this.rootStore.workspace.workspaceSlug; + const projectId = this.rootStore.project.projectId; + const moduleId = this.rootStore.module.moduleId; + + if ( + workspaceSlug && + projectId && + moduleId && + this.rootStore.moduleFilter.moduleFilters && + this.rootStore.issueFilter.userDisplayFilters + ) + this.fetchIssues(workspaceSlug, projectId, moduleId); + }); } get getIssueType() { @@ -156,11 +172,7 @@ export class ModuleIssueStore implements IModuleIssueStore { this.loader = true; this.error = null; - this.rootStore.workspace.setWorkspaceSlug(workspaceSlug); - this.rootStore.project.setProjectId(projectId); - this.rootStore.module.setModuleId(moduleId); - - const params = this.rootStore?.cycleIssueFilter?.appliedFilters; + const params = this.rootStore?.moduleFilter?.appliedFilters; const issueResponse = await this.moduleService.getModuleIssuesWithParams( workspaceSlug, projectId, diff --git a/web/store/project-view/project_view_issues.store.ts b/web/store/project-view/project_view_issues.store.ts index 9156b0c94..11571b8da 100644 --- a/web/store/project-view/project_view_issues.store.ts +++ b/web/store/project-view/project_view_issues.store.ts @@ -1,4 +1,4 @@ -import { observable, action, makeObservable, runInAction, computed } from "mobx"; +import { observable, action, makeObservable, runInAction, computed, autorun } from "mobx"; // services import { IssueService } from "services/issue"; // helpers @@ -79,8 +79,22 @@ export class ProjectViewIssuesStore implements IProjectViewIssuesStore { }); this.rootStore = _rootStore; - this.issueService = new IssueService(); + + autorun(() => { + const workspaceSlug = this.rootStore.workspace.workspaceSlug; + const projectId = this.rootStore.project.projectId; + const viewId = this.rootStore.projectViews.viewId; + + if ( + workspaceSlug && + projectId && + viewId && + this.rootStore.projectViewFilters.storedFilters[viewId] && + this.rootStore.issueFilter.userDisplayFilters + ) + this.fetchViewIssues(workspaceSlug, projectId, viewId, this.rootStore.projectViewFilters.storedFilters[viewId]); + }); } computedFilter = (filters: any, filteredParams: any) => {