adding Cookie Storage to atomWithStorage

[matannahmani]

In my recent project I needed to sync atoms with cookies and came up with the following recipe, I thought it might be beneficial to add it to the docs as people might need this.
P.s
There is probably a way without zod but I needed type-safety in my case
this requires both:

import Cookies from 'universal-cookie';
import { z } from 'zod';

Define Cookie Storage:

const cookieObject = z.object({
    uuid: z.string(),
    name: z.string(),
    // ...
})
type cookieObjectT = z.infer<typeof cookieObject>;
const cookieStorageSnippet: SyncStorage<cookieObjectT> = {
    getItem: (key) => {
      const cookieItem = cookies.get<string | undefined | object>(key);
      try {
        return cookieObject.parse(typeof cookieItem === 'object' ? cookieItem :JSON.parse(cookieItem ?? ''));
      } catch (err) {}
      return unstable_NO_STORAGE_VALUE;
    },
    setItem: (ctx, value) => cookies.set(ctx, JSON.stringify(value)),
    removeItem: (ctx) => cookies.remove(ctx),
  };

CreateStorage:

const myCookieAtom = atomWithStorage<cookieObjectT>(
    'cookie',
    {
        uuid: '',
        name: '',
    },
    cookieStorageSnippet
);

[dai-shi]

Yeah, it would be nice to have something like that in persistence guide.
Would you like to open a PR?
I think it would be better to have to recipes separately: a) zod with localStorage, and b) JSON.parse with cookieStorage.

Also, we need to revisit the structure of persistence guide entirely. Maybe, you can help on it too (in a separate PR).

[matannahmani]

I'm a bit busy these days, but I will try to find sometime during the weekend to create a PR for both or at least for the recipes
(zod, JSON.parse)

[mhsattarian]

Hi @dai-shi, I've written this persist-with-cookies functionality and I'm willing to open a PR for the persistence guide. but there are a few changes to be added to the createJSONStorage for my implementation.

can I have your feedback on the code? and then if everything looks fine open a separate PR for the changes.

here is the code and usage example:

https://gist.github.com/mhsattarian/7e9e93b29ec4d11ef31c40e85052e8be

[dai-shi]

So, do you add subscribe in options? That sounds fair to me. Although the gist shows many unacceptable changes, we can discuss in a PR. I can't guarantee if it can be merged, but can you open one?

[mhsattarian]

Yes, that's the only goal. so I'll open the PR and try to do it with minimum changes and see where it goes.

[mhsattarian]

here is the PR: #2539.
I hope it meets the standards of this project.