useState Clone: Nuxt 3 useState composables for Nuxt 2 app

useState.ts

import { Ref } from 'vue'
import { createGlobalState, createSharedComposable } from '@vueuse/core'

const createBaseStore = <T>() => createGlobalState<Record<string, Ref<T>>>(() => reactive({}))
const useBaseStore = createSharedComposable(createBaseStore)

export const useState = <T>(key: string, init?: () => T): Ref<T> => {
  const store = useBaseStore<T>()

  const state = store[key]
  if (state !== undefined) {
    return state
  }
  const initialValue = ref(init()) as Ref<T>
  store[key] = initialValue
  return initialValue
}