From 5ee6be2a98bb760c4d5478b7a710467f53484e2d Mon Sep 17 00:00:00 2001 From: gakshita Date: Wed, 5 Mar 2025 17:49:16 +0530 Subject: [PATCH 1/4] fix: issue stats refactor --- .../i18n/src/locales/en/translations.json | 3 +- .../i18n/src/locales/es/translations.json | 3 +- .../i18n/src/locales/fr/translations.json | 3 +- .../i18n/src/locales/it/translations.json | 5 +- .../i18n/src/locales/ja/translations.json | 5 +- .../i18n/src/locales/ru/translations.json | 3 +- .../i18n/src/locales/zh-CN/translations.json | 3 +- .../issues/issue-layouts/issue-stats.tsx | 9 +-- .../display-filters/display-properties.tsx | 2 +- .../issues/issue-layouts/gantt/blocks.tsx | 18 ++++-- .../issues/issue-layouts/kanban/block.tsx | 15 +++++ .../issues/issue-layouts/list/block.tsx | 11 +++- .../properties/all-properties.tsx | 58 ++++++++++--------- .../spreadsheet/columns/sub-issue-column.tsx | 13 +++-- 14 files changed, 98 insertions(+), 53 deletions(-) diff --git a/packages/i18n/src/locales/en/translations.json b/packages/i18n/src/locales/en/translations.json index f61278c608a..06daad2383b 100644 --- a/packages/i18n/src/locales/en/translations.json +++ b/packages/i18n/src/locales/en/translations.json @@ -814,7 +814,8 @@ "sub_issue_count": "Sub-work item count", "attachment_count": "Attachment count", "created_on": "Created on", - "sub_issue": "Sub-work item" + "sub_issue": "Sub-work item", + "issue_count": "Work item count" }, "extra": { "show_sub_issues": "Show sub-work items", diff --git a/packages/i18n/src/locales/es/translations.json b/packages/i18n/src/locales/es/translations.json index 12ba162f282..df46a0c85ea 100644 --- a/packages/i18n/src/locales/es/translations.json +++ b/packages/i18n/src/locales/es/translations.json @@ -985,7 +985,8 @@ "sub_issue_count": "Cantidad de sub-elementos", "attachment_count": "Cantidad de archivos adjuntos", "created_on": "Creado el", - "sub_issue": "Sub-elemento de trabajo" + "sub_issue": "Sub-elemento de trabajo", + "issue_count": "Recuento de elementos de trabajo" }, "extra": { "show_sub_issues": "Mostrar sub-elementos", diff --git a/packages/i18n/src/locales/fr/translations.json b/packages/i18n/src/locales/fr/translations.json index 855265f489a..f513a64fd1f 100644 --- a/packages/i18n/src/locales/fr/translations.json +++ b/packages/i18n/src/locales/fr/translations.json @@ -983,7 +983,8 @@ "sub_issue_count": "Nombre de sous-éléments", "attachment_count": "Nombre de pièces jointes", "created_on": "Créé le", - "sub_issue": "Sous-élément de travail" + "sub_issue": "Sous-élément de travail", + "issue_count": "Nombre d'éléments de travail" }, "extra": { "show_sub_issues": "Afficher les sous-éléments", diff --git a/packages/i18n/src/locales/it/translations.json b/packages/i18n/src/locales/it/translations.json index 2bd43107f8f..f717df30e8a 100644 --- a/packages/i18n/src/locales/it/translations.json +++ b/packages/i18n/src/locales/it/translations.json @@ -980,8 +980,9 @@ "sub_issue_count": "Numero di sotto-elementi di lavoro", "attachment_count": "Numero di allegati", "created_on": "Creato il", - "sub_issue": "Sotto-elemento di lavoro" - }, + "sub_issue": "Sotto-elemento di lavoro", + "issue_count": "Conteggio degli elementi di lavoro" + }, "extra": { "show_sub_issues": "Mostra sotto-elementi di lavoro", "show_empty_groups": "Mostra gruppi vuoti" diff --git a/packages/i18n/src/locales/ja/translations.json b/packages/i18n/src/locales/ja/translations.json index bbc6ff759d7..56555085e02 100644 --- a/packages/i18n/src/locales/ja/translations.json +++ b/packages/i18n/src/locales/ja/translations.json @@ -983,8 +983,9 @@ "sub_issue_count": "サブ作業項目数", "attachment_count": "添付ファイル数", "created_on": "作成日", - "sub_issue": "サブ作業項目" - }, + "sub_issue": "サブ作業項目", + "issue_count": "作業項目数" + }, "extra": { "show_sub_issues": "サブ作業項目を表示", "show_empty_groups": "空のグループを表示" diff --git a/packages/i18n/src/locales/ru/translations.json b/packages/i18n/src/locales/ru/translations.json index 21c8a6e7897..a67cdc80a64 100644 --- a/packages/i18n/src/locales/ru/translations.json +++ b/packages/i18n/src/locales/ru/translations.json @@ -982,7 +982,8 @@ "sub_issue_count": "Количество подэлементов", "attachment_count": "Количество вложений", "created_on": "Дата создания", - "sub_issue": "Подэлемент" + "sub_issue": "Подэлемент", + "issue_count": "Количество рабочих элементов" }, "extra": { "show_sub_issues": "Показывать подэлементы", diff --git a/packages/i18n/src/locales/zh-CN/translations.json b/packages/i18n/src/locales/zh-CN/translations.json index 14cf738f0b4..9a3aff293e1 100644 --- a/packages/i18n/src/locales/zh-CN/translations.json +++ b/packages/i18n/src/locales/zh-CN/translations.json @@ -983,7 +983,8 @@ "sub_issue_count": "子工作项数量", "attachment_count": "附件数量", "created_on": "创建于", - "sub_issue": "子工作项" + "sub_issue": "子工作项", + "issue_count": "工作项数量" }, "extra": { "show_sub_issues": "显示子工作项", diff --git a/web/ce/components/issues/issue-layouts/issue-stats.tsx b/web/ce/components/issues/issue-layouts/issue-stats.tsx index 3e842c92d56..13542280db1 100644 --- a/web/ce/components/issues/issue-layouts/issue-stats.tsx +++ b/web/ce/components/issues/issue-layouts/issue-stats.tsx @@ -4,9 +4,10 @@ import React, { FC } from "react"; type Props = { issueId: string; + className?: string; + size?: number; + showProgressText?: boolean; + showLabel?: boolean; }; -export const IssueStats: FC = (props) => { - const { issueId } = props; - return <>; -}; +export const IssueStats: FC = (props) => <>; diff --git a/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx b/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx index 9d8bd8aa12f..a9fd0191790 100644 --- a/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx +++ b/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx @@ -53,7 +53,7 @@ export const FilterDisplayProperties: React.FC = observer((props) => { } }).map((property) => { if (isEpic && property.key === "sub_issue_count") { - return { ...property, title: "Work item count" }; + return { ...property, titleTranslationKey: "issue.display.properties.issue_count" }; } return property; }); diff --git a/web/core/components/issues/issue-layouts/gantt/blocks.tsx b/web/core/components/issues/issue-layouts/gantt/blocks.tsx index f74e42232b1..09f79bc1472 100644 --- a/web/core/components/issues/issue-layouts/gantt/blocks.tsx +++ b/web/core/components/issues/issue-layouts/gantt/blocks.tsx @@ -5,9 +5,9 @@ import { useParams } from "next/navigation"; // ui import { Tooltip, ControlLink } from "@plane/ui"; // components +import { findTotalDaysInRange } from "@plane/utils"; import { SIDEBAR_WIDTH } from "@/components/gantt-chart/constants"; // helpers -import { renderFormattedDate } from "@/helpers/date-time.helper"; import { generateWorkItemLink } from "@/helpers/issue.helper"; // hooks import { useIssueDetail, useIssues, useProject, useProjectState } from "@/hooks/store"; @@ -17,6 +17,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os"; // plane web components import { IssueIdentifier } from "@/plane-web/components/issues"; // +import { IssueStats } from "@/plane-web/components/issues/issue-layouts/issue-stats"; import { getBlockViewDetails } from "../utils"; import { GanttStoreType } from "./base-gantt-root"; @@ -48,6 +49,8 @@ export const IssueGanttBlock: React.FC = observer((props) => { const handleIssuePeekOverview = () => handleRedirection(workspaceSlug, issueDetails, isMobile); + const duration = findTotalDaysInRange(issueDetails?.start_date, issueDetails?.target_date) || 0; + return ( = observer((props) => { >
-
+
{issueDetails?.name}
+ {isEpic && ( + = 2} + /> + )}
); diff --git a/web/core/components/issues/issue-layouts/kanban/block.tsx b/web/core/components/issues/issue-layouts/kanban/block.tsx index 5e2495d85d3..039a616bb8a 100644 --- a/web/core/components/issues/issue-layouts/kanban/block.tsx +++ b/web/core/components/issues/issue-layouts/kanban/block.tsx @@ -25,8 +25,10 @@ import { usePlatformOS } from "@/hooks/use-platform-os"; // plane web components import { IssueIdentifier } from "@/plane-web/components/issues"; // local components +import { IssueStats } from "@/plane-web/components/issues/issue-layouts/issue-stats"; import { TRenderQuickActions } from "../list/list-view-types"; import { IssueProperties } from "../properties/all-properties"; +import { WithDisplayPropertiesHOC } from "../properties/with-display-properties-HOC"; import { getIssueBlockId } from "../utils"; interface IssueBlockProps { @@ -61,6 +63,9 @@ const KanbanIssueDetailsBlock: React.FC = observer((prop // hooks const { isMobile } = usePlatformOS(); + // derived values + const subIssueCount = issue?.sub_issues_count ?? 0; + const handleEventPropagation = (e: React.MouseEvent) => { e.stopPropagation(); e.preventDefault(); @@ -105,6 +110,16 @@ const KanbanIssueDetailsBlock: React.FC = observer((prop isReadOnly={isReadOnly} isEpic={isEpic} /> + + {isEpic && displayProperties && ( + !!properties.sub_issue_count && !!subIssueCount} + > + + + )} ); }); diff --git a/web/core/components/issues/issue-layouts/list/block.tsx b/web/core/components/issues/issue-layouts/list/block.tsx index 65126b5a38f..0893fb492cf 100644 --- a/web/core/components/issues/issue-layouts/list/block.tsx +++ b/web/core/components/issues/issue-layouts/list/block.tsx @@ -25,6 +25,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os"; import { IssueIdentifier } from "@/plane-web/components/issues"; import { IssueStats } from "@/plane-web/components/issues/issue-layouts/issue-stats"; // types +import { WithDisplayPropertiesHOC } from "../properties/with-display-properties-HOC"; import { TRenderQuickActions } from "./list-view-types"; interface IssueBlockProps { @@ -269,7 +270,15 @@ export const IssueBlock = observer((props: IssueBlockProps) => { >

{issue.name}

- {isEpic && } + {isEpic && displayProperties && ( + !!properties.sub_issue_count} + > + + + )}
{!issue?.tempId && (
= observer((props) => { {/* extra render properties */} {/* sub-issues */} - !!properties.sub_issue_count && !!subIssueCount} - > - !!properties.sub_issue_count && !!subIssueCount} > -
{ - e.stopPropagation(); - e.preventDefault(); - if (subIssueCount) redirectToIssueDetail(); - }} - className={cn( - "flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1", - { - "hover:bg-custom-background-80 cursor-pointer": subIssueCount, - } - )} + - -
{subIssueCount}
-
-
-
+
{ + e.stopPropagation(); + e.preventDefault(); + if (subIssueCount) redirectToIssueDetail(); + }} + className={cn( + "flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1", + { + "hover:bg-custom-background-80 cursor-pointer": subIssueCount, + } + )} + > + +
{subIssueCount}
+
+ + + )} {/* attachments */} = observer((props: Props // router const router = useAppRouter(); // hooks - const { workspaceSlug, epicId } = useParams(); + const { workspaceSlug } = useParams(); // derived values + const isEpic = issue?.is_epic; const subIssueCount = issue?.sub_issues_count ?? 0; const redirectToIssueDetail = () => { router.push( - `/${workspaceSlug?.toString()}/projects/${issue.project_id}/${issue.archived_at ? "archives/" : ""}${epicId ? "epics" : "issues"}/${issue.id}#sub-issues` + `/${workspaceSlug?.toString()}/projects/${issue.project_id}/${issue.archived_at ? "archives/" : ""}${isEpic ? "epics" : "issues"}/${issue.id}#sub-issues` ); }; - const issueLabel = epicId ? "work item" : "sub-work item"; - const label = `${subIssueCount} ${issueLabel}${subIssueCount !== 1 ? "s" : ""}`; + const label = `${subIssueCount} sub-work item${subIssueCount !== 1 ? "s" : ""}`; return ( {}} className={cn( - "flex h-11 w-full items-center border-b-[0.5px] border-custom-border-200 py-1 text-xs hover:bg-custom-background-80 group-[.selected-issue-row]:bg-custom-primary-100/5 group-[.selected-issue-row]:hover:bg-custom-primary-100/10", + "flex h-11 w-full items-center border-b-[0.5px] border-custom-border-200 py-1 text-xs hover:bg-custom-background-90 group-[.selected-issue-row]:bg-custom-primary-100/5 group-[.selected-issue-row]:hover:bg-custom-primary-90", { "cursor-pointer": subIssueCount, } )} > - {label} + {isEpic ? : label} ); }); From b9bd1def23ebd19495e8935eda9e4c4f97145f9e Mon Sep 17 00:00:00 2001 From: gakshita Date: Wed, 5 Mar 2025 17:57:31 +0530 Subject: [PATCH 2/4] fix: refactor --- .../issue-layouts/spreadsheet/columns/sub-issue-column.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx b/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx index ff31cb35e92..54f3d858650 100644 --- a/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx +++ b/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx @@ -42,7 +42,7 @@ export const SpreadsheetSubIssueColumn: React.FC = observer((props: Props } )} > - {isEpic ? : label} + {isEpic ? : label} ); }); From d7600f413e467f6128ba78059fb7d7ecf7fde964 Mon Sep 17 00:00:00 2001 From: gakshita Date: Wed, 5 Mar 2025 18:03:15 +0530 Subject: [PATCH 3/4] fix: ui color --- web/core/components/issues/issue-layouts/gantt/blocks.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/core/components/issues/issue-layouts/gantt/blocks.tsx b/web/core/components/issues/issue-layouts/gantt/blocks.tsx index 09f79bc1472..0281e8b4984 100644 --- a/web/core/components/issues/issue-layouts/gantt/blocks.tsx +++ b/web/core/components/issues/issue-layouts/gantt/blocks.tsx @@ -65,7 +65,7 @@ export const IssueGanttBlock: React.FC = observer((props) => { >
From 0d4bca6cae8790aca182ed31456cd33f33234344 Mon Sep 17 00:00:00 2001 From: gakshita Date: Wed, 5 Mar 2025 18:31:20 +0530 Subject: [PATCH 4/4] fix: translation key --- packages/i18n/src/locales/en/translations.json | 2 +- packages/i18n/src/locales/es/translations.json | 2 +- packages/i18n/src/locales/fr/translations.json | 2 +- packages/i18n/src/locales/it/translations.json | 2 +- packages/i18n/src/locales/ja/translations.json | 2 +- packages/i18n/src/locales/ru/translations.json | 2 +- packages/i18n/src/locales/zh-CN/translations.json | 2 +- .../filters/header/display-filters/display-properties.tsx | 2 +- 8 files changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/i18n/src/locales/en/translations.json b/packages/i18n/src/locales/en/translations.json index 06daad2383b..b91a7293249 100644 --- a/packages/i18n/src/locales/en/translations.json +++ b/packages/i18n/src/locales/en/translations.json @@ -815,7 +815,7 @@ "attachment_count": "Attachment count", "created_on": "Created on", "sub_issue": "Sub-work item", - "issue_count": "Work item count" + "work_item_count": "Work item count" }, "extra": { "show_sub_issues": "Show sub-work items", diff --git a/packages/i18n/src/locales/es/translations.json b/packages/i18n/src/locales/es/translations.json index df46a0c85ea..9d14398c5d9 100644 --- a/packages/i18n/src/locales/es/translations.json +++ b/packages/i18n/src/locales/es/translations.json @@ -986,7 +986,7 @@ "attachment_count": "Cantidad de archivos adjuntos", "created_on": "Creado el", "sub_issue": "Sub-elemento de trabajo", - "issue_count": "Recuento de elementos de trabajo" + "work_item_count": "Recuento de elementos de trabajo" }, "extra": { "show_sub_issues": "Mostrar sub-elementos", diff --git a/packages/i18n/src/locales/fr/translations.json b/packages/i18n/src/locales/fr/translations.json index f513a64fd1f..54765d8ba8d 100644 --- a/packages/i18n/src/locales/fr/translations.json +++ b/packages/i18n/src/locales/fr/translations.json @@ -984,7 +984,7 @@ "attachment_count": "Nombre de pièces jointes", "created_on": "Créé le", "sub_issue": "Sous-élément de travail", - "issue_count": "Nombre d'éléments de travail" + "work_item_count": "Nombre d'éléments de travail" }, "extra": { "show_sub_issues": "Afficher les sous-éléments", diff --git a/packages/i18n/src/locales/it/translations.json b/packages/i18n/src/locales/it/translations.json index f717df30e8a..35ce1af8dbb 100644 --- a/packages/i18n/src/locales/it/translations.json +++ b/packages/i18n/src/locales/it/translations.json @@ -981,7 +981,7 @@ "attachment_count": "Numero di allegati", "created_on": "Creato il", "sub_issue": "Sotto-elemento di lavoro", - "issue_count": "Conteggio degli elementi di lavoro" + "work_item_count": "Conteggio degli elementi di lavoro" }, "extra": { "show_sub_issues": "Mostra sotto-elementi di lavoro", diff --git a/packages/i18n/src/locales/ja/translations.json b/packages/i18n/src/locales/ja/translations.json index 56555085e02..f30878a5e6e 100644 --- a/packages/i18n/src/locales/ja/translations.json +++ b/packages/i18n/src/locales/ja/translations.json @@ -984,7 +984,7 @@ "attachment_count": "添付ファイル数", "created_on": "作成日", "sub_issue": "サブ作業項目", - "issue_count": "作業項目数" + "work_item_count": "作業項目数" }, "extra": { "show_sub_issues": "サブ作業項目を表示", diff --git a/packages/i18n/src/locales/ru/translations.json b/packages/i18n/src/locales/ru/translations.json index a67cdc80a64..f5ac9f0ee67 100644 --- a/packages/i18n/src/locales/ru/translations.json +++ b/packages/i18n/src/locales/ru/translations.json @@ -983,7 +983,7 @@ "attachment_count": "Количество вложений", "created_on": "Дата создания", "sub_issue": "Подэлемент", - "issue_count": "Количество рабочих элементов" + "work_item_count": "Количество рабочих элементов" }, "extra": { "show_sub_issues": "Показывать подэлементы", diff --git a/packages/i18n/src/locales/zh-CN/translations.json b/packages/i18n/src/locales/zh-CN/translations.json index 9a3aff293e1..4d21ac3b91a 100644 --- a/packages/i18n/src/locales/zh-CN/translations.json +++ b/packages/i18n/src/locales/zh-CN/translations.json @@ -984,7 +984,7 @@ "attachment_count": "附件数量", "created_on": "创建于", "sub_issue": "子工作项", - "issue_count": "工作项数量" + "work_item_count": "工作项数量" }, "extra": { "show_sub_issues": "显示子工作项", diff --git a/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx b/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx index a9fd0191790..023a5c34b19 100644 --- a/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx +++ b/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx @@ -53,7 +53,7 @@ export const FilterDisplayProperties: React.FC = observer((props) => { } }).map((property) => { if (isEpic && property.key === "sub_issue_count") { - return { ...property, titleTranslationKey: "issue.display.properties.issue_count" }; + return { ...property, titleTranslationKey: "issue.display.properties.work_item_count" }; } return property; });