useStore() Value Incorrectly Rendered in Astro SPA Mode

[AustinFoss]

I'm using SolidJS for the first time; to get familiar with it I'm recreating a simple template project I originally did using Svelte components in Astro. In doing so I noticed some odd behavioral differences between mirrored Svelte and Solid components using the same Nanostores store.

My template project can be found here for reference: https://github.com/AustinFoss/astro-nanostores-example/tree/main

It's an Astro project using their SPA mode: https://docs.astro.build/en/guides/view-transitions/#full-site-view-transitions-spa-mode

At first the useStore function correctly updates the Solid component's DOM, and the Svelt counterpart's simultaneously. But when navigating away to the "About" page then back "Home" only the Svelte component initially displays the number where the counter left off while the Solid counter shows 0. However, when resuming to increment/decrement the counter Solid jumps directly back to where it left off.

I'm not exactly sure how to prompt the Solid component to remember it's old value before the page transition, nor am I exactly sure this is a problem with @nanostores/solid or astro:transitions. This is most likely a problem with my understanding of how Solid does it's rendering but if anyone can help shed some light on this and offer some insight that would be much appreciated.

[AustinFoss]

I've just got around to editing this issue with an added gif better demonstrating the issue without someone needing to clone my repo.

Edit: By cross posting over in the Astro repo and following their example I was introduced to Stackblitz and how to link to a minimal reproducible example - https://stackblitz.com/~/github.com/AustinFoss/astro-nanostores-example