From daa3094911616eb34b89786dff6d540bdac8f71b Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Thu, 21 Sep 2023 17:50:43 +0530 Subject: [PATCH] chore: update issue detail store to handle peek overview (#2237) * chore: dynamic position dropdown (#2138) * chore: dynamic position state dropdown for issue view * style: state select dropdown styling * fix: state icon attribute names * chore: state select dynamic dropdown * chore: member select dynamic dropdown * chore: label select dynamic dropdown * chore: priority select dynamic dropdown * chore: label select dropdown improvement * refactor: state dropdown location * chore: dropdown improvement and code refactor * chore: dynamic dropdown hook type added --------- Co-authored-by: Aaryan Khandelwal * fix: fields not getting selected in the create issue form (#2212) * fix: hydration error and draft issue workflow * fix: build error * fix: properties getting de-selected after create, module & cycle not getting auto-select on the form * fix: display layout, props being updated directly * chore: sub issues count in individual issue (#2221) * Implemented nested issues in the sub issues section in issue detail page (#2233) * feat: subissues infinte level * feat: updated UI for sub issues * feat: subissues new ui and nested sub issues in issue detail * chore: removed repeated code * refactor: product updates modal layout (#2225) * fix: handle no issues in custom analytics (#2226) * fix: activity label color (#2227) * fix: profile issues layout switch (#2228) * chore: update service imports * chore: update issue detail store to handle peek overview --------- Co-authored-by: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Co-authored-by: Dakshesh Jain <65905942+dakshesh14@users.noreply.github.com> Co-authored-by: Bavisetti Narayan <72156168+NarayanBavisetti@users.noreply.github.com> Co-authored-by: guru_sainath --- .../custom-analytics/graph/index.tsx | 1 - web/components/core/activity.tsx | 86 +++--- .../core/views/board-view/all-boards.tsx | 2 +- web/components/issues/delete-issue-modal.tsx | 12 +- web/components/issues/draft-issue-modal.tsx | 6 +- web/components/issues/index.ts | 1 - web/components/issues/main-content.tsx | 4 +- .../issues/peek-overview/layout.tsx | 6 +- web/components/issues/sub-issues/index.ts | 1 + web/components/issues/sub-issues/issue.tsx | 171 +++++++++++ .../issues/sub-issues/issues-list.tsx | 80 ++++++ .../issues/sub-issues/progressbar.tsx | 25 ++ .../issues/sub-issues/properties.tsx | 193 +++++++++++++ web/components/issues/sub-issues/root.tsx | 269 ++++++++++++++++++ .../profile/profile-issues-view.tsx | 1 - web/components/project/members-select.tsx | 14 +- web/components/ui/product-updates-modal.tsx | 110 +++---- web/contexts/profile-issues-context.tsx | 7 +- web/helpers/array.helper.ts | 7 +- web/store/issue.ts | 64 ++++- web/store/issue_detail.ts | 177 +++++++----- 21 files changed, 1039 insertions(+), 198 deletions(-) create mode 100644 web/components/issues/sub-issues/index.ts create mode 100644 web/components/issues/sub-issues/issue.tsx create mode 100644 web/components/issues/sub-issues/issues-list.tsx create mode 100644 web/components/issues/sub-issues/progressbar.tsx create mode 100644 web/components/issues/sub-issues/properties.tsx create mode 100644 web/components/issues/sub-issues/root.tsx diff --git a/web/components/analytics/custom-analytics/graph/index.tsx b/web/components/analytics/custom-analytics/graph/index.tsx index 349f9884d..733d17437 100644 --- a/web/components/analytics/custom-analytics/graph/index.tsx +++ b/web/components/analytics/custom-analytics/graph/index.tsx @@ -9,7 +9,6 @@ import { findStringWithMostCharacters } from "helpers/array.helper"; import { generateBarColor } from "helpers/analytics.helper"; // types import { IAnalyticsParams, IAnalyticsResponse } from "types"; -// constants type Props = { analytics: IAnalyticsResponse; diff --git a/web/components/core/activity.tsx b/web/components/core/activity.tsx index 7c2798e7a..3a011d49f 100644 --- a/web/components/core/activity.tsx +++ b/web/components/core/activity.tsx @@ -1,5 +1,9 @@ import { useRouter } from "next/router"; +import useSWR from "swr"; + +// services +import issuesService from "services/issue.service"; // icons import { Icon, Tooltip } from "components/ui"; import { CopyPlus } from "lucide-react"; @@ -10,26 +14,22 @@ import { renderShortDateWithYearFormat } from "helpers/date-time.helper"; import { capitalizeFirstLetter } from "helpers/string.helper"; // types import { IIssueActivity } from "types"; +// fetch-keys +import { WORKSPACE_LABELS } from "constants/fetch-keys"; const IssueLink = ({ activity }: { activity: IIssueActivity }) => { const router = useRouter(); const { workspaceSlug } = router.query; return ( - + - {activity.issue_detail - ? `${activity.project_detail.identifier}-${activity.issue_detail.sequence_id}` - : "Issue"} + {activity.issue_detail ? `${activity.project_detail.identifier}-${activity.issue_detail.sequence_id}` : "Issue"} @@ -52,13 +52,29 @@ const UserLink = ({ activity }: { activity: IIssueActivity }) => { ); }; +const LabelPill = ({ labelId }: { labelId: string }) => { + const router = useRouter(); + const { workspaceSlug } = router.query; + + const { data: labels } = useSWR( + workspaceSlug ? WORKSPACE_LABELS(workspaceSlug.toString()) : null, + workspaceSlug ? () => issuesService.getWorkspaceLabels(workspaceSlug.toString()) : null + ); + + return ( + l.id === labelId)?.color ?? "#000000", + }} + aria-hidden="true" + /> + ); +}; + const activityDetails: { [key: string]: { - message: ( - activity: IIssueActivity, - showIssue: boolean, - workspaceSlug: string - ) => React.ReactNode; + message: (activity: IIssueActivity, showIssue: boolean, workspaceSlug: string) => React.ReactNode; icon: React.ReactNode; }; } = { @@ -151,8 +167,7 @@ const activityDetails: { else return ( <> - removed the blocking issue{" "} - {activity.old_value}. + removed the blocking issue {activity.old_value}. ); }, @@ -208,8 +223,7 @@ const activityDetails: { else return ( <> - removed the relation from{" "} - {activity.old_value}. + removed the relation from {activity.old_value}. ); }, @@ -298,8 +312,7 @@ const activityDetails: { else return ( <> - set the estimate point to{" "} - {activity.new_value} + set the estimate point to {activity.new_value} {showIssue && ( <> {" "} @@ -325,14 +338,8 @@ const activityDetails: { return ( <> added a new label{" "} - -