Way to get hooks states in onMount function?

[Xoffio]

Sometimes we need to execute a specific function when the editor is mounted and also get the status of a hook.
I'm trying to get a hook state from onMount but it only gets the value when is mounted. (it does not update)

It would be very useful for things like addCommand when the right place to initialized it is in onMount

For example:
If I want to save a file I would use the function addCommand like this:

...

export default function AppEditorText({ tabsState }){

...

    function handleEditorDidMount(editor, monaco) {
        editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KEY_S, function() {
            //saveFileFunc();
            console.log(tabsState );
        });
    }
...

return(
        <Editor
            defaultLanguage="javascript"

            onChange={handleEditorChange}
            beforeMount={handleEditorWillMount}
            onMount={handleEditorDidMount}
        />
    )

Is this not the right way to do this?

[suren-atoyan]

two options:

1. use useEffect with a correct dependency array and attach/dispose addCommand every time dependencies are changed - to be able to get the new/updated values

2. use useRef for all values you use inside a hook - again, to be able to get the new/updated values

[Xoffio]

I ended up using useEffect another problem I encounter was that addCommand does not return a dispose anymore. Using addCommand in useEffect without disposing it made my app very slow in a couple of minutes due memory leak. I ended up using addAction instead which returns a dispose

I'll close this issue but for any one out there. Don't use addCommand because you won't be able to dispose it. Use addAction instead