From 52474715de2b5edaa4d74f8279aff9106568d06d Mon Sep 17 00:00:00 2001 From: guru_sainath Date: Tue, 31 Oct 2023 12:04:36 +0530 Subject: [PATCH 001/157] chore: handled next_url redirection issue (#2562) --- web/components/page-views/signin.tsx | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/web/components/page-views/signin.tsx b/web/components/page-views/signin.tsx index 23a1ea634..e0be15e31 100644 --- a/web/components/page-views/signin.tsx +++ b/web/components/page-views/signin.tsx @@ -32,6 +32,8 @@ export const SignInView = observer(() => { const { fetchCurrentUserSettings } = userStore; // router const router = useRouter(); + const { next: next_url } = router.query as { next: string }; + // states const [isLoading, setLoading] = useState(false); // toast @@ -46,15 +48,17 @@ export const SignInView = observer(() => { useEffect(() => { fetchCurrentUserSettings().then((settings) => { setLoading(true); - router.push( - `/${ - settings.workspace.last_workspace_slug - ? settings.workspace.last_workspace_slug - : settings.workspace.fallback_workspace_slug - }` - ); + if (next_url) router.push(next_url); + else + router.push( + `/${ + settings.workspace.last_workspace_slug + ? settings.workspace.last_workspace_slug + : settings.workspace.fallback_workspace_slug + }` + ); }); - }, [fetchCurrentUserSettings, router]); + }, [fetchCurrentUserSettings, router, next_url]); const handleLoginRedirection = () => { userStore.fetchCurrentUser().then((user) => { @@ -65,7 +69,8 @@ export const SignInView = observer(() => { .then((userSettings: IUserSettings) => { const workspaceSlug = userSettings?.workspace?.last_workspace_slug || userSettings?.workspace?.fallback_workspace_slug; - if (workspaceSlug) router.push(`/${workspaceSlug}`); + if (next_url) router.push(next_url); + else if (workspaceSlug) router.push(`/${workspaceSlug}`); else if (userSettings.workspace.invites > 0) router.push("/invitations"); else router.push("/create-workspace"); }) From 8b7b5c54b9e795c7987a6561e80bca41ccf32cdf Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Tue, 31 Oct 2023 12:06:11 +0530 Subject: [PATCH 002/157] fix: global views bugs (#2563) --- web/components/headers/global-issues.tsx | 1 + .../issues/issue-layouts/kanban/block.tsx | 6 ++-- .../issue-layouts/kanban/blocks-list.tsx | 8 ++--- .../issues/issue-layouts/kanban/default.tsx | 24 ++++++------- .../issue-layouts/kanban/properties.tsx | 34 ++++++++++++------- .../issue-layouts/kanban/roots/cycle-root.tsx | 6 ++-- .../kanban/roots/module-root.tsx | 6 ++-- .../kanban/roots/profile-issues-root.tsx | 6 ++-- .../kanban/roots/project-root.tsx | 6 ++-- .../issues/issue-layouts/kanban/swimlanes.tsx | 24 ++++++------- .../roots/global-view-layout-root.tsx | 14 +++++--- .../roots/project-layout-root.tsx | 2 ++ .../spreadsheet/columns/created-on-column.tsx | 2 +- .../spreadsheet/columns/updated-on-column.tsx | 2 +- web/components/workspace/views/form.tsx | 1 + .../global-view/global_view_issues.store.ts | 27 +++++++++++++++ 16 files changed, 106 insertions(+), 63 deletions(-) diff --git a/web/components/headers/global-issues.tsx b/web/components/headers/global-issues.tsx index b80dd45a1..5f0f1c054 100644 --- a/web/components/headers/global-issues.tsx +++ b/web/components/headers/global-issues.tsx @@ -134,6 +134,7 @@ export const GlobalIssuesHeader: React.FC = observer((props) => { handleFiltersUpdate={handleFiltersUpdate} layoutDisplayFiltersOptions={ISSUE_DISPLAY_FILTERS_BY_LAYOUT.my_issues.spreadsheet} labels={workspaceStore.workspaceLabels ?? undefined} + members={workspaceStore.workspaceMembers?.map((m) => m.member) ?? undefined} projects={workspaceSlug ? projectStore.projects[workspaceSlug.toString()] : undefined} /> diff --git a/web/components/issues/issue-layouts/kanban/block.tsx b/web/components/issues/issue-layouts/kanban/block.tsx index 3cbb4e7d5..51197c45d 100644 --- a/web/components/issues/issue-layouts/kanban/block.tsx +++ b/web/components/issues/issue-layouts/kanban/block.tsx @@ -2,7 +2,7 @@ import { Draggable } from "@hello-pangea/dnd"; // components import { KanBanProperties } from "./properties"; // types -import { IEstimatePoint, IIssue, IIssueLabels, IState, IUserLite } from "types"; +import { IEstimatePoint, IIssue, IIssueDisplayProperties, IIssueLabels, IState, IUserLite } from "types"; interface IssueBlockProps { sub_group_id: string; @@ -17,7 +17,7 @@ interface IssueBlockProps { action: "update" | "delete" ) => void; quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode; - displayProperties: any; + displayProperties: IIssueDisplayProperties; states: IState[] | null; labels: IIssueLabels[] | null; members: IUserLite[] | null; @@ -81,7 +81,7 @@ export const KanbanIssueBlock: React.FC = (props) => { columnId={columnId} issue={issue} handleIssues={updateIssue} - display_properties={displayProperties} + displayProperties={displayProperties} states={states} labels={labels} members={members} diff --git a/web/components/issues/issue-layouts/kanban/blocks-list.tsx b/web/components/issues/issue-layouts/kanban/blocks-list.tsx index 0e921638a..7c6e55f81 100644 --- a/web/components/issues/issue-layouts/kanban/blocks-list.tsx +++ b/web/components/issues/issue-layouts/kanban/blocks-list.tsx @@ -1,6 +1,6 @@ // components import { KanbanIssueBlock } from "components/issues"; -import { IEstimatePoint, IIssue, IIssueLabels, IState, IUserLite } from "types"; +import { IEstimatePoint, IIssue, IIssueDisplayProperties, IIssueLabels, IState, IUserLite } from "types"; interface IssueBlocksListProps { sub_group_id: string; @@ -14,7 +14,7 @@ interface IssueBlocksListProps { action: "update" | "delete" ) => void; quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode; - display_properties: any; + displayProperties: IIssueDisplayProperties; states: IState[] | null; labels: IIssueLabels[] | null; members: IUserLite[] | null; @@ -29,7 +29,7 @@ export const KanbanIssueBlocksList: React.FC = (props) => isDragDisabled, handleIssues, quickActions, - display_properties, + displayProperties, states, labels, members, @@ -47,7 +47,7 @@ export const KanbanIssueBlocksList: React.FC = (props) => issue={issue} handleIssues={handleIssues} quickActions={quickActions} - displayProperties={display_properties} + displayProperties={displayProperties} columnId={columnId} sub_group_id={sub_group_id} isDragDisabled={isDragDisabled} diff --git a/web/components/issues/issue-layouts/kanban/default.tsx b/web/components/issues/issue-layouts/kanban/default.tsx index 354cf011f..f441d3e22 100644 --- a/web/components/issues/issue-layouts/kanban/default.tsx +++ b/web/components/issues/issue-layouts/kanban/default.tsx @@ -7,7 +7,7 @@ import { useMobxStore } from "lib/mobx/store-provider"; import { KanBanGroupByHeaderRoot } from "./headers/group-by-root"; import { KanbanIssueBlocksList, BoardInlineCreateIssueForm } from "components/issues"; // types -import { IEstimatePoint, IIssue, IIssueLabels, IProject, IState, IUserLite } from "types"; +import { IEstimatePoint, IIssue, IIssueDisplayProperties, IIssueLabels, IProject, IState, IUserLite } from "types"; // constants import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES, getValueFromObject } from "constants/issue"; @@ -26,7 +26,7 @@ export interface IGroupByKanBan { action: "update" | "delete" ) => void; quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode; - display_properties: any; + displayProperties: IIssueDisplayProperties; kanBanToggle: any; handleKanBanToggle: any; enableQuickIssueCreate?: boolean; @@ -48,7 +48,7 @@ const GroupByKanBan: React.FC = observer((props) => { isDragDisabled, handleIssues, quickActions, - display_properties, + displayProperties, kanBanToggle, handleKanBanToggle, states, @@ -104,7 +104,7 @@ const GroupByKanBan: React.FC = observer((props) => { isDragDisabled={isDragDisabled} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} states={states} labels={labels} members={members} @@ -151,7 +151,7 @@ export interface IKanBan { action: "update" | "delete" ) => void; quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode; - display_properties: any; + displayProperties: IIssueDisplayProperties; kanBanToggle: any; handleKanBanToggle: any; states: IState[] | null; @@ -172,7 +172,7 @@ export const KanBan: React.FC = observer((props) => { sub_group_id = "null", handleIssues, quickActions, - display_properties, + displayProperties, kanBanToggle, handleKanBanToggle, states, @@ -200,7 +200,7 @@ export const KanBan: React.FC = observer((props) => { isDragDisabled={!issueKanBanViewStore?.canUserDragDrop} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} enableQuickIssueCreate={enableQuickIssueCreate} @@ -223,7 +223,7 @@ export const KanBan: React.FC = observer((props) => { isDragDisabled={!issueKanBanViewStore?.canUserDragDrop} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} enableQuickIssueCreate={enableQuickIssueCreate} @@ -246,7 +246,7 @@ export const KanBan: React.FC = observer((props) => { isDragDisabled={!issueKanBanViewStore?.canUserDragDrop} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} enableQuickIssueCreate={enableQuickIssueCreate} @@ -269,7 +269,7 @@ export const KanBan: React.FC = observer((props) => { isDragDisabled={!issueKanBanViewStore?.canUserDragDrop} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} enableQuickIssueCreate={enableQuickIssueCreate} @@ -292,7 +292,7 @@ export const KanBan: React.FC = observer((props) => { isDragDisabled={!issueKanBanViewStore?.canUserDragDrop} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} enableQuickIssueCreate={enableQuickIssueCreate} @@ -315,7 +315,7 @@ export const KanBan: React.FC = observer((props) => { isDragDisabled={!issueKanBanViewStore?.canUserDragDrop} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} enableQuickIssueCreate={enableQuickIssueCreate} diff --git a/web/components/issues/issue-layouts/kanban/properties.tsx b/web/components/issues/issue-layouts/kanban/properties.tsx index e321094d4..4ab4613aa 100644 --- a/web/components/issues/issue-layouts/kanban/properties.tsx +++ b/web/components/issues/issue-layouts/kanban/properties.tsx @@ -10,14 +10,22 @@ import { IssuePropertyAssignee } from "../properties/assignee"; import { IssuePropertyEstimates } from "../properties/estimates"; import { IssuePropertyDate } from "../properties/date"; import { Tooltip } from "@plane/ui"; -import { IEstimatePoint, IIssue, IIssueLabels, IState, IUserLite, TIssuePriorities } from "types"; +import { + IEstimatePoint, + IIssue, + IIssueDisplayProperties, + IIssueLabels, + IState, + IUserLite, + TIssuePriorities, +} from "types"; export interface IKanBanProperties { sub_group_id: string; columnId: string; issue: IIssue; handleIssues: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => void; - display_properties: any; + displayProperties: IIssueDisplayProperties; states: IState[] | null; labels: IIssueLabels[] | null; members: IUserLite[] | null; @@ -30,7 +38,7 @@ export const KanBanProperties: React.FC = observer((props) => columnId: group_id, issue, handleIssues, - display_properties, + displayProperties, states, labels, members, @@ -97,7 +105,7 @@ export const KanBanProperties: React.FC = observer((props) =>
{/* basic properties */} {/* state */} - {display_properties && display_properties?.state && ( + {displayProperties && displayProperties?.state && ( = observer((props) => )} {/* priority */} - {display_properties && display_properties?.priority && ( + {displayProperties && displayProperties?.priority && ( = observer((props) => )} {/* label */} - {display_properties && display_properties?.labels && ( + {displayProperties && displayProperties?.labels && ( = observer((props) => )} {/* assignee */} - {display_properties && display_properties?.assignee && ( + {displayProperties && displayProperties?.assignee && ( = observer((props) => )} {/* start date */} - {display_properties && display_properties?.start_date && ( + {displayProperties && displayProperties?.start_date && ( handleStartDate(date)} @@ -150,7 +158,7 @@ export const KanBanProperties: React.FC = observer((props) => )} {/* target/due date */} - {display_properties && display_properties?.due_date && ( + {displayProperties && displayProperties?.due_date && ( handleTargetDate(date)} @@ -160,7 +168,7 @@ export const KanBanProperties: React.FC = observer((props) => )} {/* estimates */} - {display_properties && display_properties?.estimate && ( + {displayProperties && displayProperties?.estimate && ( = observer((props) => {/* extra render properties */} {/* sub-issues */} - {display_properties && display_properties?.sub_issue_count && ( + {displayProperties && displayProperties?.sub_issue_count && (
@@ -182,7 +190,7 @@ export const KanBanProperties: React.FC = observer((props) => )} {/* attachments */} - {display_properties && display_properties?.attachment_count && ( + {displayProperties && displayProperties?.attachment_count && (
@@ -192,7 +200,7 @@ export const KanBanProperties: React.FC = observer((props) => )} {/* link */} - {display_properties && display_properties?.link && ( + {displayProperties && displayProperties?.link && (
diff --git a/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx b/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx index 188e27a68..ed54b0213 100644 --- a/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx @@ -35,7 +35,7 @@ export const CycleKanBanLayout: React.FC = observer(() => { const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null; - const display_properties = issueFilterStore?.userDisplayProperties || null; + const displayProperties = issueFilterStore?.userDisplayProperties || null; const currentKanBanView: "swimlanes" | "default" = issueFilterStore?.userDisplayFilters?.sub_group_by ? "swimlanes" @@ -113,7 +113,7 @@ export const CycleKanBanLayout: React.FC = observer(() => { handleRemoveFromCycle={async () => handleIssues(sub_group_by, group_by, issue, "remove")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={cycleIssueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -138,7 +138,7 @@ export const CycleKanBanLayout: React.FC = observer(() => { handleRemoveFromCycle={async () => handleIssues(sub_group_by, group_by, issue, "remove")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={cycleIssueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} diff --git a/web/components/issues/issue-layouts/kanban/roots/module-root.tsx b/web/components/issues/issue-layouts/kanban/roots/module-root.tsx index 754693d11..cebfc8f81 100644 --- a/web/components/issues/issue-layouts/kanban/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/module-root.tsx @@ -35,7 +35,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => { const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null; - const display_properties = issueFilterStore?.userDisplayProperties || null; + const displayProperties = issueFilterStore?.userDisplayProperties || null; const currentKanBanView: "swimlanes" | "default" = issueFilterStore?.userDisplayFilters?.sub_group_by ? "swimlanes" @@ -113,7 +113,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => { handleRemoveFromModule={async () => handleIssues(sub_group_by, group_by, issue, "remove")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={moduleIssueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -138,7 +138,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => { handleRemoveFromModule={async () => handleIssues(sub_group_by, group_by, issue, "remove")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={moduleIssueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} diff --git a/web/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx b/web/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx index d2346120a..eaa37bb91 100644 --- a/web/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx @@ -34,7 +34,7 @@ export const ProfileIssuesKanBanLayout: FC = observer(() => { const group_by: string | null = profileIssueFiltersStore?.userDisplayFilters?.group_by || null; - const display_properties = profileIssueFiltersStore?.userDisplayProperties || null; + const displayProperties = profileIssueFiltersStore?.userDisplayProperties || null; const currentKanBanView: "swimlanes" | "default" = profileIssueFiltersStore?.userDisplayFilters?.sub_group_by ? "swimlanes" @@ -96,7 +96,7 @@ export const ProfileIssuesKanBanLayout: FC = observer(() => { handleUpdate={async (data) => handleIssues(sub_group_by, group_by, data, "update")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={issueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -120,7 +120,7 @@ export const ProfileIssuesKanBanLayout: FC = observer(() => { handleUpdate={async (data) => handleIssues(sub_group_by, group_by, data, "update")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={issueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} diff --git a/web/components/issues/issue-layouts/kanban/roots/project-root.tsx b/web/components/issues/issue-layouts/kanban/roots/project-root.tsx index ab087e5c8..7a003842c 100644 --- a/web/components/issues/issue-layouts/kanban/roots/project-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/project-root.tsx @@ -35,7 +35,7 @@ export const KanBanLayout: React.FC = observer(() => { const group_by: string | null = issueFilterStore?.userDisplayFilters?.group_by || null; - const display_properties = issueFilterStore?.userDisplayProperties || null; + const displayProperties = issueFilterStore?.userDisplayProperties || null; const currentKanBanView: "swimlanes" | "default" = issueFilterStore?.userDisplayFilters?.sub_group_by ? "swimlanes" @@ -103,7 +103,7 @@ export const KanBanLayout: React.FC = observer(() => { handleUpdate={async (data) => handleIssues(sub_group_by, group_by, data, "update")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={issueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -128,7 +128,7 @@ export const KanBanLayout: React.FC = observer(() => { handleUpdate={async (data) => handleIssues(sub_group_by, group_by, data, "update")} /> )} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={issueKanBanViewStore?.kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} diff --git a/web/components/issues/issue-layouts/kanban/swimlanes.tsx b/web/components/issues/issue-layouts/kanban/swimlanes.tsx index 7a3126cb2..104f89dc3 100644 --- a/web/components/issues/issue-layouts/kanban/swimlanes.tsx +++ b/web/components/issues/issue-layouts/kanban/swimlanes.tsx @@ -7,7 +7,7 @@ import { KanBanGroupByHeaderRoot } from "./headers/group-by-root"; import { KanBanSubGroupByHeaderRoot } from "./headers/sub-group-by-root"; import { KanBan } from "./default"; // types -import { IEstimatePoint, IIssue, IIssueLabels, IProject, IState, IUserLite } from "types"; +import { IEstimatePoint, IIssue, IIssueDisplayProperties, IIssueLabels, IProject, IState, IUserLite } from "types"; // constants import { ISSUE_STATE_GROUPS, ISSUE_PRIORITIES, getValueFromObject } from "constants/issue"; @@ -73,7 +73,7 @@ interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader { action: "update" | "delete" ) => void; quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode; - display_properties: any; + displayProperties: IIssueDisplayProperties; kanBanToggle: any; handleKanBanToggle: any; states: IState[] | null; @@ -93,7 +93,7 @@ const SubGroupSwimlane: React.FC = observer((props) => { listKey, handleIssues, quickActions, - display_properties, + displayProperties, kanBanToggle, handleKanBanToggle, states, @@ -143,7 +143,7 @@ const SubGroupSwimlane: React.FC = observer((props) => { sub_group_id={getValueFromObject(_list, listKey) as string} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -174,7 +174,7 @@ export interface IKanBanSwimLanes { action: "update" | "delete" ) => void; quickActions: (sub_group_by: string | null, group_by: string | null, issue: IIssue) => React.ReactNode; - display_properties: any; + displayProperties: IIssueDisplayProperties; kanBanToggle: any; handleKanBanToggle: any; states: IState[] | null; @@ -193,7 +193,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { group_by, handleIssues, quickActions, - display_properties, + displayProperties, kanBanToggle, handleKanBanToggle, states, @@ -322,7 +322,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { listKey={`id`} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -344,7 +344,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { listKey={`key`} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -366,7 +366,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { listKey={`key`} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -388,7 +388,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { listKey={`id`} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -410,7 +410,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { listKey={`member.id`} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} @@ -432,7 +432,7 @@ export const KanBanSwimLanes: React.FC = observer((props) => { listKey={`member.id`} handleIssues={handleIssues} quickActions={quickActions} - display_properties={display_properties} + displayProperties={displayProperties} kanBanToggle={kanBanToggle} handleKanBanToggle={handleKanBanToggle} states={states} diff --git a/web/components/issues/issue-layouts/roots/global-view-layout-root.tsx b/web/components/issues/issue-layouts/roots/global-view-layout-root.tsx index e7adcf0e9..77b3b6ee5 100644 --- a/web/components/issues/issue-layouts/roots/global-view-layout-root.tsx +++ b/web/components/issues/issue-layouts/roots/global-view-layout-root.tsx @@ -25,6 +25,7 @@ export const GlobalViewLayoutRoot: React.FC = observer((props) => { globalViewFilters: globalViewFiltersStore, workspaceFilter: workspaceFilterStore, workspace: workspaceStore, + issueDetail: issueDetailStore, } = useMobxStore(); const viewDetails = globalViewId ? globalViewsStore.globalViewDetails[globalViewId.toString()] : undefined; @@ -62,14 +63,17 @@ export const GlobalViewLayoutRoot: React.FC = observer((props) => { const handleUpdateIssue = useCallback( (issue: IIssue, data: Partial) => { - if (!workspaceSlug) return; + if (!workspaceSlug || !globalViewId) return; - console.log("issue", issue); - console.log("data", data); + const payload = { + ...issue, + ...data, + }; - // TODO: add update issue logic here + globalViewIssuesStore.updateIssueStructure(globalViewId.toString(), payload); + issueDetailStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, data); }, - [workspaceSlug] + [globalViewId, globalViewIssuesStore, workspaceSlug, issueDetailStore] ); const issues = type diff --git a/web/components/issues/issue-layouts/roots/project-layout-root.tsx b/web/components/issues/issue-layouts/roots/project-layout-root.tsx index 0cd5911a5..1826eb344 100644 --- a/web/components/issues/issue-layouts/roots/project-layout-root.tsx +++ b/web/components/issues/issue-layouts/roots/project-layout-root.tsx @@ -33,6 +33,8 @@ export const ProjectLayoutRoot: React.FC = observer(() => { const issueCount = issueStore.getIssuesCount; + console.log("issueCount", issueCount); + return (
diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx index 54a8ffee5..b1a7c3fef 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx @@ -19,7 +19,7 @@ export const SpreadsheetCreatedOnColumn: React.FC = ({ issue, expandedIss return ( <> - {renderLongDetailDateFormat(issue.created_at)} +
{renderLongDetailDateFormat(issue.created_at)}
{isExpanded && !isLoading && diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx index b2892f2a9..225657d34 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx @@ -21,7 +21,7 @@ export const SpreadsheetUpdatedOnColumn: React.FC = (props) => { return ( <> - {renderLongDetailDateFormat(issue.updated_at)} +
{renderLongDetailDateFormat(issue.updated_at)}
{isExpanded && !isLoading && diff --git a/web/components/workspace/views/form.tsx b/web/components/workspace/views/form.tsx index 5524555e0..8b5112eb9 100644 --- a/web/components/workspace/views/form.tsx +++ b/web/components/workspace/views/form.tsx @@ -143,6 +143,7 @@ export const WorkspaceViewForm: React.FC = observer((props) => { }} layoutDisplayFiltersOptions={ISSUE_DISPLAY_FILTERS_BY_LAYOUT.my_issues.spreadsheet} labels={workspaceStore.workspaceLabels ?? undefined} + members={workspaceStore.workspaceMembers?.map((m) => m.member) ?? undefined} projects={workspaceSlug ? projectStore.projects[workspaceSlug.toString()] : undefined} /> diff --git a/web/store/global-view/global_view_issues.store.ts b/web/store/global-view/global_view_issues.store.ts index dc8e9717b..006c9b380 100644 --- a/web/store/global-view/global_view_issues.store.ts +++ b/web/store/global-view/global_view_issues.store.ts @@ -7,6 +7,7 @@ import { handleIssueQueryParamsByLayout } from "helpers/issue.helper"; // types import { RootStore } from "../root"; import { IIssue, IIssueFilterOptions, TStaticViewTypes } from "types"; +import { sortArrayByDate, sortArrayByPriority } from "constants/kanban-helpers"; export interface IGlobalViewIssuesStore { // states @@ -21,6 +22,7 @@ export interface IGlobalViewIssuesStore { // actions fetchViewIssues: (workspaceSlug: string, viewId: string, filters: IIssueFilterOptions) => Promise; fetchStaticIssues: (workspaceSlug: string, type: TStaticViewTypes) => Promise; + updateIssueStructure: (viewId: string, issue: IIssue) => Promise; } export class GlobalViewIssuesStore implements IGlobalViewIssuesStore { @@ -52,6 +54,7 @@ export class GlobalViewIssuesStore implements IGlobalViewIssuesStore { // actions fetchViewIssues: action, fetchStaticIssues: action, + updateIssueStructure: action, }); this.rootStore = _rootStore; @@ -174,4 +177,28 @@ export class GlobalViewIssuesStore implements IGlobalViewIssuesStore { throw error; } }; + + updateIssueStructure = async (viewId: string, issue: IIssue) => { + let issues = this.viewIssues[viewId]; + + if (!issues) return null; + + const _currentIssueId = issues?.find((_i) => _i?.id === issue.id); + issues = _currentIssueId + ? issues?.map((i: IIssue) => (i?.id === issue?.id ? { ...i, ...issue } : i)) + : [...(issues ?? []), issue]; + + const orderBy = this.rootStore?.workspaceFilter?.workspaceDisplayFilters?.order_by || ""; + if (orderBy === "-created_at") issues = sortArrayByDate(issues as any, "created_at"); + + if (orderBy === "-updated_at") issues = sortArrayByDate(issues as any, "updated_at"); + + if (orderBy === "start_date") issues = sortArrayByDate(issues as any, "updated_at"); + + if (orderBy === "priority") issues = sortArrayByPriority(issues as any, "priority"); + + runInAction(() => { + this.viewIssues = { ...this.viewIssues, [viewId]: issues }; + }); + }; } From 1c2ea6da5ee0085caa359b549e1e6131ffd0919e Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Tue, 31 Oct 2023 12:06:55 +0530 Subject: [PATCH 003/157] fix: edit project button redirection (#2564) * fix: redirect to project settings * fix: 404 page button alignment --- web/components/project/card.tsx | 7 ++++++- web/components/project/index.ts | 1 - .../project/{ => settings}/delete-project-section.tsx | 1 + web/components/project/settings/index.ts | 1 + web/pages/404.tsx | 2 +- 5 files changed, 9 insertions(+), 3 deletions(-) rename web/components/project/{ => settings}/delete-project-section.tsx (99%) diff --git a/web/components/project/card.tsx b/web/components/project/card.tsx index caab8571a..ca746d02e 100644 --- a/web/components/project/card.tsx +++ b/web/components/project/card.tsx @@ -186,7 +186,12 @@ export const ProjectCard: React.FC = observer((props) => { {(isOwner || isMember) && ( diff --git a/web/components/project/index.ts b/web/components/project/index.ts index 040a0f3df..8fd14b987 100644 --- a/web/components/project/index.ts +++ b/web/components/project/index.ts @@ -4,7 +4,6 @@ export * from "./card-list"; export * from "./card"; export * from "./create-project-modal"; export * from "./delete-project-modal"; -export * from "./delete-project-section"; export * from "./form-loader"; export * from "./form"; export * from "./join-project-modal"; diff --git a/web/components/project/delete-project-section.tsx b/web/components/project/settings/delete-project-section.tsx similarity index 99% rename from web/components/project/delete-project-section.tsx rename to web/components/project/settings/delete-project-section.tsx index ccd0bf571..44d4d7f8f 100644 --- a/web/components/project/delete-project-section.tsx +++ b/web/components/project/settings/delete-project-section.tsx @@ -15,6 +15,7 @@ export interface IDeleteProjectSection { export const DeleteProjectSection: React.FC = (props) => { const { projectDetails, handleDelete } = props; + return ( {({ open }) => ( diff --git a/web/components/project/settings/index.ts b/web/components/project/settings/index.ts index 65333a0e2..0bf79ec17 100644 --- a/web/components/project/settings/index.ts +++ b/web/components/project/settings/index.ts @@ -1 +1,2 @@ +export * from "./delete-project-section"; export * from "./features-list"; diff --git a/web/pages/404.tsx b/web/pages/404.tsx index e5f5ee7fd..a1f462f2c 100644 --- a/web/pages/404.tsx +++ b/web/pages/404.tsx @@ -27,7 +27,7 @@ const PageNotFound: NextPage = () => (

- + From 08ca016f657a0b15e0d8259190260e2badda0a78 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Tue, 31 Oct 2023 12:12:24 +0530 Subject: [PATCH 004/157] fix: custom theme form validations (#2565) --- .../ui/src/form-fields/input-color-picker.tsx | 58 +++-- .../core/theme/custom-theme-selector.tsx | 222 +++++++++++------- 2 files changed, 175 insertions(+), 105 deletions(-) diff --git a/packages/ui/src/form-fields/input-color-picker.tsx b/packages/ui/src/form-fields/input-color-picker.tsx index 738d0e0c8..0a91a8838 100644 --- a/packages/ui/src/form-fields/input-color-picker.tsx +++ b/packages/ui/src/form-fields/input-color-picker.tsx @@ -11,12 +11,14 @@ export interface InputColorPickerProps { value: string | undefined; onChange: (value: string) => void; name: string; - className: string; + className?: string; + style?: React.CSSProperties; placeholder: string; } export const InputColorPicker: React.FC = (props) => { - const { value, hasError, onChange, name, className, placeholder } = props; + const { value, hasError, onChange, name, className, style, placeholder } = + props; const [referenceElement, setReferenceElement] = React.useState(null); @@ -32,12 +34,12 @@ export const InputColorPicker: React.FC = (props) => { onChange(hex); }; - const handleInputChange = (value: any) => { - onChange(value); + const handleInputChange = (e: React.ChangeEvent) => { + onChange(e.target.value); }; return ( -
+
= (props) => { onChange={handleInputChange} hasError={hasError} placeholder={placeholder} - className={`border-none ${className}`} + className={`border-[0.5px] border-custom-border-200 ${className}`} + style={style} /> - + {({ open }) => { if (open) { } @@ -60,26 +66,26 @@ export const InputColorPicker: React.FC = (props) => { ref={setReferenceElement} variant="neutral-primary" size="sm" - className="border-none !p-1.5" + className="border-none !bg-transparent" > - {value && value !== "" ? ( - - ) : ( - - - - )} + + + + + + + = observer(() => { +export const CustomThemeSelector: React.FC = observer(() => { const { user: userStore } = useMobxStore(); const userTheme = userStore?.currentUser?.theme; // hooks const { setTheme } = useTheme(); const { + control, formState: { errors, isSubmitting }, handleSubmit, - control, + watch, } = useForm({ defaultValues: { background: userTheme?.background !== "" ? userTheme?.background : "#0d101b", @@ -51,100 +64,151 @@ export const CustomThemeSelector: FC = observer(() => { return userStore.updateCurrentUser({ theme: payload }); }; + const handleValueChange = (val: string | undefined, onChange: any) => { + let hex = val; + + // prepend a hashtag if it doesn't exist + if (val && val[0] !== "#") hex = `#${val}`; + + onChange(hex); + }; + return (

Customize your theme

-
+

Background color

- ( - - )} - /> +
+ ( + handleValueChange(val, onChange)} + placeholder="#0d101b" + className="w-full" + style={{ + backgroundColor: value, + color: watch("text"), + }} + hasError={Boolean(errors?.background)} + /> + )} + /> + {errors.background &&

{errors.background.message}

} +

Text color

- ( - - )} - /> +
+ ( + handleValueChange(val, onChange)} + placeholder="#c5c5c5" + className="w-full" + style={{ + backgroundColor: watch("background"), + color: value, + }} + hasError={Boolean(errors?.text)} + /> + )} + /> + {errors.text &&

{errors.text.message}

} +

Primary(Theme) color

- ( - - )} - /> +
+ ( + handleValueChange(val, onChange)} + placeholder="#3f76ff" + className="w-full" + style={{ + backgroundColor: value, + color: watch("text"), + }} + hasError={Boolean(errors?.primary)} + /> + )} + /> + {errors.primary &&

{errors.primary.message}

} +

Sidebar background color

- ( - +
+ ( + handleValueChange(val, onChange)} + placeholder="#0d101b" + className="w-full" + style={{ + backgroundColor: value, + color: watch("sidebarText"), + }} + hasError={Boolean(errors?.sidebarBackground)} + /> + )} + /> + {errors.sidebarBackground && ( +

{errors.sidebarBackground.message}

)} - /> +

Sidebar text color

- ( - - )} - /> +
+ ( + handleValueChange(val, onChange)} + placeholder="#c5c5c5" + className="w-full" + style={{ + backgroundColor: watch("sidebarBackground"), + color: value, + }} + hasError={Boolean(errors?.sidebarText)} + /> + )} + /> + {errors.sidebarText &&

{errors.sidebarText.message}

} +
From 59c52023fbeb90f9c7615d645707f4decefdbf27 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Tue, 31 Oct 2023 12:14:06 +0530 Subject: [PATCH 005/157] style: list layout (#2566) --- packages/ui/src/dropdowns/helper.tsx | 1 + web/components/headers/cycle-issues.tsx | 4 +-- web/components/headers/global-issues.tsx | 4 +-- web/components/headers/module-issues.tsx | 4 +-- web/components/headers/project-issues.tsx | 4 +-- .../headers/project-view-issues.tsx | 4 +-- .../filters/header/helpers/dropdown.tsx | 7 +++-- .../issues/issue-layouts/list/block.tsx | 2 +- .../issues/issue-layouts/list/blocks-list.tsx | 12 ++++---- .../issues/issue-layouts/list/default.tsx | 30 +++++++++---------- .../list/inline-create-issue-form.tsx | 6 ++-- .../quick-action-dropdowns/cycle-issue.tsx | 2 +- .../quick-action-dropdowns/module-issue.tsx | 2 +- .../quick-action-dropdowns/project-issue.tsx | 2 +- .../profile/profile-issues-filter.tsx | 4 +-- 15 files changed, 45 insertions(+), 43 deletions(-) diff --git a/packages/ui/src/dropdowns/helper.tsx b/packages/ui/src/dropdowns/helper.tsx index 4c9a92d4d..eac53b6e6 100644 --- a/packages/ui/src/dropdowns/helper.tsx +++ b/packages/ui/src/dropdowns/helper.tsx @@ -1,3 +1,4 @@ +// FIXME: fix this!!! import { Placement } from "@blueprintjs/popover2"; export interface IDropdownProps { diff --git a/web/components/headers/cycle-issues.tsx b/web/components/headers/cycle-issues.tsx index ac6ed2e6b..cfadc80aa 100644 --- a/web/components/headers/cycle-issues.tsx +++ b/web/components/headers/cycle-issues.tsx @@ -147,7 +147,7 @@ export const CycleIssuesHeader: React.FC = observer(() => { onChange={(layout) => handleLayoutChange(layout)} selectedLayout={activeLayout} /> - + { states={projectStore.states?.[projectId?.toString() ?? ""] ?? undefined} /> - + = observer((props) => { {activeLayout === "spreadsheet" && ( <> {!STATIC_VIEW_TYPES.some((word) => router.pathname.includes(word)) && ( - + = observer((props) => { )} - + { onChange={(layout) => handleLayoutChange(layout)} selectedLayout={activeLayout} /> - + { states={projectStore.states?.[projectId?.toString() ?? ""] ?? undefined} /> - + { onChange={(layout) => handleLayoutChange(layout)} selectedLayout={activeLayout} /> - + { states={projectStore.states?.[projectId?.toString() ?? ""] ?? undefined} /> - + { onChange={(layout) => handleLayoutChange(layout)} selectedLayout={activeLayout} /> - + { states={projectStore.states?.[projectId?.toString() ?? ""] ?? undefined} /> - + = (props) => { - const { children, title = "Dropdown" } = props; + const { children, title = "Dropdown", placement } = props; const [referenceElement, setReferenceElement] = useState(null); const [popperElement, setPopperElement] = useState(null); const { styles, attributes } = usePopper(referenceElement, popperElement, { - placement: "auto", + placement: placement ?? "auto", }); return ( diff --git a/web/components/issues/issue-layouts/list/block.tsx b/web/components/issues/issue-layouts/list/block.tsx index 5a84c5f9e..c697da78c 100644 --- a/web/components/issues/issue-layouts/list/block.tsx +++ b/web/components/issues/issue-layouts/list/block.tsx @@ -27,7 +27,7 @@ export const IssueBlock: React.FC = (props) => { return ( <> -
+
{display_properties && display_properties?.key && (
{issue?.project_detail?.identifier}-{issue.sequence_id} diff --git a/web/components/issues/issue-layouts/list/blocks-list.tsx b/web/components/issues/issue-layouts/list/blocks-list.tsx index 3267e221c..2350fe12c 100644 --- a/web/components/issues/issue-layouts/list/blocks-list.tsx +++ b/web/components/issues/issue-layouts/list/blocks-list.tsx @@ -21,9 +21,8 @@ export const IssueBlocksList: FC = (props) => { props; return ( - <> - {issues && - issues?.length > 0 && +
+ {issues && issues.length > 0 ? ( issues.map((issue) => ( = (props) => { members={members} estimates={estimates} /> - ))} - + )) + ) : ( +
No issues
+ )} +
); }; diff --git a/web/components/issues/issue-layouts/list/default.tsx b/web/components/issues/issue-layouts/list/default.tsx index 114b308eb..e6fce190a 100644 --- a/web/components/issues/issue-layouts/list/default.tsx +++ b/web/components/issues/issue-layouts/list/default.tsx @@ -53,7 +53,7 @@ const GroupByList: React.FC = observer((props) => { list.length > 0 && list.map((_list: any) => (
-
+
= observer((props) => { } />
-
- {issues && ( - - )} -
+ {issues && ( + + )} {enableQuickIssueCreate && ( = observer((props) => { }; return ( -
+
= observer((props) => { {!isOpen && ( )} diff --git a/web/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx b/web/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx index 8dc826300..9736c575e 100644 --- a/web/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx +++ b/web/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx @@ -62,7 +62,7 @@ export const CycleIssueQuickActions: React.FC = (props) => { if (issueToEdit) handleUpdate({ ...issueToEdit, ...data }); }} /> - + { e.preventDefault(); diff --git a/web/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx b/web/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx index 066a16d35..93594de9e 100644 --- a/web/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx +++ b/web/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx @@ -62,7 +62,7 @@ export const ModuleIssueQuickActions: React.FC = (props) => { if (issueToEdit) handleUpdate({ ...issueToEdit, ...data }); }} /> - + { e.preventDefault(); diff --git a/web/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx b/web/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx index 0cad8c46f..7999be31d 100644 --- a/web/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx +++ b/web/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx @@ -61,7 +61,7 @@ export const ProjectIssueQuickActions: React.FC = (props) => { if (issueToEdit) handleUpdate({ ...issueToEdit, ...data }); }} /> - + { e.preventDefault(); diff --git a/web/components/profile/profile-issues-filter.tsx b/web/components/profile/profile-issues-filter.tsx index 5dd6b1b3a..7acc73c99 100644 --- a/web/components/profile/profile-issues-filter.tsx +++ b/web/components/profile/profile-issues-filter.tsx @@ -41,7 +41,7 @@ export const ProfileIssuesFilter = observer(() => { selectedLayout={activeLayout} /> - + { /> - + Date: Tue, 31 Oct 2023 12:16:40 +0530 Subject: [PATCH 006/157] chore: update members endpoint (#2569) --- .../integration/github/single-user-select.tsx | 2 +- .../integration/jira/import-users.tsx | 6 +- .../issues/attachment/attachments.tsx | 2 +- web/components/issues/select/assignee.tsx | 2 +- .../issues/sidebar-select/assignee.tsx | 2 +- web/components/modules/select/lead.tsx | 2 +- web/components/modules/select/members.tsx | 2 +- .../modules/sidebar-select/select-lead.tsx | 2 +- .../modules/sidebar-select/select-members.tsx | 2 +- web/components/pages/pages-view.tsx | 2 +- web/components/project/member-select.tsx | 2 +- .../project/send-project-invitation-modal.tsx | 6 +- web/components/ui/avatar.tsx | 2 +- web/components/views/select-filters.tsx | 2 +- web/components/web-view/select-assignee.tsx | 2 +- web/constants/fetch-keys.ts | 27 +-------- web/hooks/use-project-members.tsx | 4 +- web/hooks/use-workspace-members.tsx | 2 +- web/layouts/auth-layout/project-wrapper.tsx | 8 ++- web/layouts/auth-layout/workspace-wrapper.tsx | 6 +- .../projects/[projectId]/settings/members.tsx | 28 +++++----- web/pages/workspace-invitations/index.tsx | 5 +- web/services/project/project.service.ts | 56 ++++++++----------- .../project/project_invitation.service.ts | 10 +--- web/services/workspace.service.ts | 16 +++--- web/store/project/project.store.ts | 14 ++--- web/store/workspace/workspace.store.ts | 4 +- web/types/projects.d.ts | 2 +- 28 files changed, 94 insertions(+), 126 deletions(-) diff --git a/web/components/integration/github/single-user-select.tsx b/web/components/integration/github/single-user-select.tsx index 2bc16d87d..40e743aa8 100644 --- a/web/components/integration/github/single-user-select.tsx +++ b/web/components/integration/github/single-user-select.tsx @@ -44,7 +44,7 @@ export const SingleUserSelect: React.FC = ({ collaborator, index, users, const { data: members } = useSWR( workspaceSlug ? WORKSPACE_MEMBERS(workspaceSlug.toString()) : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug.toString()) : null + workspaceSlug ? () => workspaceService.fetchWorkspaceMembers(workspaceSlug.toString()) : null ); const options = members?.map((member) => ({ diff --git a/web/components/integration/jira/import-users.tsx b/web/components/integration/jira/import-users.tsx index c49a3483a..48f9231c2 100644 --- a/web/components/integration/jira/import-users.tsx +++ b/web/components/integration/jira/import-users.tsx @@ -3,7 +3,7 @@ import { useRouter } from "next/router"; import useSWR from "swr"; import { useFormContext, useFieldArray, Controller } from "react-hook-form"; // fetch keys -import { WORKSPACE_MEMBERS_WITH_EMAIL } from "constants/fetch-keys"; +import { WORKSPACE_MEMBERS } from "constants/fetch-keys"; // services import { WorkspaceService } from "services/workspace.service"; // components @@ -30,8 +30,8 @@ export const JiraImportUsers: FC = () => { }); const { data: members } = useSWR( - workspaceSlug ? WORKSPACE_MEMBERS_WITH_EMAIL(workspaceSlug?.toString() ?? "") : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug?.toString() ?? "") : null + workspaceSlug ? WORKSPACE_MEMBERS(workspaceSlug?.toString() ?? "") : null, + workspaceSlug ? () => workspaceService.fetchWorkspaceMembers(workspaceSlug?.toString() ?? "") : null ); const options = members?.map((member) => ({ diff --git a/web/components/issues/attachment/attachments.tsx b/web/components/issues/attachment/attachments.tsx index 176ff5f7c..7d8872f9c 100644 --- a/web/components/issues/attachment/attachments.tsx +++ b/web/components/issues/attachment/attachments.tsx @@ -44,7 +44,7 @@ export const IssueAttachments = () => { const { data: people } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/issues/select/assignee.tsx b/web/components/issues/select/assignee.tsx index bb2ffcbd4..7e4c5bedb 100644 --- a/web/components/issues/select/assignee.tsx +++ b/web/components/issues/select/assignee.tsx @@ -26,7 +26,7 @@ export const IssueAssigneeSelect: React.FC = ({ projectId, value = [], on const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/issues/sidebar-select/assignee.tsx b/web/components/issues/sidebar-select/assignee.tsx index a56c6176b..09b1af7dd 100644 --- a/web/components/issues/sidebar-select/assignee.tsx +++ b/web/components/issues/sidebar-select/assignee.tsx @@ -28,7 +28,7 @@ export const SidebarAssigneeSelect: React.FC = ({ value, onChange, disabl const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/modules/select/lead.tsx b/web/components/modules/select/lead.tsx index 982acdeb6..86ced41a9 100644 --- a/web/components/modules/select/lead.tsx +++ b/web/components/modules/select/lead.tsx @@ -25,7 +25,7 @@ export const ModuleLeadSelect: React.FC = ({ value, onChange }) => { const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/modules/select/members.tsx b/web/components/modules/select/members.tsx index 49f8ab7db..36aaa869b 100644 --- a/web/components/modules/select/members.tsx +++ b/web/components/modules/select/members.tsx @@ -24,7 +24,7 @@ export const ModuleMembersSelect: React.FC = ({ value, onChange }) => { const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); const options = members?.map((member) => ({ diff --git a/web/components/modules/sidebar-select/select-lead.tsx b/web/components/modules/sidebar-select/select-lead.tsx index 020aad037..271b1dfc9 100644 --- a/web/components/modules/sidebar-select/select-lead.tsx +++ b/web/components/modules/sidebar-select/select-lead.tsx @@ -27,7 +27,7 @@ export const SidebarLeadSelect: FC = (props) => { const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/modules/sidebar-select/select-members.tsx b/web/components/modules/sidebar-select/select-members.tsx index 7b74ef794..35fbcd7a1 100644 --- a/web/components/modules/sidebar-select/select-members.tsx +++ b/web/components/modules/sidebar-select/select-members.tsx @@ -29,7 +29,7 @@ export const SidebarMembersSelect: React.FC = ({ value, onChange }) => { const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/pages/pages-view.tsx b/web/components/pages/pages-view.tsx index f441c4e00..699cbb582 100644 --- a/web/components/pages/pages-view.tsx +++ b/web/components/pages/pages-view.tsx @@ -54,7 +54,7 @@ export const PagesView: React.FC = ({ pages, viewType }) => { const { data: people } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId.toString()) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug.toString(), projectId.toString()) + ? () => projectService.fetchProjectMembers(workspaceSlug.toString(), projectId.toString()) : null ); diff --git a/web/components/project/member-select.tsx b/web/components/project/member-select.tsx index 90b4cb6b3..686568513 100644 --- a/web/components/project/member-select.tsx +++ b/web/components/project/member-select.tsx @@ -30,7 +30,7 @@ export const MemberSelect: React.FC = ({ value, onChange, isDisabled = fa const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/project/send-project-invitation-modal.tsx b/web/components/project/send-project-invitation-modal.tsx index 961e28802..be27088fd 100644 --- a/web/components/project/send-project-invitation-modal.tsx +++ b/web/components/project/send-project-invitation-modal.tsx @@ -67,7 +67,7 @@ const SendProjectInvitationModal: React.FC = (props) => { const { data: people } = useSWR( workspaceSlug ? WORKSPACE_MEMBERS(workspaceSlug as string) : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug as string) : null + workspaceSlug ? () => workspaceService.fetchWorkspaceMembers(workspaceSlug as string) : null ); const { @@ -90,9 +90,11 @@ const SendProjectInvitationModal: React.FC = (props) => { const onSubmit = async (formData: FormValues) => { if (!workspaceSlug || !projectId || isSubmitting) return; + const payload = { ...formData }; + await projectService - .inviteProject(workspaceSlug as string, projectId as string, payload, user) + .bulkAddMembersToProject(workspaceSlug.toString(), projectId.toString(), payload, user) .then(() => { setIsOpen(false); setToastAlert({ diff --git a/web/components/ui/avatar.tsx b/web/components/ui/avatar.tsx index 44997f807..a28b449ba 100644 --- a/web/components/ui/avatar.tsx +++ b/web/components/ui/avatar.tsx @@ -95,7 +95,7 @@ export const AssigneesList: React.FC = ({ const { data: people } = useSWR( workspaceSlug ? WORKSPACE_MEMBERS(workspaceSlug as string) : null, - workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug as string) : null + workspaceSlug ? () => workspaceService.fetchWorkspaceMembers(workspaceSlug as string) : null ); if ((users && users.length === 0) || (userIds && userIds.length === 0)) diff --git a/web/components/views/select-filters.tsx b/web/components/views/select-filters.tsx index b566bb96e..b032b1057 100644 --- a/web/components/views/select-filters.tsx +++ b/web/components/views/select-filters.tsx @@ -54,7 +54,7 @@ export const SelectFilters: React.FC = ({ filters, onSelect, direction = const { data: members } = useSWR( projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/components/web-view/select-assignee.tsx b/web/components/web-view/select-assignee.tsx index 877452579..1848b944f 100644 --- a/web/components/web-view/select-assignee.tsx +++ b/web/components/web-view/select-assignee.tsx @@ -33,7 +33,7 @@ export const AssigneeSelect: React.FC = (props) => { const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId - ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string) : null ); diff --git a/web/constants/fetch-keys.ts b/web/constants/fetch-keys.ts index 61c899ee2..fc1b5544d 100644 --- a/web/constants/fetch-keys.ts +++ b/web/constants/fetch-keys.ts @@ -47,19 +47,6 @@ const paramsToKey = (params: any) => { return `${layoutKey}_${projectKey}_${stateGroupKey}_${stateKey}_${priorityKey}_${assigneesKey}_${createdByKey}_${type}_${groupBy}_${orderBy}_${labelsKey}_${startDateKey}_${targetDateKey}_${sub_issue}_${startTargetDate}_${subscriberKey}`; }; -const inboxParamsToKey = (params: any) => { - const { priority, inbox_status } = params; - - let priorityKey = priority ? priority.split(",") : []; - let inboxStatusKey = inbox_status ? inbox_status.split(",") : []; - - // sorting each keys in ascending order - priorityKey = priorityKey.sort().join("_"); - inboxStatusKey = inboxStatusKey.sort().join("_"); - - return `${priorityKey}_${inboxStatusKey}`; -}; - const myIssuesParamsToKey = (params: any) => { const { assignees, created_by, labels, priority, state_group, subscriber, start_date, target_date } = params; @@ -93,13 +80,9 @@ export const USER_WORKSPACES = "USER_WORKSPACES"; export const WORKSPACE_DETAILS = (workspaceSlug: string) => `WORKSPACE_DETAILS_${workspaceSlug.toUpperCase()}`; export const WORKSPACE_MEMBERS = (workspaceSlug: string) => `WORKSPACE_MEMBERS_${workspaceSlug.toUpperCase()}`; -export const WORKSPACE_MEMBERS_WITH_EMAIL = (workspaceSlug: string) => - `WORKSPACE_MEMBERS_WITH_EMAIL_${workspaceSlug.toUpperCase()}`; export const WORKSPACE_MEMBERS_ME = (workspaceSlug: string) => `WORKSPACE_MEMBERS_ME${workspaceSlug.toUpperCase()}`; -export const WORKSPACE_INVITATIONS = "WORKSPACE_INVITATIONS"; -export const WORKSPACE_INVITATION_WITH_EMAIL = (workspaceSlug: string) => - `WORKSPACE_INVITATION_WITH_EMAIL_${workspaceSlug.toUpperCase()}`; -export const WORKSPACE_INVITATION = "WORKSPACE_INVITATION"; +export const WORKSPACE_INVITATIONS = (workspaceSlug: string) => `WORKSPACE_INVITATIONS_${workspaceSlug.toString()}`; +export const WORKSPACE_INVITATION = (invitationId: string) => `WORKSPACE_INVITATION_${invitationId}`; export const LAST_ACTIVE_WORKSPACE_AND_PROJECTS = "LAST_ACTIVE_WORKSPACE_AND_PROJECTS"; export const PROJECTS_LIST = ( @@ -115,11 +98,7 @@ export const PROJECTS_LIST = ( export const PROJECT_DETAILS = (projectId: string) => `PROJECT_DETAILS_${projectId.toUpperCase()}`; export const PROJECT_MEMBERS = (projectId: string) => `PROJECT_MEMBERS_${projectId.toUpperCase()}`; -export const PROJECT_MEMBERS_WITH_EMAIL = (workspaceSlug: string, projectId: string) => - `PROJECT_MEMBERS_WITH_EMAIL_${workspaceSlug}_${projectId.toUpperCase()}`; -export const PROJECT_INVITATIONS = "PROJECT_INVITATIONS"; -export const PROJECT_INVITATIONS_WITH_EMAIL = (workspaceSlug: string, projectId: string) => - `PROJECT_INVITATIONS_WITH_EMAIL_${workspaceSlug}_${projectId.toUpperCase()}`; +export const PROJECT_INVITATIONS = (projectId: string) => `PROJECT_INVITATIONS_${projectId.toString()}`; export const PROJECT_ISSUES_LIST = (workspaceSlug: string, projectId: string) => `PROJECT_ISSUES_LIST_${workspaceSlug.toUpperCase()}_${projectId.toUpperCase()}`; diff --git a/web/hooks/use-project-members.tsx b/web/hooks/use-project-members.tsx index 4b7abe641..298d0b3de 100644 --- a/web/hooks/use-project-members.tsx +++ b/web/hooks/use-project-members.tsx @@ -19,7 +19,9 @@ const useProjectMembers = ( // fetching project members const { data: members } = useSWR( workspaceSlug && projectId && fetchCondition ? PROJECT_MEMBERS(projectId) : null, - workspaceSlug && projectId && fetchCondition ? () => projectService.projectMembers(workspaceSlug, projectId) : null + workspaceSlug && projectId && fetchCondition + ? () => projectService.fetchProjectMembers(workspaceSlug, projectId) + : null ); const hasJoined = members?.some((item: any) => item.member.id === (user as any)?.id); diff --git a/web/hooks/use-workspace-members.tsx b/web/hooks/use-workspace-members.tsx index e6fa6d2e3..b486ac13e 100644 --- a/web/hooks/use-workspace-members.tsx +++ b/web/hooks/use-workspace-members.tsx @@ -15,7 +15,7 @@ const useWorkspaceMembers = (workspaceSlug: string | undefined, fetchCondition?: const { data: workspaceMembers, error: workspaceMemberErrors } = useSWR( workspaceSlug && fetchCondition ? WORKSPACE_MEMBERS(workspaceSlug) : null, - workspaceSlug && fetchCondition ? () => workspaceService.workspaceMembers(workspaceSlug) : null + workspaceSlug && fetchCondition ? () => workspaceService.fetchWorkspaceMembers(workspaceSlug) : null ); const hasJoined = workspaceMembers?.some((item: any) => item.member.id === (user as any)?.id); diff --git a/web/layouts/auth-layout/project-wrapper.tsx b/web/layouts/auth-layout/project-wrapper.tsx index 91645222e..688d97129 100644 --- a/web/layouts/auth-layout/project-wrapper.tsx +++ b/web/layouts/auth-layout/project-wrapper.tsx @@ -38,7 +38,7 @@ export const ProjectAuthWrapper: FC = observer((props) => { : null ); // fetching user project member information - useSWR( + const { data: projectMemberInfo } = useSWR( workspaceSlug && projectId ? `PROJECT_MEMBERS_ME_${workspaceSlug}_${projectId}` : null, workspaceSlug && projectId ? () => userStore.fetchUserProjectInfo(workspaceSlug.toString(), projectId.toString()) @@ -53,8 +53,10 @@ export const ProjectAuthWrapper: FC = observer((props) => { ); // fetching project members useSWR( - workspaceSlug && projectId ? `PROJECT_MEMBERS_${workspaceSlug}_${projectId}` : null, - workspaceSlug && projectId + workspaceSlug && projectId && projectMemberInfo && [20, 15].includes(projectMemberInfo.role) + ? `PROJECT_MEMBERS_${workspaceSlug}_${projectId}` + : null, + workspaceSlug && projectId && projectMemberInfo && [20, 15].includes(projectMemberInfo.role) ? () => projectStore.fetchProjectMembers(workspaceSlug.toString(), projectId.toString()) : null ); diff --git a/web/layouts/auth-layout/workspace-wrapper.tsx b/web/layouts/auth-layout/workspace-wrapper.tsx index e46515bf7..d218bf68c 100644 --- a/web/layouts/auth-layout/workspace-wrapper.tsx +++ b/web/layouts/auth-layout/workspace-wrapper.tsx @@ -12,8 +12,6 @@ export interface IWorkspaceAuthWrapper { children: ReactNode; } -const HIGHER_ROLES = [20, 15]; - export const WorkspaceAuthWrapper: FC = observer((props) => { const { children } = props; // store @@ -35,10 +33,10 @@ export const WorkspaceAuthWrapper: FC = observer((props) ); // fetch workspace members useSWR( - workspaceSlug && workspaceMemberInfo && HIGHER_ROLES.includes(workspaceMemberInfo.role) + workspaceSlug && workspaceMemberInfo && [20, 15].includes(workspaceMemberInfo.role) ? `WORKSPACE_MEMBERS_${workspaceSlug}` : null, - workspaceSlug && workspaceMemberInfo && HIGHER_ROLES.includes(workspaceMemberInfo.role) + workspaceSlug && workspaceMemberInfo && [20, 15].includes(workspaceMemberInfo.role) ? () => workspaceStore.fetchWorkspaceMembers(workspaceSlug.toString()) : null ); diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/settings/members.tsx b/web/pages/[workspaceSlug]/projects/[projectId]/settings/members.tsx index 7a0b34197..c55b33710 100644 --- a/web/pages/[workspaceSlug]/projects/[projectId]/settings/members.tsx +++ b/web/pages/[workspaceSlug]/projects/[projectId]/settings/members.tsx @@ -30,8 +30,8 @@ import { IProject, IUserLite, IWorkspace } from "types"; import { PROJECTS_LIST, PROJECT_DETAILS, - PROJECT_INVITATIONS_WITH_EMAIL, - PROJECT_MEMBERS_WITH_EMAIL, + PROJECT_INVITATIONS, + PROJECT_MEMBERS, USER_PROJECT_VIEW, WORKSPACE_DETAILS, } from "constants/fetch-keys"; @@ -68,21 +68,21 @@ const MembersSettings: NextPage = () => { const { reset, control } = useForm({ defaultValues }); - const { data: activeWorkspace } = useSWR(workspaceSlug ? WORKSPACE_DETAILS(workspaceSlug as string) : null, () => - workspaceSlug ? workspaceService.getWorkspace(workspaceSlug as string) : null + const { data: activeWorkspace } = useSWR(workspaceSlug ? WORKSPACE_DETAILS(workspaceSlug.toString()) : null, () => + workspaceSlug ? workspaceService.getWorkspace(workspaceSlug.toString()) : null ); const { data: projectMembers, mutate: mutateMembers } = useSWR( - workspaceSlug && projectId ? PROJECT_MEMBERS_WITH_EMAIL(workspaceSlug.toString(), projectId.toString()) : null, + workspaceSlug && projectId ? PROJECT_MEMBERS(projectId.toString()) : null, workspaceSlug && projectId - ? () => projectService.projectMembersWithEmail(workspaceSlug as string, projectId as string) + ? () => projectService.fetchProjectMembers(workspaceSlug.toString(), projectId.toString()) : null ); const { data: projectInvitations, mutate: mutateInvitations } = useSWR( - workspaceSlug && projectId ? PROJECT_INVITATIONS_WITH_EMAIL(workspaceSlug.toString(), projectId.toString()) : null, + workspaceSlug && projectId ? PROJECT_INVITATIONS(projectId.toString()) : null, workspaceSlug && projectId - ? () => projectInvitationService.projectInvitationsWithEmail(workspaceSlug as string, projectId as string) + ? () => projectInvitationService.fetchProjectInvitations(workspaceSlug.toString(), projectId.toString()) : null ); @@ -133,12 +133,12 @@ const MembersSettings: NextPage = () => { // }; // await projectService - // .updateProject(workspaceSlug as string, projectId as string, payload, user) + // .updateProject(workspaceSlug.toString(), projectId.toString(), payload, user) // .then((res) => { - // mutate(PROJECT_DETAILS(projectId as string)); + // mutate(PROJECT_DETAILS(projectId.toString())); // mutate( - // PROJECTS_LIST(workspaceSlug as string, { + // PROJECTS_LIST(workspaceSlug.toString(), { // is_favorite: "all", // }) // ); @@ -173,12 +173,12 @@ const MembersSettings: NextPage = () => { }; await projectService - .updateProject(workspaceSlug as string, projectId as string, payload, user) + .updateProject(workspaceSlug.toString(), projectId.toString(), payload, user) .then(() => { - mutate(PROJECT_DETAILS(projectId as string)); + mutate(PROJECT_DETAILS(projectId.toString())); mutate( - PROJECTS_LIST(workspaceSlug as string, { + PROJECTS_LIST(workspaceSlug.toString(), { is_favorite: "all", }) ); diff --git a/web/pages/workspace-invitations/index.tsx b/web/pages/workspace-invitations/index.tsx index 7288a669c..ea671a4a9 100644 --- a/web/pages/workspace-invitations/index.tsx +++ b/web/pages/workspace-invitations/index.tsx @@ -30,8 +30,9 @@ const WorkspaceInvitation: NextPage = () => { const { user } = useUser(); - const { data: invitationDetail, error } = useSWR(invitation_id && WORKSPACE_INVITATION, () => - invitation_id ? workspaceService.getWorkspaceInvitation(invitation_id as string) : null + const { data: invitationDetail, error } = useSWR( + invitation_id && WORKSPACE_INVITATION(invitation_id.toString()), + () => (invitation_id ? workspaceService.getWorkspaceInvitation(invitation_id as string) : null) ); const handleAccept = () => { diff --git a/web/services/project/project.service.ts b/web/services/project/project.service.ts index e1309fafa..1c824a40c 100644 --- a/web/services/project/project.service.ts +++ b/web/services/project/project.service.ts @@ -7,7 +7,7 @@ import type { GithubRepositoriesResponse, IUser, IProject, - IProjectBulkInviteFormData, + IProjectBulkAddFormData, IProjectMember, ISearchIssueResponse, ProjectPreferences, @@ -83,32 +83,6 @@ export class ProjectService extends APIService { }); } - async inviteProject( - workspaceSlug: string, - projectId: string, - data: IProjectBulkInviteFormData, - user: IUser | undefined - ): Promise { - return this.post(`/api/workspaces/${workspaceSlug}/projects/${projectId}/members/add/`, data) - .then((response) => { - trackEventService.trackProjectEvent( - { - workspaceId: response?.data?.workspace?.id, - workspaceSlug, - projectId, - projectName: response?.data?.project?.name, - memberEmail: response?.data?.member?.email, - }, - "PROJECT_MEMBER_INVITE", - user as IUser - ); - return response?.data; - }) - .catch((error) => { - throw error?.response?.data; - }); - } - async joinProject(workspaceSlug: string, project_ids: string[]): Promise { return this.post(`/api/workspaces/${workspaceSlug}/projects/join/`, { project_ids }) .then((response) => response?.data) @@ -136,17 +110,35 @@ export class ProjectService extends APIService { }); } - async projectMembers(workspaceSlug: string, projectId: string): Promise { - return this.get(`/api/workspaces/${workspaceSlug}/projects/${projectId}/project-members/`) + async fetchProjectMembers(workspaceSlug: string, projectId: string): Promise { + return this.get(`/api/workspaces/${workspaceSlug}/projects/${projectId}/members/`) .then((response) => response?.data) .catch((error) => { throw error?.response?.data; }); } - async projectMembersWithEmail(workspaceSlug: string, projectId: string): Promise { - return this.get(`/api/workspaces/${workspaceSlug}/projects/${projectId}/members/`) - .then((response) => response?.data) + async bulkAddMembersToProject( + workspaceSlug: string, + projectId: string, + data: IProjectBulkAddFormData, + user: IUser | undefined + ): Promise { + return this.post(`/api/workspaces/${workspaceSlug}/projects/${projectId}/members/`, data) + .then((response) => { + trackEventService.trackProjectEvent( + { + workspaceId: response?.data?.workspace?.id, + workspaceSlug, + projectId, + projectName: response?.data?.project?.name, + memberEmail: response?.data?.member?.email, + }, + "PROJECT_MEMBER_INVITE", + user as IUser + ); + return response?.data; + }) .catch((error) => { throw error?.response?.data; }); diff --git a/web/services/project/project_invitation.service.ts b/web/services/project/project_invitation.service.ts index 54686dd6a..1fbf6e24c 100644 --- a/web/services/project/project_invitation.service.ts +++ b/web/services/project/project_invitation.service.ts @@ -9,15 +9,7 @@ export class ProjectInvitationService extends APIService { super(API_BASE_URL); } - async projectInvitations(workspaceSlug: string, projectId: string): Promise { - return this.get(`/api/workspaces/${workspaceSlug}/projects/${projectId}/invitations/`) - .then((response) => response?.data) - .catch((error) => { - throw error?.response?.data; - }); - } - - async projectInvitationsWithEmail(workspaceSlug: string, projectId: string): Promise { + async fetchProjectInvitations(workspaceSlug: string, projectId: string): Promise { return this.get(`/api/workspaces/${workspaceSlug}/projects/${projectId}/invitations/`) .then((response) => response?.data) .catch((error) => { diff --git a/web/services/workspace.service.ts b/web/services/workspace.service.ts index 6d2f9cdf7..30126c2ee 100644 --- a/web/services/workspace.service.ts +++ b/web/services/workspace.service.ts @@ -132,14 +132,6 @@ export class WorkspaceService extends APIService { }); } - async workspaceMembers(workspaceSlug: string): Promise { - return this.get(`/api/workspaces/${workspaceSlug}/workspace-members/`) - .then((response) => response?.data) - .catch((error) => { - throw error?.response?.data; - }); - } - async workspaceMemberMe(workspaceSlug: string): Promise { return this.get(`/api/workspaces/${workspaceSlug}/workspace-members/me/`) .then((response) => response?.data) @@ -156,6 +148,14 @@ export class WorkspaceService extends APIService { }); } + async fetchWorkspaceMembers(workspaceSlug: string): Promise { + return this.get(`/api/workspaces/${workspaceSlug}/members/`) + .then((response) => response?.data) + .catch((error) => { + throw error?.response?.data; + }); + } + async updateWorkspaceMember( workspaceSlug: string, memberId: string, diff --git a/web/store/project/project.store.ts b/web/store/project/project.store.ts index b4361ec2f..225ca76bc 100644 --- a/web/store/project/project.store.ts +++ b/web/store/project/project.store.ts @@ -78,21 +78,21 @@ export class ProjectStore implements IProjectStore { searchQuery: string = ""; projectId: string | null = null; - projects: { [workspaceSlug: string]: IProject[] } = {}; // workspace_id: project[] + projects: { [workspaceSlug: string]: IProject[] } = {}; // workspaceSlug: project[] project_details: { - [key: string]: IProject; // project_id: project + [projectId: string]: IProject; // projectId: project } = {}; states: { - [key: string]: IStateResponse; // project_id: states + [projectId: string]: IStateResponse; // projectId: states } | null = {}; labels: { - [key: string]: IIssueLabels[]; // project_id: labels + [projectId: string]: IIssueLabels[]; // projectId: labels } | null = {}; members: { - [key: string]: IProjectMember[]; // project_id: members + [projectId: string]: IProjectMember[]; // projectId: members } | null = {}; estimates: { - [key: string]: IEstimate[]; // project_id: estimates + [projectId: string]: IEstimate[]; // projectId: estimates } | null = {}; // root store @@ -370,7 +370,7 @@ export class ProjectStore implements IProjectStore { this.loader = true; this.error = null; - const membersResponse = await this.projectService.projectMembers(workspaceSlug, projectId); + const membersResponse = await this.projectService.fetchProjectMembers(workspaceSlug, projectId); const _members = { ...this.members, [projectId]: membersResponse, diff --git a/web/store/workspace/workspace.store.ts b/web/store/workspace/workspace.store.ts index 28e901928..7c6551ec0 100644 --- a/web/store/workspace/workspace.store.ts +++ b/web/store/workspace/workspace.store.ts @@ -49,7 +49,7 @@ export class WorkspaceStore implements IWorkspaceStore { // observables workspaceSlug: string | null = null; workspaces: IWorkspace[] = []; - projects: { [workspaceSlug: string]: IProject[] } = {}; // workspace_id: project[] + projects: { [workspaceSlug: string]: IProject[] } = {}; // workspaceSlug: project[] labels: { [workspaceSlug: string]: IIssueLabels[] } = {}; members: { [workspaceSlug: string]: IWorkspaceMember[] } = {}; @@ -214,7 +214,7 @@ export class WorkspaceStore implements IWorkspaceStore { this.error = null; }); - const membersResponse = await this.workspaceService.workspaceMembers(workspaceSlug); + const membersResponse = await this.workspaceService.fetchWorkspaceMembers(workspaceSlug); runInAction(() => { this.members = { diff --git a/web/types/projects.d.ts b/web/types/projects.d.ts index 5ddfd64eb..f1f69af2a 100644 --- a/web/types/projects.d.ts +++ b/web/types/projects.d.ts @@ -108,7 +108,7 @@ export interface IProjectMemberInvitation { updated_by: string; } -export interface IProjectBulkInviteFormData { +export interface IProjectBulkAddFormData { members: { role: 5 | 10 | 15 | 20; member_id: string }[]; } From 442c83eea2f4c57f82ebb915a3c79392c3188c54 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Tue, 31 Oct 2023 12:18:04 +0530 Subject: [PATCH 007/157] style: spreadsheet columns (#2554) * style: spreadsheet columns * fix: build errors --- .../command-palette/command-modal.tsx | 2 +- .../issue/change-issue-assignee.tsx | 4 +- .../views/inline-issue-create-wrapper.tsx | 3 +- web/components/inbox/main-content.tsx | 8 +- web/components/issues/draft-issue-form.tsx | 7 +- web/components/issues/draft-issue-modal.tsx | 8 +- web/components/issues/form.tsx | 7 +- .../calendar/inline-create-issue-form.tsx | 12 -- .../gantt/inline-create-issue-form.tsx | 6 - .../issues/issue-layouts/kanban/block.tsx | 6 +- .../kanban/inline-create-issue-form.tsx | 12 -- .../issue-layouts/kanban/properties.tsx | 4 +- .../list/inline-create-issue-form.tsx | 12 -- .../issues/issue-layouts/list/properties.tsx | 4 +- .../spreadsheet/columns/assignee-column.tsx | 8 +- .../spreadsheet/columns/estimate-column.tsx | 12 +- .../columns/issue/issue-column.tsx | 7 +- .../issue/spreadsheet-issue-column.tsx | 4 - .../spreadsheet/columns/label-column.tsx | 4 +- .../spreadsheet/columns/priority-column.tsx | 9 +- .../spreadsheet/columns/state-column.tsx | 3 +- .../spreadsheet/inline-create-issue-form.tsx | 12 -- .../spreadsheet/spreadsheet-column.tsx | 5 +- .../spreadsheet/spreadsheet-view.tsx | 3 +- web/components/issues/modal.tsx | 5 +- .../issues/peek-overview/issue-properties.tsx | 2 +- .../issues/sidebar-select/label.tsx | 12 +- web/components/issues/sidebar.tsx | 4 +- .../issues/sub-issues/properties.tsx | 2 +- .../issues/view-select/assignee.tsx | 2 +- web/components/issues/view-select/label.tsx | 2 +- web/components/modules/form.tsx | 4 +- web/components/modules/modal.tsx | 3 +- web/components/modules/sidebar.tsx | 7 +- web/components/project/label-select.tsx | 130 +++++++++--------- web/components/project/priority-select.tsx | 43 +++--- .../web-view/issue-properties-detail.tsx | 12 +- web/constants/issue.ts | 2 - web/helpers/issue.helper.ts | 4 - .../archived-issues/[archivedIssueId].tsx | 5 - .../projects/[projectId]/issues/[issueId].tsx | 5 - .../projects/[projectId]/pages/[pageId].tsx | 7 +- .../projects/[projectId]/issues/[issueId].tsx | 4 +- web/store/issue/issue_draft.store.ts | 1 - web/types/issues.d.ts | 2 - web/types/modules.d.ts | 13 +- web/types/pages.d.ts | 1 - 47 files changed, 171 insertions(+), 263 deletions(-) diff --git a/web/components/command-palette/command-modal.tsx b/web/components/command-palette/command-modal.tsx index b3a3325eb..2d65bd58a 100644 --- a/web/components/command-palette/command-modal.tsx +++ b/web/components/command-palette/command-modal.tsx @@ -144,7 +144,7 @@ export const CommandModal: React.FC = (props) => { } else { updatedAssignees.push(assignee); } - updateIssue({ assignees_list: updatedAssignees }); + updateIssue({ assignees: updatedAssignees }); }; const redirect = (path: string) => { diff --git a/web/components/command-palette/issue/change-issue-assignee.tsx b/web/components/command-palette/issue/change-issue-assignee.tsx index d7ed90bd6..606acb536 100644 --- a/web/components/command-palette/issue/change-issue-assignee.tsx +++ b/web/components/command-palette/issue/change-issue-assignee.tsx @@ -79,7 +79,7 @@ export const ChangeIssueAssignee: FC = ({ setIsPaletteOpen, issue, user } ); const handleIssueAssignees = (assignee: string) => { - const updatedAssignees = issue.assignees_list ?? []; + const updatedAssignees = issue.assignees ?? []; if (updatedAssignees.includes(assignee)) { updatedAssignees.splice(updatedAssignees.indexOf(assignee), 1); @@ -87,7 +87,7 @@ export const ChangeIssueAssignee: FC = ({ setIsPaletteOpen, issue, user } updatedAssignees.push(assignee); } - updateIssue({ assignees_list: updatedAssignees }); + updateIssue({ assignees: updatedAssignees }); setIsPaletteOpen(false); }; diff --git a/web/components/core/views/inline-issue-create-wrapper.tsx b/web/components/core/views/inline-issue-create-wrapper.tsx index b474cb74c..b17a6b34b 100644 --- a/web/components/core/views/inline-issue-create-wrapper.tsx +++ b/web/components/core/views/inline-issue-create-wrapper.tsx @@ -198,8 +198,7 @@ export const InlineCreateIssueFormWrapper: React.FC = (props) => { if (onSuccess) await onSuccess(res); - if (formData.assignees_list?.some((assignee) => assignee === user?.id)) - mutate(USER_ISSUE(workspaceSlug as string)); + if (formData.assignees?.some((assignee) => assignee === user?.id)) mutate(USER_ISSUE(workspaceSlug as string)); if (formData.parent && formData.parent !== "") mutate(SUB_ISSUES(formData.parent)); }) diff --git a/web/components/inbox/main-content.tsx b/web/components/inbox/main-content.tsx index 6cc17abe6..a978dc7ce 100644 --- a/web/components/inbox/main-content.tsx +++ b/web/components/inbox/main-content.tsx @@ -22,10 +22,10 @@ import { IInboxIssue, IIssue } from "types"; const defaultValues: Partial = { name: "", description_html: "", - assignees_list: [], + assignees: [], priority: "low", target_date: new Date().toString(), - labels_list: [], + labels: [], }; export const InboxMainContent: React.FC = observer(() => { @@ -122,8 +122,8 @@ export const InboxMainContent: React.FC = observer(() => { reset({ ...issueDetails, - assignees_list: issueDetails.assignees_list ?? (issueDetails.assignee_details ?? []).map((user) => user.id), - labels_list: issueDetails.labels_list ?? issueDetails.labels, + assignees: issueDetails.assignees ?? (issueDetails.assignee_details ?? []).map((user) => user.id), + labels: issueDetails.labels ?? issueDetails.labels, }); }, [issueDetails, reset, inboxIssueId]); diff --git a/web/components/issues/draft-issue-form.tsx b/web/components/issues/draft-issue-form.tsx index 9220b7cf4..9deafb51a 100644 --- a/web/components/issues/draft-issue-form.tsx +++ b/web/components/issues/draft-issue-form.tsx @@ -51,9 +51,7 @@ const defaultValues: Partial = { parent: null, priority: "none", assignees: [], - assignees_list: [], labels: [], - labels_list: [], start_date: null, target_date: null, }; @@ -310,10 +308,7 @@ export const DraftIssueForm: FC = (props) => { handleClose={() => setLabelModal(false)} projectId={projectId} user={user} - onSuccess={(response) => { - setValue("labels", [...watch("labels"), response.id]); - setValue("labels_list", [...watch("labels_list"), response.id]); - }} + onSuccess={(response) => setValue("labels", [...watch("labels"), response.id])} /> )} diff --git a/web/components/issues/draft-issue-modal.tsx b/web/components/issues/draft-issue-modal.tsx index 535b77abc..80aebcbbd 100644 --- a/web/components/issues/draft-issue-modal.tsx +++ b/web/components/issues/draft-issue-modal.tsx @@ -208,8 +208,7 @@ export const CreateUpdateDraftIssueModal: React.FC = observer( message: "Issue created successfully.", }); - if (payload.assignees_list?.some((assignee) => assignee === user?.id)) - mutate(USER_ISSUE(workspaceSlug as string)); + if (payload.assignees?.some((assignee) => assignee === user?.id)) mutate(USER_ISSUE(workspaceSlug as string)); }) .catch(() => { setToastAlert({ @@ -325,8 +324,7 @@ export const CreateUpdateDraftIssueModal: React.FC = observer( if (!createMore) onClose(); - if (payload.assignees_list?.some((assignee) => assignee === user?.id)) - mutate(USER_ISSUE(workspaceSlug as string)); + if (payload.assignees?.some((assignee) => assignee === user?.id)) mutate(USER_ISSUE(workspaceSlug as string)); if (payload.parent && payload.parent !== "") mutate(SUB_ISSUES(payload.parent)); }) @@ -347,8 +345,6 @@ export const CreateUpdateDraftIssueModal: React.FC = observer( const payload: Partial = { ...formData, - assignees_list: formData.assignees ?? [], - labels_list: formData.labels ?? [], description: formData.description ?? "", description_html: formData.description_html ?? "

", }; diff --git a/web/components/issues/form.tsx b/web/components/issues/form.tsx index 13e622385..071a7661b 100644 --- a/web/components/issues/form.tsx +++ b/web/components/issues/form.tsx @@ -41,9 +41,7 @@ const defaultValues: Partial = { parent: null, priority: "none", assignees: [], - assignees_list: [], labels: [], - labels_list: [], start_date: null, target_date: null, }; @@ -262,10 +260,7 @@ export const IssueForm: FC = observer((props) => { handleClose={() => setLabelModal(false)} projectId={projectId} user={user ?? undefined} - onSuccess={(response) => { - setValue("labels", [...watch("labels"), response.id]); - setValue("labels_list", [...watch("labels_list"), response.id]); - }} + onSuccess={(response) => setValue("labels", [...watch("labels"), response.id])} /> )} diff --git a/web/components/issues/issue-layouts/calendar/inline-create-issue-form.tsx b/web/components/issues/issue-layouts/calendar/inline-create-issue-form.tsx index 3ab74c368..18b76c449 100644 --- a/web/components/issues/issue-layouts/calendar/inline-create-issue-form.tsx +++ b/web/components/issues/issue-layouts/calendar/inline-create-issue-form.tsx @@ -147,18 +147,6 @@ export const CalendarInlineCreateIssueForm: React.FC = observer((props) = const payload = createIssuePayload(workspaceDetail!, projectDetails!, { ...(prePopulatedData ?? {}), ...formData, - labels_list: - formData.labels_list?.length !== 0 - ? formData.labels_list - : prePopulatedData?.labels && prePopulatedData?.labels.toString() !== "none" - ? [prePopulatedData.labels as any] - : [], - assignees_list: - formData.assignees_list?.length !== 0 - ? formData.assignees_list - : prePopulatedData?.assignees && prePopulatedData?.assignees.toString() !== "none" - ? [prePopulatedData.assignees as any] - : [], }); try { diff --git a/web/components/issues/issue-layouts/gantt/inline-create-issue-form.tsx b/web/components/issues/issue-layouts/gantt/inline-create-issue-form.tsx index b4edddbd1..bcdd1ba13 100644 --- a/web/components/issues/issue-layouts/gantt/inline-create-issue-form.tsx +++ b/web/components/issues/issue-layouts/gantt/inline-create-issue-form.tsx @@ -113,12 +113,6 @@ export const GanttInlineCreateIssueForm: React.FC = observer((props) => { const payload = createIssuePayload(workspaceDetail!, projectDetails!, { ...(prePopulatedData ?? {}), ...formData, - labels_list: - formData.labels_list?.length !== 0 - ? formData.labels_list - : prePopulatedData?.labels && prePopulatedData?.labels.toString() !== "none" - ? [prePopulatedData.labels as any] - : [], start_date: renderDateFormat(new Date()), target_date: renderDateFormat(new Date(new Date().getTime() + 24 * 60 * 60 * 1000)), }); diff --git a/web/components/issues/issue-layouts/kanban/block.tsx b/web/components/issues/issue-layouts/kanban/block.tsx index 51197c45d..f30453a44 100644 --- a/web/components/issues/issue-layouts/kanban/block.tsx +++ b/web/components/issues/issue-layouts/kanban/block.tsx @@ -65,9 +65,9 @@ export const KanbanIssueBlock: React.FC = (props) => { )}
{displayProperties && displayProperties?.key && (
diff --git a/web/components/issues/issue-layouts/kanban/inline-create-issue-form.tsx b/web/components/issues/issue-layouts/kanban/inline-create-issue-form.tsx index cad0814b8..764c8a7c6 100644 --- a/web/components/issues/issue-layouts/kanban/inline-create-issue-form.tsx +++ b/web/components/issues/issue-layouts/kanban/inline-create-issue-form.tsx @@ -117,18 +117,6 @@ export const BoardInlineCreateIssueForm: React.FC = observer((props) => { const payload = createIssuePayload(workspaceDetail!, projectDetails!, { ...(prePopulatedData ?? {}), ...formData, - labels_list: - formData.labels_list && formData.labels_list.length !== 0 - ? formData.labels_list - : prePopulatedData?.labels && prePopulatedData?.labels.toString() !== "none" - ? [prePopulatedData.labels as any] - : [], - assignees_list: - formData.assignees_list && formData.assignees_list.length !== 0 - ? formData.assignees_list - : prePopulatedData?.assignees && prePopulatedData?.assignees.toString() !== "none" - ? [prePopulatedData.assignees as any] - : [], }); try { diff --git a/web/components/issues/issue-layouts/kanban/properties.tsx b/web/components/issues/issue-layouts/kanban/properties.tsx index 4ab4613aa..f40434686 100644 --- a/web/components/issues/issue-layouts/kanban/properties.tsx +++ b/web/components/issues/issue-layouts/kanban/properties.tsx @@ -65,7 +65,7 @@ export const KanBanProperties: React.FC = observer((props) => handleIssues( !sub_group_id && sub_group_id === "null" ? null : sub_group_id, !group_id && group_id === "null" ? null : group_id, - { ...issue, labels_list: ids } + { ...issue, labels: ids } ); }; @@ -73,7 +73,7 @@ export const KanBanProperties: React.FC = observer((props) => handleIssues( !sub_group_id && sub_group_id === "null" ? null : sub_group_id, !group_id && group_id === "null" ? null : group_id, - { ...issue, assignees_list: ids } + { ...issue, assignees: ids } ); }; diff --git a/web/components/issues/issue-layouts/list/inline-create-issue-form.tsx b/web/components/issues/issue-layouts/list/inline-create-issue-form.tsx index a0624a74f..761fd7f9e 100644 --- a/web/components/issues/issue-layouts/list/inline-create-issue-form.tsx +++ b/web/components/issues/issue-layouts/list/inline-create-issue-form.tsx @@ -116,18 +116,6 @@ export const ListInlineCreateIssueForm: React.FC = observer((props) => { const payload = createIssuePayload(workspaceDetail!, projectDetails!, { ...(prePopulatedData ?? {}), ...formData, - labels_list: - formData.labels_list?.length !== 0 - ? formData.labels_list - : prePopulatedData?.labels && prePopulatedData?.labels.toString() !== "none" - ? [prePopulatedData.labels as any] - : [], - assignees_list: - formData.assignees_list?.length !== 0 - ? formData.assignees_list - : prePopulatedData?.assignees && prePopulatedData?.assignees.toString() !== "none" - ? [prePopulatedData.assignees as any] - : [], }); try { diff --git a/web/components/issues/issue-layouts/list/properties.tsx b/web/components/issues/issue-layouts/list/properties.tsx index 9c70f9fdd..e751a2fe9 100644 --- a/web/components/issues/issue-layouts/list/properties.tsx +++ b/web/components/issues/issue-layouts/list/properties.tsx @@ -36,11 +36,11 @@ export const KanBanProperties: FC = observer((props) => { }; const handleLabel = (ids: string[]) => { - handleIssues(!group_id && group_id === "null" ? null : group_id, { ...issue, labels_list: ids }); + handleIssues(!group_id && group_id === "null" ? null : group_id, { ...issue, labels: ids }); }; const handleAssignee = (ids: string[]) => { - handleIssues(!group_id && group_id === "null" ? null : group_id, { ...issue, assignees_list: ids }); + handleIssues(!group_id && group_id === "null" ? null : group_id, { ...issue, assignees: ids }); }; const handleStartDate = (date: string) => { diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx index f4878d137..db06d81b8 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx @@ -21,12 +21,12 @@ export const SpreadsheetAssigneeColumn: React.FC = ({ issue, members, onC const { subIssues, isLoading } = useSubIssue(issue.project_detail.id, issue.id, isExpanded); return ( - <> +
onChange({ assignees_list: data })} + onChange={(data) => onChange({ assignees: data })} members={members ?? []} - buttonClassName="!p-0 !rounded-none !shadow-none !border-0" + buttonClassName="!p-0 !rounded-none !border-0" hideDropdownArrow disabled={disabled} multiple @@ -46,6 +46,6 @@ export const SpreadsheetAssigneeColumn: React.FC = ({ issue, members, onC disabled={disabled} /> ))} - +
); }; diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx index 156fb707f..fa1cd4c0e 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx @@ -1,5 +1,5 @@ // components -import { ViewEstimateSelect } from "components/issues"; +import { EstimateSelect } from "components/estimates"; // hooks import useSubIssue from "hooks/use-sub-issue"; // types @@ -21,7 +21,15 @@ export const SpreadsheetEstimateColumn: React.FC = (props) => { return ( <> - onChange({ estimate_point: data })} disabled={disabled} /> + onChange({ estimate_point: data })} + className="h-full" + buttonClassName="!border-0 !h-full !w-full !rounded-none px-4" + estimatePoints={undefined} + disabled={disabled} + hideDropdownArrow + /> {isExpanded && !isLoading && diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/issue/issue-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/issue/issue-column.tsx index 8bb5235c9..e26cdb789 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/issue/issue-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/issue/issue-column.tsx @@ -5,13 +5,12 @@ import { MoreHorizontal, Pencil, Trash2, ChevronRight, Link } from "lucide-react // hooks import useToast from "hooks/use-toast"; // helpers -import { copyTextToClipboard } from "helpers/string.helper"; +import { copyUrlToClipboard } from "helpers/string.helper"; // types import { IIssue, IIssueDisplayProperties } from "types"; type Props = { issue: IIssue; - projectId: string; expanded: boolean; handleToggleExpand: (issueId: string) => void; properties: IIssueDisplayProperties; @@ -23,7 +22,6 @@ type Props = { export const IssueColumn: React.FC = ({ issue, - projectId, expanded, handleToggleExpand, properties, @@ -50,8 +48,7 @@ export const IssueColumn: React.FC = ({ }; const handleCopyText = () => { - const originURL = typeof window !== "undefined" && window.location.origin ? window.location.origin : ""; - copyTextToClipboard(`${originURL}/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`).then(() => { + copyUrlToClipboard(`${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`).then(() => { setToastAlert({ type: "success", title: "Link Copied!", diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/issue/spreadsheet-issue-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/issue/spreadsheet-issue-column.tsx index 887b7bae4..22692a396 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/issue/spreadsheet-issue-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/issue/spreadsheet-issue-column.tsx @@ -9,7 +9,6 @@ import { IIssue, IIssueDisplayProperties } from "types"; type Props = { issue: IIssue; - projectId: string; expandedIssues: string[]; setExpandedIssues: React.Dispatch>; properties: IIssueDisplayProperties; @@ -20,7 +19,6 @@ type Props = { export const SpreadsheetIssuesColumn: React.FC = ({ issue, - projectId, expandedIssues, setExpandedIssues, properties, @@ -48,7 +46,6 @@ export const SpreadsheetIssuesColumn: React.FC = ({ <> = ({ = (props) => { <> onChange({ labels_list: data })} + onChange={(data) => onChange({ labels: data })} labels={labels ?? []} + className="h-full" + buttonClassName="!border-0 !h-full !w-full !rounded-none" hideDropdownArrow maxRender={1} disabled={disabled} diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx index 22ef2a0bd..1f1301d5e 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx @@ -20,11 +20,14 @@ export const SpreadsheetPriorityColumn: React.FC = ({ issue, onChange, ex const { subIssues, isLoading } = useSubIssue(issue.project_detail.id, issue.id, isExpanded); return ( -
+ <> onChange({ priority: data })} - buttonClassName="!p-0 !rounded-none !shadow-none !border-0" + className="h-full" + buttonClassName="!border-0 !h-full !w-full !rounded-none px-4" + showTitle + highlightUrgentPriority={false} hideDropdownArrow disabled={disabled} /> @@ -42,6 +45,6 @@ export const SpreadsheetPriorityColumn: React.FC = ({ issue, onChange, ex disabled={disabled} /> ))} -
+ ); }; diff --git a/web/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx b/web/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx index 81f45d04f..1a9a32e2e 100644 --- a/web/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx @@ -32,7 +32,8 @@ export const SpreadsheetStateColumn: React.FC = (props) => { value={issue.state_detail} onChange={(data) => onChange({ state: data.id, state_detail: data })} states={statesList} - buttonClassName="!shadow-none !border-0" + className="h-full" + buttonClassName="!border-0 !h-full !w-full !rounded-none" hideDropdownArrow disabled={disabled} /> diff --git a/web/components/issues/issue-layouts/spreadsheet/inline-create-issue-form.tsx b/web/components/issues/issue-layouts/spreadsheet/inline-create-issue-form.tsx index 20105a67e..5284d64e4 100644 --- a/web/components/issues/issue-layouts/spreadsheet/inline-create-issue-form.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/inline-create-issue-form.tsx @@ -120,18 +120,6 @@ export const SpreadsheetInlineCreateIssueForm: React.FC = observer((props const payload = createIssuePayload(workspaceDetail!, projectDetails!, { ...(prePopulatedData ?? {}), ...formData, - labels_list: - formData.labels_list && formData.labels_list?.length !== 0 - ? formData.labels_list - : prePopulatedData?.labels && prePopulatedData?.labels.toString() !== "none" - ? [prePopulatedData.labels as any] - : [], - assignees_list: - formData.assignees_list && formData.assignees_list?.length !== 0 - ? formData.assignees_list - : prePopulatedData?.assignees && prePopulatedData?.assignees.toString() !== "none" - ? [prePopulatedData.assignees as any] - : [], }); try { diff --git a/web/components/issues/issue-layouts/spreadsheet/spreadsheet-column.tsx b/web/components/issues/issue-layouts/spreadsheet/spreadsheet-column.tsx index d6e674e28..4013c7737 100644 --- a/web/components/issues/issue-layouts/spreadsheet/spreadsheet-column.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/spreadsheet-column.tsx @@ -100,6 +100,7 @@ export const SpreadsheetColumn: React.FC = (props) => {
} width="xl" + placement="bottom-end" > handleOrderBy(propertyDetails.ascendingOrderKey, property)}>
= (props) => { {issues?.map((issue) => (
{property === "state" ? ( = observer((props) => { Issue
- {issues.map((issue: IIssue, index) => ( + {issues.map((issue, index) => ( = observer((prop setFormDirtyState(null); setShowConfirmDiscard(false); - if (payload.assignees_list?.some((assignee) => assignee === user?.id)) - mutate(USER_ISSUE(workspaceSlug as string)); + if (payload.assignees?.some((assignee) => assignee === user?.id)) mutate(USER_ISSUE(workspaceSlug as string)); if (payload.parent && payload.parent !== "") mutate(SUB_ISSUES(payload.parent)); }) @@ -271,8 +270,6 @@ export const CreateUpdateIssueModal: React.FC = observer((prop const payload: Partial = { ...formData, - assignees_list: formData.assignees ?? [], - labels_list: formData.labels ?? [], description: formData.description ?? "", description_html: formData.description_html ?? "

", }; diff --git a/web/components/issues/peek-overview/issue-properties.tsx b/web/components/issues/peek-overview/issue-properties.tsx index 9a871dfa2..6bb267a6c 100644 --- a/web/components/issues/peek-overview/issue-properties.tsx +++ b/web/components/issues/peek-overview/issue-properties.tsx @@ -93,7 +93,7 @@ export const PeekOverviewIssueProperties: FC = (props) => {
handleUpdateIssue({ assignees_list: val })} + onChange={(val: string[]) => handleUpdateIssue({ assignees: val })} disabled={readOnly} />
diff --git a/web/components/issues/sidebar-select/label.tsx b/web/components/issues/sidebar-select/label.tsx index dffb97f56..a442a1d42 100644 --- a/web/components/issues/sidebar-select/label.tsx +++ b/web/components/issues/sidebar-select/label.tsx @@ -77,7 +77,7 @@ export const SidebarLabelSelect: React.FC = ({ issueLabelMutate((prevData: any) => [...(prevData ?? []), res], false); - submitChanges({ labels_list: [...(issueDetails?.labels ?? []), res.id] }); + submitChanges({ labels: [...(issueDetails?.labels ?? []), res.id] }); setCreateLabelForm(false); }); @@ -99,7 +99,7 @@ export const SidebarLabelSelect: React.FC = ({
- {watchIssue("labels_list")?.map((labelId) => { + {watchIssue("labels")?.map((labelId) => { const label = issueLabels?.find((l) => l.id === labelId); if (label) @@ -108,9 +108,9 @@ export const SidebarLabelSelect: React.FC = ({ key={label.id} className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-100 px-1 py-0.5 text-xs hover:border-red-500/20 hover:bg-red-500/20" onClick={() => { - const updatedLabels = watchIssue("labels_list")?.filter((l) => l !== labelId); + const updatedLabels = watchIssue("labels")?.filter((l) => l !== labelId); submitChanges({ - labels_list: updatedLabels, + labels: updatedLabels, }); }} > @@ -127,12 +127,12 @@ export const SidebarLabelSelect: React.FC = ({ })} ( submitChanges({ labels_list: val })} + onChange={(val: any) => submitChanges({ labels: val })} className="flex-shrink-0" multiple disabled={isNotAllowed || uneditable} diff --git a/web/components/issues/sidebar.tsx b/web/components/issues/sidebar.tsx index 075c43cc3..d87033f5b 100644 --- a/web/components/issues/sidebar.tsx +++ b/web/components/issues/sidebar.tsx @@ -357,11 +357,11 @@ export const IssueDetailsSidebar: React.FC = ({
( submitChanges({ assignees_list: val })} + onChange={(val: string[]) => submitChanges({ assignees: val })} disabled={memberRole.isGuest || memberRole.isViewer || uneditable} /> )} diff --git a/web/components/issues/sub-issues/properties.tsx b/web/components/issues/sub-issues/properties.tsx index ce84d92c5..665ff8514 100644 --- a/web/components/issues/sub-issues/properties.tsx +++ b/web/components/issues/sub-issues/properties.tsx @@ -72,7 +72,7 @@ export const IssueProperty: React.FC = observer((props) => { }; const handleAssigneeChange = (data: string[]) => { - partialUpdateIssue({ assignees_list: data, assignees: data }); + partialUpdateIssue({ assignees: data }); trackEventService.trackIssuePartialPropertyUpdateEvent( { diff --git a/web/components/issues/view-select/assignee.tsx b/web/components/issues/view-select/assignee.tsx index f096c03fc..3be22b25d 100644 --- a/web/components/issues/view-select/assignee.tsx +++ b/web/components/issues/view-select/assignee.tsx @@ -90,7 +90,7 @@ export const ViewAssigneeSelect: React.FC = ({ if (newData.includes(data)) newData.splice(newData.indexOf(data), 1); else newData.push(data); - partialUpdateIssue({ assignees_list: data }, issue); + partialUpdateIssue({ assignees: data }, issue); trackEventService.trackIssuePartialPropertyUpdateEvent( { diff --git a/web/components/issues/view-select/label.tsx b/web/components/issues/view-select/label.tsx index 6aa85fb1a..c7f71e4f1 100644 --- a/web/components/issues/view-select/label.tsx +++ b/web/components/issues/view-select/label.tsx @@ -139,7 +139,7 @@ export const ViewLabelSelect: FC = ({ { - partialUpdateIssue({ labels_list: data }, issue); + partialUpdateIssue({ labels: data }, issue); }} options={options} {...(customButton ? { customButton: labelsLabel } : { label: labelsLabel })} diff --git a/web/components/modules/form.tsx b/web/components/modules/form.tsx index 15fe24cca..c26926ff8 100644 --- a/web/components/modules/form.tsx +++ b/web/components/modules/form.tsx @@ -23,7 +23,7 @@ const defaultValues: Partial = { description: "", status: "backlog", lead: null, - members_list: [], + members: [], }; export const ModuleForm: React.FC = ({ @@ -47,7 +47,7 @@ export const ModuleForm: React.FC = ({ description: data?.description || "", status: data?.status || "backlog", lead: data?.lead || null, - members_list: data?.members_list || [], + members: data?.members || [], }, }); diff --git a/web/components/modules/modal.tsx b/web/components/modules/modal.tsx index cfb422cbf..887884ba2 100644 --- a/web/components/modules/modal.tsx +++ b/web/components/modules/modal.tsx @@ -24,7 +24,7 @@ const defaultValues: Partial = { description: "", status: "backlog", lead: null, - members_list: [], + members: [], }; export const CreateUpdateModuleModal: React.FC = observer((props) => { @@ -98,7 +98,6 @@ export const CreateUpdateModuleModal: React.FC = observer((props) => { const payload: Partial = { ...formData, - members_list: formData.members, }; if (!data) await createModule(payload); diff --git a/web/components/modules/sidebar.tsx b/web/components/modules/sidebar.tsx index f931f3fc1..58ea811a6 100644 --- a/web/components/modules/sidebar.tsx +++ b/web/components/modules/sidebar.tsx @@ -32,7 +32,7 @@ import { MODULE_STATUS } from "constants/module"; const defaultValues: Partial = { lead: "", - members_list: [], + members: [], start_date: null, target_date: null, status: "backlog", @@ -186,7 +186,6 @@ export const ModuleDetailsSidebar: React.FC = observer((props) => { if (moduleDetails) reset({ ...moduleDetails, - members_list: moduleDetails.members_list ?? moduleDetails.members_detail?.map((m) => m.id), }); }, [moduleDetails, reset]); @@ -301,12 +300,12 @@ export const ModuleDetailsSidebar: React.FC = observer((props) => { /> ( { - submitChanges({ members_list: val }); + submitChanges({ members: val }); }} /> )} diff --git a/web/components/project/label-select.tsx b/web/components/project/label-select.tsx index ebf7f4776..c70aa8d29 100644 --- a/web/components/project/label-select.tsx +++ b/web/components/project/label-select.tsx @@ -2,7 +2,7 @@ import React, { useState } from "react"; import { usePopper } from "react-popper"; import { Placement } from "@popperjs/core"; import { Combobox } from "@headlessui/react"; -import { Check, ChevronDown, PlusIcon, Search } from "lucide-react"; +import { Check, ChevronDown, Search } from "lucide-react"; // ui import { Tooltip } from "components/ui"; // types @@ -21,18 +21,20 @@ type Props = { disabled?: boolean; }; -export const LabelSelect: React.FC = ({ - value, - onChange, - labels, - className = "", - buttonClassName = "", - optionsClassName = "", - maxRender = 2, - placement, - hideDropdownArrow = false, - disabled = false, -}) => { +export const LabelSelect: React.FC = (props) => { + const { + value, + onChange, + labels, + className = "", + buttonClassName = "", + optionsClassName = "", + maxRender = 2, + placement, + hideDropdownArrow = false, + disabled = false, + } = props; + const [query, setQuery] = useState(""); const [referenceElement, setReferenceElement] = useState(null); @@ -79,63 +81,57 @@ export const LabelSelect: React.FC = ({ multiple > - diff --git a/web/components/project/priority-select.tsx b/web/components/project/priority-select.tsx index 5c9ff83e7..38a51ff6e 100644 --- a/web/components/project/priority-select.tsx +++ b/web/components/project/priority-select.tsx @@ -20,6 +20,8 @@ type Props = { buttonClassName?: string; optionsClassName?: string; placement?: Placement; + showTitle?: boolean; + highlightUrgentPriority?: boolean; hideDropdownArrow?: boolean; disabled?: boolean; }; @@ -31,6 +33,8 @@ export const PrioritySelect: React.FC = ({ buttonClassName = "", optionsClassName = "", placement, + showTitle = false, + highlightUrgentPriority = true, hideDropdownArrow = false, disabled = false, }) => { @@ -69,20 +73,21 @@ export const PrioritySelect: React.FC = ({ const label = ( - +
+ + {showTitle && {value}} +
); @@ -99,9 +104,13 @@ export const PrioritySelect: React.FC = ({ ref={setReferenceElement} type="button" className={`flex items-center justify-between gap-1 h-full w-full text-xs rounded border-[0.5px] ${ - value === "urgent" ? "border-red-500/20 bg-red-500" : "border-custom-border-300" - } ${ - disabled ? "cursor-not-allowed text-custom-text-200" : "cursor-pointer hover:bg-custom-background-80" + value === "urgent" + ? highlightUrgentPriority + ? "border-red-500/20 bg-red-500" + : "border-custom-border-300" + : "border-custom-border-300" + } ${!disabled ? "hover:bg-custom-background-80" : ""} ${ + disabled ? "cursor-not-allowed text-custom-text-200" : "cursor-pointer" } ${buttonClassName}`} > {label} diff --git a/web/components/web-view/issue-properties-detail.tsx b/web/components/web-view/issue-properties-detail.tsx index 40b84ff82..67e067dac 100644 --- a/web/components/web-view/issue-properties-detail.tsx +++ b/web/components/web-view/issue-properties-detail.tsx @@ -144,7 +144,7 @@ export const IssuePropertiesDetail: React.FC = (props) => {
( = (props) => { onChange={(val: string) => { const assignees = value?.includes(val) ? value?.filter((i) => i !== val) : [...(value ?? []), val]; - submitChanges({ assignees_list: assignees }); + submitChanges({ assignees: assignees }); }} /> )} @@ -232,7 +232,7 @@ export const IssuePropertiesDetail: React.FC = (props) => { JSON.stringify({ issue_id: relation.issue_detail?.id, project_id: relation.issue_detail?.project_detail.id, - issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}` + issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`, }) ) } @@ -295,7 +295,7 @@ export const IssuePropertiesDetail: React.FC = (props) => { JSON.stringify({ issue_id: relation.issue_detail?.id, project_id: relation.issue_detail?.project_detail.id, - issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}` + issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`, }) ) } @@ -358,7 +358,7 @@ export const IssuePropertiesDetail: React.FC = (props) => { JSON.stringify({ issue_id: relation.issue_detail?.id, project_id: relation.issue_detail?.project_detail.id, - issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}` + issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`, }) ) } @@ -421,7 +421,7 @@ export const IssuePropertiesDetail: React.FC = (props) => { JSON.stringify({ issue_id: relation.issue_detail?.id, project_id: relation.issue_detail?.project_detail.id, - issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}` + issue_identifier: `${relation.issue_detail?.project_detail.identifier}-${relation.issue_detail?.sequence_id}`, }) ) } diff --git a/web/constants/issue.ts b/web/constants/issue.ts index 2e7983c11..376c99aa0 100644 --- a/web/constants/issue.ts +++ b/web/constants/issue.ts @@ -437,7 +437,6 @@ export const createIssuePayload: ( archived_at: null, assignees: [], assignee_details: [], - assignees_list: [], attachment_count: 0, attachments: [], issue_relations: [], @@ -459,7 +458,6 @@ export const createIssuePayload: ( labels: [], label_details: [], is_draft: false, - labels_list: [], links_list: [], link_count: 0, module: null, diff --git a/web/helpers/issue.helper.ts b/web/helpers/issue.helper.ts index 919699d69..6f4381dec 100644 --- a/web/helpers/issue.helper.ts +++ b/web/helpers/issue.helper.ts @@ -37,8 +37,6 @@ export const handleIssuesMutation: THandleIssuesMutation = ( const updatedIssue = { ...prevData[issueIndex], ...formData, - assignees: formData?.assignees_list ?? prevData[issueIndex]?.assignees, - labels: formData?.labels_list ?? prevData[issueIndex]?.labels, }; prevData.splice(issueIndex, 1, updatedIssue); @@ -55,8 +53,6 @@ export const handleIssuesMutation: THandleIssuesMutation = ( const updatedIssue = { ...oldGroup[issueIndex], ...formData, - assignees: formData?.assignees_list ?? oldGroup[issueIndex]?.assignees, - labels: formData?.labels_list ?? oldGroup[issueIndex]?.labels, }; if (selectedGroupBy !== Object.keys(formData)[0]) diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/archived-issues/[archivedIssueId].tsx b/web/pages/[workspaceSlug]/projects/[projectId]/archived-issues/[archivedIssueId].tsx index df20f8a1f..d6d0c6859 100644 --- a/web/pages/[workspaceSlug]/projects/[projectId]/archived-issues/[archivedIssueId].tsx +++ b/web/pages/[workspaceSlug]/projects/[projectId]/archived-issues/[archivedIssueId].tsx @@ -32,12 +32,10 @@ const defaultValues: Partial = { description_html: "", estimate_point: null, state: "", - assignees_list: [], priority: "low", target_date: new Date().toString(), issue_cycle: null, issue_module: null, - labels_list: [], }; // services @@ -109,9 +107,6 @@ const ArchivedIssueDetailsPage: NextPage = () => { mutate(PROJECT_ISSUES_ACTIVITY(archivedIssueId as string)); reset({ ...issueDetails, - assignees_list: issueDetails.assignees_list ?? issueDetails.assignee_details?.map((user) => user.id), - labels_list: issueDetails.labels_list ?? issueDetails.labels, - labels: issueDetails.labels_list ?? issueDetails.labels, }); }, [issueDetails, reset, archivedIssueId]); diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx b/web/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx index af942ef47..c8e70bdb7 100644 --- a/web/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx +++ b/web/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx @@ -27,13 +27,11 @@ import { PROJECT_ISSUES_ACTIVITY, ISSUE_DETAILS } from "constants/fetch-keys"; // helper const defaultValues: Partial = { - assignees_list: [], description: "", description_html: "", estimate_point: null, issue_cycle: null, issue_module: null, - labels_list: [], name: "", priority: "low", start_date: null, @@ -109,9 +107,6 @@ const IssueDetailsPage: NextPage = () => { mutate(PROJECT_ISSUES_ACTIVITY(issueId as string)); reset({ ...issueDetails, - assignees_list: issueDetails.assignees_list ?? issueDetails.assignee_details?.map((user) => user.id), - labels_list: issueDetails.labels_list ?? issueDetails.labels, - labels: issueDetails.labels_list ?? issueDetails.labels, }); }, [issueDetails, reset, issueId]); diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx b/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx index 7c4cae55d..24a25fa9d 100644 --- a/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx +++ b/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx @@ -133,7 +133,6 @@ const SinglePage: NextPage = () => { (prevData) => ({ ...(prevData as IPage), ...formData, - labels: formData.labels_list ? formData.labels_list : (prevData as IPage).labels, }), false ); @@ -361,7 +360,7 @@ const SinglePage: NextPage = () => { className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-200 px-2 py-0.5 text-xs hover:border-red-500 hover:bg-red-50" onClick={() => { const updatedLabels = pageDetails.labels.filter((l) => l !== labelId); - partialUpdatePage({ labels_list: updatedLabels }); + partialUpdatePage({ labels: updatedLabels }); }} style={{ backgroundColor: `${label?.color && label.color !== "" ? label.color : "#000000"}20`, @@ -402,7 +401,7 @@ const SinglePage: NextPage = () => { } - onChange={(val: string[]) => partialUpdatePage({ labels_list: val })} + onChange={(val: string[]) => partialUpdatePage({ labels: val })} options={options} multiple noChevron @@ -606,7 +605,7 @@ const SinglePage: NextPage = () => { user={user} onSuccess={(response) => { partialUpdatePage({ - labels_list: [...(pageDetails.labels ?? []), response.id], + labels: [...(pageDetails.labels ?? []), response.id], }); }} /> diff --git a/web/pages/m/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx b/web/pages/m/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx index 167b89de7..37ce2d90e 100644 --- a/web/pages/m/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx +++ b/web/pages/m/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx @@ -69,15 +69,13 @@ const MobileWebViewIssueDetail_ = () => { useEffect(() => { if (!issueDetails) return; + reset({ ...issueDetails, name: issueDetails.name, description: issueDetails.description, description_html: issueDetails.description_html, state: issueDetails.state, - assignees_list: issueDetails.assignees_list ?? issueDetails.assignee_details?.map((user) => user.id), - labels_list: issueDetails.labels_list ?? issueDetails.labels, - labels: issueDetails.labels_list ?? issueDetails.labels, }); }, [issueDetails, reset]); diff --git a/web/store/issue/issue_draft.store.ts b/web/store/issue/issue_draft.store.ts index 815e58278..76faacb7e 100644 --- a/web/store/issue/issue_draft.store.ts +++ b/web/store/issue/issue_draft.store.ts @@ -122,7 +122,6 @@ export class DraftIssuesStore { // immediately update the issue in the store const updatedIssue = { ...this.issues[issueId], ...issueForm }; - if (updatedIssue.assignees_list) updatedIssue.assignees = updatedIssue.assignees_list; try { runInAction(() => { diff --git a/web/types/issues.d.ts b/web/types/issues.d.ts index 164718237..553a12ced 100644 --- a/web/types/issues.d.ts +++ b/web/types/issues.d.ts @@ -80,7 +80,6 @@ export interface IIssue { archived_at: string; assignees: string[]; assignee_details: IUser[]; - assignees_list: string[]; attachment_count: number; attachments: any[]; issue_relations: IssueRelation[]; @@ -105,7 +104,6 @@ export interface IIssue { labels: string[]; label_details: any[]; is_draft: boolean; - labels_list: string[]; links_list: IIssueLink[]; link_count: number; module: string | null; diff --git a/web/types/modules.d.ts b/web/types/modules.d.ts index 709d1d300..6ec86c4f5 100644 --- a/web/types/modules.d.ts +++ b/web/types/modules.d.ts @@ -10,13 +10,7 @@ import type { linkDetails, } from "types"; -export type TModuleStatus = - | "backlog" - | "planned" - | "in-progress" - | "paused" - | "completed" - | "cancelled"; +export type TModuleStatus = "backlog" | "planned" | "in-progress" | "paused" | "completed" | "cancelled"; export interface IModule { backlog_issues: number; @@ -38,7 +32,6 @@ export interface IModule { link_module: linkDetails[]; links_list: ModuleLink[]; members: string[]; - members_list: string[]; members_detail: IUserLite[]; is_favorite: boolean; name: string; @@ -80,8 +73,6 @@ export type ModuleLink = { url: string; }; -export type SelectModuleType = - | (IModule & { actionType: "edit" | "delete" | "create-issue" }) - | undefined; +export type SelectModuleType = (IModule & { actionType: "edit" | "delete" | "create-issue" }) | undefined; export type SelectIssue = (IIssue & { actionType: "edit" | "delete" | "create" }) | undefined; diff --git a/web/types/pages.d.ts b/web/types/pages.d.ts index 6be966f7c..f7850d11d 100644 --- a/web/types/pages.d.ts +++ b/web/types/pages.d.ts @@ -14,7 +14,6 @@ export interface IPage { is_favorite: boolean; label_details: IIssueLabels[]; labels: string[]; - labels_list: string[]; name: string; owned_by: string; project: string; From 8072bbb5591863cb7a66c93f0376c4ae0cc9c4ad Mon Sep 17 00:00:00 2001 From: "M. Palanikannan" <73993394+Palanikannan1437@users.noreply.github.com> Date: Tue, 31 Oct 2023 12:26:10 +0530 Subject: [PATCH 008/157] fix: Debounce title and Editor initialization (#2530) * fixed debounce logic and extracted the same * fixed editor mounting with custom hook * removed console logs and improved structure * fixed comment editor behavior on Shift-Enter * fixed editor initialization behaviour for new peek view * fixed button type to avoid reload while editing comments * fixed initialization of content in peek overview * improved naming variables in updated title debounce logic * added react-hook-form support to the issue detail in peek view with save states * delete image plugin's ts support improved --- .../editor/core/src/ui/hooks/useEditor.tsx | 71 +++++++++------- .../src/ui/hooks/useInitializedContent.tsx | 19 +++++ .../core/src/ui/hooks/useReadOnlyEditor.tsx | 28 +++++-- .../core/src/ui/plugins/delete-image.tsx | 2 +- .../ui/extensions/custom-list-extension.tsx | 9 -- .../src/ui/extensions/enter-key-extension.tsx | 37 ++++---- .../src/ui/extensions/index.tsx | 2 - web/components/issues/comment/add-comment.tsx | 31 +------ .../issues/comment/comment-card.tsx | 3 +- web/components/issues/description-form.tsx | 20 +++-- .../issue-peek-overview/issue-detail.tsx | 84 +++++++++++++++---- 11 files changed, 194 insertions(+), 112 deletions(-) create mode 100644 packages/editor/core/src/ui/hooks/useInitializedContent.tsx delete mode 100644 packages/editor/lite-text-editor/src/ui/extensions/custom-list-extension.tsx diff --git a/packages/editor/core/src/ui/hooks/useEditor.tsx b/packages/editor/core/src/ui/hooks/useEditor.tsx index 837700915..f58c7964b 100644 --- a/packages/editor/core/src/ui/hooks/useEditor.tsx +++ b/packages/editor/core/src/ui/hooks/useEditor.tsx @@ -1,18 +1,23 @@ import { useEditor as useCustomEditor, Editor } from "@tiptap/react"; -import { useImperativeHandle, useRef, MutableRefObject } from "react"; -import { useDebouncedCallback } from "use-debounce"; -import { DeleteImage } from '../../types/delete-image'; +import { + useImperativeHandle, + useRef, + MutableRefObject, + useEffect, +} from "react"; +import { DeleteImage } from "../../types/delete-image"; import { CoreEditorProps } from "../props"; import { CoreEditorExtensions } from "../extensions"; -import { EditorProps } from '@tiptap/pm/view'; +import { EditorProps } from "@tiptap/pm/view"; import { getTrimmedHTML } from "../../lib/utils"; import { UploadImage } from "../../types/upload-image"; - -const DEBOUNCE_DELAY = 1500; +import { useInitializedContent } from "./useInitializedContent"; interface CustomEditorProps { uploadFile: UploadImage; - setIsSubmitting?: (isSubmitting: "submitting" | "submitted" | "saved") => void; + setIsSubmitting?: ( + isSubmitting: "submitting" | "submitted" | "saved", + ) => void; setShouldShowAlert?: (showAlert: boolean) => void; value: string; deleteFile: DeleteImage; @@ -23,25 +28,37 @@ interface CustomEditorProps { forwardedRef?: any; } -export const useEditor = ({ uploadFile, deleteFile, editorProps = {}, value, extensions = [], onChange, setIsSubmitting, debouncedUpdatesEnabled, forwardedRef, setShouldShowAlert, }: CustomEditorProps) => { - const editor = useCustomEditor({ - editorProps: { - ...CoreEditorProps(uploadFile, setIsSubmitting), - ...editorProps, - }, - extensions: [...CoreEditorExtensions(deleteFile), ...extensions], - content: (typeof value === "string" && value.trim() !== "") ? value : "

", - onUpdate: async ({ editor }) => { - // for instant feedback loop - setIsSubmitting?.("submitting"); - setShouldShowAlert?.(true); - if (debouncedUpdatesEnabled) { - debouncedUpdates({ onChange: onChange, editor }); - } else { +export const useEditor = ({ + uploadFile, + deleteFile, + editorProps = {}, + value, + extensions = [], + onChange, + setIsSubmitting, + forwardedRef, + setShouldShowAlert, +}: CustomEditorProps) => { + const editor = useCustomEditor( + { + editorProps: { + ...CoreEditorProps(uploadFile, setIsSubmitting), + ...editorProps, + }, + extensions: [...CoreEditorExtensions(deleteFile), ...extensions], + content: + typeof value === "string" && value.trim() !== "" ? value : "

", + onUpdate: async ({ editor }) => { + // for instant feedback loop + setIsSubmitting?.("submitting"); + setShouldShowAlert?.(true); onChange?.(editor.getJSON(), getTrimmedHTML(editor.getHTML())); - } + }, }, - }); + [], + ); + + useInitializedContent(editor, value); const editorRef: MutableRefObject = useRef(null); editorRef.current = editor; @@ -55,12 +72,6 @@ export const useEditor = ({ uploadFile, deleteFile, editorProps = {}, value, ext }, })); - const debouncedUpdates = useDebouncedCallback(async ({ onChange, editor }) => { - if (onChange) { - onChange(editor.getJSON(), getTrimmedHTML(editor.getHTML())); - } - }, DEBOUNCE_DELAY); - if (!editor) { return null; } diff --git a/packages/editor/core/src/ui/hooks/useInitializedContent.tsx b/packages/editor/core/src/ui/hooks/useInitializedContent.tsx new file mode 100644 index 000000000..8e2ce1717 --- /dev/null +++ b/packages/editor/core/src/ui/hooks/useInitializedContent.tsx @@ -0,0 +1,19 @@ +import { Editor } from "@tiptap/react"; +import { useEffect, useRef } from "react"; + +export const useInitializedContent = (editor: Editor | null, value: string) => { + const hasInitializedContent = useRef(false); + + useEffect(() => { + if (editor) { + const cleanedValue = + typeof value === "string" && value.trim() !== "" ? value : "

"; + if (cleanedValue !== "

" && !hasInitializedContent.current) { + editor.commands.setContent(cleanedValue); + hasInitializedContent.current = true; + } else if (cleanedValue === "

" && hasInitializedContent.current) { + hasInitializedContent.current = false; + } + } + }, [value, editor]); +}; diff --git a/packages/editor/core/src/ui/hooks/useReadOnlyEditor.tsx b/packages/editor/core/src/ui/hooks/useReadOnlyEditor.tsx index 3e32c5044..522cd94b8 100644 --- a/packages/editor/core/src/ui/hooks/useReadOnlyEditor.tsx +++ b/packages/editor/core/src/ui/hooks/useReadOnlyEditor.tsx @@ -1,8 +1,13 @@ import { useEditor as useCustomEditor, Editor } from "@tiptap/react"; -import { useImperativeHandle, useRef, MutableRefObject } from "react"; +import { + useImperativeHandle, + useRef, + MutableRefObject, + useEffect, +} from "react"; import { CoreReadOnlyEditorExtensions } from "../../ui/read-only/extensions"; import { CoreReadOnlyEditorProps } from "../../ui/read-only/props"; -import { EditorProps } from '@tiptap/pm/view'; +import { EditorProps } from "@tiptap/pm/view"; interface CustomReadOnlyEditorProps { value: string; @@ -11,10 +16,16 @@ interface CustomReadOnlyEditorProps { editorProps?: EditorProps; } -export const useReadOnlyEditor = ({ value, forwardedRef, extensions = [], editorProps = {} }: CustomReadOnlyEditorProps) => { +export const useReadOnlyEditor = ({ + value, + forwardedRef, + extensions = [], + editorProps = {}, +}: CustomReadOnlyEditorProps) => { const editor = useCustomEditor({ editable: false, - content: (typeof value === "string" && value.trim() !== "") ? value : "

", + content: + typeof value === "string" && value.trim() !== "" ? value : "

", editorProps: { ...CoreReadOnlyEditorProps, ...editorProps, @@ -22,6 +33,14 @@ export const useReadOnlyEditor = ({ value, forwardedRef, extensions = [], editor extensions: [...CoreReadOnlyEditorExtensions, ...extensions], }); + const hasIntiliazedContent = useRef(false); + useEffect(() => { + if (editor && !value && !hasIntiliazedContent.current) { + editor.commands.setContent(value); + hasIntiliazedContent.current = true; + } + }, [value]); + const editorRef: MutableRefObject = useRef(null); editorRef.current = editor; @@ -34,7 +53,6 @@ export const useReadOnlyEditor = ({ value, forwardedRef, extensions = [], editor }, })); - if (!editor) { return null; } diff --git a/packages/editor/core/src/ui/plugins/delete-image.tsx b/packages/editor/core/src/ui/plugins/delete-image.tsx index ba21d686d..56284472b 100644 --- a/packages/editor/core/src/ui/plugins/delete-image.tsx +++ b/packages/editor/core/src/ui/plugins/delete-image.tsx @@ -16,7 +16,7 @@ const TrackImageDeletionPlugin = (deleteImage: DeleteImage): Plugin => new Plugin({ key: deleteKey, appendTransaction: (transactions: readonly Transaction[], oldState: EditorState, newState: EditorState) => { - const newImageSources = new Set(); + const newImageSources = new Set(); newState.doc.descendants((node) => { if (node.type.name === IMAGE_NODE_TYPE) { newImageSources.add(node.attrs.src); diff --git a/packages/editor/lite-text-editor/src/ui/extensions/custom-list-extension.tsx b/packages/editor/lite-text-editor/src/ui/extensions/custom-list-extension.tsx deleted file mode 100644 index f0bc70cff..000000000 --- a/packages/editor/lite-text-editor/src/ui/extensions/custom-list-extension.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import ListItem from '@tiptap/extension-list-item' - -export const CustomListItem = ListItem.extend({ - addKeyboardShortcuts() { - return { - 'Shift-Enter': () => this.editor.chain().focus().splitListItem('listItem').run(), - } - }, -}) diff --git a/packages/editor/lite-text-editor/src/ui/extensions/enter-key-extension.tsx b/packages/editor/lite-text-editor/src/ui/extensions/enter-key-extension.tsx index 04c4a1fbe..129efa4ee 100644 --- a/packages/editor/lite-text-editor/src/ui/extensions/enter-key-extension.tsx +++ b/packages/editor/lite-text-editor/src/ui/extensions/enter-key-extension.tsx @@ -1,16 +1,25 @@ -import { Extension } from '@tiptap/core'; +import { Extension } from "@tiptap/core"; -export const EnterKeyExtension = (onEnterKeyPress?: () => void) => Extension.create({ - name: 'enterKey', +export const EnterKeyExtension = (onEnterKeyPress?: () => void) => + Extension.create({ + name: "enterKey", - addKeyboardShortcuts() { - return { - 'Enter': () => { - if (onEnterKeyPress) { - onEnterKeyPress(); - } - return true; - }, - } - }, -}); + addKeyboardShortcuts() { + return { + Enter: () => { + if (onEnterKeyPress) { + onEnterKeyPress(); + } + return true; + }, + "Shift-Enter": ({ editor }) => + editor.commands.first(({ commands }) => [ + () => commands.newlineInCode(), + () => commands.splitListItem("listItem"), + () => commands.createParagraphNear(), + () => commands.liftEmptyBlock(), + () => commands.splitBlock(), + ]), + }; + }, + }); diff --git a/packages/editor/lite-text-editor/src/ui/extensions/index.tsx b/packages/editor/lite-text-editor/src/ui/extensions/index.tsx index ccd04a395..358f15294 100644 --- a/packages/editor/lite-text-editor/src/ui/extensions/index.tsx +++ b/packages/editor/lite-text-editor/src/ui/extensions/index.tsx @@ -1,7 +1,5 @@ -import { CustomListItem } from "./custom-list-extension"; import { EnterKeyExtension } from "./enter-key-extension"; export const LiteTextEditorExtensions = (onEnterKeyPress?: () => void) => [ - CustomListItem, EnterKeyExtension(onEnterKeyPress), ]; diff --git a/web/components/issues/comment/add-comment.tsx b/web/components/issues/comment/add-comment.tsx index f836efb01..7baca7d61 100644 --- a/web/components/issues/comment/add-comment.tsx +++ b/web/components/issues/comment/add-comment.tsx @@ -7,7 +7,7 @@ import { FileService } from "services/file.service"; // components import { LiteTextEditorWithRef } from "@plane/lite-text-editor"; // ui -import { Button, Tooltip } from "@plane/ui"; +import { Button } from "@plane/ui"; import { Globe2, Lock } from "lucide-react"; // types @@ -72,35 +72,6 @@ export const AddComment: React.FC = ({ disabled = false, onSubmit, showAc
- {showAccessSpecifier && ( -
- ( -
- {commentAccess.map((access) => ( - - - - ))} -
- )} - /> -
- )} = ({