github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: update create/update issue modal to use currently active store's create/update method. (#3395)

Browse Source 
* refactor: update `create/update issue` modal to use currently active store's create/update method.

* chore: add condition to avoid multiple API calls if the current store is MODULE or CYCLE.

* remove: console log

* chore: update `currentStore` to `storeType`.
This commit is contained in:
Prateek Shourya 2024-01-18 14:42:10 +05:30 committed by GitHub
parent e175d50ab7
commit a9e2e21641
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
29 changed files with 251 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/components/command-palette/command-palette.tsx
View File

@ -60,6 +60,7 @@ export const CommandPalette: FC = observer(() => {
isDeleteIssueModalOpen,
toggleDeleteIssueModal,
isAnyModalOpen,
createIssueStoreType,
} = commandPalette;
const { setToastAlert } = useToast();
@ -216,6 +217,7 @@ export const CommandPalette: FC = observer(() => {
isOpen={isCreateIssueModalOpen}
onClose={() => toggleCreateIssueModal(false)}
data={cycleId ? { cycle_id: cycleId.toString() } : moduleId ? { module_id: moduleId.toString() } : undefined}
storeType={createIssueStoreType}
/>
{workspaceSlug && projectId && issueId && issueDetails && (

2
web/components/issues/issue-layouts/empty-states/module.tsx
View File

@ -75,7 +75,7 @@ export const ModuleEmptyState: React.FC<Props> = observer((props) => {
icon: <PlusIcon className="h-3 w-3" strokeWidth={2} />,
onClick: () => {
setTrackElement("MODULE_EMPTY_STATE");
toggleCreateIssueModal(true);
toggleCreateIssueModal(true, EIssuesStoreType.MODULE);
},
}}
secondaryButton={

6
web/components/issues/issue-layouts/kanban/base-kanban-root.tsx
View File

@ -43,7 +43,7 @@ export interface IBaseKanBanLayout {
};
showLoader?: boolean;
viewId?: string;
currentStore?: TCreateModalStoreTypes;
storeType?: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
canEditPropertiesBasedOnProject?: (projectId: string) => boolean;
}
@ -62,7 +62,7 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
issueActions,
showLoader,
viewId,
currentStore,
storeType,
addIssuesToView,
canEditPropertiesBasedOnProject,
} = props;
@ -277,7 +277,7 @@ export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBas
viewId={viewId}
disableIssueCreation={!enableIssueCreation || !isEditingAllowed}
canEditProperties={canEditProperties}
currentStore={currentStore}
storeType={storeType}
addIssuesToView={addIssuesToView}
/>
</DragDropContext>

12
web/components/issues/issue-layouts/kanban/default.tsx
View File

@ -42,7 +42,7 @@ export interface IGroupByKanBan {
) => Promise<TIssue | undefined>;
viewId?: string;
disableIssueCreation?: boolean;
currentStore?: TCreateModalStoreTypes;
storeType?: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
canEditProperties: (projectId: string | undefined) => boolean;
}
@ -64,7 +64,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
quickAddCallback,
viewId,
disableIssueCreation,
currentStore,
storeType,
addIssuesToView,
canEditProperties,
} = props;
@ -107,7 +107,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
count={(issueIds as TGroupedIssues)?.[_list.id]?.length || 0}
issuePayload={_list.payload}
disableIssueCreation={disableIssueCreation || isGroupByCreatedBy}
currentStore={currentStore}
storeType={storeType}
addIssuesToView={addIssuesToView}
kanbanFilters={kanbanFilters}
handleKanbanFilters={handleKanbanFilters}
@ -163,7 +163,7 @@ export interface IKanBan {
) => Promise<TIssue | undefined>;
viewId?: string;
disableIssueCreation?: boolean;
currentStore?: TCreateModalStoreTypes;
storeType?: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
canEditProperties: (projectId: string | undefined) => boolean;
}
@ -184,7 +184,7 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback,
viewId,
disableIssueCreation,
currentStore,
storeType,
addIssuesToView,
canEditProperties,
} = props;
@ -208,7 +208,7 @@ export const KanBan: React.FC<IKanBan> = observer((props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
currentStore={currentStore}
storeType={storeType}
addIssuesToView={addIssuesToView}
canEditProperties={canEditProperties}
/>

10
web/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
View File

@ -25,7 +25,7 @@ interface IHeaderGroupByCard {
handleKanbanFilters: any;
issuePayload: Partial<TIssue>;
disableIssueCreation?: boolean;
currentStore?: TCreateModalStoreTypes;
storeType?: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
}
@ -40,6 +40,7 @@ export const HeaderGroupByCard: FC<IHeaderGroupByCard> = observer((props) => {
handleKanbanFilters,
issuePayload,
disableIssueCreation,
storeType,
addIssuesToView,
} = props;
const verticalAlignPosition = sub_group_by ? false : kanbanFilters?.group_by.includes(column_id);
@ -83,7 +84,12 @@ export const HeaderGroupByCard: FC<IHeaderGroupByCard> = observer((props) => {
fieldsToShow={["all"]}
/>
) : (
<CreateUpdateIssueModal isOpen={isOpen} onClose={() => setIsOpen(false)} data={issuePayload} />
<CreateUpdateIssueModal
isOpen={isOpen}
onClose={() => setIsOpen(false)}
data={issuePayload}
storeType={storeType}
/>
)}
{renderExistingIssueModal && (
<ExistingIssuesListModal

2
web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx
View File

@ -50,7 +50,7 @@ export const CycleKanBanLayout: React.FC = observer(() => {
showLoader={true}
QuickActions={CycleIssueQuickActions}
viewId={cycleId?.toString() ?? ""}
currentStore={EIssuesStoreType.CYCLE}
storeType={EIssuesStoreType.CYCLE}
addIssuesToView={(issueIds: string[]) => {
if (!workspaceSlug || !projectId || !cycleId) throw new Error();
return issues.addIssueToCycle(workspaceSlug.toString(), projectId.toString(), cycleId.toString(), issueIds);

2
web/components/issues/issue-layouts/kanban/roots/module-root.tsx
View File

@ -50,7 +50,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => {
showLoader={true}
QuickActions={ModuleIssueQuickActions}
viewId={moduleId?.toString()}
currentStore={EIssuesStoreType.MODULE}
storeType={EIssuesStoreType.MODULE}
addIssuesToView={(issueIds: string[]) => {
if (!workspaceSlug || !projectId || !moduleId) throw new Error();
return issues.addIssueToModule(workspaceSlug.toString(), projectId.toString(), moduleId.toString(), issueIds);

2
web/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx
View File

@ -52,7 +52,7 @@ export const ProfileIssuesKanBanLayout: React.FC = observer(() => {
issues={issues}
showLoader={true}
QuickActions={ProjectIssueQuickActions}
currentStore={EIssuesStoreType.PROFILE}
storeType={EIssuesStoreType.PROFILE}
canEditPropertiesBasedOnProject={canEditPropertiesBasedOnProject}
/>
);

2
web/components/issues/issue-layouts/kanban/roots/project-root.tsx
View File

@ -43,7 +43,7 @@ export const KanBanLayout: React.FC = observer(() => {
issuesFilter={issuesFilter}
showLoader={true}
QuickActions={ProjectIssueQuickActions}
currentStore={EIssuesStoreType.PROJECT}
storeType={EIssuesStoreType.PROJECT}
/>
);
});

2
web/components/issues/issue-layouts/kanban/roots/project-view-root.tsx
View File

@ -35,7 +35,7 @@ export const ProjectViewKanBanLayout: React.FC<IViewKanBanLayout> = observer((pr
issues={issues}
showLoader={true}
QuickActions={ProjectIssueQuickActions}
currentStore={EIssuesStoreType.PROJECT_VIEW}
storeType={EIssuesStoreType.PROJECT_VIEW}
viewId={viewId?.toString()}
/>
);

4
web/components/issues/issue-layouts/kanban/swimlanes.tsx
View File

@ -69,7 +69,7 @@ interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
handleKanbanFilters: (toggle: "group_by" | "sub_group_by", value: string) => void;
isDragStarted?: boolean;
disableIssueCreation?: boolean;
currentStore?: TCreateModalStoreTypes;
storeType?: TCreateModalStoreTypes;
enableQuickIssueCreate: boolean;
canEditProperties: (projectId: string | undefined) => boolean;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
@ -172,7 +172,7 @@ export interface IKanBanSwimLanes {
showEmptyGroup: boolean;
isDragStarted?: boolean;
disableIssueCreation?: boolean;
currentStore?: TCreateModalStoreTypes;
storeType?: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
enableQuickIssueCreate: boolean;
quickAddCallback?: (

6
web/components/issues/issue-layouts/list/base-list-root.tsx
View File

@ -48,7 +48,7 @@ interface IBaseListRoot {
[EIssueActions.REMOVE]?: (issue: TIssue) => Promise<void>;
};
viewId?: string;
currentStore: TCreateModalStoreTypes;
storeType: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
canEditPropertiesBasedOnProject?: (projectId: string) => boolean;
}
@ -60,7 +60,7 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
QuickActions,
issueActions,
viewId,
currentStore,
storeType,
addIssuesToView,
canEditPropertiesBasedOnProject,
} = props;
@ -134,7 +134,7 @@ export const BaseListRoot = observer((props: IBaseListRoot) => {
enableIssueQuickAdd={!!enableQuickAdd}
canEditProperties={canEditProperties}
disableIssueCreation={!enableIssueCreation || !isEditingAllowed}
currentStore={currentStore}
storeType={storeType}
addIssuesToView={addIssuesToView}
/>
</div>

12
web/components/issues/issue-layouts/list/default.tsx
View File

@ -34,7 +34,7 @@ export interface IGroupByList {
viewId?: string
) => Promise<TIssue | undefined>;
disableIssueCreation?: boolean;
currentStore: TCreateModalStoreTypes;
storeType: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
viewId?: string;
}
@ -53,7 +53,7 @@ const GroupByList: React.FC<IGroupByList> = (props) => {
quickAddCallback,
viewId,
disableIssueCreation,
currentStore,
storeType,
addIssuesToView,
} = props;
// store hooks
@ -116,7 +116,7 @@ const GroupByList: React.FC<IGroupByList> = (props) => {
count={is_list ? issueIds?.length || 0 : issueIds?.[_list.id]?.length || 0}
issuePayload={_list.payload}
disableIssueCreation={disableIssueCreation || isGroupByCreatedBy}
currentStore={currentStore}
storeType={storeType}
addIssuesToView={addIssuesToView}
/>
</div>
@ -166,7 +166,7 @@ export interface IList {
) => Promise<TIssue | undefined>;
viewId?: string;
disableIssueCreation?: boolean;
currentStore: TCreateModalStoreTypes;
storeType: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
}
@ -184,7 +184,7 @@ export const List: React.FC<IList> = (props) => {
enableIssueQuickAdd,
canEditProperties,
disableIssueCreation,
currentStore,
storeType,
addIssuesToView,
} = props;
@ -203,7 +203,7 @@ export const List: React.FC<IList> = (props) => {
quickAddCallback={quickAddCallback}
viewId={viewId}
disableIssueCreation={disableIssueCreation}
currentStore={currentStore}
storeType={storeType}
addIssuesToView={addIssuesToView}
/>
</div>

11
web/components/issues/issue-layouts/list/headers/group-by-card.tsx
View File

@ -19,12 +19,12 @@ interface IHeaderGroupByCard {
count: number;
issuePayload: Partial<TIssue>;
disableIssueCreation?: boolean;
currentStore: TCreateModalStoreTypes;
storeType: TCreateModalStoreTypes;
addIssuesToView?: (issueIds: string[]) => Promise<TIssue>;
}
export const HeaderGroupByCard = observer(
({ icon, title, count, issuePayload, disableIssueCreation, currentStore, addIssuesToView }: IHeaderGroupByCard) => {
({ icon, title, count, issuePayload, disableIssueCreation, storeType, addIssuesToView }: IHeaderGroupByCard) => {
const router = useRouter();
const { workspaceSlug, projectId, moduleId, cycleId } = router.query;
@ -101,7 +101,12 @@ export const HeaderGroupByCard = observer(
fieldsToShow={["all"]}
/>
) : (
<CreateUpdateIssueModal isOpen={isOpen} onClose={() => setIsOpen(false)} data={issuePayload} />
<CreateUpdateIssueModal
isOpen={isOpen}
onClose={() => setIsOpen(false)}
data={issuePayload}
storeType={storeType}
/>
)}
{renderExistingIssueModal && (

2
web/components/issues/issue-layouts/list/roots/archived-issue-root.tsx
View File

@ -34,7 +34,7 @@ export const ArchivedIssueListLayout: FC = observer(() => {
issues={issues}
QuickActions={ArchivedIssueQuickActions}
issueActions={issueActions}
currentStore={EIssuesStoreType.PROJECT}
storeType={EIssuesStoreType.PROJECT}
/>
);
});

2
web/components/issues/issue-layouts/list/roots/cycle-root.tsx
View File

@ -48,7 +48,7 @@ export const CycleListLayout: React.FC = observer(() => {
QuickActions={CycleIssueQuickActions}
issueActions={issueActions}
viewId={cycleId?.toString()}
currentStore={EIssuesStoreType.CYCLE}
storeType={EIssuesStoreType.CYCLE}
addIssuesToView={(issueIds: string[]) => {
if (!workspaceSlug || !projectId || !cycleId) throw new Error();
return issues.addIssueToCycle(workspaceSlug.toString(), projectId.toString(), cycleId.toString(), issueIds);

2
web/components/issues/issue-layouts/list/roots/draft-issue-root.tsx
View File

@ -43,7 +43,7 @@ export const DraftIssueListLayout: FC = observer(() => {
issues={issues}
QuickActions={ProjectIssueQuickActions}
issueActions={issueActions}
currentStore={EIssuesStoreType.PROJECT}
storeType={EIssuesStoreType.PROJECT}
/>
);
});

2
web/components/issues/issue-layouts/list/roots/module-root.tsx
View File

@ -48,7 +48,7 @@ export const ModuleListLayout: React.FC = observer(() => {
QuickActions={ModuleIssueQuickActions}
issueActions={issueActions}
viewId={moduleId?.toString()}
currentStore={EIssuesStoreType.MODULE}
storeType={EIssuesStoreType.MODULE}
addIssuesToView={(issueIds: string[]) => {
if (!workspaceSlug || !projectId || !moduleId) throw new Error();
return issues.addIssueToModule(workspaceSlug.toString(), projectId.toString(), moduleId.toString(), issueIds);

2
web/components/issues/issue-layouts/list/roots/profile-issues-root.tsx
View File

@ -52,7 +52,7 @@ export const ProfileIssuesListLayout: FC = observer(() => {
issues={issues}
QuickActions={ProjectIssueQuickActions}
issueActions={issueActions}
currentStore={EIssuesStoreType.PROFILE}
storeType={EIssuesStoreType.PROFILE}
canEditPropertiesBasedOnProject={canEditPropertiesBasedOnProject}
/>
);

2
web/components/issues/issue-layouts/list/roots/project-root.tsx
View File

@ -44,7 +44,7 @@ export const ListLayout: FC = observer(() => {
issues={issues}
QuickActions={ProjectIssueQuickActions}
issueActions={issueActions}
currentStore={EIssuesStoreType.PROJECT}
storeType={EIssuesStoreType.PROJECT}
/>
);
});

2
web/components/issues/issue-layouts/list/roots/project-view-root.tsx
View File

@ -36,7 +36,7 @@ export const ProjectViewListLayout: React.FC<IViewListLayout> = observer((props)
issues={issues}
QuickActions={ProjectIssueQuickActions}
issueActions={issueActions}
currentStore={EIssuesStoreType.PROJECT_VIEW}
storeType={EIssuesStoreType.PROJECT_VIEW}
viewId={viewId?.toString()}
/>
);

3
web/components/issues/issue-layouts/quick-action-dropdowns/all-issue.tsx
View File

@ -11,6 +11,8 @@ import { copyUrlToClipboard } from "helpers/string.helper";
// types
import { TIssue } from "@plane/types";
import { IQuickActionProps } from "../list/list-view-types";
// constants
import { EIssuesStoreType } from "constants/issue";
export const AllIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
const { issue, handleDelete, handleUpdate, customActionButton, portalElement } = props;
@ -58,6 +60,7 @@ export const AllIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
onSubmit={async (data) => {
if (issueToEdit && handleUpdate) await handleUpdate({ ...issueToEdit, ...data });
}}
storeType={EIssuesStoreType.PROJECT}
/>
<CustomMenu
placement="bottom-start"

3
web/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx
View File

@ -11,6 +11,8 @@ import { copyUrlToClipboard } from "helpers/string.helper";
// types
import { TIssue } from "@plane/types";
import { IQuickActionProps } from "../list/list-view-types";
// constants
import { EIssuesStoreType } from "constants/issue";
export const CycleIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
const { issue, handleDelete, handleUpdate, handleRemoveFromView, customActionButton, portalElement } = props;
@ -58,6 +60,7 @@ export const CycleIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
onSubmit={async (data) => {
if (issueToEdit && handleUpdate) await handleUpdate({ ...issueToEdit, ...data });
}}
storeType={EIssuesStoreType.CYCLE}
/>
<CustomMenu
placement="bottom-start"

3
web/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx
View File

@ -11,6 +11,8 @@ import { copyUrlToClipboard } from "helpers/string.helper";
// types
import { TIssue } from "@plane/types";
import { IQuickActionProps } from "../list/list-view-types";
// constants
import { EIssuesStoreType } from "constants/issue";
export const ModuleIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
const { issue, handleDelete, handleUpdate, handleRemoveFromView, customActionButton, portalElement } = props;
@ -58,6 +60,7 @@ export const ModuleIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
onSubmit={async (data) => {
if (issueToEdit && handleUpdate) await handleUpdate({ ...issueToEdit, ...data });
}}
storeType={EIssuesStoreType.MODULE}
/>
<CustomMenu
placement="bottom-start"

2
web/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx
View File

@ -14,6 +14,7 @@ import { TIssue } from "@plane/types";
import { IQuickActionProps } from "../list/list-view-types";
// constant
import { EUserProjectRoles } from "constants/project";
import { EIssuesStoreType } from "constants/issue";
export const ProjectIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
const { issue, handleDelete, handleUpdate, customActionButton, portalElement } = props;
@ -67,6 +68,7 @@ export const ProjectIssueQuickActions: React.FC<IQuickActionProps> = (props) =>
onSubmit={async (data) => {
if (issueToEdit && handleUpdate) await handleUpdate({ ...issueToEdit, ...data });
}}
storeType={EIssuesStoreType.PROJECT}
/>
<CustomMenu
placement="bottom-start"

1
web/components/issues/issue-modal/form.tsx
View File

@ -65,7 +65,6 @@ const fileService = new FileService();
export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
const { data, onChange, onClose, onSubmit, projectId, isCreateMoreToggleEnabled, onCreateMoreToggleChange } = props;
console.log("onCreateMoreToggleChange", typeof onCreateMoreToggleChange);
// states
const [labelModal, setLabelModal] = useState(false);
const [parentIssueListModalOpen, setParentIssueListModalOpen] = useState(false);

213
web/components/issues/issue-modal/modal.tsx
View File

@ -1,9 +1,8 @@
import React, { useState } from "react";
import { useRouter } from "next/router";
import React, { useEffect, useState } from "react";
import { observer } from "mobx-react-lite";
import { Dialog, Transition } from "@headlessui/react";
// hooks
import { useIssues, useProject } from "hooks/store";
import { useApplication, useCycle, useIssues, useModule, useProject, useUser, useWorkspace } from "hooks/store";
import useToast from "hooks/use-toast";
import useLocalStorage from "hooks/use-local-storage";
// components
@ -12,7 +11,7 @@ import { IssueFormRoot } from "./form";
// types
import type { TIssue } from "@plane/types";
// constants
import { EIssuesStoreType } from "constants/issue";
import { EIssuesStoreType, TCreateModalStoreTypes } from "constants/issue";
export interface IssuesModalProps {
data?: Partial<TIssue>;
@ -20,31 +19,108 @@ export interface IssuesModalProps {
onClose: () => void;
onSubmit?: (res: TIssue) => Promise<void>;
withDraftIssueWrapper?: boolean;
storeType?: TCreateModalStoreTypes;
}
export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((props) => {
const { data, isOpen, onClose, onSubmit, withDraftIssueWrapper = true } = props;
const {
data,
isOpen,
onClose,
onSubmit,
withDraftIssueWrapper = true,
storeType = EIssuesStoreType.PROJECT,
} = props;
// states
const [changesMade, setChangesMade] = useState<Partial<TIssue> | null>(null);
const [createMore, setCreateMore] = useState(false);
// router
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
const [activeProjectId, setActiveProjectId] = useState<string | null>(null);
// store hooks
const {
eventTracker: { postHogEventTracker },
} = useApplication();
const { currentUser } = useUser();
const {
router: { workspaceSlug, projectId, cycleId, moduleId, viewId: projectViewId },
} = useApplication();
const { currentWorkspace } = useWorkspace();
const { workspaceProjectIds } = useProject();
const {
issues: { createIssue, updateIssue },
} = useIssues(EIssuesStoreType.PROJECT);
const {
issues: { addIssueToCycle },
} = useIssues(EIssuesStoreType.CYCLE);
const {
issues: { addIssueToModule },
} = useIssues(EIssuesStoreType.MODULE);
const { fetchCycleDetails } = useCycle();
const { fetchModuleDetails } = useModule();
const { issues: projectIssues } = useIssues(EIssuesStoreType.PROJECT);
const { issues: moduleIssues } = useIssues(EIssuesStoreType.MODULE);
const { issues: cycleIssues } = useIssues(EIssuesStoreType.CYCLE);
const { issues: viewIssues } = useIssues(EIssuesStoreType.PROJECT_VIEW);
const { issues: profileIssues } = useIssues(EIssuesStoreType.PROFILE);
// store mapping based on current store
const issueStores = {
[EIssuesStoreType.PROJECT]: {
store: projectIssues,
dataIdToUpdate: activeProjectId,
viewId: undefined,
},
[EIssuesStoreType.PROJECT_VIEW]: {
store: viewIssues,
dataIdToUpdate: activeProjectId,
viewId: projectViewId,
},
[EIssuesStoreType.PROFILE]: {
store: profileIssues,
dataIdToUpdate: currentUser?.id || undefined,
viewId: undefined,
},
[EIssuesStoreType.CYCLE]: {
store: cycleIssues,
dataIdToUpdate: activeProjectId,
viewId: cycleId,
},
[EIssuesStoreType.MODULE]: {
store: moduleIssues,
dataIdToUpdate: activeProjectId,
viewId: moduleId,
},
};
// toast alert
const { setToastAlert } = useToast();
// local storage
const { setValue: setLocalStorageDraftIssue } = useLocalStorage<any>("draftedIssue", {});
// current store details
const { store: currentIssueStore, viewId, dataIdToUpdate } = issueStores[storeType];
useEffect(() => {
// if modal is closed, reset active project to null
// and return to avoid activeProjectId being set to some other project
if (!isOpen) {
setActiveProjectId(null);
return;
}
// if data is present, set active project to the project of the
// issue. This has more priority than the project in the url.
if (data && data.project_id) {
setActiveProjectId(data.project_id);
return;
}
// if data is not present, set active project to the project
// in the url. This has the least priority.
if (workspaceProjectIds && workspaceProjectIds.length > 0 && !activeProjectId)
setActiveProjectId(projectId ?? workspaceProjectIds?.[0]);
}, [data, projectId, workspaceProjectIds, isOpen, activeProjectId]);
const addIssueToCycle = async (issue: TIssue, cycleId: string) => {
if (!workspaceSlug || !activeProjectId) return;
await cycleIssues.addIssueToCycle(workspaceSlug, issue.project_id, cycleId, [issue.id]);
fetchCycleDetails(workspaceSlug, activeProjectId, cycleId);
};
const addIssueToModule = async (issue: TIssue, moduleId: string) => {
if (!workspaceSlug || !activeProjectId) return;
await moduleIssues.addIssueToModule(workspaceSlug, activeProjectId, moduleId, [issue.id]);
fetchModuleDetails(workspaceSlug, activeProjectId, moduleId);
};
const handleCreateMoreToggleChange = (value: boolean) => {
setCreateMore(value);
@ -55,19 +131,41 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((prop
const draftIssue = JSON.stringify(changesMade);
setLocalStorageDraftIssue(draftIssue);
}
setActiveProjectId(null);
onClose();
};
const handleCreateIssue = async (payload: Partial<TIssue>): Promise<TIssue | undefined> => {
if (!workspaceSlug || !payload.project_id) return undefined;
if (!workspaceSlug || !dataIdToUpdate) return;
try {
const response = await createIssue(workspaceSlug.toString(), payload.project_id, payload);
const response = await currentIssueStore.createIssue(workspaceSlug, dataIdToUpdate, payload, viewId);
if (!response) throw new Error();
currentIssueStore.fetchIssues(workspaceSlug, dataIdToUpdate, "mutation", viewId);
if (payload.cycle_id && payload.cycle_id !== "" && storeType !== EIssuesStoreType.CYCLE)
await addIssueToCycle(response, payload.cycle_id);
if (payload.module_id && payload.module_id !== "" && storeType !== EIssuesStoreType.MODULE)
await addIssueToModule(response, payload.module_id);
setToastAlert({
type: "success",
title: "Success!",
message: "Issue created successfully.",
});
postHogEventTracker(
"ISSUE_CREATED",
{
...response,
state: "SUCCESS",
},
{
isGrouping: true,
groupType: "Workspace_metrics",
groupId: currentWorkspace?.id!,
}
);
!createMore && handleClose();
return response;
} catch (error) {
@ -76,19 +174,42 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((prop
title: "Error!",
message: "Issue could not be created. Please try again.",
});
postHogEventTracker(
"ISSUE_CREATED",
{
state: "FAILED",
},
{
isGrouping: true,
groupType: "Workspace_metrics",
groupId: currentWorkspace?.id!,
}
);
}
};
const handleUpdateIssue = async (payload: Partial<TIssue>): Promise<TIssue | undefined> => {
if (!workspaceSlug || !payload.project_id || !data?.id) return undefined;
if (!workspaceSlug || !dataIdToUpdate || !data?.id) return;
try {
const response = await updateIssue(workspaceSlug.toString(), payload.project_id, data.id, payload);
const response = await currentIssueStore.updateIssue(workspaceSlug, dataIdToUpdate, data.id, payload, viewId);
setToastAlert({
type: "success",
title: "Success!",
message: "Issue updated successfully.",
});
postHogEventTracker(
"ISSUE_UPDATED",
{
...response,
state: "SUCCESS",
},
{
isGrouping: true,
groupType: "Workspace_metrics",
groupId: currentWorkspace?.id!,
}
);
handleClose();
return response;
} catch (error) {
@ -97,39 +218,39 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((prop
title: "Error!",
message: "Issue could not be created. Please try again.",
});
postHogEventTracker(
"ISSUE_UPDATED",
{
state: "FAILED",
},
{
isGrouping: true,
groupType: "Workspace_metrics",
groupId: currentWorkspace?.id!,
}
);
}
};
const handleFormSubmit = async (formData: Partial<TIssue>) => {
if (!workspaceSlug || !formData.project_id) return;
if (!workspaceSlug || !dataIdToUpdate || !storeType) return;
const payload: Partial<TIssue> = {
...formData,
description_html: formData.description_html ?? "<p></p>",
};
let res: TIssue | undefined = undefined;
if (!data?.id) res = await handleCreateIssue(payload);
else res = await handleUpdateIssue(payload);
let response: TIssue | undefined = undefined;
if (!data?.id) response = await handleCreateIssue(payload);
else response = await handleUpdateIssue(payload);
// add issue to cycle if cycle is selected, and cycle is different from current cycle
if (formData.cycle_id && res && (!data?.id || formData.cycle_id !== data?.cycle_id))
await addIssueToCycle(workspaceSlug.toString(), formData.project_id, formData.cycle_id, [res.id]);
// add issue to module if module is selected, and module is different from current module
if (formData.module_id && res && (!data?.id || formData.module_id !== data?.module_id))
await addIssueToModule(workspaceSlug.toString(), formData.project_id, formData.module_id, [res.id]);
if (res != undefined && onSubmit) await onSubmit(res);
if (response != undefined && onSubmit) await onSubmit(response);
};
const handleFormChange = (formData: Partial<TIssue> | null) => setChangesMade(formData);
// don't open the modal if there are no projects
if (!workspaceProjectIds || workspaceProjectIds.length === 0) return null;
// if project id is present in the router query, use that as the selected project id, otherwise use the first project id
const selectedProjectId = projectId ? projectId.toString() : workspaceProjectIds[0];
if (!workspaceProjectIds || workspaceProjectIds.length === 0 || !activeProjectId) return null;
return (
<Transition.Root show={isOpen} as={React.Fragment}>
@ -161,22 +282,30 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((prop
{withDraftIssueWrapper ? (
<DraftIssueLayout
changesMade={changesMade}
data={data}
data={{
...data,
cycle_id: cycleId ?? null,
module_id: moduleId ?? null,
}}
onChange={handleFormChange}
onClose={handleClose}
onSubmit={handleFormSubmit}
projectId={selectedProjectId}
projectId={activeProjectId}
isCreateMoreToggleEnabled={createMore}
onCreateMoreToggleChange={handleCreateMoreToggleChange}
/>
) : (
<IssueFormRoot
data={data}
data={{
...data,
cycle_id: cycleId ?? null,
module_id: moduleId ?? null,
}}
onClose={() => handleClose(false)}
isCreateMoreToggleEnabled={createMore}
onCreateMoreToggleChange={handleCreateMoreToggleChange}
onSubmit={handleFormSubmit}
projectId={selectedProjectId}
projectId={activeProjectId}
/>
)}
</Dialog.Panel>

20
web/store/issue/cycle/issue.store.ts
View File

@ -180,9 +180,16 @@ export class CycleIssues extends IssueHelperStore implements ICycleIssues {
if (!cycleId) throw new Error("Cycle Id is required");
const response = await this.rootIssueStore.projectIssues.createIssue(workspaceSlug, projectId, data);
const issueToCycle = await this.addIssueToCycle(workspaceSlug, projectId, cycleId, [response.id]);
await this.addIssueToCycle(workspaceSlug, projectId, cycleId, [response.id]);
return issueToCycle;
runInAction(() => {
update(this.issues, cycleId, (cycleIssueIds) => {
if (!cycleIssueIds) return [response.id];
else return concat(cycleIssueIds, [response.id]);
});
});
return response;
} catch (error) {
throw error;
}
@ -261,15 +268,6 @@ export class CycleIssues extends IssueHelperStore implements ICycleIssues {
addIssueToCycle = async (workspaceSlug: string, projectId: string, cycleId: string, issueIds: string[]) => {
try {
runInAction(() => {
update(this.issues, cycleId, (cycleIssueIds) => {
if (!cycleIssueIds) return issueIds;
else return concat(cycleIssueIds, issueIds);
});
});
issueIds.map((issueId) => this.rootStore.issues.updateIssue(issueId, { cycle_id: cycleId }));
const issueToCycle = await this.issueService.addIssueToCycle(workspaceSlug, projectId, cycleId, {
issues: issueIds,
});

19
web/store/issue/module/issue.store.ts
View File

@ -173,7 +173,15 @@ export class ModuleIssues extends IssueHelperStore implements IModuleIssues {
if (!moduleId) throw new Error("Module Id is required");
const response = await this.rootIssueStore.projectIssues.createIssue(workspaceSlug, projectId, data);
const issueToModule = await this.addIssueToModule(workspaceSlug, projectId, moduleId, [response.id]);
await this.addIssueToModule(workspaceSlug, projectId, moduleId, [response.id]);
runInAction(() => {
update(this.issues, moduleId, (moduleIssueIds) => {
if (!moduleIssueIds) return [response.id];
else return concat(moduleIssueIds, [response.id]);
});
});
return response;
} catch (error) {
throw error;
@ -252,15 +260,6 @@ export class ModuleIssues extends IssueHelperStore implements IModuleIssues {
addIssueToModule = async (workspaceSlug: string, projectId: string, moduleId: string, issueIds: string[]) => {
try {
runInAction(() => {
update(this.issues, moduleId, (moduleIssueIds) => {
if (!moduleIssueIds) return issueIds;
else return concat(moduleIssueIds, issueIds);
});
});
issueIds.map((issueId) => this.rootStore.issues.updateIssue(issueId, { module_id: moduleId }));
const issueToModule = await this.moduleService.addIssuesToModule(workspaceSlug, projectId, moduleId, {
issues: issueIds,
});