poi-plugin-quest-info-2 0.7.4 → 0.8.2

package/src/components/QuestTag.tsx

@@ -1,23 +1,70 @@
-import { Tag } from '@blueprintjs/core'
-import React, { useCallback } from 'react'
+import type { TooltipProps } from '@blueprintjs/core'
+import { Tag, Tooltip } from '@blueprintjs/core'
+import { IconNames } from '@blueprintjs/icons'
+import React, { forwardRef, useCallback } from 'react'
 import styled from 'styled-components'
-import { guessQuestCategory } from '../questHelper'
+import { DocQuest, guessQuestCategory, QUEST_STATUS } from '../questHelper'
 import { useFilterTags } from '../store/filterTags'
+import { useQuestByCode, useQuestStatus } from '../store/quest'
 import { useSearchInput } from '../store/search'
 
 const TagWrapper = styled(Tag)`
   margin: 2px 4px;
-  user-select: none;
+  user-select: ${({ interactive }) => (interactive ? 'none' : 'auto')};
   overflow: visible;
 
   & > span {
-    cursor: pointer;
+    cursor: ${({ interactive }) => (interactive ? 'pointer' : 'auto')};
   }
 `
 
+const QuestTooltip = forwardRef<
+  Tooltip,
+  Omit<TooltipProps, 'content'> & {
+    quest: DocQuest
+    children: React.ReactNode
+  }
+>(({ quest, children, ...props }, ref) => {
+  if (!quest) {
+    return <>{children}</>
+  }
+  return (
+    <Tooltip
+      ref={ref}
+      content={
+        <>
+          <div>{`${quest.code} - ${quest.name}`}</div>
+          <div>{quest.desc}</div>
+          {quest.memo2 && <b>{quest.memo2}</b>}
+          {quest.memo && <i>{quest.memo}</i>}
+        </>
+      }
+      placement={'top'}
+      {...props}
+    >
+      {children}
+    </Tooltip>
+  )
+})
+
+const getTagIcon = (questStatus: QUEST_STATUS) => {
+  switch (questStatus) {
+    case QUEST_STATUS.ALREADY_COMPLETED:
+      return IconNames.TICK
+    case QUEST_STATUS.LOCKED:
+      return IconNames.LOCK
+    default:
+      return null
+  }
+}
+
 export const QuestTag = ({ code }: { code: string }) => {
   const { setSearchInput } = useSearchInput()
   const { setCategoryTagsAll, setTypeTagsAll } = useFilterTags()
+  const maybeQuest = useQuestByCode(code)
+  const maybeGameId = maybeQuest?.gameId ?? null
+  const questStatus = useQuestStatus(maybeGameId)
+  const tagIcon = getTagIcon(questStatus)
 
   const handleClick = useCallback(() => {
     setSearchInput(code)
@@ -29,13 +76,29 @@ export const QuestTag = ({ code }: { code: string }) => {
     indicatorColor === '#fff' || indicatorColor === '#87da61'
       ? 'black'
       : 'white'
+
+  if (!maybeQuest) {
+    return (
+      <TagWrapper
+        icon={IconNames.HELP}
+        style={{ color: fontColor, background: indicatorColor }}
+      >
+        {code}
+      </TagWrapper>
+    )
+  }
+
+  const quest = maybeQuest.docQuest
   return (
-    <TagWrapper
-      onClick={handleClick}
-      interactive
-      style={{ color: fontColor, background: indicatorColor }}
-    >
-      {code}
-    </TagWrapper>
+    <QuestTooltip quest={quest}>
+      <TagWrapper
+        interactive
+        icon={tagIcon}
+        onClick={handleClick}
+        style={{ color: fontColor, background: indicatorColor }}
+      >
+        {code}
+      </TagWrapper>
+    </QuestTooltip>
   )
 }

package/src/poi/hooks.ts

@@ -1,9 +1,12 @@
-import { useState, useEffect } from 'react'
+import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { observePluginStore, observePoiStore } from './store'
 import { name as PACKAGE_NAME } from '../../package.json'
+import { observePluginStore, observePoiStore } from './store'
 import { GameQuest, PoiQuestState, PoiState, QuestTab } from './types'
 
+export const activeQuestsSelector = (state: PoiState): PoiQuestState =>
+  state?.info?.quests?.activeQuests ?? {}
+
 export const useActiveQuest = () => {
   const [activeQuests, setActiveQuests] = useState<PoiQuestState>({})
 
@@ -17,9 +20,6 @@ export const useActiveQuest = () => {
   return activeQuests
 }
 
-export const activeQuestsSelector = (state: PoiState): PoiQuestState =>
-  state?.info?.quests?.activeQuests ?? {}
-
 export const usePluginTranslation = () => {
   return useTranslation(PACKAGE_NAME)
 }
@@ -30,7 +30,7 @@ export const useGameQuest = () => {
     const listener = (quests: GameQuest[] | null) => setQuests(quests ?? [])
     // See reducer.ts
     return observePluginStore(listener, (i) => i?._?.questList)
-  }, [])
+  }, [setQuests])
   return quests
 }
 

package/src/questHelper.ts

@@ -1,9 +1,13 @@
-import questCategory from '../build/questCategory.json'
+import moize from 'moize'
+import { QuestData } from '../build/kcanotifyGamedata'
+import { KcwikiQuestData } from '../build/kcQuestsData'
 import newQuestData from '../build/kcQuestsData/quests-scn-new.json'
 import prePostQuest from '../build/prePostQuest.json'
+import questCategory from '../build/questCategory.json'
+import questCodeMap from '../build/questCodeMap.json'
 import { GameQuest, QUEST_API_STATE } from './poi/types'
 
-type DocQuest = {
+export type DocQuest = {
   code: string
   name: string
   desc: string
@@ -35,6 +39,9 @@ export type UnionQuest = {
   docQuest: DocQuest
 }
 
+export const getKcwikiQuestData = () => KcwikiQuestData
+export const getKcanotifyQuestData = () => QuestData
+
 const dailyQuest = new Set(questCategory.dailyQuest)
 const weeklyQuest = new Set(questCategory.weeklyQuest)
 const monthlyQuest = new Set(questCategory.monthlyQuest)
@@ -197,17 +204,80 @@ export const isUnknownCategoryQuest = ({ code }: DocQuest) =>
   // Starts with unknown character
   /^[^ABCDEFG]/.test(code)
 
-export const getPrePost = (gameId: number) => {
+export const getQuestPrePost = (gameId: number) => {
   if (!(gameId in prePostQuest)) {
     return { pre: [], post: [] }
   }
   return prePostQuest[String(gameId) as keyof typeof prePostQuest]
 }
 
+export const getQuestIdByCode = (code: string) => {
+  if (code in questCodeMap) {
+    return questCodeMap[code as keyof typeof questCodeMap]
+  }
+  return null
+}
+
+export const getPreQuestIds = (gameId: number): number[] =>
+  getQuestPrePost(gameId)
+    .pre.map((code) => getQuestIdByCode(code))
+    .filter(Boolean) as number[]
+
+export const getPostQuestIds = (gameId: number): number[] =>
+  getQuestPrePost(gameId)
+    .post.map((code) => getQuestIdByCode(code))
+    .filter(Boolean) as number[]
+
+const calcQuestMap = (
+  inProgressQuests: number[],
+  next: (gameId: number) => number[]
+) => {
+  const map: Record<number, true> = {}
+  const queue: number[] = inProgressQuests.flatMap(next)
+  while (queue.length) {
+    const gameId = queue.shift()!
+    if (gameId in map) {
+      continue
+    }
+    map[gameId] = true
+
+    next(gameId).forEach((nextGameId) => {
+      queue.push(nextGameId)
+    })
+  }
+  return map
+}
+
+export const getCompletedQuest = moize((inProgressQuest: number[]) => {
+  const completedQuest = calcQuestMap(inProgressQuest, getPreQuestIds)
+  return completedQuest
+})
+
+export const getLockedQuest = moize((inProgressQuest: number[]) => {
+  const lockedQuest = calcQuestMap(inProgressQuest, getPostQuestIds)
+  return lockedQuest
+})
+
+export const questApiStateToQuestStatus = (
+  state: QUEST_API_STATE | undefined
+): QUEST_STATUS => {
+  switch (state) {
+    case QUEST_API_STATE.DEFAULT:
+      return QUEST_STATUS.DEFAULT
+    case QUEST_API_STATE.COMPLETED:
+      return QUEST_STATUS.COMPLETED
+    case QUEST_API_STATE.IN_PROGRESS:
+      return QUEST_STATUS.IN_PROGRESS
+    default:
+      return QUEST_STATUS.DEFAULT
+  }
+}
+
 export enum QUEST_STATUS {
   LOCKED,
   DEFAULT,
   IN_PROGRESS,
   COMPLETED,
   ALREADY_COMPLETED,
+  UNKNOWN,
 }

package/src/store/kcwiki.ts

@@ -1,5 +1,5 @@
-import { KcwikiQuestData } from '../../build/kcQuestsData'
 import { useStore } from '.'
+import { getKcwikiQuestData } from '../questHelper'
 
 export const usePreferKcwiki = () => {
   const {
@@ -13,7 +13,10 @@ export const usePreferKcwiki = () => {
 
 export const checkIsKcwikiSupportedLanguages = (
   lang: string
-): lang is keyof typeof KcwikiQuestData => lang in KcwikiQuestData
+): lang is keyof typeof kcwikiQuestData => {
+  const kcwikiQuestData = getKcwikiQuestData()
+  return lang in kcwikiQuestData
+}
 
 export const useKcwikiData = (lang: string) => {
   const [preferKcwiki] = usePreferKcwiki()
@@ -25,5 +28,6 @@ export const useKcwikiData = (lang: string) => {
   if (!supported) {
     return null
   }
-  return KcwikiQuestData[lang]
+  const kcwikiQuestData = getKcwikiQuestData()
+  return kcwikiQuestData[lang]
 }

package/src/store/quest.ts

@@ -1,20 +1,31 @@
 import { useCallback } from 'react'
-import { QuestData } from '../../build/kcanotifyGamedata'
 import { useGameQuest, usePluginTranslation } from '../poi/hooks'
-import { getCategory } from '../questHelper'
-import type { UnionQuest } from '../questHelper'
-import { useKcwikiData, checkIsKcwikiSupportedLanguages } from './kcwiki'
+import {
+  DocQuest,
+  getCategory,
+  getCompletedQuest,
+  getKcanotifyQuestData,
+  getLockedQuest,
+  getQuestIdByCode,
+  questApiStateToQuestStatus,
+  QUEST_STATUS,
+  UnionQuest,
+} from '../questHelper'
+import { checkIsKcwikiSupportedLanguages, useKcwikiData } from './kcwiki'
 import { useStore, useSyncWithGame } from './store'
 
 const DEFAULT_LANG = 'ja-JP'
 
-export const checkIsKcanotifySupportedLanguages = (
+const checkIsKcanotifySupportedLanguages = (
   lang: string
-): lang is keyof typeof QuestData => lang in QuestData
+): lang is keyof typeof kcaQuestData => {
+  const kcaQuestData = getKcanotifyQuestData()
+  return lang in kcaQuestData
+}
 
 export const isSupportedLanguages = (
   lang: string
-): lang is keyof typeof QuestData =>
+): lang is keyof ReturnType<typeof getKcanotifyQuestData> =>
   checkIsKcanotifySupportedLanguages(lang) ||
   checkIsKcwikiSupportedLanguages(lang)
 
@@ -28,13 +39,14 @@ export const useLanguage = () => {
   return lang
 }
 
-const useQuestMap = () => {
+const useQuestMap = (): Record<string, DocQuest> => {
   const lang = useLanguage()
   const kcwikiData = useKcwikiData(lang)
   if (kcwikiData) {
     return kcwikiData
   }
-  return QuestData[lang]
+  const kcaQuestData = getKcanotifyQuestData()
+  return kcaQuestData[lang]
 }
 
 export const useQuest = (): UnionQuest[] => {
@@ -76,6 +88,40 @@ export const useQuest = (): UnionQuest[] => {
   }
 }
 
+export const useQuestByCode = (code: string): UnionQuest | null => {
+  const questMap = useQuestMap()
+  const gameId = getQuestIdByCode(code)
+  if (gameId && gameId in questMap) {
+    return {
+      gameId,
+      docQuest: questMap[String(gameId) as keyof typeof questMap],
+    }
+  }
+  return null
+}
+
+export const useQuestStatus = (gameId: number | null) => {
+  const gameQuest = useGameQuest()
+  const gameQuestId = gameQuest.map((quest) => quest.api_no)
+  const completedQuest = getCompletedQuest(gameQuestId)
+  const lockedQuest = getLockedQuest(gameQuestId)
+
+  if (!gameId) {
+    return QUEST_STATUS.UNKNOWN
+  }
+  const theGameQuest = gameQuest.find((quest) => quest.api_no === gameId)
+  if (theGameQuest) {
+    return questApiStateToQuestStatus(theGameQuest.api_state)
+  }
+  if (gameId in lockedQuest) {
+    return QUEST_STATUS.LOCKED
+  }
+  if (gameId in completedQuest) {
+    return QUEST_STATUS.ALREADY_COMPLETED
+  }
+  return QUEST_STATUS.UNKNOWN
+}
+
 /**
  * @deprecated Not large card now
  */

package/src/tags.tsx

@@ -38,12 +38,12 @@ export const ALL_CATEGORY_TAG = {
 export const ALL_TYPE_TAG = ALL_CATEGORY_TAG
 
 const withDocQuest =
-  <T extends any>(filterFn: (q: UnionQuest['docQuest']) => T) =>
+  <T,>(filterFn: (q: UnionQuest['docQuest']) => T) =>
   (unionQuest: UnionQuest) =>
     filterFn(unionQuest.docQuest)
 
 const withGameQuestOr =
-  <T extends any>(filterFn: (q: GameQuest) => T, fallback: T) =>
+  <T,>(filterFn: (q: GameQuest) => T, fallback: T) =>
   ({ gameQuest }: UnionQuest) => {
     if (!gameQuest) {
       return fallback

package/tsconfig.json

@@ -44,7 +44,7 @@
     // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
     // "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */
     // "noUncheckedIndexedAccess": true,      /* Include 'undefined' in index signature results */
-    "importsNotUsedAsValues": "error",
+    // "importsNotUsedAsValues": "error",
 
     /* Module Resolution Options */
     // "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */