Merge pull request #919 from equinor/feat/option-drawer-disabled

✨ Add 'disabled' prop to OptionDrawer
equinor · Dec 20, 2024 · bcec666 · bcec666
2 parents 8cff552 + ae3710f
commit bcec666
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 1 deletion.
diff --git a/.idea/runConfigurations/_template__of_JavaScriptTestRunnerVitest2.xml b/.idea/runConfigurations/_template__of_JavaScriptTestRunnerVitest2.xml
diff --git a/src/molecules/OptionDrawer/OptionDrawer.test.tsx b/src/molecules/OptionDrawer/OptionDrawer.test.tsx
@@ -348,3 +348,16 @@ test('chevron toggler works as expected', async () => {
     expect(screen.queryByText(label)).not.toBeInTheDocument()
   );
 });
+
+test("Doesn't call onToggle if disabled", async () => {
+  const user = userEvent.setup();
+
+  const props = fakeProps();
+  const onToggle = vi.fn();
+
+  render(<OptionDrawer {...props} onToggle={onToggle} disabled />);
+
+  await user.click(screen.getByText(props.item.label));
+
+  expect(onToggle).not.toHaveBeenCalled();
+});
diff --git a/src/molecules/OptionDrawer/OptionDrawer.tsx b/src/molecules/OptionDrawer/OptionDrawer.tsx
@@ -88,6 +88,7 @@ export interface OptionDrawerProps<
   openAll?: boolean;
   showIntermediateParent?: boolean;
   parentHasNestedItems?: boolean;
+  disabled?: boolean;
 }
 
 export const OptionDrawer = <
@@ -105,6 +106,7 @@ export const OptionDrawer = <
   openAll,
   showIntermediateParent = false,
   parentHasNestedItems = false,
+  disabled = false,
 }: OptionDrawerProps<T>) => {
   const [open, setOpen] = useState(false);
   const [status, setStatus] = useState<StatusType>(
@@ -127,6 +129,8 @@ export const OptionDrawer = <
   }, [openAll]);
 
   const handleClick = (e: MouseEvent) => {
+    if (disabled) return;
+
     if (item.children && item.children.length !== 0) {
       setOpen((o) => !o);
     }
@@ -233,7 +237,6 @@ export const OptionDrawer = <
             indeterminate={status === 'INTERMEDIATE'}
             checked={status === 'CHECKED'}
             color="secondary"
-            onChange={() => null}
           />
           {item.label}
         </StyledOption>
@@ -254,6 +257,7 @@ export const OptionDrawer = <
             openAll={openAll}
             showIntermediateParent={showIntermediateParent}
             parentHasNestedItems
+            disabled={disabled}
           />
         ))}
     </StyledOptionWrapper>