ref: do not allow uncontrolled compactSelect

static/app/components/core/compactSelect/compactSelect.tsx

@@ -60,7 +60,6 @@ export function CompactSelect<Value extends SelectKey>({
   // List props
   options,
   value,
-  defaultValue,
   onChange,
   onSectionToggle,
   multiple,
@@ -87,7 +86,6 @@ export function CompactSelect<Value extends SelectKey>({
       return {
         multiple,
         value,
-        defaultValue,
         onChange,
         closeOnSelect,
         grid,
@@ -96,12 +94,11 @@ export function CompactSelect<Value extends SelectKey>({
     return {
       multiple,
       value,
-      defaultValue,
       onChange,
       closeOnSelect,
       grid,
     };
-  }, [multiple, value, defaultValue, onChange, closeOnSelect, grid]);
+  }, [multiple, value, onChange, closeOnSelect, grid]);
 
   const itemsWithKey = useMemo(() => getItemsWithKeys(options), [options]);
 

static/app/components/core/compactSelect/composite.spec.tsx

@@ -8,7 +8,7 @@ describe('CompactSelect', () => {
       <CompositeSelect menuTitle="Menu title">
         <CompositeSelect.Region
           label="Region 1"
-          defaultValue="choice_one"
+          value="choice_one"
           onChange={() => {}}
           options={[
             {value: 'choice_one', label: 'Choice One'},
@@ -18,7 +18,7 @@ describe('CompactSelect', () => {
         <CompositeSelect.Region
           multiple
           label="Region 2"
-          defaultValue={['choice_three', 'choice_four']}
+          value={['choice_three', 'choice_four']}
           onChange={() => {}}
           options={[
             {value: 'choice_three', label: 'Choice Three'},
@@ -252,7 +252,7 @@ describe('CompactSelect', () => {
       <CompositeSelect grid>
         <CompositeSelect.Region
           label="Region 1"
-          defaultValue="choice_one"
+          value="choice_one"
           onChange={() => {}}
           options={[
             {value: 'choice_one', label: 'Choice One'},
@@ -317,7 +317,7 @@ describe('CompactSelect', () => {
       <CompositeSelect>
         <CompositeSelect.Region
           label="Region 1"
-          defaultValue={1}
+          value={1}
           onChange={onChange}
           options={[
             {value: 1, label: 'One'},

static/app/components/core/compactSelect/composite.tsx

@@ -133,7 +133,6 @@ type RegionProps<Value extends SelectKey> = CompositeSelectRegion<Value> & {
 function Region<Value extends SelectKey>({
   options,
   value,
-  defaultValue,
   onChange,
   multiple,
   disallowEmptySelection,
@@ -151,19 +150,17 @@ function Region<Value extends SelectKey>({
       return {
         multiple,
         value,
-        defaultValue,
         closeOnSelect,
         onChange,
       };
     }
     return {
       multiple,
       value,
-      defaultValue,
       closeOnSelect,
       onChange,
     };
-  }, [multiple, value, defaultValue, onChange, closeOnSelect]);
+  }, [multiple, value, onChange, closeOnSelect]);
 
   const itemsWithKey = useMemo(() => getItemsWithKeys(options), [options]);
 

static/app/components/core/compactSelect/control.tsx

@@ -88,10 +88,11 @@ export interface ControlProps
   extends Omit<
       React.BaseHTMLAttributes<HTMLDivElement>,
       // omit keys from SingleListProps because those will be passed to <List /> instead
-      keyof Omit<
-        SingleListProps<SelectKey>,
-        'children' | 'items' | 'grid' | 'compositeIndex' | 'label'
-      >
+      | keyof Omit<
+          SingleListProps<SelectKey>,
+          'children' | 'items' | 'grid' | 'compositeIndex' | 'label'
+        >
+      | 'defaultValue'
     >,
     Pick<
       UseOverlayProps,

static/app/components/core/compactSelect/list.tsx

@@ -105,7 +105,6 @@ export interface SingleListProps<Value extends SelectKey> extends BaseListProps<
    * that receives the newly selected option and returns whether to close the menu.
    */
   closeOnSelect?: boolean | ((selectedOption: SelectOption<Value>) => boolean);
-  defaultValue?: Value;
   multiple?: false;
   onChange?: (selectedOption: SelectOption<Value>) => void;
   value?: Value;
@@ -118,7 +117,6 @@ export interface MultipleListProps<Value extends SelectKey> extends BaseListProp
    * that receives the newly selected options and returns whether to close the menu.
    */
   closeOnSelect?: boolean | ((selectedOptions: Array<SelectOption<Value>>) => boolean);
-  defaultValue?: Value[];
   onChange?: (selectedOptions: Array<SelectOption<Value>>) => void;
   value?: Value[];
 }
@@ -133,7 +131,6 @@ export interface MultipleListProps<Value extends SelectKey> extends BaseListProp
 function List<Value extends SelectKey>({
   items,
   value,
-  defaultValue,
   onChange,
   grid,
   multiple,
@@ -170,7 +167,6 @@ function List<Value extends SelectKey>({
         disabledKeys,
         // react-aria turns all keys into strings
         selectedKeys: value?.map(getEscapedKey),
-        defaultSelectedKeys: defaultValue?.map(getEscapedKey),
         disallowEmptySelection,
         allowDuplicateSelectionEvents: true,
         onSelectionChange: selection => {
@@ -196,9 +192,6 @@ function List<Value extends SelectKey>({
       disabledKeys,
       // react-aria turns all keys into strings
       selectedKeys: defined(value) ? [getEscapedKey(value)] : undefined,
-      defaultSelectedKeys: defined(defaultValue)
-        ? [getEscapedKey(defaultValue)]
-        : undefined,
       disallowEmptySelection: disallowEmptySelection ?? true,
       allowDuplicateSelectionEvents: true,
       onSelectionChange: selection => {
@@ -221,7 +214,6 @@ function List<Value extends SelectKey>({
     };
   }, [
     value,
-    defaultValue,
     onChange,
     items,
     isOptionDisabled,

static/gsApp/views/subscriptionPage/usageLog.tsx

@@ -165,7 +165,7 @@ function UsageLog({location, subscription}: Props) {
           clearable
           menuTitle={t('Subscription Actions')}
           options={eventNameOptions}
-          defaultValue={selectedEventName}
+          value={selectedEventName}
           onClear={() => handleEventFilter(null)}
           onChange={option => {
             handleEventFilter(option.value);