chore: Upgrade deps

eslint.config.js

@@ -0,0 +1,42 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import neostandard from 'neostandard'
+
+export default tseslint.config(
+  neostandard(),
+  { ignores: ['dist'] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: {
+        ...globals.browser,
+        React: false,
+      },
+    },
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+
+      // Custom rules
+      '@stylistic/space-before-function-paren': ['error', {
+        anonymous: 'always',
+        named: 'never',
+        asyncArrow: 'always'
+      }],
+
+      '@stylistic/jsx-quotes': ['error', 'prefer-double'],
+    },
+  }
+)

package.json

@@ -6,40 +6,37 @@
   "license": "MIT",
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build",
+    "build": "tsc -b && vite build",
+    "lint": "eslint .",
     "preview": "vite preview"
   },
   "dependencies": {
-    "@ant-design/icons": "^5.2.5",
-    "antd": "^5.12.8",
-    "axios": "^1.1.2",
-    "clsx": "^1.2.1",
-    "react": "^18.2.0",
+    "@ant-design/icons": "^5.5.2",
+    "antd": "^5.22.6",
+    "axios": "^1.7.9",
+    "clsx": "^2.1.1",
+    "react": "^18.3.1",
     "react-diff-view": "3.2.1",
-    "react-dom": "^18.2.0",
-    "semver": "^7.3.8",
-    "usehooks-ts": "^2.9.2"
+    "react-dom": "^18.3.1",
+    "semver": "^7.6.3",
+    "usehooks-ts": "^3.1.0"
   },
   "devDependencies": {
+    "@eslint/js": "^9.17.0",
     "@types/node": "^18.11.0",
-    "@types/react": "^18.2.15",
-    "@types/react-dom": "^18.2.7",
-    "@types/semver": "^7.3.12",
-    "@typescript-eslint/eslint-plugin": "^6.4.0",
-    "@vitejs/plugin-react": "^4.2.1",
-    "eslint": "^8.0.1",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-config-standard-with-typescript": "39.0.0",
-    "eslint-plugin-import": "^2.28.1",
-    "eslint-plugin-n": "^15.0.0",
-    "eslint-plugin-prettier": "4.0.0",
-    "eslint-plugin-promise": "^6.0.0",
-    "eslint-plugin-react": "^7.31.10",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-simple-import-sort": "^8.0.0",
+    "@types/react": "^18.3.18",
+    "@types/react-dom": "^18.3.5",
+    "@types/semver": "^7.5.8",
+    "@vitejs/plugin-react": "^4.3.4",
+    "eslint": "^9.17.0",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "eslint-plugin-react-refresh": "^0.4.16",
+    "globals": "^15.14.0",
+    "neostandard": "^0.12.0",
     "prettier": "^2.7.1",
     "tailwindcss": "^3.2.4",
-    "typescript": "^5.2.2",
-    "vite": "5.0.12"
+    "typescript": "~5.6.2",
+    "typescript-eslint": "^8.18.2",
+    "vite": "^6.0.5"
   }
 }

src/App.tsx

@@ -1,9 +1,8 @@
-import { ConfigProvider, theme } from 'antd'
+import { ConfigProvider, theme, App as AntdApp } from 'antd'
 import { type PropsWithChildren, useEffect } from 'react'
 import { useDarkMode } from 'usehooks-ts'
 
 import { Home } from './components/pages'
-import { MessageProvider } from './contexts/message'
 
 function AntdConfig(props: PropsWithChildren) {
   const { isDarkMode } = useDarkMode()
@@ -33,7 +32,10 @@ function AntdConfig(props: PropsWithChildren) {
         }
       }}
     >
-      <MessageProvider>{props.children}</MessageProvider>
+      <AntdApp>
+        {props.children}
+      </AntdApp>
+
     </ConfigProvider>
   )
 }

src/components/pages/home.tsx

@@ -17,16 +17,16 @@ import {
 } from '../ui'
 
 export function Home() {
-  const [type, setType] = useState<'app' | 'plugin'>(getFromUrl('type', 'app'))
+  const [type, setType] = useState<'app' | 'plugin'>(getFromUrl<'app' | 'plugin'>('type', 'app'))
 
   const [fromVersion, setFromVersion] = useState(getFromUrl('from', ''))
   const [fromProfile, setFromProfile] = useState<Profile>(
-    getFromUrl('fromProfile', 'web')
+    getFromUrl<Profile>('fromProfile', 'web')
   )
 
   const [toVersion, setToVersion] = useState(getFromUrl('to', ''))
   const [toProfile, setToProfile] = useState<Profile>(
-    getFromUrl('toProfile', 'web')
+    getFromUrl<Profile>('toProfile', 'web')
   )
 
   const { versions } = useFetchVersions()

src/components/ui/diff/diff.tsx

@@ -55,7 +55,7 @@ export function Diff(props: DiffProps) {
             viewType={viewType}
             diffType={file.type}
             hunks={file.hunks}
-            optimizeSelection={true}
+            optimizeSelection
             tokens={tokens}
           >
             {hunks => {

src/hooks/use-fetch-diff.ts

@@ -2,7 +2,7 @@ import axios from 'axios'
 import { useCallback, useState } from 'react'
 
 import { DIFFS_REPO_URL } from '../constants'
-import { useMessage } from '../contexts/message'
+import { App } from 'antd'
 
 interface UseFetchDiffProps {
   fromVersion?: string
@@ -20,7 +20,7 @@ export function useFetchDiff(props: UseFetchDiffProps) {
   const [isFetching, setIsFetching] = useState(false)
   const [diff, setDiff] = useState<string | null>(null)
 
-  const { message } = useMessage()
+  const { message } = App.useApp()
 
   const fetch = useCallback(async () => {
     if (!fromVersion || !toVersion) {

src/utils/get-from-url.ts

@@ -1,7 +1,7 @@
-export function getFromUrl(param: string, fallback?: any) {
+export function getFromUrl<T extends string>(param: string, fallback?: string): T {
   const urlParams = new URLSearchParams(window.location.search)
 
-  const paramFromURL = urlParams.get(param)
+  const paramFromURL = urlParams.get(param) as T | null
 
-  return paramFromURL || fallback
+  return (paramFromURL ?? fallback) as T
 }

src/vite-env.d.ts

@@ -1,2 +1 @@
-/* eslint-disable @typescript-eslint/triple-slash-reference */
 /// <reference types="vite/client" />

tsconfig.app.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true,
+
+    "typeRoots": ["./src/@types/react-diff-view.d.ts"]
+  },
+  "include": ["src"]
+}

tsconfig.json

@@ -1,26 +1,7 @@
 {
-  "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "typeRoots": ["./src/@types/react-diff-view.d.ts"]
-  },
-  "include": ["src"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "files": [],
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ]
 }

tsconfig.node.json

@@ -1,10 +1,24 @@
 {
   "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2022",
+    "lib": ["ES2023"],
     "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
     "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
   },
   "include": ["vite.config.ts"]
 }