import { writable, type Writable } from 'svelte/store';
import { browser } from '$app/environment';

export const persistentStore = <T>(key: string, initial: T): Writable<T> => {
  const store = writable<T>(initial);

  if (browser)
    import('localforage').then((localforage) => {
      localforage.default.getItem<T>(key).then((value) => {
        if (value !== null) store.set(value);
      });

      store.subscribe((value) => {
        localforage.default.setItem(key, value);
      });
    });

  return store;
};