poi-plugin-quest-info-2 0.8.3 → 0.8.6

package/src/store/gameQuest.tsx

@@ -0,0 +1,20 @@
+import React, { createContext, useContext } from 'react'
+import type { ReactNode } from 'react'
+import { GameQuest } from '../poi/types'
+import { useGameQuest } from '../poi/hooks'
+
+export const GameQuestContext = createContext<GameQuest[]>([])
+
+export const GameQuestProvider = ({ children }: { children?: ReactNode }) => {
+  const gameQuest = useGameQuest()
+  return (
+    <GameQuestContext.Provider value={gameQuest}>
+      {children}
+    </GameQuestContext.Provider>
+  )
+}
+
+export const useGlobalGameQuest = () => {
+  const gameQuest = useContext(GameQuestContext)
+  return gameQuest
+}

package/src/store/quest.ts

@@ -1,5 +1,5 @@
 import { useCallback } from 'react'
-import { useGameQuest, usePluginTranslation } from '../poi/hooks'
+import { usePluginTranslation } from '../poi/hooks'
 import {
   DocQuest,
   getCategory,
@@ -11,6 +11,7 @@ import {
   QUEST_STATUS,
   UnionQuest,
 } from '../questHelper'
+import { useGlobalGameQuest } from './gameQuest'
 import { checkIsKcwikiSupportedLanguages, useKcwikiData } from './kcwiki'
 import { useStore, useSyncWithGame } from './store'
 
@@ -51,7 +52,7 @@ const useQuestMap = (): Record<string, DocQuest> => {
 
 export const useQuest = (): UnionQuest[] => {
   const docQuestMap = useQuestMap()
-  const gameQuest = useGameQuest()
+  const gameQuest = useGlobalGameQuest()
   const { syncWithGame } = useSyncWithGame()
 
   if (syncWithGame && gameQuest.length) {
@@ -101,7 +102,7 @@ export const useQuestByCode = (code: string) => {
 }
 
 export const useQuestStatus = (gameId: number | null) => {
-  const gameQuest = useGameQuest()
+  const gameQuest = useGlobalGameQuest()
 
   if (!gameId) {
     return QUEST_STATUS.UNKNOWN

package/src/store/store.tsx

@@ -4,10 +4,12 @@ import React, {
   SetStateAction,
   useCallback,
   useContext,
+  useState,
 } from 'react'
-import { ALL_TYPE_TAG, ALL_CATEGORY_TAG } from '../tags'
+import { useMount, useUpdateEffect } from 'react-use'
 import { name as PACKAGE_NAME } from '../../package.json'
-import { createGlobalState, useMount, useUpdateEffect } from 'react-use'
+import { ALL_CATEGORY_TAG, ALL_TYPE_TAG } from '../tags'
+import { GameQuestProvider } from './gameQuest'
 
 export const initialState = {
   searchInput: '',
@@ -27,28 +29,29 @@ export type State = typeof initialState
 // Persist state
 const STORAGE_KEY = PACKAGE_NAME
 
-const useStorage = (
-  store: State,
-  setState: (state: State) => void,
-  merge = true
-) => {
+const useStorage = <T,>(initialValue: T) => {
+  const [state, setState] = useState<T>(initialValue)
   // Load storage at mount
   useMount(() => {
-    const stringStore = localStorage.getItem(STORAGE_KEY)
-    if (stringStore == null) {
-      return
+    try {
+      const stringStore = localStorage.getItem(STORAGE_KEY)
+      if (stringStore == null) {
+        return
+      }
+      const parsedStorage: T = JSON.parse(stringStore)
+      setState(parsedStorage)
+    } catch (error) {
+      console.error('Failed to load storage', error)
     }
-    const parsedStorage: State = JSON.parse(stringStore)
-    // TODO use deep merge
-    const storageStore = merge ? { ...store, ...parsedStorage } : parsedStorage
-    setState(storageStore)
   })
 
   // Save storage when store change
   useUpdateEffect(() => {
-    const serializedStore = JSON.stringify(store)
+    const serializedStore = JSON.stringify(state)
     localStorage.setItem(STORAGE_KEY, serializedStore)
-  }, [store])
+  }, [state])
+
+  return [state, setState] as const
 }
 
 export const getStorage = () => {
@@ -62,15 +65,14 @@ export const getStorage = () => {
 const StateContext = createContext<State>(initialState)
 const SetStateContext = createContext<Dispatch<SetStateAction<State>>>(() => {})
 
-const useGlobalState = createGlobalState<State>(initialState)
-
 export const StoreProvider = ({ children }: { children?: React.ReactNode }) => {
-  const [state, setState] = useGlobalState()
-  useStorage(state, setState)
+  const [state, setState] = useStorage<State>(initialState)
   return (
-    <SetStateContext.Provider value={setState}>
-      <StateContext.Provider value={state}>{children}</StateContext.Provider>
-    </SetStateContext.Provider>
+    <GameQuestProvider>
+      <SetStateContext.Provider value={setState}>
+        <StateContext.Provider value={state}>{children}</StateContext.Provider>
+      </SetStateContext.Provider>
+    </GameQuestProvider>
   )
 }
 

package/src/tags.tsx

@@ -2,7 +2,7 @@ import { Tag } from '@blueprintjs/core'
 import React from 'react'
 import styled from 'styled-components'
 import { IN_POI } from './poi/env'
-import { useGameQuest, useGameTab, usePluginTranslation } from './poi/hooks'
+import { useGameTab, usePluginTranslation } from './poi/hooks'
 import { GameQuest, QuestTab } from './poi/types'
 import type { UnionQuest } from './questHelper'
 import {
@@ -27,8 +27,8 @@ import {
 } from './questHelper'
 import { useSyncWithGame } from './store'
 import { useFilterTags } from './store/filterTags'
-
-const yes = () => true as const
+import { useGlobalGameQuest } from './store/gameQuest'
+import { yes } from './utils'
 
 export const ALL_CATEGORY_TAG = {
   name: 'All',
@@ -119,7 +119,7 @@ export const TypeTags = () => {
   const { t } = usePluginTranslation()
   const gameTab = useGameTab()
   const { syncWithGame } = useSyncWithGame()
-  const gameQuests = useGameQuest()
+  const gameQuests = useGlobalGameQuest()
   const inProgressQuest = gameQuests.filter((gameQuest) =>
     isInProgressQuest(gameQuest)
   )

package/src/utils.ts

@@ -0,0 +1,15 @@
+export const noop = () => {}
+
+export const id = <T>(x: T) => x
+
+export const yes = () => true as const
+
+export const And =
+  <T extends (...args: any[]) => boolean>(...fnArray: T[]) =>
+  (...args: Parameters<T>) =>
+    fnArray.every((fn) => fn(...args))
+
+export const Or =
+  <T extends (...args: any[]) => boolean>(...fnArray: T[]) =>
+  (...args: Parameters<T>) =>
+    fnArray.some((fn) => fn(...args))