UPDATE: next16 and minifyjson

eslint.config.mjs

@@ -1,16 +1,13 @@
+import nextCoreWebVitals from "eslint-config-next/core-web-vitals";
+import nextTypescript from "eslint-config-next/typescript";
 import { dirname } from "path";
 import { fileURLToPath } from "url";
-import { FlatCompat } from "@eslint/eslintrc";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 
-const compat = new FlatCompat({
-  baseDirectory: __dirname,
-});
-
-const eslintConfig = [
-  ...compat.extends("next/core-web-vitals", "next/typescript"),
-];
+const eslintConfig = [...nextCoreWebVitals, ...nextTypescript, {
+  ignores: ["node_modules/**", ".next/**", "out/**", "build/**", "next-env.d.ts"]
+}];
 
 export default eslintConfig;

next.config.ts

@@ -36,8 +36,8 @@ const nextConfig: NextConfig = {
       },
     ],
   },
-  eslint: {
-    ignoreDuringBuilds: true,
+  compiler: {
+    styledComponents: true,
   },
 };
 

package.json

@@ -3,43 +3,46 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev --turbopack",
+    "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "eslint ."
   },
   "dependencies": {
-    "@next/bundle-analyzer": "^15.5.4",
-    "@tanstack/react-query": "^5.83.0",
-    "axios": "^1.10.0",
+    "@next/bundle-analyzer": "16.0.3",
+    "@tanstack/react-query": "^5.90.10",
+    "axios": "^1.13.2",
     "fast-average-color": "^9.5.0",
-    "framer-motion": "^12.12.1",
-    "html2canvas-pro": "^1.5.11",
-    "lucide-react": "^0.536.0",
-    "next": "15.3.2",
-    "next-intl": "^4.1.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
-    "react-select": "^5.10.1",
+    "framer-motion": "^12.23.24",
+    "html2canvas-pro": "^1.5.13",
+    "lucide-react": "^0.554.0",
+    "next": "16.0.3",
+    "next-intl": "^4.5.3",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
+    "react-select": "^5.10.2",
     "react-toastify": "^11.0.5",
-    "sharp": "^0.34.4",
+    "sharp": "^0.34.5",
     "socket.io-client": "^4.8.1",
-    "zod": "^3.25.67",
-    "zustand": "^5.0.5"
+    "zod": "^4.1.12",
+    "zustand": "^5.0.8"
   },
   "devDependencies": {
-    "@eslint/eslintrc": "^3",
-    "@tailwindcss/postcss": "^4",
-    "@types/jest": "^29.5.14",
-    "@types/node": "^20",
-    "@types/react": "^19",
-    "@types/react-dom": "^19",
-    "daisyui": "^5.0.27",
-    "eslint": "^9",
-    "eslint-config-next": "15.3.1",
+    "@tailwindcss/postcss": "^4.1.17",
+    "@types/jest": "^30.0.0",
+    "@types/node": "^24.10.1",
+    "@types/react": "19.2.6",
+    "@types/react-dom": "19.2.3",
+    "daisyui": "^5.5.5",
+    "eslint": "^9.39.1",
+    "eslint-config-next": "16.0.3",
     "tailwind-scrollbar": "^4.0.2",
-    "tailwindcss": "^4",
-    "ts-to-zod": "^3.15.0",
-    "typescript": "^5"
+    "tailwindcss": "^4.1.17",
+    "ts-to-zod": "^5.0.1",
+    "typescript": "^5.9.3"
+  },
+  "overrides": {
+    "@types/react": "19.2.6",
+    "@types/react-dom": "19.2.3"
   }
 }

src/app/api/[locale]/as/[id]/route.ts

@@ -13,6 +13,7 @@ export async function GET(
   if (!as) {
     return NextResponse.json({ error: 'AS info not found' }, { status: 404 })
   }
-
-  return NextResponse.json(as)
+  return new NextResponse(JSON.stringify(as), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/as/route.ts

@@ -13,7 +13,9 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
 
     const asData = await loadAS(asIds, locale);
 
-    return NextResponse.json(asData);
+    return new NextResponse(JSON.stringify(asData), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load as data' }, { status: 500 });
   }

src/app/api/[locale]/characters/[id]/route.ts

@@ -14,5 +14,7 @@ export async function GET(
     return NextResponse.json({ error: 'Character not found' }, { status: 404 })
   }
 
-  return NextResponse.json(char)
+  return new NextResponse(JSON.stringify(char), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/characters/route.ts

@@ -6,14 +6,16 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
     const body = await request.json();
     const charIds = body.charIds as string[];
     const { locale } = await params;
-    
+
     if (!Array.isArray(charIds) || charIds.some(id => typeof id !== 'string')) {
       return NextResponse.json({ error: 'Invalid charIds' }, { status: 400 });
     }
 
     const characters = await loadCharacters(charIds, locale);
 
-    return NextResponse.json(characters);
+    return new NextResponse(JSON.stringify(characters), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load characters' }, { status: 500 });
   }

src/app/api/[locale]/lightcones/[id]/route.ts

@@ -14,5 +14,7 @@ export async function GET(
     return NextResponse.json({ error: 'Lightcone not found' }, { status: 404 })
   }
 
-  return NextResponse.json(lightcone)
+  return new NextResponse(JSON.stringify(lightcone), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/lightcones/route.ts

@@ -6,14 +6,16 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
     const body = await request.json();
     const lightconeIds = body.lightconeIds as string[];
     const { locale } = await params;
-    
+
     if (!Array.isArray(lightconeIds) || lightconeIds.some(id => typeof id !== 'string')) {
       return NextResponse.json({ error: 'Invalid lightconeIds' }, { status: 400 });
     }
 
     const lightcones = await loadLightcones(lightconeIds, locale);
 
-    return NextResponse.json(lightcones);
+    return new NextResponse(JSON.stringify(lightcones), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load lightcones' }, { status: 500 });
   }

src/app/api/[locale]/moc/[id]/route.ts

@@ -14,5 +14,7 @@ export async function GET(
     return NextResponse.json({ error: 'MOC info not found' }, { status: 404 })
   }
 
-  return NextResponse.json(moc)
+  return new NextResponse(JSON.stringify(moc), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/moc/route.ts

@@ -13,7 +13,9 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
 
     const mocData = await loadMOC(mocIds, locale);
 
-    return NextResponse.json(mocData);
+    return new NextResponse(JSON.stringify(mocData), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load moc data' }, { status: 500 });
   }

src/app/api/[locale]/monster/[id]/route.ts

@@ -13,6 +13,7 @@ export async function GET(
   if (!monster) {
     return NextResponse.json({ error: 'Monster info not found' }, { status: 404 })
   }
-
-  return NextResponse.json(monster)
+  return new NextResponse(JSON.stringify(monster), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/monster/route.ts

@@ -6,14 +6,16 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
     const body = await request.json();
     const monsterIds = body.monsterIds as string[];
     const { locale } = await params;
-    
+
     if (!Array.isArray(monsterIds) || monsterIds.some(id => typeof id !== 'string')) {
       return NextResponse.json({ error: 'Invalid monsterIds' }, { status: 400 });
     }
 
     const monsterData = await loadMonster(monsterIds, locale);
 
-    return NextResponse.json(monsterData);
+    return new NextResponse(JSON.stringify(monsterData), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load monster data' }, { status: 500 });
   }

src/app/api/[locale]/peak/[id]/route.ts

@@ -14,5 +14,7 @@ export async function GET(
     return NextResponse.json({ error: 'Peak info not found' }, { status: 404 })
   }
 
-  return NextResponse.json(peak)
+  return new NextResponse(JSON.stringify(peak), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/peak/route.ts

@@ -13,7 +13,9 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
 
     const peakData = await loadPeak(peakIds, locale);
 
-    return NextResponse.json(peakData);
+    return new NextResponse(JSON.stringify(peakData), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load peak data' }, { status: 500 });
   }

src/app/api/[locale]/pf/[id]/route.ts

@@ -14,5 +14,8 @@ export async function GET(
     return NextResponse.json({ error: 'PF info not found' }, { status: 404 })
   }
 
-  return NextResponse.json(pf)
+
+  return new NextResponse(JSON.stringify(pf), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/pf/route.ts

@@ -6,14 +6,16 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
     const body = await request.json();
     const pfIds = body.pfIds as string[];
     const { locale } = await params;
-    
+
     if (!Array.isArray(pfIds) || pfIds.some(id => typeof id !== 'string')) {
       return NextResponse.json({ error: 'Invalid pfIds' }, { status: 400 });
     }
 
     const pfData = await loadPF(pfIds, locale);
 
-    return NextResponse.json(pfData);
+    return new NextResponse(JSON.stringify(pfData), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load pf data' }, { status: 500 });
   }

src/app/api/[locale]/relics/[id]/route.ts

@@ -14,5 +14,7 @@ export async function GET(
     return NextResponse.json({ error: 'Relic not found' }, { status: 404 })
   }
 
-  return NextResponse.json(relic)
+  return new NextResponse(JSON.stringify(relic), {
+    headers: { "Content-Type": "application/json" }
+  });
 }

src/app/api/[locale]/relics/route.ts

@@ -6,14 +6,16 @@ export async function POST(request: NextRequest, { params }: { params: Promise<{
     const body = await request.json();
     const relicIds = body.relicIds as string[];
     const { locale } = await params;
-    
+
     if (!Array.isArray(relicIds) || relicIds.some(id => typeof id !== 'string')) {
       return NextResponse.json({ error: 'Invalid relicIds' }, { status: 400 });
     }
 
     const relics = await loadRelics(relicIds, locale);
 
-    return NextResponse.json(relics);
+    return new NextResponse(JSON.stringify(relics), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load relics' }, { status: 500 });
   }

src/app/api/config-maze/route.ts

@@ -4,7 +4,9 @@ import { NextResponse } from "next/server";
 export async function GET() {
   try {
     const configMaze = await loadConfigMaze();
-    return NextResponse.json(configMaze);
+    return new NextResponse(JSON.stringify(configMaze), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load config maze' }, { status: 500 });
   }

src/app/api/main-affixes/route.ts

@@ -4,7 +4,9 @@ import { NextResponse } from "next/server";
 export async function GET() {
   try {
     const mainAffix = await loadMainAffix();
-    return NextResponse.json(mainAffix);
+    return new NextResponse(JSON.stringify(mainAffix), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load main affix' }, { status: 500 });
   }

src/app/api/sub-affixes/route.ts

@@ -4,7 +4,9 @@ import { NextResponse } from "next/server";
 export async function GET() {
   try {
     const subAffix = await loadSubAffix();
-    return NextResponse.json(subAffix);
+    return new NextResponse(JSON.stringify(subAffix), {
+      headers: { "Content-Type": "application/json" }
+    });
   } catch {
     return NextResponse.json({ error: 'Failed to load sub affix' }, { status: 500 });
   }

src/lib/loader/asLoader.ts

@@ -43,7 +43,8 @@ export async function loadAS(charIds: string[], locale: string): Promise<Record<
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
+
 
   asFileCache[locale] = result;
   asMap = result;

src/lib/loader/characterLoader.ts

@@ -55,7 +55,7 @@ export async function loadCharacters(charIds: string[], locale: string): Promise
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   characterFileCache[locale] = result;
   characterMap = result;

src/lib/loader/lighconeLoader.ts

@@ -56,7 +56,7 @@ export async function loadLightcones(charIds: string[], locale: string): Promise
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   lightconeFileCache[locale] = result;
   lightconeMap = result;

src/lib/loader/mocLoader.ts

@@ -43,7 +43,7 @@ export async function loadMOC(charIds: string[], locale: string): Promise<Record
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   mocFileCache[locale] = result;
   mocMap = result;

src/lib/loader/monsterLoader.ts

@@ -43,7 +43,7 @@ export async function loadMonster(charIds: string[], locale: string): Promise<Re
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   monsterFileCache[locale] = result;
   monsterMap = result;

src/lib/loader/peakLoader.ts

@@ -43,7 +43,7 @@ export async function loadPeak(charIds: string[], locale: string): Promise<Recor
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   peakFileCache[locale] = result;
   peakMap = result;

src/lib/loader/pfLoader.ts

@@ -43,7 +43,7 @@ export async function loadPF(charIds: string[], locale: string): Promise<Record<
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   pfFileCache[locale] = result;
   pfMap = result;

src/lib/loader/relicLoader.ts

@@ -54,7 +54,7 @@ export async function loadRelics(charIds: string[], locale: string): Promise<Rec
 
   fs.mkdirSync(DATA_DIR, { recursive: true });
   const filePath = getJsonFilePath(locale);
-  fs.writeFileSync(filePath, JSON.stringify(result, null, 2), 'utf-8');
+  fs.writeFileSync(filePath, JSON.stringify(result), 'utf-8');
 
   relicFileCache[locale] = result;
   relicMap = result;

tsconfig.json

@@ -14,7 +14,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react-jsx",
     "incremental": true,
     "plugins": [
       {
@@ -32,7 +32,8 @@
     "next-env.d.ts",
     "**/*.ts",
     "**/*.tsx",
-    ".next/types/**/*.ts"
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
   ],
   "exclude": [
     "node_modules"