fix: group selection

web/components/issues/issue-layouts/list/default.tsx

@@ -118,12 +118,19 @@ const GroupByList: React.FC<IGroupByList> = observer((props) => {
 
   const is_list = group_by === null ? true : false;
 
+  // create groupIds array and entities object for bulk ops
   const groupIds = groups.map((g) => g.id);
   const orderedGroups: Record<string, string[]> = {};
   groupIds.forEach((gID) => {
     orderedGroups[gID] = [];
   });
-  const entities = Object.assign(orderedGroups, { ...issueIds });
+  let entities: Record<string, string[]> = {};
+
+  if (is_list) {
+    entities = Object.assign(orderedGroups, { [groupIds[0]]: issueIds });
+  } else {
+    entities = Object.assign(orderedGroups, { ...issueIds });
+  }
 
   return (
     <div

web/hooks/use-multiple-select.ts

@@ -1,5 +1,7 @@
 import { useCallback, useEffect } from "react";
-import { useBulkIssueOperations } from "./store";
+import { useRouter } from "next/router";
+// hooks
+import { useBulkIssueOperations } from "@/hooks/store";
 
 export type TEntityDetails = {
   entityID: string;
@@ -28,7 +30,9 @@ export type TSelectionHelper = {
 
 export const useMultipleSelect = (props: Props) => {
   const { containerRef, entities, groups } = props;
-
+  // router
+  const router = useRouter();
+  // store hooks
   const {
     selectedEntityDetails,
     updateSelectedEntityDetails,
@@ -122,9 +126,24 @@ export const useMultipleSelect = (props: Props) => {
   );
 
   const handleEntitySelection = useCallback(
-    (entityDetails: TEntityDetails, shouldScroll: boolean = true) => {
+    (
+      entityDetails: TEntityDetails,
+      shouldScroll: boolean = true,
+      forceAction: "force-add" | "force-remove" | null = null
+    ) => {
       const isSelected = isEntitySelected(entityDetails.entityID);
 
+      if (forceAction) {
+        if (forceAction === "force-add") {
+          updateSelectedEntityDetails(entityDetails, "add");
+          handleActiveEntityChange(entityDetails, shouldScroll);
+        }
+        if (forceAction === "force-remove") {
+          updateSelectedEntityDetails(entityDetails, "remove");
+        }
+        return;
+      }
+
       if (isSelected) {
         updateSelectedEntityDetails(entityDetails, "remove");
       } else {
@@ -179,20 +198,6 @@ export const useMultipleSelect = (props: Props) => {
     [entities, handleEntitySelection, lastSelectedEntityDetails]
   );
 
-  /**
-   * @description toggle group selection
-   * @param {string} groupID
-   */
-  const handleGroupClick = useCallback(
-    (groupID: string) => {
-      const groupEntities = entities.filter((entity) => entity.groupID === groupID);
-      groupEntities.forEach((entity) => {
-        handleEntitySelection(entity, false);
-      });
-    },
-    [entities, handleEntitySelection]
-  );
-
   /**
    * @description check if any entity of the group is selected
    * @param {string} groupID
@@ -209,6 +214,21 @@ export const useMultipleSelect = (props: Props) => {
     [entities, isEntitySelected]
   );
 
+  /**
+   * @description toggle group selection
+   * @param {string} groupID
+   */
+  const handleGroupClick = useCallback(
+    (groupID: string) => {
+      const groupEntities = entities.filter((entity) => entity.groupID === groupID);
+      const groupSelectionStatus = isGroupSelected(groupID);
+      groupEntities.forEach((entity) => {
+        handleEntitySelection(entity, false, groupSelectionStatus === "empty" ? "force-add" : "force-remove");
+      });
+    },
+    [entities, handleEntitySelection, isGroupSelected]
+  );
+
   // clear selection on escape key press
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
@@ -283,6 +303,17 @@ export const useMultipleSelect = (props: Props) => {
     };
   }, [activeEntityDetails, entities, groups, getPreviousAndNextEntities, handleActiveEntityChange]);
 
+  // clear selection on route change
+  useEffect(() => {
+    const handleRouteChange = () => clearSelection();
+
+    router.events.on("routeChangeComplete", handleRouteChange);
+
+    return () => {
+      router.events.off("routeChangeComplete", handleRouteChange);
+    };
+  }, [clearSelection, router.events]);
+
   /**
    * @description snapshot of the current state of selection
    */