It won't render if unified text code is fetched from localStorage or a cached Firestore get.

[Molnfront]

I am using <Emoji unified="{emoji}" size="25" /> to view users emoji on a page. If I fetch it from localStorage where I have user info cached, it does not render. If I fetch it from Firestore as a cached doc with getDocFromCache it won't render. Though I get all the data. Only way to show it is if I hardcode it or fetch it directly from Firestore with getDoc. Very Strange and frustrating.

[ealush]

The picker itself uses local storage to retain emoji history, so that's probably not the issue.

I would look at the way you're serializing or deserializing the object you store in LS. Maybe you keep it a string?

[Molnfront]

Yes just kept it simple and stored it as a stirng. Maybe I should try with a json?

Actually I did this localStorage.setItem('emoji', JSON.stringify(result?.emoji));

And fetched with this: useState(localStorage.getItem('emoji')

I should have probably parsed it ... JSON.parse(localStorage.getItem('emoji')

I will try that tomorow.

[Molnfront]

Ok solved!

A more stringent approach to serializasing and json solved it.

Now I fetch it from Firestore when the user loggs in and add it to localStorage. localStorage.setItem('emoji', JSON.stringify(em));

Also tried to put it in the Firebase auth session, but push did not work.

[Molnfront]

Closing!