cyntler / cyntler/react-doc-viewer

LoadingTimeout is missing cleanup function

Open
#245 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
481
Forks
147
PR merge metrics
No merged PRs in 30d

Description

Hi @cyntler ,

we are using v1.7.0 to preview Images selected in an Input.

While developing we experienced the following Console Warning:

`console.js:273 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
in LoadingTimeout (created by Contents)
in Contents (created by ProxyRenderer)`

So we dug a bit into the readme, tried to set the `showLoadingTimeout` to false, yet, the warning continued to show up.

Like the warning suggested, we then worked on a cleanup function. Which would change the useEffect of the `LoadingTimeout` component to look like this:

```
useEffect(() => {
if (shouldLoadingRender) {
return () => {};
}

const timer = setTimeout(
() => {
setShouldLoadingRender(true);
},
typeof config?.loadingRenderer?.showLoadingTimeout === "number"
? config.loadingRenderer.showLoadingTimeout
: 500,
);

return () => {
clearTimeout(timer);
}
}, [config?.loadingRenderer?.showLoadingTimeout]);
```

Notice the early exit if `showLoadingTimeout` is false.
We think this might be relevant for every version, so i createe this issue.

Let us know, what you think.

Regards,
Jakob

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.