plane/web/store/issues/project-issues/project/issue.store.ts
guru_sainath d6abb87a3a chore: implemented new store and issue layouts for issues and updated new data structure for issues (#2843)
* fix: Implemented new workflow in the issue store and updated the quick add workflow in list layout

* fix: initial load and mutaion of issues in list layout

* dev: implemented the new project issues store with grouped, subGrouped and unGrouped issue computed functions

* dev: default display properties data made as a function

* conflict: merge conflict resolved

* dev: implemented quick add logic in kanban

* chore: implemented quick add logic in calendar and spreadsheet layout

* fix: spreadsheet layout quick add fix

* dev: optimised the issues workflow and handled the issues order_by filter

* dev: project issue CRUD operations in new issue store architecture

* dev: issues filtering in calendar layout

* fix: build error

* dev/issue_filters_store

* chore: updated filters computed structure

* conflict: merge conflicts resolved in project issues

* dev: implemented gantt chart for project issues using the new mobx store

* dev: initialized cycle and module issue filters store

* dev: issue store and list layout store updates

* dev: quick add and update, delete issue in the list

* refactor list root changes

* dev: store new structure

* refactor spreadsheet and gnatt project roots

* fix errors for base gantt and spreadsheet roots

* connect Calendar project view

* minor house keeping

* connect Kanban View to th enew store

* generalise base calendar issue actions

* dev: store project issues and issue filters

* dev: store project issues and filters

* dev: updated undefined with displayFilters in project issue store

* Add Quick add to all the layouts

* connect module views to store

* dev: Rendering list issues in project issues

* dev: removed console log

* dev: module filters store

* fix errors and connect modules list and quick add for list

* dev: module issue store

* dev: modle filter store issue fixed and updates cycle issue filters

* minor house keeping changes

* dev: cycle issues and cycle filters

* connecty cycles to teh store

* dev: project view issues and issue filtrs

* connect project views

* dev: updated applied filters in layouts

* dev: replaced project id with view id in project views

* dev: in cycle and module store made cycledId and moduleId as optional

* fix minor issues and build errots

* dev: project draft and archived issues store and filters

---------

Co-authored-by: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
Co-authored-by: rahulramesha <rahulramesham@gmail.com>
2023-12-07 19:59:35 +05:30

216 lines
7.4 KiB
TypeScript

import { action, observable, makeObservable, computed, runInAction, autorun } from "mobx";
// base class
import { IssueBaseStore } from "store/issues";
// services
import { IssueService } from "services/issue/issue.service";
// types
import { TIssueGroupByOptions } from "types";
import { IIssue } from "types/issues";
import { IIssueResponse, TLoader, IGroupedIssues, ISubGroupedIssues, TUnGroupedIssues } from "../../types";
import { RootStore } from "store/root";
export interface IProjectIssuesStore {
// observable
loader: TLoader;
issues: { [project_id: string]: IIssueResponse } | undefined;
// computed
getIssues: IIssueResponse | undefined;
getIssuesIds: IGroupedIssues | ISubGroupedIssues | TUnGroupedIssues | undefined;
// actions
fetchIssues: (workspaceSlug: string, projectId: string, loadType: TLoader) => Promise<IIssueResponse>;
createIssue: (workspaceSlug: string, projectId: string, data: Partial<IIssue>) => Promise<IIssue>;
updateIssue: (workspaceSlug: string, projectId: string, issueId: string, data: Partial<IIssue>) => Promise<IIssue>;
removeIssue: (workspaceSlug: string, projectId: string, issueId: string) => Promise<IIssue>;
quickAddIssue: (workspaceSlug: string, projectId: string, data: IIssue) => Promise<IIssue>;
}
export class ProjectIssuesStore extends IssueBaseStore implements IProjectIssuesStore {
loader: TLoader = "init-loader";
issues: { [project_id: string]: IIssueResponse } | undefined = undefined;
// root store
rootStore;
// service
issueService;
constructor(_rootStore: RootStore) {
super(_rootStore);
makeObservable(this, {
// observable
loader: observable.ref,
issues: observable.ref,
// computed
getIssues: computed,
getIssuesIds: computed,
// action
fetchIssues: action,
createIssue: action,
updateIssue: action,
removeIssue: action,
quickAddIssue: action,
});
this.rootStore = _rootStore;
this.issueService = new IssueService();
autorun(() => {
const workspaceSlug = this.rootStore.workspace.workspaceSlug;
const projectId = this.rootStore.project.projectId;
if (!workspaceSlug || !projectId) return;
const userFilters = this.rootStore?.projectIssuesFilter?.issueFilters?.filters;
if (userFilters) this.fetchIssues(workspaceSlug, projectId, "mutation");
});
}
get getIssues() {
const projectId = this.rootStore?.project.projectId;
if (!projectId || !this.issues || !this.issues[projectId]) return undefined;
return this.issues[projectId];
}
get getIssuesIds() {
const projectId = this.rootStore?.project.projectId;
const displayFilters = this.rootStore?.projectIssuesFilter?.issueFilters?.displayFilters;
if (!displayFilters) return undefined;
const subGroupBy = displayFilters?.sub_group_by;
const groupBy = displayFilters?.group_by;
const orderBy = displayFilters?.order_by;
const layout = displayFilters?.layout;
if (!projectId || !this.issues || !this.issues[projectId]) return undefined;
let issues: IIssueResponse | IGroupedIssues | ISubGroupedIssues | TUnGroupedIssues | undefined = undefined;
if (layout === "list" && orderBy) {
if (groupBy) issues = this.groupedIssues(groupBy, orderBy, this.issues[projectId]);
else issues = this.unGroupedIssues(orderBy, this.issues[projectId]);
} else if (layout === "kanban" && groupBy && orderBy) {
if (subGroupBy) issues = this.subGroupedIssues(subGroupBy, groupBy, orderBy, this.issues[projectId]);
else issues = this.groupedIssues(groupBy, orderBy, this.issues[projectId]);
} else if (layout === "calendar")
issues = this.groupedIssues("target_date" as TIssueGroupByOptions, "target_date", this.issues[projectId], true);
else if (layout === "spreadsheet") issues = this.unGroupedIssues(orderBy ?? "-created_at", this.issues[projectId]);
else if (layout === "gantt_chart") issues = this.unGroupedIssues(orderBy ?? "sort_order", this.issues[projectId]);
return issues;
}
fetchIssues = async (workspaceSlug: string, projectId: string, loadType: TLoader = "init-loader") => {
try {
this.loader = loadType;
const params = this.rootStore?.projectIssuesFilter?.appliedFilters;
const response = await this.issueService.getV3Issues(workspaceSlug, projectId, params);
const _issues = { ...this.issues, [projectId]: { ...response } };
runInAction(() => {
this.issues = _issues;
this.loader = undefined;
});
return response;
} catch (error) {
this.fetchIssues(workspaceSlug, projectId);
this.loader = undefined;
throw error;
}
};
createIssue = async (workspaceSlug: string, projectId: string, data: Partial<IIssue>) => {
try {
const response = await this.issueService.createIssue(workspaceSlug, projectId, data);
let _issues = this.issues;
if (!_issues) _issues = {};
if (!_issues[projectId]) _issues[projectId] = {};
_issues[projectId] = { ..._issues[projectId], ...{ [response.id]: response } };
runInAction(() => {
this.issues = _issues;
});
return response;
} catch (error) {
this.fetchIssues(workspaceSlug, projectId, "mutation");
throw error;
}
};
updateIssue = async (workspaceSlug: string, projectId: string, issueId: string, data: Partial<IIssue>) => {
try {
let _issues = { ...this.issues };
if (!_issues) _issues = {};
if (!_issues[projectId]) _issues[projectId] = {};
_issues[projectId][issueId] = { ..._issues[projectId][issueId], ...data };
runInAction(() => {
this.issues = _issues;
});
const response = await this.issueService.patchIssue(workspaceSlug, projectId, issueId, data);
return response;
} catch (error) {
this.fetchIssues(workspaceSlug, projectId, "mutation");
throw error;
}
};
removeIssue = async (workspaceSlug: string, projectId: string, issueId: string) => {
try {
let _issues = { ...this.issues };
if (!_issues) _issues = {};
if (!_issues[projectId]) _issues[projectId] = {};
delete _issues?.[projectId]?.[issueId];
runInAction(() => {
this.issues = _issues;
});
const response = await this.issueService.deleteIssue(workspaceSlug, projectId, issueId);
return response;
} catch (error) {
this.fetchIssues(workspaceSlug, projectId, "mutation");
throw error;
}
};
quickAddIssue = async (workspaceSlug: string, projectId: string, data: IIssue) => {
try {
let _issues = { ...this.issues };
if (!_issues) _issues = {};
if (!_issues[projectId]) _issues[projectId] = {};
_issues[projectId] = { ..._issues[projectId], ...{ [data.id as keyof IIssue]: data } };
runInAction(() => {
this.issues = _issues;
});
const response = await this.issueService.createIssue(workspaceSlug, projectId, data);
if (this.issues) {
delete this.issues[projectId][data.id as keyof IIssue];
let _issues = { ...this.issues };
if (!_issues) _issues = {};
if (!_issues[projectId]) _issues[projectId] = {};
_issues[projectId] = { ..._issues[projectId], ...{ [response.id as keyof IIssue]: response } };
runInAction(() => {
this.issues = _issues;
});
}
return response;
} catch (error) {
this.fetchIssues(workspaceSlug, projectId, "mutation");
throw error;
}
};
}