binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: optimised issue loaders and added enum for issue status and current tab (#4164)

Browse source
This commit is contained in:
guru_sainath 2024-04-10 19:55:16 +05:30 • committed by GitHub
parent 7aa1d750ea
commit cfbc1a91af
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 131 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

10
web/store/inbox/inbox-issue.store.ts
View file

@ -1,6 +1,8 @@
import set from "lodash/set";
import { makeObservable, observable, runInAction, action } from "mobx";
import { TIssue, TInboxIssue, TInboxIssueStatus, TInboxDuplicateIssueDetails } from "@plane/types";
// helpers
import { EInboxIssueStatus } from "@/helpers/inbox.helper";
// services
import { InboxIssueService } from "@/services/inbox";
// root store
@ -26,7 +28,7 @@ export class InboxIssueStore implements IInboxIssueStore {
// observables
isLoading: boolean = false;
id: string;
status: TInboxIssueStatus = -2;
status: TInboxIssueStatus = EInboxIssueStatus.PENDING;
issue: Partial<TIssue> = {};
snoozed_till: Date | undefined;
duplicate_to: string | undefined;
@ -82,7 +84,8 @@ export class InboxIssueStore implements IInboxIssueStore {
};
updateInboxIssueDuplicateTo = async (issueId: string) => {
const inboxStatus = 2;
const inboxStatus = EInboxIssueStatus.DUPLICATE;
const previousData: Partial<TInboxIssue> = {
status: this.status,
duplicate_to: this.duplicate_to,
@ -108,7 +111,8 @@ export class InboxIssueStore implements IInboxIssueStore {
};
updateInboxIssueSnoozeTill = async (date: Date) => {
const inboxStatus = 0;
const inboxStatus = EInboxIssueStatus.SNOOZED;
const previousData: Partial<TInboxIssue> = {
status: this.status,
snoozed_till: this.snoozed_till,

83
web/store/inbox/project-inbox.store.ts
View file

@ -1,5 +1,7 @@
import isEmpty from "lodash/isEmpty";
import omit from "lodash/omit";
import orderBy from "lodash/orderBy";
import reverse from "lodash/reverse";
import set from "lodash/set";
import { action, computed, makeObservable, observable, runInAction } from "mobx";
import { computedFn } from "mobx-utils";
@ -13,19 +15,26 @@ import {
TInboxIssueSortingOrderByQueryParam,
} from "@plane/types";
// helpers
import { EPastDurationFilters, getCustomDates } from "@/helpers/inbox.helper";
import { EInboxIssueCurrentTab, EInboxIssueStatus, EPastDurationFilters, getCustomDates } from "@/helpers/inbox.helper";
// services
import { InboxIssueService } from "@/services/inbox";
// root store
import { IInboxIssueStore, InboxIssueStore } from "@/store/inbox/inbox-issue.store";
import { RootStore } from "@/store/root.store";
type TLoader = "init-loading" | "filter-loading" | "pagination-loading" | "issue-loading" | undefined;
type TLoader =
| "init-loading"
| "mutation-loading"
| "filter-loading"
| "pagination-loading"
| "issue-loading"
| undefined;
export interface IProjectInboxStore {
currentTab: TInboxIssueCurrentTab;
isLoading: TLoader;
error: { message: string; status: "init-error" | "pagination-error" } | undefined;
currentInboxProjectId: string;
inboxFilters: Partial<TInboxIssueFilter>;
inboxSorting: Partial<TInboxIssueSorting>;
inboxIssuePaginationInfo: TInboxIssuePaginationInfo | undefined;
@ -35,6 +44,7 @@ export interface IProjectInboxStore {
inboxIssuesArray: IInboxIssueStore[];
// helper actions
getIssueInboxByIssueId: (issueId: string) => IInboxIssueStore | undefined;
inboxIssueSorting: (issues: IInboxIssueStore[]) => IInboxIssueStore[];
inboxIssueQueryParams: (
inboxFilters: Partial<TInboxIssueFilter>,
inboxSorting: Partial<TInboxIssueSorting>,
@ -60,11 +70,12 @@ export class ProjectInboxStore implements IProjectInboxStore {
// constants
PER_PAGE_COUNT = 10;
// observables
currentTab: TInboxIssueCurrentTab = "open";
isLoading: TLoader = undefined;
currentTab: TInboxIssueCurrentTab = EInboxIssueCurrentTab.OPEN;
isLoading: TLoader = "init-loading";
error: { message: string; status: "init-error" | "pagination-error" } | undefined = undefined;
currentInboxProjectId: string = "";
inboxFilters: Partial<TInboxIssueFilter> = {
status: [-2],
status: [EInboxIssueStatus.PENDING],
};
inboxSorting: Partial<TInboxIssueSorting> = {
order_by: "issue__created_at",
@ -79,6 +90,8 @@ export class ProjectInboxStore implements IProjectInboxStore {
makeObservable(this, {
currentTab: observable.ref,
isLoading: observable.ref,
error: observable,
currentInboxProjectId: observable.ref,
inboxFilters: observable,
inboxSorting: observable,
inboxIssuePaginationInfo: observable,
@ -111,13 +124,40 @@ export class ProjectInboxStore implements IProjectInboxStore {
}
get inboxIssuesArray() {
return Object.values(this.inboxIssues || {}).filter((inbox) =>
(this.currentTab === "open" ? [-2, 0] : [-1, 1, 2]).includes(inbox.status)
return this.inboxIssueSorting(
Object.values(this.inboxIssues || {}).filter((inbox) =>
(this.currentTab === EInboxIssueCurrentTab.OPEN
? [EInboxIssueStatus.PENDING, EInboxIssueStatus.SNOOZED]
: [EInboxIssueStatus.ACCEPTED, EInboxIssueStatus.DECLINED, EInboxIssueStatus.DUPLICATE]
).includes(inbox.status)
)
);
}
getIssueInboxByIssueId = computedFn((issueId: string) => this.inboxIssues?.[issueId] || undefined);
// helpers
inboxIssueSorting = (issues: IInboxIssueStore[]) => {
console.log("issues", issues);
let inboxIssues: IInboxIssueStore[] = [];
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(issues, ["issue", "created_at"]);
else inboxIssues = reverse(orderBy(issues, ["issue", "created_at"]));
case "issue__updated_at":
if (this.inboxSorting.sort_by === "desc") inboxIssues = orderBy(issues, ["issue", "updated_at"]);
else inboxIssues = reverse(orderBy(issues, ["issue", "updated_at"]));
case "issue__sequence_id":
if (this.inboxSorting.sort_by === "desc") inboxIssues = orderBy(issues, ["issue", "sequence_id"]);
else inboxIssues = reverse(orderBy(issues, ["issue", "sequence_id"]));
default:
inboxIssues = orderBy(issues, ["issue", "created_at"]);
}
}
return inboxIssues;
};
inboxIssueQueryParams = (
inboxFilters: Partial<TInboxIssueFilter>,
inboxSorting: Partial<TInboxIssueSorting>,
@ -177,6 +217,8 @@ export class ProjectInboxStore implements IProjectInboxStore {
set(this, "inboxFilters", undefined);
set(this, ["inboxSorting", "order_by"], "issue__created_at");
set(this, ["inboxSorting", "sort_by"], "desc");
set(this, ["inboxIssues"], {});
set(this, ["inboxIssuePaginationInfo"], undefined);
if (tab === "closed") set(this, ["inboxFilters", "status"], [-1, 1, 2]);
else set(this, ["inboxFilters", "status"], [-2]);
const { workspaceSlug, projectId } = this.store.app.router;
@ -185,12 +227,16 @@ export class ProjectInboxStore implements IProjectInboxStore {
handleInboxIssueFilters = <T extends keyof TInboxIssueFilter>(key: T, value: TInboxIssueFilter[T]) => {
set(this.inboxFilters, key, value);
set(this, ["inboxIssues"], {});
set(this, ["inboxIssuePaginationInfo"], undefined);
const { workspaceSlug, projectId } = this.store.app.router;
if (workspaceSlug && projectId) this.fetchInboxIssues(workspaceSlug, projectId, "filter-loading");
};
handleInboxIssueSorting = <T extends keyof TInboxIssueSorting>(key: T, value: TInboxIssueSorting[T]) => {
set(this.inboxSorting, key, value);
set(this, ["inboxIssues"], {});
set(this, ["inboxIssuePaginationInfo"], undefined);
const { workspaceSlug, projectId } = this.store.app.router;
if (workspaceSlug && projectId) this.fetchInboxIssues(workspaceSlug, projectId, "filter-loading");
};
@ -202,10 +248,14 @@ export class ProjectInboxStore implements IProjectInboxStore {
*/
fetchInboxIssues = async (workspaceSlug: string, projectId: string, loadingType: TLoader = undefined) => {
try {
if (this.currentInboxProjectId != projectId) {
set(this, ["currentInboxProjectId"], projectId);
set(this, ["inboxIssues"], {});
set(this, ["inboxIssuePaginationInfo"], undefined);
}
if (Object.keys(this.inboxIssues).length === 0) this.isLoading = "init-loading";
else this.isLoading = "mutation-loading";
if (loadingType) this.isLoading = loadingType;
else if (Object.keys(this.inboxIssues).length === 0) this.isLoading = "init-loading";
set(this, ["inboxIssues"], {});
set(this, ["inboxIssuePaginationInfo"], undefined);
const queryParams = this.inboxIssueQueryParams(
this.inboxFilters,
@ -247,9 +297,10 @@ export class ProjectInboxStore implements IProjectInboxStore {
fetchInboxPaginationIssues = async (workspaceSlug: string, projectId: string) => {
try {
if (
!this.inboxIssuePaginationInfo?.total_results ||
(this.inboxIssuePaginationInfo?.total_results &&
this.inboxIssuesArray.length < this.inboxIssuePaginationInfo?.total_results)
this.inboxIssuePaginationInfo &&
(!this.inboxIssuePaginationInfo?.total_results ||
(this.inboxIssuePaginationInfo?.total_results &&
this.inboxIssuesArray.length < this.inboxIssuePaginationInfo?.total_results))
) {
this.isLoading = "pagination-loading";
@ -299,15 +350,15 @@ export class ProjectInboxStore implements IProjectInboxStore {
const issueId = inboxIssue?.issue?.id || undefined;
if (inboxIssue && issueId) {
runInAction(() => {
set(this.inboxIssues, [issueId], new InboxIssueStore(workspaceSlug, projectId, inboxIssue, this.store));
});
// fetching reactions
await this.store.issue.issueDetail.fetchReactions(workspaceSlug, projectId, issueId);
// fetching activity
await this.store.issue.issueDetail.fetchActivities(workspaceSlug, projectId, issueId);
// fetching comments
await this.store.issue.issueDetail.fetchComments(workspaceSlug, projectId, issueId);
runInAction(() => {
set(this.inboxIssues, [issueId], new InboxIssueStore(workspaceSlug, projectId, inboxIssue, this.store));
});
this.isLoading = undefined;
}
} catch {