docs: update documentation of persist

[cheatkey]

Related Issues or Discussions

Summary

Added example of using third-party libraries to the "How do I use it with Map and Set" section of the persist documentation

There's no need to write code to serialise or deserialise data that is not supported by JSON.stringify

Check List

• yarn run prettier for formatting code and docs

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
zustand-demo	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 30, 2023 5:23pm

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit eb37b28:

Sandbox	Source
React	Configuration
React TypeScript	Configuration
React Browserify	Configuration
React Snowpack	Configuration
React Parcel	Configuration
Next.js	Configuration
@pavlobu/zustand demo	Configuration

[sewera]

@dai-shi — please comment if you're okay with encouraging the usage of superjson external library.

[sewera]

It depends whether @dai-shi and other contributors want to encourage using another library for this use case in the official Zustand docs.

[cheatkey]

Should we change it to how to use persist with a custom serialization library? Like "How can I use a custom storage engine"?

If you use a lot of variables like Map, Set, Date, etc. that JSON.stringify() doesn't support, it would be nice to have a way in the documentation to avoid writing your own serialization/deserialization code

No problem using other libraries (ex) serialize-javascript, devalue , ...etc)

[dbritto-dev]

@cheatkey I'm down with the idea of having this under "How can I use a custom storage engine?".

[sewera]

Please use the American English spelling — serialization for this and other occurrences.

[sewera]

Please run prettier.

[dai-shi]

@dai-shi — please comment if you're okay with encouraging the usage of superjson external library.

I'm not familiar with superjson, and we shouldn't endorse a specific library, but a usage example may help people.

[dai-shi]

So, how about adding this?

Suggested change

	SuperJSON serialize data along with its type, allowing the data to be parsed back to its original type upon deserialization
	For example, [Superjson](https://github.com/blitz-js/superjson) can serialize data along with its type, allowing the data to be parsed back to its original type upon deserialization

[dai-shi]

@cheatkey I'm down with the idea of having this under "How can I use a custom storage engine?".

That sounds good too.

[cheatkey]

I have committed the following changes

• Moved content below "How can I use a custom storage engine?"
• Specified that the code is an example
• Added the following types to the example code: Map, Set, Date, and RegExp

[sewera]

Instead of an ellipsis, use some example names, like "bears", "fish", "time", "query", or something like that.

[sewera]

Wrap it with const storage: StateStorage = {} and add necessary imports.

[sewera]

I'm wondering if you need to return { state: superjson.parse().state }, or if you could just return superjson.parse().state, without wrapping it in an object?

[cheatkey]

You don't need to wrap it in an object. The result of superjson.parse returns the original json, so you can return the result of the superjson.parse function directly.
I have updated the example code accordingly