fix: 题目搜索字符串存到localstorage

src/GZCTF/ClientApp/src/components/ChallengePanel.tsx

@@ -18,7 +18,7 @@ import { useLocalStorage } from '@mantine/hooks'
 import { mdiFileUploadOutline, mdiFlagOutline, mdiPuzzle } from '@mdi/js'
 import { Icon } from '@mdi/react'
 import dayjs from 'dayjs'
-import React, { FC, useState } from 'react'
+import React, { FC, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useParams } from 'react-router-dom'
 import ChallengeCard from '@Components/ChallengeCard'
@@ -50,7 +50,11 @@ const ChallengePanel: FC = () => {
     defaultValue: false,
     getInitialValueInEffect: false,
   })
-  const [searchText, setSearchText] = useState<string>('')
+  const [searchText, setSearchText] = useLocalStorage({
+    key: 'challenge-search-pattern',
+    defaultValue: '',
+    getInitialValueInEffect: true,
+  })
   const [searchPattern, setSearchPattern] = useState<RegExp | null>(null)
 
   const allChallenges = Object.values(challenges ?? {}).flat()
@@ -64,8 +68,8 @@ const ChallengePanel: FC = () => {
             SubmissionType.Unaccepted)
       )) ?? []
   const searchedChallenges = unsolvedTaggedChallenges.filter(
-    (chal) => !searchPattern || chal.title && searchPattern.test(chal.title)
-  )
+      (chal) => !searchPattern || chal.title && searchPattern.test(chal.title)
+    )
   const currentChallenges = searchedChallenges.length ? searchedChallenges : unsolvedTaggedChallenges
 
   const [challenge, setChallenge] = useState<ChallengeInfo | null>(null)
@@ -75,6 +79,14 @@ const ChallengePanel: FC = () => {
   const challengeTagLabelMap = useChallengeTagLabelMap()
   const { t } = useTranslation()
 
+  useEffect(() => {
+    try {
+      setSearchPattern(searchText.trim() ? new RegExp(searchText.trim(), 'i') : null)
+    } catch {
+      setSearchPattern(null)
+    }
+  }, [searchText])
+
   // skeleton for loading
   if (!challenges) {
     return (
@@ -188,14 +200,7 @@ const ChallengePanel: FC = () => {
           placeholder={t('game.placeholder.challenge_search')}
           value={searchText ?? ''}
           error={searchText.trim() !== '' && (!searchPattern || searchedChallenges.length === 0)}
-          onChange={(e) => {
-            setSearchText(e.currentTarget.value)
-            try {
-              setSearchPattern(e.currentTarget.value.trim() ? new RegExp(e.currentTarget.value.trim(), 'i') : null)
-            } catch {
-              setSearchPattern(null)
-            }
-          }}
+          onChange={(e) => setSearchText(e.currentTarget.value)}
           w="10rem"
           styles={{
             body: {

src/GZCTF/ClientApp/src/components/ScoreboardTable.tsx

@@ -261,7 +261,7 @@ export interface ScoreboardProps {
   organization: string | null
   setOrganization: (org: string | null) => void
   titlePattern: string | null
-  setTitlePattern: (pattern: string | null) => void
+  setTitlePattern: (pattern: string | ((prevState: string) => string)) => void
   category: ChallengeTag | null
   setCategory: (tag: ChallengeTag | null) => void
 }
@@ -286,12 +286,6 @@ const ScoreboardTable: FC<ScoreboardProps> = ({
   const [searchTextBuffer, setSearchTextBuffer] = useState<string | null>('')
   const [searchCloseButtonVisible, setSearchCloseButtonVisible] = useState(false)
   const [filterTips, setFilterTips] = useState('')
-  const onSearch = (searchText: string) => {
-    setTitlePattern(searchText)
-    setSearchTextBuffer(searchText)
-    setSearchCloseButtonVisible(searchText.length > 0)
-    setPage(1)
-  }
 
   const [updatingBarrier, setUpdatingBarrier] = useState(true)
 
@@ -313,6 +307,9 @@ const ScoreboardTable: FC<ScoreboardProps> = ({
     }
 
     setUpdatingBarrier(false)
+    setSearchTextBuffer(titlePattern ?? '')
+    setSearchCloseButtonVisible((titlePattern?.length ?? 0) > 0)
+    setPage(1)
     try {
       const customScoreboard = generateCustomScoreboard(
         scoreboard,
@@ -381,7 +378,7 @@ const ScoreboardTable: FC<ScoreboardProps> = ({
                   <ActionIcon
                     variant="transparent"
                     color="dimmed"
-                    onClick={() => onSearch(searchTextBuffer?.trim() ?? '')}
+                    onClick={() => setTitlePattern(searchTextBuffer?.trim() ?? '')}
                   >
                     <Icon path={mdiMagnify} size={0.8} />
                   </ActionIcon>
@@ -391,11 +388,11 @@ const ScoreboardTable: FC<ScoreboardProps> = ({
                   <CloseButton
                     color="dimmed"
                     size={'sm'}
-                    onClick={() => onSearch('')}
+                    onClick={() => setTitlePattern('')}
                   />
                 }
                 onKeyDown={(e) =>
-                  updatingBarrier && e.key === 'Enter' && onSearch(searchTextBuffer?.trim() ?? '')
+                  e.key === 'Enter' && updatingBarrier && setTitlePattern(searchTextBuffer?.trim() ?? '')
                 }
                 value={searchTextBuffer ?? ''}
                 onChange={(e) => {

src/GZCTF/ClientApp/src/pages/games/[id]/Scoreboard.tsx

@@ -10,14 +10,19 @@ import WithNavBar from '@Components/WithNavbar'
 import { useIsMobile } from '@Utils/ThemeOverride'
 import { useGameTeamInfo } from '@Utils/useGame'
 import { ChallengeTag } from '@Api'
+import { useLocalStorage } from '@mantine/hooks'
 
 const Scoreboard: FC = () => {
   const { id } = useParams()
   const numId = parseInt(id ?? '-1')
   const { teamInfo, error } = useGameTeamInfo(numId)
 
   const [organization, setOrganization] = useState<string | null>('all')
-  const [titlePattern, setTitlePattern] = useState<string | null>(null)
+  const [titlePattern, setTitlePattern] = useLocalStorage({
+    key: 'scoreboard-search-pattern',
+    defaultValue: '',
+    getInitialValueInEffect: false,
+  })
   const [category, setCategory] = useState<ChallengeTag | null>(null)
 
   const scoreboardProps: ScoreboardProps = {