From e01e736ffe5272d82b7a72544c2eda338168d33b Mon Sep 17 00:00:00 2001 From: rahulramesha <71900764+rahulramesha@users.noreply.github.com> Date: Mon, 17 Jun 2024 16:53:33 +0530 Subject: [PATCH] fix bulk issues selection checkboxes in list view (#4842) --- .../multiple-select/entity-select-action.tsx | 6 ++++-- .../issues/issue-layouts/list/default.tsx | 6 +++--- .../components/issues/issue-layouts/utils.tsx | 21 ++++++++++++++++++- 3 files changed, 27 insertions(+), 6 deletions(-) diff --git a/web/core/components/core/multiple-select/entity-select-action.tsx b/web/core/components/core/multiple-select/entity-select-action.tsx index 3ba228099e..cbec2a34e2 100644 --- a/web/core/components/core/multiple-select/entity-select-action.tsx +++ b/web/core/components/core/multiple-select/entity-select-action.tsx @@ -1,4 +1,6 @@ "use client"; + +import { observer } from "mobx-react"; // ui import { Checkbox } from "@plane/ui"; // helpers @@ -14,7 +16,7 @@ type Props = { selectionHelpers: TSelectionHelper; }; -export const MultipleSelectEntityAction: React.FC = (props) => { +export const MultipleSelectEntityAction: React.FC = observer((props) => { const { className, disabled = false, groupId, id, selectionHelpers } = props; // derived values const isSelected = selectionHelpers.getIsEntitySelected(id); @@ -36,4 +38,4 @@ export const MultipleSelectEntityAction: React.FC = (props) => { readOnly /> ); -}; +}); diff --git a/web/core/components/issues/issue-layouts/list/default.tsx b/web/core/components/issues/issue-layouts/list/default.tsx index ce22321612..dafb00ed23 100644 --- a/web/core/components/issues/issue-layouts/list/default.tsx +++ b/web/core/components/issues/issue-layouts/list/default.tsx @@ -25,7 +25,7 @@ import { IssueBulkOperationsRoot } from "@/plane-web/components/issues"; // plane web constants import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue"; // utils -import { getGroupByColumns, isWorkspaceLevel, GroupDropLocation } from "../utils"; +import { getGroupByColumns, isWorkspaceLevel, GroupDropLocation, isSubGrouped } from "../utils"; import { ListGroup } from "./list-group"; import { TRenderQuickActions } from "./list-view-types"; @@ -119,8 +119,8 @@ export const List: React.FC = observer((props) => { let entities: Record = {}; if (is_list) { - entities = Object.assign(orderedGroups, { [groupIds[0]]: groupedIssueIds[ALL_ISSUES] }); - } else if(Array.isArray(groupedIssueIds[groupIds[0]])){ + entities = Object.assign(orderedGroups, { [groupIds[0]]: groupedIssueIds[ALL_ISSUES] ?? [] }); + } else if (!isSubGrouped(groupedIssueIds)) { entities = Object.assign(orderedGroups, { ...groupedIssueIds }); } else { entities = orderedGroups; diff --git a/web/core/components/issues/issue-layouts/utils.tsx b/web/core/components/issues/issue-layouts/utils.tsx index e655d76788..6314d5beb6 100644 --- a/web/core/components/issues/issue-layouts/utils.tsx +++ b/web/core/components/issues/issue-layouts/utils.tsx @@ -20,6 +20,7 @@ import { IIssueFilterOptions, IIssueFilters, IProjectView, + TGroupedIssues, } from "@plane/types"; // ui import { Avatar, CycleGroupIcon, DiceIcon, PriorityIcon, StateGroupIcon } from "@plane/ui"; @@ -297,7 +298,8 @@ export const getDisplayPropertiesCount = ( } return count; -} +}; + /** * This Method finds the DOM element with elementId, scrolls to it and highlights the issue block * @param elementId @@ -573,3 +575,20 @@ export const getAreFiltersEqual = ( isEqual(appliedFilters ?? {}, viewDetails?.filters ?? {}) && isEqual(issueFilters?.displayFilters ?? {}, viewDetails?.display_filters ?? {}) && isEqual(issueFilters?.displayProperties ?? {}, viewDetails?.display_properties ?? {}); + +/** + * This Method returns if the the grouped values are subGrouped + * @param groupedIssueIds + * @returns + */ +export const isSubGrouped = (groupedIssueIds: TGroupedIssues) => { + if (!groupedIssueIds || Array.isArray(groupedIssueIds)) { + return false; + } + + if (Array.isArray(groupedIssueIds[Object.keys(groupedIssueIds)[0]])) { + return false; + } + + return true; +}; \ No newline at end of file