Release

.editorconfig

@@ -6,6 +6,7 @@ indent_style = space
 indent_size = 2
 insert_final_newline = true
 trim_trailing_whitespace = true
+end_of_line = lf
 
 [*.{js,ts,jsx,tsx,css,json,md,mdx,yml,yaml}]
 indent_size = 2

.vscode/extensions.json

@@ -0,0 +1,5 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint"
+  ]
+}

package.json

@@ -88,7 +88,7 @@
     "pinyin": "^3.0.0-alpha.5",
     "simplebig": "^0.0.3",
     "tailwindcss": "^3.1.4",
-    "typescript": "^5.3.3",
+    "typescript": "^5.5.0",
     "vite": "^4.2.1"
   },
   "resolutions": {

scripts/shared.ts

@@ -111,6 +111,7 @@ export async function getOperators() {
       return [
         {
           id: id,
+          prof: op.profession,
           subProf: op.subProfessionId,
           ...transformOperatorName(op.name),
           rarity:

src/components/AccountManager.tsx

@@ -33,6 +33,7 @@ const AccountMenu: FC = () => {
   const [authState, setAuthState] = useAtom(authAtom)
   const [logoutDialogOpen, setLogoutDialogOpen] = useState(false)
   const [editDialogOpen, setEditDialogOpen] = useState(false)
+  const { isSM } = useCurrentSize()
 
   const handleLogout = () => {
     setAuthState({})
@@ -72,6 +73,14 @@ const AccountMenu: FC = () => {
           />
         )}
 
+        {isSM && (
+          <MenuItem
+            shouldDismissPopover={false}
+            icon="user"
+            text={authState.username}
+          />
+        )}
+
         <MenuItem
           shouldDismissPopover={false}
           icon="edit"
@@ -161,7 +170,7 @@ export const AccountManager: ComponentType = withGlobalErrorBoundary(() => {
         <Popover2 content={<AccountMenu />} position={Position.BOTTOM_RIGHT}>
           <Button
             icon="user"
-            text={authState.username}
+            text={!isSM && authState.username}
             rightIcon="caret-down"
           />
         </Popover2>

src/components/FactItem.tsx

@@ -19,8 +19,12 @@ export const FactItem: FCC<{
       className,
     )}
   >
-    {icon && <Icon icon={icon} className="mr-2 text-zinc-500 dark:text-slate-100" />}
-    <div className="text-sm mr-2 text-zinc-500 dark:text-slate-100">{title}</div>
+    {icon && (
+      <Icon icon={icon} className="mr-2 text-zinc-500 dark:text-slate-100" />
+    )}
+    <div className="text-sm mr-2 text-zinc-500 dark:text-slate-100">
+      {title}
+    </div>
     {children}
   </div>
 )

src/components/HelperText.tsx

@@ -22,7 +22,12 @@ export const HelperText: FCC<{
   }
 
   return (
-    <div className={clsx('flex text-gray-600 dark:text-zinc-400 text-xs items-center', className)}>
+    <div
+      className={clsx(
+        'flex text-gray-600 dark:text-zinc-400 text-xs items-center',
+        className,
+      )}
+    >
       <Icon icon="info-sign" size={12} className="mr-1.5" />
       <div>{child()}</div>
     </div>

src/components/OperationCard.tsx

@@ -20,12 +20,11 @@ export const NeoOperationCard = ({ operation }: { operation: Operation }) => {
   const { data: levels } = useLevels()
 
   return (
-    <Card
-      interactive={true}
-      elevation={Elevation.TWO}
-      className="relative flex flex-col gap-2"
-    >
-      <ReLink search={{ op: operation.id }} className="block no-underline">
+    <Card interactive={true} elevation={Elevation.TWO} className="relative">
+      <ReLink
+        search={{ op: operation.id }}
+        className="no-underline h-full flex flex-col gap-2"
+      >
         <div className="flex">
           <Tooltip2
             content={operation.parsedContent.doc.title}

src/components/Paragraphs.tsx

@@ -20,7 +20,7 @@ export const Paragraphs: FC<{
     const { height } = paragraphElementRef.current.getBoundingClientRect()
 
     setExceededLimitHeight(height > limitHeight)
-  }, [paragraphElementRef.current, limitHeight])
+  }, [limitHeight])
 
   const mask = exceededLimitHeight
     ? 'linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) calc(100% - 2rem), rgba(0,0,0,0) 100%)'
@@ -40,9 +40,7 @@ export const Paragraphs: FC<{
       }}
     >
       <div ref={paragraphElementRef}>
-        {paragraphs?.map((paragraph, index) => (
-          <p key={index}>{paragraph}</p>
-        ))}
+        {paragraphs?.map((paragraph, index) => <p key={index}>{paragraph}</p>)}
       </div>
     </div>
   )

src/components/Suspensable.tsx

@@ -24,6 +24,7 @@ export const Suspensable: FCC<SuspensableProps> = ({
   useEffect(() => {
     resetError.current?.()
     resetError.current = undefined
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, retryDeps)
 
   return (

src/components/ThemeSwitchButton.tsx

@@ -1,16 +1,16 @@
 import { Button } from '@blueprintjs/core'
 
-import { useEffect, useState } from 'react'
+import { useCallback, useEffect, useState } from 'react'
 
 const themeMedia = window.matchMedia('(prefers-color-scheme: light)')
 
 export const ThemeSwitchButton = () => {
   const [theme, setTheme] = useState(localStorage.getItem('theme') || '')
-  const handleThemeSwitch = () => {
+  const handleThemeSwitch = useCallback(() => {
     const isCurrentDark = theme === 'dark'
     setTheme(isCurrentDark ? 'light' : 'dark')
     localStorage.setItem('theme', isCurrentDark ? 'light' : 'dark')
-  }
+  }, [theme])
   useEffect(() => {
     if (!themeMedia.matches && !localStorage.getItem('theme')) {
       handleThemeSwitch()
@@ -23,7 +23,7 @@ export const ThemeSwitchButton = () => {
       document.body.classList.remove('bp4-dark')
       document.body.classList.remove('dark')
     }
-  }, [theme])
+  }, [theme, handleThemeSwitch])
   return (
     <Button
       onClick={handleThemeSwitch}

src/components/account/EditDialog.tsx

@@ -92,7 +92,7 @@ const InfoPanel = ({ onClose }) => {
 
   useEffect(() => {
     reset(auth)
-  }, [auth])
+  }, [auth, reset])
 
   const globalError = (errors as FieldErrors<{ global: void }>).global?.message
 

src/components/announcement/AnnPanel.tsx

@@ -43,7 +43,7 @@ export const AnnPanel: FC<AnnPanelProps> = ({ className }) => {
       setDisplaySections(freshSections)
       setLastNoticed(Date.now())
     }
-  }, [announcement])
+  }, [announcement, lastNoticed, setLastNoticed])
 
   return (
     <>
@@ -60,9 +60,9 @@ export const AnnPanel: FC<AnnPanelProps> = ({ className }) => {
         <div className="flex">
           {announcement && (
             <ul className="grow list-disc pl-4">
-              {announcement?.sections.slice(0, 3).map(({ title }) => (
-                <li key={title}>{title}</li>
-              ))}
+              {announcement?.sections
+                .slice(0, 3)
+                .map(({ title }) => <li key={title}>{title}</li>)}
             </ul>
           )}
           {!announcement && error && (

src/components/editor/EditorFieldProps.tsx

@@ -48,10 +48,8 @@ type PathOfType<T, P extends Path<T> | ArrayPath<T>, U> = P extends any
  * }
  * ```
  */
-export interface EditorFieldProps<
-  TFieldValues extends FieldValues,
-  TType = any,
-> extends UseControllerProps<
+export interface EditorFieldProps<TFieldValues extends FieldValues, TType = any>
+  extends UseControllerProps<
     TFieldValues,
     // the Cast here is a workaround for the fact that TS cannot correctly recognize
     // that the result of PathOfType is assignable to FieldPath<TFieldValues>

src/components/editor/NumericInput2.tsx

@@ -3,6 +3,7 @@ import {
   NumericInput,
   NumericInputProps,
 } from '@blueprintjs/core'
+
 import { useRef, useState } from 'react'
 
 type MixedNumericInputProps = HTMLInputProps & NumericInputProps

src/components/editor/OperationEditor.tsx

@@ -276,7 +276,7 @@ export const OperationEditor: FC<OperationEditorProps> = ({
         )
       }
     }
-  }, [stageName, levels])
+  }, [stageName, levels, getValues, setValue])
 
   const globalError = (errors as FieldErrors<{ global: void }>).global?.message
 

src/components/editor/action/EditorActionAdd.tsx

@@ -90,12 +90,15 @@ export const EditorActionAdd = ({
     [levels, stageName],
   )
 
-  const resettingValues: DeepPartial<CopilotDocV1.Action> = {
-    ...defaultAction,
-    // to prevent layout jumping, we persist the action type on reset
-    type,
-    ...(type === 'MoveCamera' ? defaultMoveCameraAction : null),
-  }
+  const resettingValues: DeepPartial<CopilotDocV1.Action> = useMemo(
+    () => ({
+      ...defaultAction,
+      // to prevent layout jumping, we persist the action type on reset
+      type,
+      ...(type === 'MoveCamera' ? defaultMoveCameraAction : null),
+    }),
+    [type],
+  )
 
   useEffect(() => {
     if (editingAction) {
@@ -154,13 +157,13 @@ export const EditorActionAdd = ({
     } else {
       reset(resettingValues)
     }
-  }, [editingAction])
+  }, [editingAction, reset, resettingValues, setValue])
 
   useEffect(() => {
     if (type === 'MoveCamera') {
       reset(resettingValues)
     }
-  }, [type])
+  }, [type, reset, resettingValues])
 
   useEffect(() => {
     setValue(
@@ -169,7 +172,7 @@ export const EditorActionAdd = ({
         ? (editingAction as CopilotDocV1.ActionSkillUsage)?.skillTimes ?? 1
         : undefined,
     )
-  }, [skillUsage])
+  }, [skillUsage, editingAction, setValue])
 
   const onSubmit = handleSubmit((values) => {
     if ('name' in values) {

src/components/editor/floatingMap/FloatingMap.tsx

@@ -70,7 +70,7 @@ export function FloatingMap() {
       x: clamp(cfg.x, 0, windowWidth - cfg.width),
       y: clamp(cfg.y, 0, windowHeight - cfg.height),
     }))
-  }, [windowWidth, windowHeight])
+  }, [setConfig, windowWidth, windowHeight])
 
   const [iframeWindow, setIframeWindow] = useState<Window | null | undefined>()
   const [mapStatus, setMapStatus] = useState(MapStatus.Loading)
@@ -81,7 +81,7 @@ export function FloatingMap() {
     // when level changes, the iframe should reload
     setMapStatus(MapStatus.Loading)
     setConfig((cfg) => ({ ...cfg, level }))
-  }, [level])
+  }, [setConfig, level])
 
   const setMapState = useCallback(() => {
     if (iframeWindow) {
@@ -136,7 +136,7 @@ export function FloatingMap() {
       toggleIframePointerEvents(false)
       setConfig((cfg) => ({ ...cfg, x, y }))
     },
-    [toggleIframePointerEvents],
+    [setConfig, toggleIframePointerEvents],
   )
 
   const onResizeStartHandler = useCallback(() => {
@@ -153,7 +153,7 @@ export function FloatingMap() {
         height: parseFloat(ref.style.height),
       }))
     },
-    [toggleIframePointerEvents],
+    [setConfig, toggleIframePointerEvents],
   )
 
   return createPortal(

src/components/editor/operator/EditorOperator.tsx

@@ -11,7 +11,7 @@ import { CopilotDocV1 } from '../../../models/copilot.schema'
 import { OPERATORS } from '../../../models/operator'
 import { Suggest } from '../../Suggest'
 
-type OperatorInfo = typeof OPERATORS[number]
+type OperatorInfo = (typeof OPERATORS)[number]
 type PerformerItem = OperatorInfo | CopilotDocV1.Group
 
 const isOperator = (item: PerformerItem): item is OperatorInfo =>

src/components/editor/operator/EditorPerformer.tsx

@@ -312,13 +312,6 @@ export const EditorPerformer: FC<EditorPerformerProps> = ({ control }) => {
     setError,
     fromSheet,
   ) => {
-    const removeOperatorByArray = () =>
-      removeOperator(
-        group.opers
-          ?.map((item) => operators.findIndex(({ name }) => name === item.name))
-          .filter((item) => item !== -1),
-      )
-
     if (
       groups.find(({ name, _id }) => name === group.name && _id !== group._id)
     ) {
@@ -331,7 +324,6 @@ export const EditorPerformer: FC<EditorPerformerProps> = ({ control }) => {
         : findGroupById(getId(editingGroup!))
       if (existingGroup) {
         group._id = getId(existingGroup)
-        if (fromSheet) removeOperatorByArray()
         updateGroup(
           groups.findIndex(({ _id }) => _id === existingGroup._id),
           group,
@@ -344,7 +336,15 @@ export const EditorPerformer: FC<EditorPerformerProps> = ({ control }) => {
     } else {
       group._id = uniqueId()
       appendGroup(group)
-      if (group.opers?.length) removeOperatorByArray()
+      if (group.opers?.length) {
+        removeOperator(
+          group.opers
+            ?.map((item) =>
+              operators.findIndex(({ name }) => name === item.name),
+            )
+            .filter((item) => item !== -1),
+        )
+      }
     }
 
     return true