Hide buttons to add child labels for Data Subjects (#5619)

Co-authored-by: Lucano Vera <[email protected]>
ethyca · Dec 18, 2024 · 2f1242a · 2f1242a
1 parent 4157ac5
commit 2f1242a
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 12 deletions.
diff --git a/clients/admin-ui/src/features/taxonomy/components/TaxonomyInteractiveTree.tsx b/clients/admin-ui/src/features/taxonomy/components/TaxonomyInteractiveTree.tsx
@@ -68,6 +68,7 @@ const TaxonomyInteractiveTree = ({
         taxonomyItem: {
           fides_key: TAXONOMY_ROOT_NODE_ID,
         },
+        taxonomyType,
         onTaxonomyItemClick: null,
         onAddButtonClick,
         hasChildren: taxonomyItems.length !== 0,
@@ -90,6 +91,7 @@ const TaxonomyInteractiveTree = ({
       position: { x: 0, y: 0 },
       data: {
         label,
+        taxonomyType,
         taxonomyItem,
         onTaxonomyItemClick,
         onAddButtonClick,

diff --git a/clients/admin-ui/src/features/taxonomy/components/TaxonomyTreeNode.tsx b/clients/admin-ui/src/features/taxonomy/components/TaxonomyTreeNode.tsx
@@ -6,7 +6,7 @@ import {
 } from "fidesui";
 import { useCallback, useContext, useEffect } from "react";
 
-import { TAXONOMY_ROOT_NODE_ID } from "../constants";
+import { CoreTaxonomiesEnum, TAXONOMY_ROOT_NODE_ID } from "../constants";
 import {
   TaxonomyTreeHoverContext,
   TreeNodeHoverStatus,
@@ -20,6 +20,7 @@ export type TaxonomyTreeNodeType = Node<
   {
     label: string;
     taxonomyItem?: TaxonomyEntity;
+    taxonomyType: CoreTaxonomiesEnum;
     onTaxonomyItemClick: (taxonomyItem: TaxonomyEntity) => void | null;
     onAddButtonClick: (taxonomyItem: TaxonomyEntity | undefined) => void;
     hasChildren: boolean;
@@ -38,6 +39,7 @@ const TaxonomyTreeNode = ({
     TaxonomyTreeHoverContext,
   );
   const {
+    taxonomyType,
     taxonomyItem,
     onAddButtonClick,
     onTaxonomyItemClick,
@@ -89,6 +91,10 @@ const TaxonomyTreeNode = ({
   }, [nodeHoverStatus]);
 
   const isRootNode = taxonomyItem?.fides_key === TAXONOMY_ROOT_NODE_ID;
+  const isDataSubjectNode = taxonomyType === CoreTaxonomiesEnum.DATA_SUBJECTS;
+
+  // Data subjects don't support child nodes, so we only show the add button for root node
+  const shouldDisplayAddChildButton = !isDataSubjectNode || isRootNode;
 
   return (
     <div
@@ -122,17 +128,19 @@ const TaxonomyTreeNode = ({
         />
       )}
 
-      <div className={styles["add-button-container"]}>
-        <Button
-          type="default"
-          className={`${styles["add-button"]} ${nodeHoverStatus === TreeNodeHoverStatus.ACTIVE_HOVER ? styles["add-button--visible"] : ""}`}
-          icon={<Icons.Add size={20} />}
-          onClick={() => onAddButtonClick?.(taxonomyItem)}
-          size="middle"
-          data-testid="taxonomy-add-child-label-button"
-          aria-label={`Add child label to ${label}`}
-        />
-      </div>
+      {shouldDisplayAddChildButton && (
+        <div className={styles["add-button-container"]}>
+          <Button
+            type="default"
+            className={`${styles["add-button"]} ${nodeHoverStatus === TreeNodeHoverStatus.ACTIVE_HOVER ? styles["add-button--visible"] : ""}`}
+            icon={<Icons.Add size={20} />}
+            onClick={() => onAddButtonClick?.(taxonomyItem)}
+            size="middle"
+            data-testid="taxonomy-add-child-label-button"
+            aria-label={`Add child label to ${label}`}
+          />
+        </div>
+      )}
     </div>
   );
 };