From 64f50bdf8181b5c1134645637b7e5f77c18b2245 Mon Sep 17 00:00:00 2001
From: Akshat Jawne <akshatjawne@gmail.com>
Date: Fri, 20 Sep 2024 11:26:00 -0400
Subject: [PATCH] make changes based on PR

---
 .../components/src/spectrum/CheckboxGroup.tsx | 42 +++++++------------
 1 file changed, 15 insertions(+), 27 deletions(-)

diff --git a/packages/components/src/spectrum/CheckboxGroup.tsx b/packages/components/src/spectrum/CheckboxGroup.tsx
index 1657aea9f..afa1a4a38 100644
--- a/packages/components/src/spectrum/CheckboxGroup.tsx
+++ b/packages/components/src/spectrum/CheckboxGroup.tsx
@@ -1,10 +1,12 @@
+/* eslint-disable react/no-array-index-key */
 import { isElementOfType } from '@deephaven/react-hooks';
-import React, { ReactNode, useMemo, useState } from 'react';
+import React, { ReactNode, useMemo } from 'react';
 import {
   Checkbox,
   CheckboxGroup as SpectrumCheckboxGroup,
   SpectrumCheckboxGroupProps,
 } from '@adobe/react-spectrum';
+import { ensureArray } from '@deephaven/utils';
 
 export type CheckboxGroupProps = {
   children: ReactNode;
@@ -18,38 +20,24 @@ export function CheckboxGroup({
   children,
   ...props
 }: CheckboxGroupProps): JSX.Element {
-  const [checkedState, setCheckedState] = useState<{ [key: number]: boolean }>(
-    {}
-  );
-
-  const handleCheckboxChange = (index: number) => {
-    setCheckedState(prevState => ({
-      ...prevState,
-      [index]: !prevState[index],
-    }));
-  };
-
   const wrappedChildren = useMemo(
     () =>
-      React.Children.map(children, (child, index) => {
-        if (isElementOfType(child, Checkbox)) {
-          return React.cloneElement(child, {
-            isSelected: true,
-            value: `checkbox-${index}`,
-            onChange: () => handleCheckboxChange(index),
-          });
-        }
-        return (
+      ensureArray(children).map((child, index) =>
+        isElementOfType(child, Checkbox) ? (
+          React.cloneElement(child, {
+            key: `${index}-${String(child)}`,
+            value: `${index}-${String(child)}`,
+          })
+        ) : (
           <Checkbox
-            isSelected={checkedState[index] || false}
-            value={`checkbox-${index}`}
-            onChange={() => handleCheckboxChange(index)}
+            key={`${index}-${String(child)}`}
+            value={`${index}-${String(child)}`}
           >
             {String(child)}
           </Checkbox>
-        );
-      }) || [],
-    [children, checkedState]
+        )
+      ),
+    [children]
   );
 
   return (