Fixed uncontrolled selection detection (#1935)

deephaven · Apr 18, 2024 · f541b3e · f541b3e
1 parent daa1730
commit f541b3e
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/packages/components/src/spectrum/picker/Picker.tsx b/packages/components/src/spectrum/picker/Picker.tsx
@@ -78,6 +78,8 @@ export function Picker({
     [tooltip]
   );
 
+  // `null` is a valid value for `selectedKey` in controlled mode, so we check
+  // for explicit `undefined` to identify uncontrolled mode.
   const isUncontrolled = selectedKey === undefined;
   const [uncontrolledSelectedKey, setUncontrolledSelectedKey] =
     useState(defaultSelectedKey);
@@ -93,10 +95,10 @@ export function Picker({
         children: wrappedItems,
         itemHeight: PICKER_ITEM_HEIGHTS.noDescription,
         itemHeightWithDescription: PICKER_ITEM_HEIGHTS.withDescription,
-        selectedKey: selectedKey ?? uncontrolledSelectedKey,
+        selectedKey: isUncontrolled ? uncontrolledSelectedKey : selectedKey,
         topOffset: PICKER_TOP_OFFSET,
       }),
-    [selectedKey, uncontrolledSelectedKey, wrappedItems]
+    [isUncontrolled, selectedKey, uncontrolledSelectedKey, wrappedItems]
   );
 
   const onSelectionChangeInternal = useCallback(

diff --git a/packages/jsapi-components/src/spectrum/Picker.tsx b/packages/jsapi-components/src/spectrum/Picker.tsx
@@ -43,6 +43,8 @@ export function Picker({
 }: PickerProps): JSX.Element {
   const { getFormattedString: formatValue } = useFormatter(settings);
 
+  // `null` is a valid value for `selectedKey` in controlled mode, so we check
+  // for explicit `undefined` to identify uncontrolled mode.
   const isUncontrolled = props.selectedKey === undefined;
   const [uncontrolledSelectedKey, setUncontrolledSelectedKey] = useState(
     props.defaultSelectedKey
@@ -63,7 +65,7 @@ export function Picker({
   const getItemIndexByValue = useGetItemIndexByValue({
     table,
     columnName: keyColumn.name,
-    value: props.selectedKey ?? uncontrolledSelectedKey,
+    value: isUncontrolled ? uncontrolledSelectedKey : props.selectedKey,
   });
 
   const getInitialScrollPosition = useCallback(async () => {