mirror of
https://github.com/makeplane/plane
synced 2024-06-14 14:31:34 +00:00
chore: implemented autorun for inbox issues (#2470)
* fix: inbox issues not loading * chore: implemented autorun for inbox issues * chore: don't revalidate inbox list
This commit is contained in:
parent
3197dd484c
commit
baa2621fe2
@ -157,16 +157,14 @@ export const ProjectIssuesHeader: FC = observer(() => {
|
||||
}
|
||||
/>
|
||||
</FiltersDropdown>
|
||||
{projectId && inboxStore.isInboxEnabled(projectId.toString()) && (
|
||||
{projectId && inboxStore.isInboxEnabled && inboxDetails && (
|
||||
<Link href={`/${workspaceSlug}/projects/${projectId}/inbox/${inboxStore.getInboxId(projectId.toString())}`}>
|
||||
<a>
|
||||
<Button variant="neutral-primary" size="sm" className="relative">
|
||||
Inbox
|
||||
{inboxDetails && (
|
||||
<span className="absolute -top-1.5 -right-1.5 h-4 w-4 rounded-full text-custom-text-100 bg-custom-sidebar-background-80 border border-custom-sidebar-border-200">
|
||||
{inboxDetails.pending_issue_count}
|
||||
</span>
|
||||
)}
|
||||
<span className="absolute -top-1.5 -right-1.5 h-4 w-4 rounded-full text-custom-text-100 bg-custom-sidebar-background-80 border border-custom-sidebar-border-200">
|
||||
{inboxDetails.pending_issue_count}
|
||||
</span>
|
||||
</Button>
|
||||
</a>
|
||||
</Link>
|
||||
|
@ -55,7 +55,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
|
||||
: "border-custom-border-200"
|
||||
}`}
|
||||
>
|
||||
<PriorityIcon priority={issue.priority ?? null} className="text-sm" />
|
||||
<PriorityIcon priority={issue.priority ?? null} className="h-3.5 w-3.5" />
|
||||
</div>
|
||||
</Tooltip>
|
||||
<Tooltip
|
||||
|
@ -18,11 +18,18 @@ interface IProjectAuthWrapper {
|
||||
export const ProjectAuthWrapper: FC<IProjectAuthWrapper> = 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<IProjectAuthWrapper> = 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) {
|
||||
|
@ -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
|
||||
);
|
||||
|
||||
|
@ -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<IInbox[]>;
|
||||
fetchInboxDetails: (workspaceSlug: string, projectId: string, inboxId: string) => Promise<IInbox>;
|
||||
|
||||
// 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];
|
||||
|
@ -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) => {
|
||||
|
Loading…
Reference in New Issue
Block a user