ViewManager receiveCommand is deprecated?

Question

I've recently noticed in the react-native source code that the following method:

public void receiveCommand(@NonNull T root, int commandId, @Nullable ReadableArray args)

of the ViewManager class is marked as deprecated. Therefore, I tried to replace it with an overloaded version that is not marked as deprecated:

public void receiveCommand(@NonNull T root, String commandId, @Nullable ReadableArray args)

but this one never gets invoked. I imagine I also might need to change some other methods, but I cannot find any information what else has to be done, there is no migration guide that I could follow.

Does anyone know how to properly use the new, non-deprecated receiveCommand method?

The source code of the ViewManager can be found here: https://github.com/facebook/react-native/blob/master/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewManager.java

Answer 1

The new, non-deprecated version of receiveCommand will get called if a String is sent as the second argument of the dispatchViewManagerCommand from your React Native code. There is no need to override getCommandsMap() anymore.

Example:

CustomViewManager.kt (In Kotlin, should be easy to convert to Java)

class CustomViewManager : SimpleViewManager<CustomView>() {
...
    override fun createViewInstance( context: ThemedReactContext): CustomView {
        // code to instantiate your view
    }
...
    override fun getName(): String {
        return "CustomView"
    }
...
    override fun receiveCommand(view: CustomView, commandId: String, args: ReadableArray?) {
    when (commandId) {
        "doSomething" -> doSomething()
    }
}

MyComponent.js

import { View, requireNativeComponent, UIManager, findNodeHandle } from 'react-native';
...
const CustomView = requireNativeComponent('CustomView');
...
export default class MyComponent extends Component {
...
    onDoSomething = async () => {
        UIManager.dispatchViewManagerCommand(
            findNodeHandle(this.customView),
            'doSomething',
            undefined,
        );
    };
...
    render() {
        return (
            <View>
                <CustomView
                    ref={(component) => {
                        this.customView = component;
                    }}
                />
            </View>
        );
    }
}