feat(ui): Suppport indeterminate checkbox (#37979)

static/app/components/checkbox.tsx

@@ -1,9 +1,33 @@
-const Checkbox = (props: React.InputHTMLAttributes<HTMLInputElement>) => (
-  <input type="checkbox" {...props} />
-);
+import {useEffect, useRef} from 'react';
 
-Checkbox.defaultProps = {
-  checked: false,
+type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement>;
+
+interface Props extends Omit<CheckboxProps, 'checked'> {
+  /**
+   * Is the checkbox active? Supports 'indeterminate'
+   */
+  checked?: CheckboxProps['checked'] | 'indeterminate';
+}
+
+const Checkbox = ({checked = false, ...props}: Props) => {
+  const checkboxRef = useRef<HTMLInputElement>(null);
+
+  // Support setting the indeterminate value, which is only possible through
+  // setting this attribute
+  useEffect(() => {
+    if (checkboxRef.current) {
+      checkboxRef.current.indeterminate = checked === 'indeterminate';
+    }
+  }, [checked]);
+
+  return (
+    <input
+      ref={checkboxRef}
+      checked={checked !== 'indeterminate' && checked}
+      type="checkbox"
+      {...props}
+    />
+  );
 };
 
 export default Checkbox;

static/app/views/issueList/actions/index.tsx

@@ -264,7 +264,7 @@ class IssueListActions extends Component<Props, State> {
           <ActionsCheckbox isReprocessingQuery={displayReprocessingActions}>
             <Checkbox
               onChange={this.handleSelectAll}
-              checked={pageSelected}
+              checked={pageSelected || (anySelected ? 'indeterminate' : false)}
               disabled={displayReprocessingActions}
             />
           </ActionsCheckbox>