useLocalStorage causes infinite re-renders

[NimmLor]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.7.1

What package has an issue?

@mantine/hooks

What framework do you use?

Vite

In which browsers you can reproduce the issue?

Chrome

Describe the bug

v7.7.1 break my useLocalStorage states. The following PR updates the memo dependencies and causes infinite re-renders.

https://github.com/mantinedev/mantine/pull/5910/files

I suspect that the useEffect on Line 145 causes this.

If possible, include a link to a codesandbox with a minimal reproduction

No response

Possible fix

Revert memo dependencies back to how they were in v7.7.0

Self-service

• I would be willing to implement a fix for this issue

[wuifdesign]

i was just typing the same issue when this popped up. if you use simple values like string this doesn't happen, but when you use an object and the deserialize is triggered it runs into an infinite loop.

[MathiasGr]

👍 We're seeing the same on our side.

[wuifdesign]

i prepared a fix here: #6019

[LuckyLukas98]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.1.1

What package has an issue?

@mantine/hooks

What framework do you use?

Vite

In which browsers you can reproduce the issue?

Chrome

Describe the bug

v7.1.1 break my useLocalStorage states. The following PR updates the memo dependencies and causes infinite re-renders.

https://github.com/mantinedev/mantine/pull/5910/files

I suspect that the useEffect on Line 145 causes this.

If possible, include a link to a codesandbox with a minimal reproduction

No response

Possible fix

Revert memo dependencies back to how they were in v7.1.0

Self-service

• I would be willing to implement a fix for this issue

I think you probably meant v7.7.1 (and v7.7.0 respectively), do you?

If so, I'm experiencing the same issue you're describing.

[wuifdesign]

bug was introduced in ec1adbf (so only 7.7.1 should be effected)

after my fix it is still needed to memorize the serialize and deserialize if overwriting them in your own code.

[wuifdesign]

if you need a workaround until fixed in the codebase, you just need to overwrite the serialize function with a memorized one:

const [value, setValue, removeValue] = useLocalStorage({
  key: `myKey`,
  serialize: useCallback((value: any) => JSON.stringify(value), []),
})

[noxan]

found the same issue, got stuck on it for 3 hours - thanks for reporting and fixing @wuifdesign ❤️

[icflorescu]

The same issue breaks Mantine DataTable on Mantine 7.7.1, see icflorescu/mantine-datatable#564 - many thanks for investigating and coming up with the fix!

[Karakatiza666]

Having the same issue

[rtivital]

Fixed in 7.7.2

[icflorescu]

Thanks a lot, @rtivital!
And many thanks for the new features in Mantine 7.8, especially the uncontrolled form mode 🙏