import { createApp } from 'vue'
import App from './App.vue'
import './index.css'
import router from './router'
import { createPinia, SubscriptionCallbackMutation } from 'pinia'
import { useBudgetsStore } from './stores/budget';
import { useSessionStore } from './stores/session';
import { useSettingsStore } from './stores/settings';
import { useAccountStore } from './stores/budget-account'
import PiniaLogger from './pinia-logger'

const app = createApp(App)
app.use(router)

const pinia = createPinia()
pinia.use(PiniaLogger())
app.use(pinia)
app.mount('#app')

router.beforeEach(async (to, from, next) => {
  const budgetStore = useBudgetsStore();
  await budgetStore.SetCurrentBudget((<string>to.params.budgetid));

  const accountStore = useAccountStore();
  await accountStore.SetCurrentAccount((<string>to.params.budgetid), (<string>to.params.accountid));
  next();
})

function saveStateToLocalStorage(mutation : SubscriptionCallbackMutation<any>, state : any) {
  localStorage.setItem(mutation.storeId, JSON.stringify(state));
  console.log("saving to local storage", mutation)
}

useSettingsStore().$subscribe(saveStateToLocalStorage);
useBudgetsStore().$subscribe(saveStateToLocalStorage);
useSessionStore().$subscribe(saveStateToLocalStorage);