[WEB-1481] fix: inbox issue list update after changing issue status. (#4715)

This commit is contained in:
Prateek Shourya 2024-06-07 17:02:30 +05:30 committed by GitHub
parent 2331404d46
commit 9a4971efa4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 27 additions and 39 deletions

View File

@ -52,7 +52,7 @@ export const InboxIssueActionsHeader: FC<TInboxIssueActionsHeader> = observer((p
const [declineIssueModal, setDeclineIssueModal] = useState(false);
const [deleteIssueModal, setDeleteIssueModal] = useState(false);
// store
const { currentTab, deleteInboxIssue, inboxIssueIds } = useProjectInbox();
const { currentTab, deleteInboxIssue, filteredInboxIssueIds } = useProjectInbox();
const { data: currentUser } = useUser();
const {
membership: { currentProjectRole },
@ -76,11 +76,11 @@ export const InboxIssueActionsHeader: FC<TInboxIssueActionsHeader> = observer((p
const redirectIssue = (): string | undefined => {
let nextOrPreviousIssueId: string | undefined = undefined;
const currentIssueIndex = inboxIssueIds.findIndex((id) => id === currentInboxIssueId);
if (inboxIssueIds[currentIssueIndex + 1])
nextOrPreviousIssueId = inboxIssueIds[currentIssueIndex + 1];
else if (inboxIssueIds[currentIssueIndex - 1])
nextOrPreviousIssueId = inboxIssueIds[currentIssueIndex - 1];
const currentIssueIndex = filteredInboxIssueIds.findIndex((id) => id === currentInboxIssueId);
if (filteredInboxIssueIds[currentIssueIndex + 1])
nextOrPreviousIssueId = filteredInboxIssueIds[currentIssueIndex + 1];
else if (filteredInboxIssueIds[currentIssueIndex - 1])
nextOrPreviousIssueId = filteredInboxIssueIds[currentIssueIndex - 1];
else nextOrPreviousIssueId = undefined;
return nextOrPreviousIssueId;
};
@ -134,22 +134,22 @@ export const InboxIssueActionsHeader: FC<TInboxIssueActionsHeader> = observer((p
})
);
const currentIssueIndex = inboxIssueIds.findIndex((issueId) => issueId === currentInboxIssueId) ?? 0;
const currentIssueIndex = filteredInboxIssueIds.findIndex((issueId) => issueId === currentInboxIssueId) ?? 0;
const handleInboxIssueNavigation = useCallback(
(direction: "next" | "prev") => {
if (!inboxIssueIds || !currentInboxIssueId) return;
if (!filteredInboxIssueIds || !currentInboxIssueId) return;
const activeElement = document.activeElement as HTMLElement;
if (activeElement && (activeElement.classList.contains("tiptap") || activeElement.id === "title-input")) return;
const nextIssueIndex =
direction === "next"
? (currentIssueIndex + 1) % inboxIssueIds.length
: (currentIssueIndex - 1 + inboxIssueIds.length) % inboxIssueIds.length;
const nextIssueId = inboxIssueIds[nextIssueIndex];
? (currentIssueIndex + 1) % filteredInboxIssueIds.length
: (currentIssueIndex - 1 + filteredInboxIssueIds.length) % filteredInboxIssueIds.length;
const nextIssueId = filteredInboxIssueIds[nextIssueIndex];
if (!nextIssueId) return;
router.push(`/${workspaceSlug}/projects/${projectId}/inbox?inboxIssueId=${nextIssueId}`);
},
[currentInboxIssueId, currentIssueIndex, inboxIssueIds, projectId, router, workspaceSlug]
[currentInboxIssueId, currentIssueIndex, filteredInboxIssueIds, projectId, router, workspaceSlug]
);
const onKeyDown = useCallback(

View File

@ -44,7 +44,7 @@ export const InboxSidebar: FC<IInboxSidebarProps> = observer((props) => {
currentTab,
handleCurrentTab,
loader,
inboxIssueIds,
filteredInboxIssueIds,
inboxIssuePaginationInfo,
fetchInboxPaginationIssues,
getAppliedFiltersCount,
@ -106,13 +106,13 @@ export const InboxSidebar: FC<IInboxSidebarProps> = observer((props) => {
className="w-full h-full overflow-hidden overflow-y-auto vertical-scrollbar scrollbar-md"
ref={containerRef}
>
{inboxIssueIds.length > 0 ? (
{filteredInboxIssueIds.length > 0 ? (
<InboxIssueList
setIsMobileSidebar={setIsMobileSidebar}
workspaceSlug={workspaceSlug}
projectId={projectId}
projectIdentifier={currentProjectDetails?.identifier}
inboxIssueIds={inboxIssueIds}
inboxIssueIds={filteredInboxIssueIds}
/>
) : (
<div className="flex items-center justify-center h-full w-full">

View File

@ -1,7 +1,6 @@
import { uniq, update } from "lodash";
import isEmpty from "lodash/isEmpty";
import omit from "lodash/omit";
import orderBy from "lodash/orderBy";
import set from "lodash/set";
import { action, computed, makeObservable, observable, runInAction } from "mobx";
import { computedFn } from "mobx-utils";
@ -42,11 +41,11 @@ export interface IProjectInboxStore {
inboxIssueIds: string[];
// computed
getAppliedFiltersCount: number;
filteredInboxIssueIds: string[];
// computed functions
getIssueInboxByIssueId: (issueId: string) => IInboxIssueStore;
getIsIssueAvailable: (inboxIssueId: string) => boolean;
// helper actions
inboxIssueSorting: (issues: IInboxIssueStore[]) => IInboxIssueStore[];
inboxIssueQueryParams: (
inboxFilters: Partial<TInboxIssueFilter>,
inboxSorting: Partial<TInboxIssueSorting>,
@ -103,6 +102,7 @@ export class ProjectInboxStore implements IProjectInboxStore {
inboxIssueIds: observable,
// computed
getAppliedFiltersCount: computed,
filteredInboxIssueIds: computed,
// actions
handleInboxIssueFilters: action,
handleInboxIssueSorting: action,
@ -127,6 +127,16 @@ export class ProjectInboxStore implements IProjectInboxStore {
return count;
}
get filteredInboxIssueIds() {
let appliedFilters =
this.currentTab === EInboxIssueCurrentTab.OPEN
? [EInboxIssueStatus.PENDING, EInboxIssueStatus.SNOOZED]
: [EInboxIssueStatus.ACCEPTED, EInboxIssueStatus.DECLINED, EInboxIssueStatus.DUPLICATE];
appliedFilters = appliedFilters.filter((filter) => this.inboxFilters?.status?.includes(filter));
return this.inboxIssueIds.filter((id) => appliedFilters.includes(this.inboxIssues[id].status));
}
getIssueInboxByIssueId = computedFn((issueId: string) => this.inboxIssues?.[issueId]);
getIsIssueAvailable = computedFn((inboxIssueId: string) => {
@ -134,28 +144,6 @@ export class ProjectInboxStore implements IProjectInboxStore {
return this.inboxIssueIds.includes(inboxIssueId);
});
// helpers
inboxIssueSorting = (issues: IInboxIssueStore[]) => {
let inboxIssues: IInboxIssueStore[] = issues;
inboxIssues = orderBy(inboxIssues, "issue.sequence_id", "desc");
if (this.inboxSorting?.order_by && this.inboxSorting?.sort_by) {
switch (this.inboxSorting.order_by) {
case "issue__created_at":
if (this.inboxSorting.sort_by === "desc") inboxIssues = orderBy(inboxIssues, "issue.created_at", "desc");
else inboxIssues = orderBy(inboxIssues, "issue.created_at", "asc");
case "issue__updated_at":
if (this.inboxSorting.sort_by === "desc") inboxIssues = orderBy(inboxIssues, "issue.updated_at", "desc");
else inboxIssues = orderBy(inboxIssues, "issue.updated_at", "asc");
case "issue__sequence_id":
if (this.inboxSorting.sort_by === "desc") inboxIssues = orderBy(inboxIssues, "issue.sequence_id", "desc");
else inboxIssues = orderBy(inboxIssues, "issue.sequence_id", "asc");
default:
inboxIssues = inboxIssues;
}
}
return inboxIssues;
};
inboxIssueQueryParams = (
inboxFilters: Partial<TInboxIssueFilter>,
inboxSorting: Partial<TInboxIssueSorting>,