#90 Update neuron and group visibility logic for newly added groups a…

…nd hide neurons from side menu when hiding it from the viewer
MetaCell · Sep 17, 2024 · f7e06f1 · f7e06f1
1 parent c245853
commit f7e06f1
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 8 deletions.
diff --git a/applications/visualizer/frontend/src/components/ViewerContainer/CustomListItem.tsx b/applications/visualizer/frontend/src/components/ViewerContainer/CustomListItem.tsx
@@ -137,11 +137,13 @@ const CustomListItem = ({
                       <DeleteOutlinedIcon fontSize="small" />
                     </IconButton>
                   </Tooltip>
-                  <Tooltip title="Add to group">
-                    <IconButton>
-                      <AddIcon fontSize="small" />
-                    </IconButton>
-                  </Tooltip>
+                  {isNeurons && (
+                    <Tooltip title="Add to group">
+                      <IconButton>
+                        <AddIcon fontSize="small" />
+                      </IconButton>
+                    </Tooltip>
+                  )}
                 </Box>
               )}
             </Stack>

diff --git a/applications/visualizer/frontend/src/components/ViewerContainer/Neurons.tsx b/applications/visualizer/frontend/src/components/ViewerContainer/Neurons.tsx
@@ -14,6 +14,12 @@ const mapNeuronsToListItem = (neuron: string, isActive: boolean) => ({
   label: neuron,
   checked: isActive,
 });
+
+const mapGroupsToListItem = (group: string, isActive: boolean) => ({
+  id: group,
+  label: group,
+  checked: isActive,
+});
 const mapNeuronsAvailableNeuronsToOptions = (neuron: Neuron) => ({
   id: neuron.name,
   label: neuron.name,
@@ -62,6 +68,9 @@ const Neurons = ({ children }) => {
     .map((neuron: Neuron) => mapNeuronsAvailableNeuronsToOptions(neuron))
     .sort((a, b) => a.label.localeCompare(b.label));
 
+  const handleUpdateNeuronGroupVisibility = (_, group) => {
+    currentWorkspace.updateNeuronGroupVisibility(group.id, group.visible);
+  };
   return (
     <Box
       sx={{
@@ -141,11 +150,11 @@ const Neurons = ({ children }) => {
           {Array.from(Object.keys(groups)).map((groupId) => (
             <CustomListItem
               key={groupId}
-              data={mapNeuronsToListItem(groupId, activeNeurons.has(groupId))}
+              data={mapGroupsToListItem(groupId, groups[groupId].visible)}
               showTooltip={false}
               showExtraActions={true}
               listType="groups"
-              onSwitchChange={() => console.log("switch")}
+              onSwitchChange={(e) => handleUpdateNeuronGroupVisibility(e, groups[groupId])}
               onDelete={() => console.log("delete")}
               deleteTooltipTitle="Remove group from the workspace"
             />

diff --git a/applications/visualizer/frontend/src/components/viewers/TwoD/ContextMenu.tsx b/applications/visualizer/frontend/src/components/viewers/TwoD/ContextMenu.tsx
@@ -71,6 +71,8 @@ const ContextMenu: React.FC<ContextMenuProps> = ({ open, onClose, position, setS
         const neuron = draft.availableNeurons[neuronId];
         if (neuron && neuron.viewerData[ViewerType.Graph]) {
           neuron.viewerData[ViewerType.Graph].visibility = Visibility.Hidden;
+          neuron.isVisible = false;
+          draft.selectedNeurons.delete(neuronId);
         }
       });
       draft.selectedNeurons.clear();

diff --git a/applications/visualizer/frontend/src/helpers/twoD/groupHelper.ts b/applications/visualizer/frontend/src/helpers/twoD/groupHelper.ts
@@ -48,6 +48,7 @@ export const groupNeurons = (selectedNeurons: Set<string>, workspace: Workspace)
     name: originalGroupName || newGroupId,
     color: originalGroupColor,
     neurons: newGroupNeurons,
+    visible: true,
   };
 
   return { newGroupId, newGroup, groupsToDelete };

diff --git a/applications/visualizer/frontend/src/models/models.ts b/applications/visualizer/frontend/src/models/models.ts
@@ -24,6 +24,7 @@ export interface NeuronGroup {
   name: string;
   color: string;
   neurons: Set<string>;
+  visible: boolean;
 }
 
 export interface EnhancedNeuron extends Neuron {

diff --git a/applications/visualizer/frontend/src/models/workspace.ts b/applications/visualizer/frontend/src/models/workspace.ts
@@ -67,7 +67,6 @@ export class Workspace {
     });
     this.updateContext(updated);
   }
-
   hideNeuron(neuronId: string): void {
     const updated = produce(this, (draft: Workspace) => {
       if (draft.availableNeurons[neuronId]) {
@@ -167,6 +166,17 @@ export class Workspace {
     this.updateContext(updated);
   }
 
+  updateNeuronGroupVisibility(groupId: string, isVisible: boolean): void {
+    const updated = produce(this, (draft: Workspace) => {
+      if (draft.neuronGroups[groupId]) {
+        draft.neuronGroups[groupId].visible = !isVisible;
+      } else {
+        throw new Error("Neuron group not found");
+      }
+    });
+    this.updateContext(updated);
+  }
+
   changeViewerVisibility(viewerId: ViewerType, isVisible: boolean): void {
     const updated = produce(this, (draft: Workspace) => {
       if (draft.viewers[viewerId] === undefined) {