poi-plugin-quest-info-2 0.8.9 → 0.9.1

package/src/tags.tsx

@@ -1,7 +1,7 @@
 import { Tag } from '@blueprintjs/core'
+import { IconNames } from '@blueprintjs/icons'
 import React from 'react'
 import styled from 'styled-components'
-import { IN_POI } from './poi/env'
 import { useGameTab, usePluginTranslation } from './poi/hooks'
 import { GameQuest, QuestTab } from './poi/types'
 import type { UnionQuest } from './questHelper'
@@ -25,17 +25,14 @@ import {
   isYearlyQuest,
   newQuestNumber,
 } from './questHelper'
-import { useSyncWithGame } from './store'
-import { useFilterTags } from './store/filterTags'
-import { useGlobalGameQuest } from './store/gameQuest'
-import { yes } from './utils'
-
-export const ALL_CATEGORY_TAG = {
-  name: 'All',
-  filter: yes,
-} as const
-
-export const ALL_TYPE_TAG = ALL_CATEGORY_TAG
+import {
+  ALL_CATEGORY_TAG,
+  ALL_TYPE_TAG,
+  PROGRESS_TAG,
+  useSyncWithGame,
+} from './store'
+import { useFilterProgressTag, useFilterTags } from './store/filterTags'
+import { useGlobalGameQuest, useGlobalQuestStatusNum } from './store/gameQuest'
 
 const withDocQuest =
   <T,>(filterFn: (q: UnionQuest['docQuest']) => T) =>
@@ -78,9 +75,9 @@ export const TYPE_TAGS = [
   { name: 'Yearly', filter: isYearlyQuest },
 ] as const
 
-// TODO tag Lock / Completed
-
 const TagsWrapper = styled.div`
+  display: flex;
+  flex-wrap: wrap;
   margin-left: -4px;
   margin-right: -4px;
 
@@ -89,10 +86,61 @@ const TagsWrapper = styled.div`
   }
 `
 
-export const CategoryTags = () => {
+export const ProgressTags = () => {
   const { t } = usePluginTranslation()
+  const { progressTag, toggleTag } = useFilterProgressTag()
+  const {
+    lockedQuestNum,
+    unlockedQuestNum,
+    completedQuestNum,
+    alreadyCompletedQuestNum,
+  } = useGlobalQuestStatusNum()
+  const completedQuestSuffix =
+    completedQuestNum > 0
+      ? `${alreadyCompletedQuestNum} + ${completedQuestNum}`
+      : alreadyCompletedQuestNum
+  return (
+    <>
+      <Tag
+        onClick={() => {
+          toggleTag(PROGRESS_TAG.Locked)
+        }}
+        intent={progressTag === PROGRESS_TAG.Locked ? 'success' : 'none'}
+        interactive={true}
+      >
+        {t('Locked', { number: lockedQuestNum })}
+      </Tag>
+      <Tag
+        icon={IconNames.EXCHANGE}
+        onClick={() => {
+          toggleTag(PROGRESS_TAG.Unlocked)
+        }}
+        intent={progressTag === PROGRESS_TAG.Unlocked ? 'success' : 'none'}
+        interactive={true}
+      >
+        {t('Unlocked', { number: unlockedQuestNum })}
+      </Tag>
+      <Tag
+        onClick={() => {
+          toggleTag(PROGRESS_TAG.AlreadyCompleted)
+        }}
+        intent={
+          progressTag === PROGRESS_TAG.AlreadyCompleted ? 'success' : 'none'
+        }
+        interactive={true}
+      >
+        {t('Already Completed', {
+          number: completedQuestSuffix,
+        })}
+      </Tag>
+    </>
+  )
+}
 
+export const CategoryTags = () => {
+  const { t } = usePluginTranslation()
   const { categoryTags, setCategoryTags } = useFilterTags()
+
   return (
     <TagsWrapper>
       {CATEGORY_TAGS.map(({ name }) => (
@@ -111,6 +159,8 @@ export const CategoryTags = () => {
           {t(name)}
         </Tag>
       ))}
+
+      <ProgressTags />
     </TagsWrapper>
   )
 }
@@ -120,6 +170,8 @@ export const TypeTags = () => {
   const gameTab = useGameTab()
   const { syncWithGame } = useSyncWithGame()
   const gameQuests = useGlobalGameQuest()
+  const { progressTag } = useFilterProgressTag()
+
   const inProgressQuest = gameQuests.filter((gameQuest) =>
     isInProgressQuest(gameQuest)
   )
@@ -136,15 +188,22 @@ export const TypeTags = () => {
       >
         {t('All')}
       </Tag>
-      {IN_POI && (
-        <Tag
-          intent={typeTags['In Progress'] ? 'primary' : 'none'}
-          interactive={true}
-          onClick={() => setTypeTags('In Progress')}
-        >
-          {t('In Progress', { number: inProgressQuest.length })}
-        </Tag>
-      )}
+
+      <Tag
+        intent={
+          typeTags['In Progress']
+            ? progressTag === PROGRESS_TAG.AlreadyCompleted ||
+              progressTag === PROGRESS_TAG.Locked
+              ? 'warning'
+              : 'primary'
+            : 'none'
+        }
+        interactive={true}
+        onClick={() => setTypeTags('In Progress')}
+      >
+        {t('In Progress', { number: inProgressQuest.length })}
+      </Tag>
+
       {hasNewQuest && (
         <Tag
           intent={typeTags['New'] ? 'primary' : 'none'}

package/tsconfig.json

@@ -13,7 +13,7 @@
     ] /* Specify library files to be included in the compilation. */,
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
-    "jsx": "preserve",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
+    "jsx": "react",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
     // "declaration": true,                   /* Generates corresponding '.d.ts' file. */
     // "declarationMap": true,                /* Generates a sourcemap for each corresponding '.d.ts' file. */
     // "sourceMap": true,                     /* Generates corresponding '.map' file. */