chore(superset-ui-core): forward-compat fixes for TypeScript 6.0 (Phase B) (#39535)

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>

Author: rusackas

UPDATING.md

@@ -44,6 +44,10 @@ The git SHA and build number surfaced in the "About" section, the bootstrap payl
 
 The pivot table chart's `First` and `Last` aggregations now return the first and last value in data (query result) order, instead of effectively returning the minimum and maximum. Existing pivot tables that use these aggregations for totals/subtotals may show different values after upgrading. For deterministic results, ensure the underlying query has a stable sort order.
 
+### `FetchRetryOptions` callback parameters widened to allow `null`
+
+The `error` and `response` parameters of the `retryDelay` and `retryOn` callbacks in `FetchRetryOptions` (exported from `@superset-ui/core`) are now typed `Error | null` and `Response | null` to match the actual call-site signature provided by `fetch-retry`. Because these parameter types are contravariant, consumers who typed their callbacks with the non-nullable `(attempt: number, error: Error, response: Response) => number` will get a TypeScript compile error. Widen your callback signatures to accept `Error | null` / `Response | null`.
+
 ### `thumbnail_url` removed from dashboard list API response
 
 The `thumbnail_url` field has been removed from `GET /api/v1/dashboard/` list responses. External consumers relying on this field must now construct the thumbnail URL client-side using `id` and `changed_on_utc`:

superset-frontend/packages/superset-ui-core/src/chart/components/StatefulChart.tsx

@@ -28,6 +28,7 @@ import {
   RequestConfig,
   getClientErrorObject,
 } from '../..';
+import type { HandlerFunction } from '../types/Base';
 import { Loading } from '../../components/Loading';
 import ChartClient from '../clients/ChartClient';
 import getChartBuildQueryRegistry from '../registries/ChartBuildQueryRegistrySingleton';
@@ -482,7 +483,7 @@ export default function StatefulChart(props: StatefulChartProps) {
         enableNoResults={enableNoResults}
         noResults={NoDataComponent && <NoDataComponent />}
         onRenderSuccess={onRenderSuccess}
-        onRenderFailure={onRenderFailure}
+        onRenderFailure={onRenderFailure as HandlerFunction | undefined}
         hooks={hooks}
       />
     );

superset-frontend/packages/superset-ui-core/src/components/AsyncEsmComponent/index.tsx

@@ -16,7 +16,13 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import React, { useEffect, useState, forwardRef, ComponentType } from 'react';
+import React, {
+  useEffect,
+  useState,
+  forwardRef,
+  ComponentType,
+  ForwardedRef,
+} from 'react';
 
 import { Loading } from '../Loading';
 import type { PlaceholderProps } from './types';
@@ -93,7 +99,7 @@ export function AsyncEsmComponent<
   // @ts-expect-error -- generic forwardRef has PropsWithoutRef incompatibility with FullProps
   const AsyncComponent: AsyncComponent = forwardRef(function AsyncComponent(
     props: FullProps,
-    ref,
+    ref: ForwardedRef<ComponentType<FullProps>>,
   ) {
     const [loaded, setLoaded] = useState(component !== undefined);
     useEffect(() => {

superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.tsx

@@ -19,7 +19,7 @@
 import {
   cloneElement,
   forwardRef,
-  RefObject,
+  ForwardedRef,
   useEffect,
   useImperativeHandle,
   useLayoutEffect,
@@ -54,7 +54,7 @@ export const DropdownContainer = forwardRef(
       forceRender,
       style,
     }: DropdownContainerProps,
-    outerRef: RefObject<DropdownRef>,
+    outerRef: ForwardedRef<DropdownRef>,
   ) => {
     const theme = useTheme();
     const { ref, width = 0 } = useResizeDetector<HTMLDivElement>();

superset-frontend/packages/superset-ui-core/src/components/Icons/AntdEnhanced.tsx

@@ -331,12 +331,21 @@ export const antdEnhancedIcons: Record<
   .reduce(
     (acc, key) => {
       acc[key as AntdIconNames] = forwardRef<HTMLSpanElement, IconType>(
-        (props, ref) => (
+        (
+          {
+            // Forward-compat: TS 6.0 treats IconComponentProps.component as a
+            // different shape than BaseIconProps.component; strip it from spread
+            // props so our own component binding is authoritative.
+            component: _ignoredComponent,
+            ...rest
+          },
+          ref,
+        ) => (
           <BaseIconComponent
             ref={ref}
             component={AntdIcons[key as AntdIconNames]}
             fileName={key}
-            {...props}
+            {...rest}
           />
         ),
       );

superset-frontend/packages/superset-ui-core/src/components/ModalTrigger/index.tsx

@@ -16,7 +16,13 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { forwardRef, useState, ReactNode, MouseEvent } from 'react';
+import {
+  forwardRef,
+  ForwardedRef,
+  useState,
+  ReactNode,
+  MouseEvent,
+} from 'react';
 
 import { Button } from '../Button';
 import { Modal } from '../Modal';
@@ -54,7 +60,7 @@ export interface ModalTriggerRef {
 }
 
 export const ModalTrigger = forwardRef(
-  (props: ModalTriggerProps, ref: ModalTriggerRef | null) => {
+  (props: ModalTriggerProps, ref: ForwardedRef<ModalTriggerRef['current']>) => {
     const [showModal, setShowModal] = useState(false);
     const {
       beforeOpen = () => {},
@@ -87,8 +93,14 @@ export const ModalTrigger = forwardRef(
       setShowModal(true);
     };
 
-    if (ref) {
-      ref.current = { close, open, showModal }; // eslint-disable-line
+    // Forward both callback refs (e.g. `(value) => setRef(value)`) and
+    // object refs. Without the callback-ref branch, parents that pass a
+    // function ref get silently no-op'd and can't call close/open/showModal.
+    const refValue = { close, open, showModal };
+    if (typeof ref === 'function') {
+      ref(refValue);
+    } else if (ref) {
+      ref.current = refValue; // eslint-disable-line
     }
 
     /* eslint-disable jsx-a11y/interactive-supports-focus */

superset-frontend/packages/superset-ui-core/src/components/Select/AsyncSelect.tsx

@@ -18,6 +18,7 @@
  */
 import {
   forwardRef,
+  ForwardedRef,
   FocusEvent,
   ReactElement,
   RefObject,
@@ -38,6 +39,8 @@ import {
   getClientErrorObject,
 } from '@superset-ui/core';
 import {
+  BaseOptionType,
+  DefaultOptionType,
   LabeledValue as AntdLabeledValue,
   RefSelectProps,
 } from 'antd/es/select';
@@ -146,7 +149,7 @@ const AsyncSelect = forwardRef(
       maxTagCount: propsMaxTagCount,
       ...props
     }: AsyncSelectProps,
-    ref: RefObject<AsyncSelectRef>,
+    ref: ForwardedRef<AsyncSelectRef>,
   ) => {
     const isSingleMode = mode === 'single';
     const [selectValue, setSelectValue] = useState(value);
@@ -324,7 +327,14 @@ const AsyncSelect = forwardRef(
             mergedData = prevOptions
               .filter(previousOption => !dataValues.has(previousOption.value))
               .concat(data)
-              .sort(sortComparatorForNoSearch);
+              // Forward-compat: TS 6.0 infers stricter antd option types; widen
+              // the comparator to accept the broader DefaultOptionType shape.
+              .sort(
+                sortComparatorForNoSearch as unknown as (
+                  a: BaseOptionType | DefaultOptionType,
+                  b: BaseOptionType | DefaultOptionType,
+                ) => number,
+              );
             return mergedData;
           });
         }
@@ -509,7 +519,13 @@ const AsyncSelect = forwardRef(
       if (isDropdownVisible && !inputValue && selectOptions.length > 1) {
         const sortedOptions = selectOptions
           .slice()
-          .sort(sortComparatorForNoSearch);
+          // Forward-compat: see note in mergeData above.
+          .sort(
+            sortComparatorForNoSearch as unknown as (
+              a: BaseOptionType | DefaultOptionType,
+              b: BaseOptionType | DefaultOptionType,
+            ) => number,
+          );
         if (!isEqual(sortedOptions, selectOptions)) {
           setSelectOptions(sortedOptions);
         }
@@ -632,14 +648,16 @@ const AsyncSelect = forwardRef(
       setAllValuesLoaded(false);
     };
 
-    useImperativeHandle(
-      ref,
-      () => ({
-        ...(ref.current as RefSelectProps),
+    useImperativeHandle(ref, () => {
+      const current =
+        ref && typeof ref !== 'function' && ref.current
+          ? (ref.current as RefSelectProps)
+          : ({} as RefSelectProps);
+      return {
+        ...current,
         clearCache,
-      }),
-      [ref],
-    );
+      };
+    }, [ref]);
 
     const getPastedTextValue = useCallback(
       async (text: string) => {
@@ -705,8 +723,21 @@ const AsyncSelect = forwardRef(
           data-test={ariaLabel || name}
           autoClearSearchValue={autoClearSearchValue}
           popupRender={popupRender}
-          filterOption={handleFilterOption}
-          filterSort={sortComparatorWithSearch}
+          // Forward-compat: TS 6.0 infers stricter antd option types; local
+          // helpers typed against AntdLabeledValue are behaviorally compatible
+          // with the broader BaseOptionType/DefaultOptionType antd expects.
+          filterOption={
+            handleFilterOption as unknown as (
+              search: string,
+              option?: BaseOptionType | DefaultOptionType,
+            ) => boolean
+          }
+          filterSort={
+            sortComparatorWithSearch as unknown as (
+              a: BaseOptionType | DefaultOptionType,
+              b: BaseOptionType | DefaultOptionType,
+            ) => number
+          }
           getPopupContainer={
             getPopupContainer || (triggerNode => triggerNode.parentNode)
           }
@@ -716,13 +747,26 @@ const AsyncSelect = forwardRef(
           mode={mappedMode}
           notFoundContent={isLoading ? t('Loading...') : notFoundContent}
           onBlur={handleOnBlur}
-          onDeselect={handleOnDeselect}
+          // Forward-compat: TS 6.0 narrows the Select value type handed to
+          // SelectHandler; our local handlers already accept the broader union.
+          onDeselect={
+            handleOnDeselect as unknown as (
+              value: unknown,
+              option: BaseOptionType | DefaultOptionType,
+            ) => void
+          }
           onOpenChange={handleOnDropdownVisibleChange}
-          // @ts-expect-error
+          // @ts-expect-error antd Select does not declare onPaste on its prop
+          // surface, but the underlying input accepts it and we rely on that.
           onPaste={onPaste}
           onPopupScroll={handlePagination}
           onSearch={showSearch ? handleOnSearch : undefined}
-          onSelect={handleOnSelect}
+          onSelect={
+            handleOnSelect as unknown as (
+              value: unknown,
+              option: BaseOptionType | DefaultOptionType,
+            ) => void
+          }
           onClear={handleClear}
           options={fullSelectOptions}
           optionRender={option => <Space>{option.label || option.value}</Space>}

superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx

@@ -34,6 +34,8 @@ import { t } from '@apache-superset/core/translation';
 import { ensureIsArray, formatNumber, usePrevious } from '@superset-ui/core';
 import { Constants } from '@superset-ui/core/components';
 import {
+  BaseOptionType,
+  DefaultOptionType,
   LabeledValue as AntdLabeledValue,
   RefSelectProps,
 } from 'antd/es/select';
@@ -212,7 +214,17 @@ const Select = forwardRef(
     );
 
     const initialOptionsSorted = useMemo(
-      () => initialOptions.slice().sort(sortSelectedFirst),
+      () =>
+        initialOptions
+          .slice()
+          // Forward-compat: TS 6.0 infers stricter antd option types; widen the
+          // comparator to accept the broader DefaultOptionType shape.
+          .sort(
+            sortSelectedFirst as unknown as (
+              a: BaseOptionType | DefaultOptionType,
+              b: BaseOptionType | DefaultOptionType,
+            ) => number,
+          ),
       [initialOptions, sortSelectedFirst],
     );
 
@@ -240,7 +252,17 @@ const Select = forwardRef(
         missingValues.length > 0
           ? missingValues.concat(selectOptions)
           : selectOptions;
-      return result.slice().sort(sortSelectedFirst);
+      return (
+        result
+          .slice()
+          // Forward-compat: see note on initialOptionsSorted.
+          .sort(
+            sortSelectedFirst as unknown as (
+              a: BaseOptionType | DefaultOptionType,
+              b: BaseOptionType | DefaultOptionType,
+            ) => number,
+          )
+      );
     }, [selectOptions, selectValue, sortSelectedFirst]);
 
     const enabledOptions = useMemo(
@@ -773,8 +795,21 @@ const Select = forwardRef(
           data-test={ariaLabel || name}
           autoClearSearchValue={autoClearSearchValue}
           popupRender={popupRender}
-          filterOption={handleFilterOption}
-          filterSort={sortComparatorWithSearch}
+          // Forward-compat: TS 6.0 infers stricter antd option types; local
+          // helpers typed against AntdLabeledValue are behaviorally compatible
+          // with the broader BaseOptionType/DefaultOptionType antd expects.
+          filterOption={
+            handleFilterOption as unknown as (
+              search: string,
+              option?: BaseOptionType | DefaultOptionType,
+            ) => boolean
+          }
+          filterSort={
+            sortComparatorWithSearch as unknown as (
+              a: BaseOptionType | DefaultOptionType,
+              b: BaseOptionType | DefaultOptionType,
+            ) => number
+          }
           getPopupContainer={
             getPopupContainer || (triggerNode => triggerNode.parentNode)
           }
@@ -785,13 +820,26 @@ const Select = forwardRef(
           mode={mappedMode}
           notFoundContent={isLoading ? t('Loading...') : notFoundContent}
           onBlur={handleOnBlur}
-          onDeselect={handleOnDeselect}
+          // Forward-compat: TS 6.0 narrows the Select value type handed to
+          // SelectHandler; our local handlers already accept the broader union.
+          onDeselect={
+            handleOnDeselect as unknown as (
+              value: unknown,
+              option: BaseOptionType | DefaultOptionType,
+            ) => void
+          }
           onOpenChange={handleOnDropdownVisibleChange}
-          // @ts-expect-error
+          // @ts-expect-error antd Select does not declare onPaste on its prop
+          // surface, but the underlying input accepts it and we rely on that.
           onPaste={onPaste}
           onPopupScroll={undefined}
           onSearch={shouldShowSearch ? handleOnSearch : undefined}
-          onSelect={handleOnSelect}
+          onSelect={
+            handleOnSelect as unknown as (
+              value: unknown,
+              option: BaseOptionType | DefaultOptionType,
+            ) => void
+          }
           onClear={handleClear}
           placeholder={placeholder}
           tokenSeparators={tokenSeparators}

superset-frontend/packages/superset-ui-core/src/components/Table/VirtualTable.tsx

@@ -84,8 +84,8 @@ const VirtualTable = <RecordType extends object>(
     allowHTML = false,
   } = props;
   const [tableWidth, setTableWidth] = useState<number>(0);
-  const onResize = useCallback((width: number) => {
-    setTableWidth(width);
+  const onResize = useCallback((width?: number) => {
+    setTableWidth(width ?? 0);
   }, []);
   const { ref } = useResizeDetector({ onResize });
   const theme = useTheme();

superset-frontend/packages/superset-ui-core/src/components/Table/utils/InteractiveTableUtils.ts

@@ -29,7 +29,7 @@ interface IInteractiveColumn extends HTMLElement {
 export default class InteractiveTableUtils {
   tableRef: HTMLTableElement | null;
 
-  columnRef: IInteractiveColumn | null;
+  columnRef: IInteractiveColumn | null = null;
 
   setDerivedColumns: Function;