example of persisting state using @xstate/store

[jericopulvera]

Can we add an example of this in the docs.

[davidkpiano]

Yes, good idea. Here's an example:

// Example of a counter store with localStorage persistence
const savedSnapshot = localStorage.getItem('store');
const initialSnapshot = savedSnapshot ? JSON.parse(savedSnapshot) : {
  context: {
    count: 0,
    lastUpdated: Date.now(),
    // ... any other state properties
  }
};

const counterStore = createStore({
  context: initialSnapshot.context,
  on: {
    increment: (context, event: { amount: number }) => ({
      ...context,
      count: context.count + event.amount,
      lastUpdated: Date.now()
    }),
    decrement: (context, event: { amount: number }) => ({
      ...context,
      count: context.count - event.amount,
      lastUpdated: Date.now()
    })
  }
});

// Handle persistence via subscription - persist entire snapshot
counterStore.subscribe((snapshot) => {
  localStorage.setItem('store', JSON.stringify(snapshot));
});

// Usage
counterStore.send({ type: 'increment', amount: 5 });
counterStore.send({ type: 'decrement', amount: 2 });