useEffect cleanup function

Forge Forge UI Kit and Custom UI
, ,
1

Hello,

I want to use the native cleanup (unmount) function from react. Sadly Typescript is throwing an error that a return value of useEffect is not valid.

Here are the doc from the react:

My Test Code:

    useEffect(() => {
        let timeout: Timeout;

        if (saved) {
            timeout = setTimeout(() => setSaved(false), 5000);
        }

        return () => {
            clearTimeout(timeout);
        }
    }, [saved]);

TS2345: Argument of type ‘() => () => void’ is not assignable to parameter of type ‘() => void | Promise’. Type ‘() => void’ is not assignable to type ‘void | Promise’. Type ‘() => void’ is missing the following properties from type ‘Promise’: then, catch, finally, [Symbol.toStringTag]

How can I solve it with Forge UI?

2

Hi @anon72326184,

UI kit does not support a cleanup function. Note that while UI kit may look similar to react, it is not the same as react.

https://developer.atlassian.com/platform/forge/ui-kit-hooks-reference/#useeffect

Also, from your code snippet, you need to be careful with setTimeout usage as there are some caveats: SetInterval and SetTimeout usage with Forge UI - #2 by SamSmyth

1 Like