lint fix

WxWatch · Jun 8, 2023 · 9aafbd8 · 9aafbd8
1 parent bccbd44
commit 9aafbd8
Show file tree

Hide file tree

Showing 24 changed files with 596 additions and 453 deletions.
diff --git a/package.json b/package.json
@@ -16,7 +16,7 @@
     "dev": "cross-env NODE_ENV=development vite",
     "build": "cross-env NODE_ENV=production tsc && vite build",
     "lint": "prettier --check src/**/*.{ts,tsx} && eslint --ext .ts,.tsx --ignore-path .gitignore .",
-    "lint:fix": "prettier --fix src/**/*.{ts,tsx} && eslint --fix --ext .ts,.tsx --ignore-path .gitignore ."
+    "lint:fix": "prettier --write src/**/*.{ts,tsx} && eslint --fix --ext .ts,.tsx --ignore-path .gitignore ."
   },
   "dependencies": {
     "@emotion/react": "^11.11.0",

diff --git a/src/App.tsx b/src/App.tsx
@@ -1,20 +1,22 @@
-import React from 'react'
-import { RouterProvider } from 'react-router-dom'
-import { QueryClientProvider } from '@tanstack/react-query'
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
-import queryClient from '@/query-client'
-import router from '@/router'
-import Theme from '@/theme'
+import React from "react";
+import { RouterProvider } from "react-router-dom";
+import { QueryClientProvider } from "@tanstack/react-query";
+import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+import queryClient from "@/query-client";
+import router from "@/router";
+import Theme from "@/theme";
 
-export default function App () {
+export default function App() {
   // HACK: Disable context menu in production
   React.useEffect(() => {
     if (import.meta.env.PROD) {
-      const listener = (evt: Event) => evt.preventDefault()
-      document.addEventListener('contextmenu', listener)
-      return () => { document.removeEventListener('contextmenu', listener) }
+      const listener = (evt: Event) => evt.preventDefault();
+      document.addEventListener("contextmenu", listener);
+      return () => {
+        document.removeEventListener("contextmenu", listener);
+      };
     }
-  }, [])
+  }, []);
 
   return (
     <Theme>
@@ -23,5 +25,5 @@ export default function App () {
         <ReactQueryDevtools position="bottom-right" />
       </QueryClientProvider>
     </Theme>
-  )
+  );
 }
diff --git a/src/ErrorPage.tsx b/src/ErrorPage.tsx
@@ -1,20 +1,22 @@
-import React from 'react'
-import { useRouteError } from 'react-router-dom'
-import Box from '@mui/material/Box'
-import Typography from '@mui/material/Typography'
+import React from "react";
+import { useRouteError } from "react-router-dom";
+import Box from "@mui/material/Box";
+import Typography from "@mui/material/Typography";
 
-export default function ErrorPage () {
-  const error = useRouteError() as any
-  console.error(error)
+export default function ErrorPage() {
+  const error = useRouteError();
+  console.error(error);
   // TODO: Error page
 
   return (
     <Box padding={2}>
       <Typography variant="h5">Oops!</Typography>
-      <Typography gutterBottom>Sorry, an unexpected error has occurred.</Typography>
+      <Typography gutterBottom>
+        Sorry, an unexpected error has occurred.
+      </Typography>
       <Typography>
         <pre>{error.stack || error.statusText || error.message}</pre>
       </Typography>
     </Box>
-  )
+  );
 }
diff --git a/src/components/Content.tsx b/src/components/Content.tsx
@@ -1,10 +1,10 @@
-import React from 'react'
-import Box from '@mui/material/Box'
+import React from "react";
+import Box from "@mui/material/Box";
 
-export default function Content (props: React.PropsWithChildren) {
+export default function Content(props: React.PropsWithChildren) {
   return (
     <Box component="main" display="flex" flexDirection="column" width="100%">
       {props.children}
     </Box>
-  )
+  );
 }
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
@@ -1,37 +1,47 @@
-import React from 'react'
-import Stack from '@mui/material/Stack'
-import AppBar from '@mui/material/AppBar'
-import Toolbar from '@mui/material/Toolbar'
-import Typography from '@mui/material/Typography'
-import { SidebarWidth } from '@/components/Sidebar'
+import React from "react";
+import Stack from "@mui/material/Stack";
+import AppBar from "@mui/material/AppBar";
+import Toolbar from "@mui/material/Toolbar";
+import Typography from "@mui/material/Typography";
+import { SidebarWidth } from "@/components/Sidebar";
 
 export interface LayoutProps {
-  title?: React.ReactNode
-  navbar?: React.ReactNode
+  title?: React.ReactNode;
+  navbar?: React.ReactNode;
 }
 
-export default function Layout (props: React.PropsWithChildren<LayoutProps>) {
+export default function Layout(props: React.PropsWithChildren<LayoutProps>) {
   return (
     <React.Fragment>
-      <Navbar title={props.title}>
-        {props.navbar}
-      </Navbar>
+      <Navbar title={props.title}>{props.navbar}</Navbar>
       <Stack direction="column" spacing={2} padding={2}>
         {props.children}
       </Stack>
     </React.Fragment>
-  )
+  );
 }
 
-function Navbar (props: React.PropsWithChildren<{ title?: React.ReactNode }>) {
+function Navbar(props: React.PropsWithChildren<{ title?: React.ReactNode }>) {
   return (
     <React.Fragment>
-      <AppBar component="nav" position="fixed" color="inherit" elevation={0} sx={{
-        borderBottom: 1,
-        borderColor: (theme) => theme.palette.divider,
-        paddingLeft: SidebarWidth
-      }}>
-        <Toolbar component={Stack} direction="row" maxHeight={64} padding={2} disableGutters>
+      <AppBar
+        component="nav"
+        position="fixed"
+        color="inherit"
+        elevation={0}
+        sx={{
+          borderBottom: 1,
+          borderColor: (theme) => theme.palette.divider,
+          paddingLeft: SidebarWidth,
+        }}
+      >
+        <Toolbar
+          component={Stack}
+          direction="row"
+          maxHeight={64}
+          padding={2}
+          disableGutters
+        >
           {props.title && (
             <Typography component="h2" variant="h6" flexGrow={1} noWrap>
               {props.title}
@@ -42,5 +52,5 @@ function Navbar (props: React.PropsWithChildren<{ title?: React.ReactNode }>) {
       </AppBar>
       <Toolbar disableGutters />
     </React.Fragment>
-  )
+  );
 }
diff --git a/src/components/account/AccountAvatar.tsx b/src/components/account/AccountAvatar.tsx
@@ -1,28 +1,26 @@
-import React from 'react'
-import Avatar, { AvatarProps } from '@mui/material/Avatar'
-import { AccountFacet } from '@/interfaces/account'
-import AvatarGenshinLumine from '@/assets/images/genshin/UI_AvatarIcon_PlayerGirl.png'
-import AvatarGenshinAether from '@/assets/images/genshin/UI_AvatarIcon_PlayerBoy.png'
-import AvatarStarRailTrailblazer from '@/assets/images/starrail/Trailblazer.png'
+import React from "react";
+import Avatar, { AvatarProps } from "@mui/material/Avatar";
+import { AccountFacet } from "@/interfaces/account";
+import AvatarGenshinLumine from "@/assets/images/genshin/UI_AvatarIcon_PlayerGirl.png";
+// import AvatarGenshinAether from "@/assets/images/genshin/UI_AvatarIcon_PlayerBoy.png";
+import AvatarStarRailTrailblazer from "@/assets/images/starrail/Trailblazer.png";
 
-export interface AccountAvatarProps extends Omit<AvatarProps, 'src'> {
-  facet: AccountFacet
+export interface AccountAvatarProps extends Omit<AvatarProps, "src"> {
+  facet: AccountFacet;
 }
 
-export default function AccountAvatar (props: AccountAvatarProps) {
-  const { facet, ...rest } = props
+export default function AccountAvatar(props: AccountAvatarProps) {
+  const { facet, ...rest } = props;
   const src = React.useMemo(() => {
     switch (facet) {
       case AccountFacet.Genshin:
-        return AvatarGenshinLumine
+        return AvatarGenshinLumine;
       case AccountFacet.StarRail:
-        return AvatarStarRailTrailblazer
+        return AvatarStarRailTrailblazer;
       default:
-        return undefined
+        return undefined;
     }
-  }, [facet])
+  }, [facet]);
 
-  return (
-    <Avatar src={src} {...rest} />
-  )
+  return <Avatar src={src} {...rest} />;
 }
diff --git a/src/components/common/Version.tsx b/src/components/common/Version.tsx
@@ -10,7 +10,7 @@ export default function Version (props: TypographyProps) {
     <Typography component="span" {...props}>
       {version.data ? formatVersion(version.data) : __APP_VERSION__}
     </Typography>
-  )
+  );
 }
 
 function formatVersion (version: CurrentVersion): string {

diff --git a/src/components/gacha/GachaLayoutContext.ts b/src/components/gacha/GachaLayoutContext.ts
@@ -1,22 +1,28 @@
-import React from 'react'
-import { AccountFacet, Account } from '@/interfaces/account'
-import { GachaRecords } from '@/hooks/useGachaRecordsQuery'
+import React from "react";
+import { AccountFacet, Account } from "@/interfaces/account";
+import { GachaRecords } from "@/hooks/useGachaRecordsQuery";
 
 export interface GachaLayoutContextValue {
-  facet: AccountFacet
-  selectedAccount: Account
-  gachaRecords: GachaRecords
-  alert (error: Error | string | undefined | null | unknown, message?: string): void
+  facet: AccountFacet;
+  selectedAccount: Account;
+  gachaRecords: GachaRecords;
+  alert(
+    error: Error | string | undefined | null | unknown,
+    message?: string
+  ): void;
 }
 
-export const GachaLayoutContext =
-  React.createContext<GachaLayoutContextValue | undefined>(undefined)
+export const GachaLayoutContext = React.createContext<
+  GachaLayoutContextValue | undefined
+>(undefined);
 
-export function useGachaLayoutContext () {
-  const context = React.useContext(GachaLayoutContext)
+export function useGachaLayoutContext() {
+  const context = React.useContext(GachaLayoutContext);
   if (!context) {
-    throw new Error('useGachaLayoutContext must be used within a GachaLayoutContext.Provider')
+    throw new Error(
+      "useGachaLayoutContext must be used within a GachaLayoutContext.Provider"
+    );
   } else {
-    return context
+    return context;
   }
 }
diff --git a/src/components/gacha/analysis/index.tsx b/src/components/gacha/analysis/index.tsx
@@ -1,13 +1,13 @@
-import React from 'react'
-import GachaAnalysisSum from '@/components/gacha/analysis/GachaAnalysisSum'
-import GachaAnalysisHistory from '@/components/gacha/analysis/GachaAnalysisHistory'
-import Stack from '@mui/material/Stack'
+import React from "react";
+import GachaAnalysisSum from "@/components/gacha/analysis/GachaAnalysisSum";
+import GachaAnalysisHistory from "@/components/gacha/analysis/GachaAnalysisHistory";
+import Stack from "@mui/material/Stack";
 
-export default function GachaAnalysis () {
+export default function GachaAnalysis() {
   return (
     <Stack direction="column" spacing={2}>
       <GachaAnalysisSum />
       <GachaAnalysisHistory />
     </Stack>
-  )
+  );
 }
diff --git a/src/components/gacha/overview/index.tsx b/src/components/gacha/overview/index.tsx
@@ -1,15 +1,15 @@
-import React from 'react'
-import GachaOverviewLastUpdated from '@/components/gacha/overview/GachaOverviewLastUpdated'
-import GachaOverviewGrid from '@/components/gacha/overview/GachaOverviewGrid'
-import GachaOverviewTooltips from '@/components/gacha/overview/GachaOverviewTooltips'
-import Stack from '@mui/material/Stack'
+import React from "react";
+import GachaOverviewLastUpdated from "@/components/gacha/overview/GachaOverviewLastUpdated";
+import GachaOverviewGrid from "@/components/gacha/overview/GachaOverviewGrid";
+import GachaOverviewTooltips from "@/components/gacha/overview/GachaOverviewTooltips";
+import Stack from "@mui/material/Stack";
 
-export default function GachaOverview () {
+export default function GachaOverview() {
   return (
     <Stack direction="column" spacing={2}>
       <GachaOverviewLastUpdated />
       <GachaOverviewGrid />
       <GachaOverviewTooltips />
     </Stack>
-  )
+  );
 }
diff --git a/src/components/gacha/toolbar/GachaActionTabs.tsx b/src/components/gacha/toolbar/GachaActionTabs.tsx
@@ -1,29 +1,33 @@
-import React from 'react'
-import Box from '@mui/material/Box'
-import Tabs, { TabsProps } from '@mui/material/Tabs'
-import Tab from '@mui/material/Tab'
-import { styled, alpha } from '@mui/material/styles'
+import React from "react";
+import Box from "@mui/material/Box";
+import Tabs, { TabsProps } from "@mui/material/Tabs";
+import Tab from "@mui/material/Tab";
+import { styled, alpha } from "@mui/material/styles";
 
 export interface GachaActionTabsProps {
-  tabs: string[]
-  value: number
-  onChange?: TabsProps['onChange']
+  tabs: string[];
+  value: number;
+  onChange?: TabsProps["onChange"];
 }
 
-export default function GachaActionTabs (props: GachaActionTabsProps) {
+export default function GachaActionTabs(props: GachaActionTabsProps) {
   return (
     <Box display="inline-flex" alignItems="center">
-      <Tabs value={props.value} onChange={props.onChange} sx={{
-        minHeight: 0,
-        borderRadius: 2,
-        bgcolor: (theme) => theme.palette.action.hover
-      }}>
+      <Tabs
+        value={props.value}
+        onChange={props.onChange}
+        sx={{
+          minHeight: 0,
+          borderRadius: 2,
+          bgcolor: (theme) => theme.palette.action.hover,
+        }}
+      >
         {props.tabs.map((label, i) => (
           <GachaActionTabsItem key={i} label={label} />
         ))}
       </Tabs>
     </Box>
-  )
+  );
 }
 
 const GachaActionTabsItem = styled((props: { label: string }) => (
@@ -33,15 +37,18 @@ const GachaActionTabsItem = styled((props: { label: string }) => (
   minHeight: 0,
   height: 36,
   padding: theme.spacing(0, 2),
-  '&:first-of-type': {
+  "&:first-of-type": {
     borderTopLeftRadius: 2,
-    borderBottomLeftRadius: 2
+    borderBottomLeftRadius: 2,
   },
-  '&:last-of-type': {
+  "&:last-of-type": {
     borderTopRightRadius: 2,
-    borderBottomRightRadius: 2
+    borderBottomRightRadius: 2,
   },
-  '&.Mui-selected': {
-    background: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + 0.05)
-  }
-}))
+  "&.Mui-selected": {
+    background: alpha(
+      theme.palette.primary.main,
+      theme.palette.action.selectedOpacity + 0.05
+    ),
+  },
+}));