I have a fabric component that looks like this:

import type {DirectEventHandler} from 'react-native/Libraries/Types/CodegenTypes';
import type {ViewProps, HostComponent} from 'react-native';
import {Float} from 'react-native/Libraries/Types/CodegenTypes';
import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';

export type ProgressUpdateEvent = Readonly<{
  time: Float;
  duration: Float;
}>;

export interface NativeProps extends ViewProps {
  videoUrl: string;
  onProgressUpdate?: DirectEventHandler<ProgressUpdateEvent>;
}

// The component name must match exactly what's used in the native registration
// Ensure this matches the component view class name in iOS (FabricTimeIndicatorComponentView)
export default codegenNativeComponent<NativeProps>('FabricTimeIndicator', {
  paperComponentName: 'FabricTimeIndicator',
  excludedPlatforms: [],
}) as HostComponent<NativeProps>;

and on the receiving end I want to run the onUpdate on the UI thread like so:

<FabricTimeIndicator
   onUpdate={runOnUI(handleProgressUpdate)}
/>

But I keep getting error:

ReanimatedError: [Reanimated] Trying to access property `nativeEvent` of an object which cannot be sent to the UI runtime., js engine: reanimated

which makes sense because I'm passing a complex event as my handleProgressUpdate parameter.

How do I refactor this to make it work 100% on the UI thread and avoid this error?

(Please don't suggest destructuring the event variable on the JS thread, and then calling handleProgressUpdate on the UI thread, because that's not 100% UI thread)