Update dependencies

52poke · Jul 3, 2024 · 07afcea · 07afcea
1 parent 0475ad6
commit 07afcea
Show file tree

Hide file tree

Showing 55 changed files with 4,948 additions and 3,395 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
diff --git a/dprint.json b/dprint.json
@@ -0,0 +1,16 @@
+{
+  "typescript": {
+    "semiColons": "asi",
+    "quoteStyle": "preferSingle",
+    "trailingCommas": "never",
+    "functionDeclaration.spaceBeforeParentheses": true,
+    "constructor.spaceBeforeParentheses": true,
+    "method.spaceBeforeParentheses": true
+  },
+  "excludes": [
+    "**/node_modules"
+  ],
+  "plugins": [
+    "https://plugins.dprint.dev/typescript-0.91.2.wasm"
+  ]
+}
diff --git a/eslint.config.cjs b/eslint.config.cjs
@@ -0,0 +1,32 @@
+const love = require('eslint-config-love')
+const reactHooks = require('eslint-plugin-react-hooks')
+
+module.exports = [
+  {
+    ...love,
+    files: ['packages/**/*.ts', 'packages/**/*.tsx'],
+    plugins: {
+      ...love.plugins,
+      'react-hooks': reactHooks
+    },
+    languageOptions: {
+      ...love.languageOptions,
+      parserOptions: {
+        project: ['./packages/*/tsconfig.json']
+      }
+    },
+    ignores: ['build', 'dist', 'node_modules', 'eslint.config.cjs'],
+    rules: {
+      ...love.rules,
+      ...reactHooks.configs.recommended.rules,
+      '@typescript-eslint/no-misused-promises': [
+        'error',
+        {
+          checksVoidReturn: {
+            properties: false
+          }
+        }
+      ]
+    }
+  }
+]
diff --git a/package.json b/package.json
@@ -12,14 +12,9 @@
     "build": "pnpm run -r build"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "^6.5.0",
-    "@typescript-eslint/parser": "^6.5.0",
-    "eslint": "^8.48.0",
-    "eslint-config-standard-with-typescript": "^39.0.0",
-    "eslint-plugin-import": "^2.28.1",
-    "eslint-plugin-n": "^16.0.2",
-    "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "typescript": "^5.2.2"
+    "eslint": "^8.57.0",
+    "eslint-config-love": "^53.0.0",
+    "eslint-plugin-react-hooks": "^4.6.2",
+    "typescript": "^5.5.3"
   }
 }
diff --git a/packages/klinklang-client/package.json b/packages/klinklang-client/package.json
@@ -21,19 +21,19 @@
     "url": "https://github.com/mudkipme/klinklang/issues"
   },
   "devDependencies": {
-    "vite": "^4.5.3"
+    "vite": "^5.3.3"
   },
   "dependencies": {
-    "@emotion/react": "^11.11.1",
-    "@emotion/styled": "^11.11.0",
-    "@mui/icons-material": "^5.14.7",
-    "@mui/material": "^5.14.7",
-    "@types/react": "^18.2.21",
-    "@types/react-dom": "^18.2.7",
-    "@vitejs/plugin-react": "^4.0.4",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router-dom": "^6.15.0",
-    "zustand": "^4.4.1"
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
+    "@mui/icons-material": "^5.15.21",
+    "@mui/material": "^5.15.21",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^6.24.0",
+    "zustand": "^4.5.4"
   }
 }
diff --git a/packages/klinklang-client/src/App.tsx b/packages/klinklang-client/src/App.tsx
@@ -1,9 +1,9 @@
 import { Box, Drawer, Toolbar, Typography } from '@mui/material'
 import React, { useEffect, useState } from 'react'
-import { KlinklangHeader } from './components/Header'
 import { Outlet } from 'react-router-dom'
-import { KlinklangMenu } from './components/Menu'
 import { KlinklangFooter } from './components/Footer'
+import { KlinklangHeader } from './components/Header'
+import { KlinklangMenu } from './components/Menu'
 import { useUserStore } from './store/user'
 
 export const App: React.FC = () => {
@@ -16,14 +16,26 @@ export const App: React.FC = () => {
 
   return (
     <Box>
-      <Drawer open={drawerOpen} onClose={() => { setDrawerOpen(false) }} onClick={() => { setDrawerOpen(false) }}>
+      <Drawer
+        open={drawerOpen}
+        onClose={() => {
+          setDrawerOpen(false)
+        }}
+        onClick={() => {
+          setDrawerOpen(false)
+        }}
+      >
         <Box padding={2} width={256}>
           <Typography variant='h6'>Klinklang</Typography>
-          <Typography variant="subtitle2" color="text.secondary">Utilities for 52Poké Wiki</Typography>
+          <Typography variant='subtitle2' color='text.secondary'>Utilities for 52Poké Wiki</Typography>
         </Box>
         <KlinklangMenu />
       </Drawer>
-      <KlinklangHeader onDrawerOpen={() => { setDrawerOpen(true) }} />
+      <KlinklangHeader
+        onDrawerOpen={() => {
+          setDrawerOpen(true)
+        }}
+      />
       <Toolbar />
       <Outlet />
       <KlinklangFooter />

diff --git a/packages/klinklang-client/src/components/Footer/index.tsx b/packages/klinklang-client/src/components/Footer/index.tsx
@@ -4,8 +4,8 @@ import React from 'react'
 export const KlinklangFooter: React.FC = () => {
   return (
     <Container sx={{ padding: 2 }}>
-      <Typography variant="body2">
-        &copy; <Link href="https://52poke.wiki" color="inherit">52Poké Wiki</Link>
+      <Typography variant='body2'>
+        &copy; <Link href='https://52poke.wiki' color='inherit'>52Poké Wiki</Link>
       </Typography>
     </Container>
   )

diff --git a/packages/klinklang-client/src/components/Header/index.tsx b/packages/klinklang-client/src/components/Header/index.tsx
@@ -1,12 +1,22 @@
-import { AppBar, Divider, IconButton, ListItemIcon, ListItemText, Menu, MenuItem, Toolbar, Typography } from '@mui/material'
-import React, { useCallback, useState } from 'react'
-import MenuIcon from '@mui/icons-material/Menu'
 import AccountCircle from '@mui/icons-material/AccountCircle'
 import Face from '@mui/icons-material/Face'
 import LoginIcon from '@mui/icons-material/Login'
 import LogoutIcon from '@mui/icons-material/Logout'
-import { useUserStore } from '../../store/user'
+import MenuIcon from '@mui/icons-material/Menu'
+import {
+  AppBar,
+  Divider,
+  IconButton,
+  ListItemIcon,
+  ListItemText,
+  Menu,
+  MenuItem,
+  Toolbar,
+  Typography
+} from '@mui/material'
+import React, { useCallback, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
+import { useUserStore } from '../../store/user'
 
 export interface KlinklangHeaderProps {
   onDrawerOpen: () => void
@@ -25,21 +35,23 @@ export const KlinklangHeader: React.FC<KlinklangHeaderProps> = ({ onDrawerOpen }
     <AppBar>
       <Toolbar>
         <IconButton
-          color="inherit"
-          edge="start"
+          color='inherit'
+          edge='start'
           sx={{ mr: 2 }}
           onClick={onDrawerOpen}
         >
           <MenuIcon />
         </IconButton>
-        <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
+        <Typography variant='h6' component='div' sx={{ flexGrow: 1 }}>
           52Poké Wiki Utilities
         </Typography>
         <div>
           <IconButton
-            color="inherit"
-            size="large"
-            onClick={(e) => { setAnchorEl(e.currentTarget) }}
+            color='inherit'
+            size='large'
+            onClick={(e) => {
+              setAnchorEl(e.currentTarget)
+            }}
           >
             <AccountCircle />
           </IconButton>
@@ -55,25 +67,45 @@ export const KlinklangHeader: React.FC<KlinklangHeaderProps> = ({ onDrawerOpen }
               horizontal: 'right'
             }}
             open={anchorEl !== null}
-            onClose={() => { setAnchorEl(null) }}
+            onClose={() => {
+              setAnchorEl(null)
+            }}
           >
             {currentUser !== null
               ? [
-                <MenuItem onClick={() => { navigate('/pages/settings'); setAnchorEl(null) }} key="settings">
-                  <ListItemIcon><Face /></ListItemIcon>
+                <MenuItem
+                  onClick={() => {
+                    navigate('/pages/settings')
+                    setAnchorEl(null)
+                  }}
+                  key='settings'
+                >
+                  <ListItemIcon>
+                    <Face />
+                  </ListItemIcon>
                   <ListItemText>{currentUser.name}</ListItemText>
                 </MenuItem>,
-                <Divider key="divider" />,
-                <MenuItem onClick={() => { logout().catch(console.log) }} key="logout">
-                  <ListItemIcon><LogoutIcon /></ListItemIcon>
+                <Divider key='divider' />,
+                <MenuItem
+                  onClick={() => {
+                    logout().catch(console.log)
+                  }}
+                  key='logout'
+                >
+                  <ListItemIcon>
+                    <LogoutIcon />
+                  </ListItemIcon>
                   <ListItemText>Logout</ListItemText>
                 </MenuItem>
-                ]
-              : <MenuItem onClick={login}>
-                  <ListItemIcon><LoginIcon /></ListItemIcon>
+              ]
+              : (
+                <MenuItem onClick={login}>
+                  <ListItemIcon>
+                    <LoginIcon />
+                  </ListItemIcon>
                   <ListItemText>Login</ListItemText>
                 </MenuItem>
-                }
+              )}
           </Menu>
         </div>
       </Toolbar>

diff --git a/packages/klinklang-client/src/main.tsx b/packages/klinklang-client/src/main.tsx
@@ -1,13 +1,13 @@
-import * as React from 'react'
-import * as ReactDOM from 'react-dom/client'
 import { ThemeProvider } from '@emotion/react'
 import { CssBaseline } from '@mui/material'
-import theme from './theme'
+import * as React from 'react'
+import * as ReactDOM from 'react-dom/client'
+import { createBrowserRouter, RouterProvider } from 'react-router-dom'
 import { App } from './App'
-import { RouterProvider, createBrowserRouter } from 'react-router-dom'
+import { Settings } from './pages/Settings'
 import { TermReplacer } from './pages/TermReplacer'
 import { Workflows } from './pages/Workflows'
-import { Settings } from './pages/Settings'
+import theme from './theme'
 
 const router = createBrowserRouter([
   {
@@ -34,7 +34,8 @@ const router = createBrowserRouter([
   }
 ])
 
-ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
+// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <ThemeProvider theme={theme}>
       <CssBaseline />

diff --git a/packages/klinklang-client/src/pages/Settings/index.tsx b/packages/klinklang-client/src/pages/Settings/index.tsx
@@ -1,7 +1,20 @@
-import { Button, Card, CardContent, Container, Grid, IconButton, List, ListItem, ListItemText, Stack, TextField, Typography } from '@mui/material'
+import { Delete } from '@mui/icons-material'
+import {
+  Button,
+  Card,
+  CardContent,
+  Container,
+  Grid,
+  IconButton,
+  List,
+  ListItem,
+  ListItemText,
+  Stack,
+  TextField,
+  Typography
+} from '@mui/material'
 import React, { useCallback, useRef } from 'react'
 import { useUserStore } from '../../store/user'
-import { Delete } from '@mui/icons-material'
 
 export const Settings: React.FC = () => {
   const domainEl = useRef<HTMLInputElement | null>(null)
@@ -44,14 +57,23 @@ export const Settings: React.FC = () => {
           <Grid item xs={12} sm={6}>
             <Card>
               <CardContent>
-                <Typography variant="h5">Linked ActivityPub accounts</Typography>
+                <Typography variant='h5'>Linked ActivityPub accounts</Typography>
                 <List>
                   {currentUser?.fediAccounts?.map((account) => (
-                    <ListItem key={account.subject} disablePadding secondaryAction={(
-                      <IconButton edge="end" onClick={() => { deleteFediAccount(account.id).catch(console.log) }}>
-                        <Delete />
-                      </IconButton>
-                    )}>
+                    <ListItem
+                      key={account.subject}
+                      disablePadding
+                      secondaryAction={
+                        <IconButton
+                          edge='end'
+                          onClick={() => {
+                            deleteFediAccount(account.id).catch(console.log)
+                          }}
+                        >
+                          <Delete />
+                        </IconButton>
+                      }
+                    >
                       <ListItemText>{account.subject}</ListItemText>
                     </ListItem>
                   ))}
@@ -63,10 +85,17 @@ export const Settings: React.FC = () => {
         <Grid item xs={12} sm={6}>
           <Card>
             <CardContent>
-              <Typography variant="h5" mb={2}>Link to a new ActivityPub account</Typography>
-              <Stack direction="row" spacing={2}>
-                <TextField inputRef={domainEl} label="Your instance domain" size="small" />
-                <Button variant="contained" onClick={() => { fediConnect().catch(console.log) }}>Connect</Button>
+              <Typography variant='h5' mb={2}>Link to a new ActivityPub account</Typography>
+              <Stack direction='row' spacing={2}>
+                <TextField inputRef={domainEl} label='Your instance domain' size='small' />
+                <Button
+                  variant='contained'
+                  onClick={() => {
+                    fediConnect().catch(console.log)
+                  }}
+                >
+                  Connect
+                </Button>
               </Stack>
             </CardContent>
           </Card>