diff --git a/web/components/headers/project-issues.tsx b/web/components/headers/project-issues.tsx
index 910e18a52..25a2addaf 100644
--- a/web/components/headers/project-issues.tsx
+++ b/web/components/headers/project-issues.tsx
@@ -157,16 +157,14 @@ export const ProjectIssuesHeader: FC = observer(() => {
}
/>
- {projectId && inboxStore.isInboxEnabled(projectId.toString()) && (
+ {projectId && inboxStore.isInboxEnabled && inboxDetails && (
diff --git a/web/components/inbox/issue-card.tsx b/web/components/inbox/issue-card.tsx
index edaed1cd5..223ef6821 100644
--- a/web/components/inbox/issue-card.tsx
+++ b/web/components/inbox/issue-card.tsx
@@ -55,7 +55,7 @@ export const InboxIssueCard: React.FC = (props) => {
: "border-custom-border-200"
}`}
>
-
+
= observer((props) => {
const { children } = props;
// store
- const { user: userStore, project: projectStore } = useMobxStore();
+ const { user: userStore, project: projectStore, inbox: inboxStore } = useMobxStore();
// router
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
+ // fetching project details
+ useSWR(
+ workspaceSlug && projectId ? `PROJECT_DETAILS_${workspaceSlug.toString()}_${projectId.toString()}` : null,
+ workspaceSlug && projectId
+ ? () => projectStore.fetchProjectDetails(workspaceSlug.toString(), projectId.toString())
+ : null
+ );
// fetching user project member information
useSWR(
workspaceSlug && projectId ? `PROJECT_MEMBERS_ME_${workspaceSlug}_${projectId}` : null,
@@ -51,6 +58,17 @@ export const ProjectAuthWrapper: FC = observer((props) => {
? () => projectStore.fetchProjectStates(workspaceSlug.toString(), projectId.toString())
: null
);
+ // fetching project inboxes if inbox is enabled
+ useSWR(
+ workspaceSlug && projectId && inboxStore.isInboxEnabled ? `PROJECT_INBOXES_${workspaceSlug}_${projectId}` : null,
+ workspaceSlug && projectId && inboxStore.isInboxEnabled
+ ? () => inboxStore.fetchInboxesList(workspaceSlug.toString(), projectId.toString())
+ : null,
+ {
+ revalidateOnFocus: false,
+ revalidateOnReconnect: false,
+ }
+ );
// check if the project member apis is loading
if (!userStore.projectMemberInfo && userStore.hasPermissionToProject === null) {
diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/inbox/[inboxId].tsx b/web/pages/[workspaceSlug]/projects/[projectId]/inbox/[inboxId].tsx
index f08837e8c..f53d8f25c 100644
--- a/web/pages/[workspaceSlug]/projects/[projectId]/inbox/[inboxId].tsx
+++ b/web/pages/[workspaceSlug]/projects/[projectId]/inbox/[inboxId].tsx
@@ -19,7 +19,7 @@ const ProjectInbox: NextPage = () => {
const router = useRouter();
const { workspaceSlug, projectId, inboxId } = router.query;
- const { inboxIssues: inboxIssuesStore, inboxFilters: inboxFiltersStore, project: projectStore } = useMobxStore();
+ const { inboxFilters: inboxFiltersStore, project: projectStore } = useMobxStore();
const projectDetails =
workspaceSlug && projectId
@@ -27,12 +27,9 @@ const ProjectInbox: NextPage = () => {
: undefined;
useSWR(
- workspaceSlug && projectId && inboxId ? `REVALIDATE_INBOX_${inboxId.toString()}` : null,
+ workspaceSlug && projectId && inboxId ? `INBOX_FILTERS_${inboxId.toString()}` : null,
workspaceSlug && projectId && inboxId
- ? async () => {
- await inboxFiltersStore.fetchInboxFilters(workspaceSlug.toString(), projectId.toString(), inboxId.toString());
- await inboxIssuesStore.fetchInboxIssues(workspaceSlug.toString(), projectId.toString(), inboxId.toString());
- }
+ ? () => inboxFiltersStore.fetchInboxFilters(workspaceSlug.toString(), projectId.toString(), inboxId.toString())
: null
);
diff --git a/web/store/inbox/inbox.store.ts b/web/store/inbox/inbox.store.ts
index 132a56f62..c1ca08609 100644
--- a/web/store/inbox/inbox.store.ts
+++ b/web/store/inbox/inbox.store.ts
@@ -1,4 +1,4 @@
-import { observable, action, makeObservable, runInAction } from "mobx";
+import { observable, action, makeObservable, runInAction, computed } from "mobx";
// types
import { RootStore } from "../root";
// services
@@ -24,11 +24,13 @@ export interface IInboxStore {
// actions
setInboxId: (inboxId: string) => void;
- isInboxEnabled: (projectId: string) => boolean;
getInboxId: (projectId: string) => string | null;
fetchInboxesList: (workspaceSlug: string, projectId: string) => Promise;
fetchInboxDetails: (workspaceSlug: string, projectId: string, inboxId: string) => Promise;
+
+ // computed
+ isInboxEnabled: boolean;
}
export class InboxStore implements IInboxStore {
@@ -68,21 +70,27 @@ export class InboxStore implements IInboxStore {
setInboxId: action,
fetchInboxesList: action,
- isInboxEnabled: action,
getInboxId: action,
+
+ // computed
+ isInboxEnabled: computed,
});
this.rootStore = _rootStore;
this.inboxService = new InboxService();
}
- isInboxEnabled = (projectId: string) => {
+ get isInboxEnabled() {
+ const projectId = this.rootStore.project.projectId;
+
+ if (!projectId) return false;
+
const projectDetails = this.rootStore.project.project_details[projectId];
if (!projectDetails) return false;
return projectDetails.inbox_view;
- };
+ }
getInboxId = (projectId: string) => {
const projectDetails = this.rootStore.project.project_details[projectId];
diff --git a/web/store/inbox/inbox_issues.store.ts b/web/store/inbox/inbox_issues.store.ts
index f2a45e731..06c7997b2 100644
--- a/web/store/inbox/inbox_issues.store.ts
+++ b/web/store/inbox/inbox_issues.store.ts
@@ -1,4 +1,4 @@
-import { observable, action, makeObservable, runInAction } from "mobx";
+import { observable, action, makeObservable, runInAction, autorun } from "mobx";
// types
import { RootStore } from "../root";
// services
@@ -51,6 +51,15 @@ export class InboxIssuesStore implements IInboxIssuesStore {
this.rootStore = _rootStore;
this.inboxService = new InboxService();
+
+ autorun(() => {
+ const workspaceSlug = this.rootStore.workspace.workspaceSlug;
+ const projectId = this.rootStore.project.projectId;
+ const inboxId = this.rootStore.inbox.inboxId;
+
+ if (workspaceSlug && projectId && inboxId && this.rootStore.inboxFilters.inboxFilters[inboxId])
+ this.fetchInboxIssues(workspaceSlug, projectId, inboxId);
+ });
}
fetchInboxIssues = async (workspaceSlug: string, projectId: string, inboxId: string) => {