chore: migrate to eslitn flat configuration

.eslintignore

@@ -1 +0,0 @@
-**/dist/**

.eslintrc.cjs

@@ -1,34 +0,0 @@
-module.exports = {
-    root: true,
-    extends: [
-        '@pionxzh/eslint-config-react',
-    ],
-    rules: {
-        'no-console': 'off',
-        'no-alert': 'off',
-        'react/prop-types': 'off',
-        'react/no-unknown-property': ['error', {
-            ignore: [
-                'stroke-width',
-                'stroke-linecap',
-                'stroke-linejoin',
-            ],
-        }],
-        '@typescript-eslint/ban-ts-comment': 'off',
-        '@typescript-eslint/no-unused-vars': 'off',
-    },
-    overrides: [
-        {
-            files: ['template.html'],
-            rules: {
-                'no-undef': 'off',
-            },
-        },
-        {
-            files: ['**/*.md/*.*'],
-            rules: {
-                'jsonc/indent': ['error', 4],
-            },
-        },
-    ],
-}

.vscode/settings.json

@@ -1,6 +1,7 @@
 {
+  "eslint.experimental.useFlatConfig": true,
   "editor.codeActionsOnSave": {
-    "source.fixAll": "explicit",
+    "source.fixAll": false,
     "source.fixAll.eslint": true, // this allows ESLint to auto fix on save
     "source.organizeImports": false
   },
@@ -15,7 +16,8 @@
     "markdown",
     "json",
     "jsonc",
-    "json5"
+    "json5",
+    "yaml"
   ],
   "prettier.enable": false,
   "cSpell.words": [

eslint.config.js

@@ -0,0 +1,18 @@
+import pionxzh from '@pionxzh/eslint-config'
+
+export default pionxzh(
+    {
+        typescript: true,
+        react: true,
+        vue: false,
+        yaml: false,
+        ignores: ['*.md', '.release-please-manifest.json'],
+    },
+    {
+        rules: {
+            'no-alert': 'off',
+            'ts/ban-types': 'off',
+            'node/prefer-global/process': 'off',
+        },
+    },
+)

package.json

@@ -55,7 +55,7 @@
   "devDependencies": {
     "@commitlint/cli": "^18.2.0",
     "@commitlint/config-conventional": "^18.1.0",
-    "@pionxzh/eslint-config-react": "^0.7.0",
+    "@pionxzh/eslint-config": "^1.0.1",
     "@preact/preset-vite": "^2.6.0",
     "@types/mdast": "^3.0.12",
     "@types/node": "^20.5.1",

src/i18n.ts

@@ -113,7 +113,7 @@ const resources = LOCALES.reduce<Record<string, { translation: Record<string, st
     return acc
 }, {})
 
-const standardizeLanguage = (language: string) => {
+function standardizeLanguage(language: string) {
     if (language in LanguageMapping) return LanguageMapping[language]
 
     const shortLang = language.split('-')[0]
@@ -122,7 +122,7 @@ const standardizeLanguage = (language: string) => {
     return language
 }
 
-const getNavigatorLanguage = () => {
+function getNavigatorLanguage() {
     const { language, languages } = navigator
     if (language) return language
 
@@ -133,7 +133,7 @@ const getNavigatorLanguage = () => {
     return null
 }
 
-const getDefaultLanguage = () => {
+function getDefaultLanguage() {
     const storedLanguage = ScriptStorage.get<string>(KEY_LANGUAGE)
     if (storedLanguage) return standardizeLanguage(storedLanguage)
 

src/page.ts

@@ -19,7 +19,7 @@ declare global {
                         paid: unknown
                         public: unknown
                     }
-                    serviceStatus: {}
+                    serviceStatus: unknown
                     user: {
                         email: string
                         group: unknown[]

src/ui/ExportDialog.tsx

@@ -117,7 +117,6 @@ const DialogContent: FC<DialogContentProps> = ({ format }) => {
                 alert(t('Invalid File Format'))
                 return
             }
-            console.log(data)
             setSelected([])
             setExportSource('Local')
             setLocalConversations(data)
@@ -219,7 +218,7 @@ const DialogContent: FC<DialogContentProps> = ({ format }) => {
         <>
             <Dialog.Title className="DialogTitle">{t('Export Dialog Title')}</Dialog.Title>
             <div className="flex items-center text-gray-600 dark:text-gray-300 flex justify-between border-b-[1px] pb-3 mb-3 dark:border-gray-700">
-                {t('Export from official export file')} {'(conversations.json)'}&nbsp;
+                {t('Export from official export file')} (conversations.json)&nbsp;
                 {exportSource === 'API' && (
                     <button className="btn relative btn-neutral" onClick={() => fileInputRef.current?.click()}>
                         <IconUpload className="w-4 h-4 text-white" />

src/ui/Icons.tsx

@@ -93,7 +93,7 @@ export function IconLoading({ className, style }: { className?: string; style?:
 // source: mui
 export function IconCheckBox() {
     return (
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" style="width: 1em; height: 1em; display: inline-block" fill="currentColor">
+        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" style={{ width: '1em', height: '1em', display: 'inline-block' }} fill="currentColor">
             <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
         </svg>
     )
@@ -102,7 +102,7 @@ export function IconCheckBox() {
 // source: mui
 export function IconCheckBoxChecked({ className }: { className?: string }) {
     return (
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className={className} style="width: 1em; height: 1em; display: inline-block" fill="currentColor">
+        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className={className} style={{ width: '1em', height: '1em', display: 'inline-block' }} fill="currentColor">
             <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
         </svg>
     )

src/ui/Menu.tsx

@@ -62,7 +62,7 @@ function MenuInner({ container }: { container: HTMLDivElement }) {
                 className="mt-1"
                 text="Chat History disabled"
                 icon={IconArrowRightFromBracket}
-                disabled={true}
+                disabled
             />
         )
     }

src/ui/SettingDialog.tsx

@@ -12,9 +12,9 @@ import { useSettingContext } from './SettingContext'
 import { Toggle } from './Toggle'
 import type { FC } from '../type'
 
-const Variable = ({ name, title }: { name: string; title: string }) => (
+function Variable({ name, title }: { name: string; title: string }) {
-    <strong className="cursor-help select-all whitespace-nowrap" title={title}>{name}</strong>
+    return <strong className="cursor-help select-all whitespace-nowrap" title={title}>{name}</strong>
-)
+}
 
 interface SettingDialogProps {
     open: boolean
@@ -27,6 +27,7 @@ export const SettingDialog: FC<SettingDialogProps> = ({
     children,
 }) => {
     const {
+        /* eslint-disable pionxzh/consistent-list-newline */
         format, setFormat,
         enableTimestamp, setEnableTimestamp,
         timeStamp24H, setTimeStamp24H,
@@ -35,6 +36,7 @@ export const SettingDialog: FC<SettingDialogProps> = ({
         exportOfficialJsonFormat, setExportOfficialJsonFormat,
         enableMeta, setEnableMeta,
         exportMetaList, setExportMetaList,
+        /* eslint-enable pionxzh/consistent-list-newline */
     } = useSettingContext()
     const { t, i18n } = useTranslation()
     const _title = useTitle()
@@ -183,14 +185,15 @@ export const SettingDialog: FC<SettingDialogProps> = ({
                                                 ,{' '}
                                                 <Variable name="{source}" title={source} />
                                                 ,{' '}
-                                                <Variable name="{model}" title={'ChatGPT-3.5'} />
+                                                <Variable name="{model}" title="ChatGPT-3.5" />
                                                 ,{' '}
-                                                <Variable name="{model_name}" title={'text-davinci-002-render-sha'} />
+                                                <Variable name="{model_name}" title="text-davinci-002-render-sha" />
                                                 ,{' '}
-                                                <Variable name="{create_time}" title={'2023-04-10T21:45:35.027Z'} />
+                                                <Variable name="{create_time}" title="2023-04-10T21:45:35.027Z" />
                                                 ,{' '}
-                                                <Variable name="{update_time}" title={'2023-04-10T21:45:35.027Z'} />
+                                                <Variable name="{update_time}" title="2023-04-10T21:45:35.027Z" />
                                             </p>
+                                            {/* eslint-disable-next-line pionxzh/consistent-list-newline */}
                                             {exportMetaList.map((meta, i) => (
                                                 <div className="flex items-center mt-2" key={i}>
                                                     <input

src/ui/Toggle.tsx

@@ -9,7 +9,7 @@ interface ToggleProps {
 /**
  * Mimics the style of OpenAI's toggle switches.
  */
-export const Toggle = ({ label, checked = true, onCheckedUpdate }: ToggleProps) => {
+export function Toggle({ label, checked = true, onCheckedUpdate }: ToggleProps) {
     return (
         <div className="inline-flex items-center">
             <Switch

src/utils/utils.ts

@@ -1,4 +1,4 @@
-export const noop = () => {}
+export function noop() {}
 
 export function onloadSafe(fn: () => void) {
     if (document.readyState === 'complete') {

tsconfig.json

@@ -1,34 +1,30 @@
 {
   "compilerOptions": {
     "target": "ESNext",
-    "module": "ESNext",
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
     "lib": ["ESNext", "DOM"],
+    "useDefineForClassFields": true,
+    "module": "ESNext",
     "moduleResolution": "Node",
-    "strict": true,
-    "outDir": "dist",
     "resolveJsonModule": true,
-    "isolatedModules": true,
+    "types": ["vite/client"],
-    "esModuleInterop": true,
+    "strict": true,
-    "noEmit": true,
+    "strictNullChecks": true,
     "noImplicitAny": true,
+    "noImplicitReturns": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
-    "noImplicitReturns": true,
+    "noEmit": true,
-    "skipLibCheck": true,
+    "outDir": "dist",
-    "strictNullChecks": true,
+    "esModuleInterop": true,
-    "useDefineForClassFields": true,
+    "isolatedModules": true,
-    "types": ["vite/client"],
+    "skipLibCheck": true
-    "jsx": "react-jsx",
-    "jsxImportSource": "preact"
   },
   "include": [
     "src",
     "src/locales/*.json",
     "package.json",
     "vite.config.ts"
-  ],
-  "exclude": [
-    "node_modules",
-    "**/dist"
   ]
 }