feat(eslint): Add typescript-eslint plugins

.eslintrc.json

@@ -1,3 +1,14 @@
 {
-  "extends": "next/core-web-vitals"
+    "extends": [
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended-type-checked",
+        "plugin:@typescript-eslint/stylistic-type-checked",
+        "next/core-web-vitals"
+    ],
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "project": "./tsconfig.json"
+    },
+    "plugins": ["@typescript-eslint"],
+    "root": true
 }

components/link.tsx

@@ -13,7 +13,7 @@ const LinkComponent: FC<ComponentProps<typeof Link>> = ({ children, href, ...res
 
     if (locale) {
         if (typeof href === "string") {
-            if (href.indexOf("http") !== 0) {
+            if (!href.startsWith("http")) {
                 hrefWithLocale = hrefWithLocale ? `/${locale}${href}` : router.pathname.replace("[locale]", locale);
             }
         } else {

components/redirect.tsx

@@ -5,7 +5,7 @@ import type { FC } from "react";
 
 export const useRedirect = (to?: string) => {
     const router = useRouter();
-    to = to || router.asPath;
+    to = to ?? router.asPath;
 
     // language detection
     useEffect(() => {
@@ -14,14 +14,14 @@ export const useRedirect = (to?: string) => {
         if (detectedLng) {
             if (to.startsWith("/" + detectedLng) && router.route === "/404") {
                 // prevent endless loop
-                router.replace("/" + detectedLng + router.route);
+                router.replace("/" + detectedLng + router.route).catch(console.error);
                 return;
             }
 
             if (languageDetector.cache) {
                 languageDetector.cache(detectedLng);
             }
-            router.replace("/" + detectedLng + to);
+            router.replace("/" + detectedLng + to).catch(console.error);
         }
     }, [to, router]);
 

lib/getStatic.ts

@@ -16,7 +16,7 @@ export const getI18nPaths = (): I18nPath[] =>
         },
     }));
 
-export const mergeI18nPaths = (paths: Array<{ params: Record<string, string> }>) => {
+export const mergeI18nPaths = (paths: { params: Record<string, string> }[]) => {
     const locales = getI18nPaths();
 
     return locales.flatMap(localePath =>
@@ -29,7 +29,7 @@ export const mergeI18nPaths = (paths: Array<{ params: Record<string, string> }>)
     );
 };
 
-export const getStaticPaths = (async () => {
+export const getStaticPaths = (() => {
     return {
         paths: getI18nPaths(),
         fallback: false,
@@ -38,7 +38,7 @@ export const getStaticPaths = (async () => {
 
 export async function getI18nProps(ctx: GetStaticPropsContext, ns: string[] = ["common"]) {
     const locale = ctx?.params?.locale as string;
-    let props = {
+    const props = {
         ...(await serverSideTranslations(locale, ns)),
     };
     return props;

package.json

@@ -36,13 +36,15 @@
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/sort-json": "^2",
+    "@typescript-eslint/eslint-plugin": "^7.7.0",
+    "@typescript-eslint/parser": "^7.7.0",
     "eslint": "^8",
     "eslint-config-next": "14.2.2",
     "postcss": "^8",
     "sort-json": "^2.0.1",
     "tailwindcss": "^3.4.1",
     "tailwindcss-animate": "^1.0.7",
-    "typescript": "^5"
+    "typescript": "^5.4.5"
   },
   "packageManager": "[email protected]"
 }

pages/[locale]/[map]/index.tsx

@@ -22,7 +22,7 @@ import { getQueryWithoutUndefined } from "@/lib/query";
 import type { GetStaticPaths } from "next";
 import type { Map } from "@/constants/map";
 
-export const getStaticPaths = (async () => {
+export const getStaticPaths = (() => {
     const mapPaths = MAPS.map(map => ({ params: { map } }));
     const paths = mergeI18nPaths(mapPaths);
 
@@ -46,7 +46,9 @@ export default function MapIndex() {
 
     const [initDialogOpen, setInitDialogOpen] = useState(false);
 
-    const onClickInitDialogAction = useCallback(() => {}, []);
+    const onClickInitDialogAction = useCallback(() => {
+        // Do something
+    }, []);
 
     const onClickInitDialogClose = useCallback(() => {
         setInitDialogOpen(false);

pages/_document.tsx

@@ -6,7 +6,7 @@ import i18nextConfig from "../next-i18next.config";
 
 class MyDocument extends Document {
     render() {
-        const currentLocale = getQuery(this.props.__NEXT_DATA__.query.locale) || i18nextConfig.i18n.defaultLocale;
+        const currentLocale = getQuery(this.props.__NEXT_DATA__.query.locale) ?? i18nextConfig.i18n.defaultLocale;
 
         return (
             <Html lang={currentLocale}>