frontend updates

decompme · Dec 1, 2024 · 95435ff · 95435ff
1 parent 1d9a08c
commit 95435ff
Show file tree

Hide file tree

Showing 8 changed files with 1,725 additions and 713 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -1,7 +1,7 @@
 {
     "license": "MIT",
     "scripts": {
-        "dev": "next dev --port 8080",
+        "dev": "next dev --turbopack --port 8080",
         "build": "next build",
         "start": "next start --port 8080",
         "lint": "next lint && yarn stylelint 'src/**/*.css' 'src/**/*.scss'",
@@ -11,89 +11,92 @@
     },
     "dependencies": {
         "@clangd-wasm/clangd-wasm": "15.0.7-dev5",
-        "@codemirror/autocomplete": "^6.15.0",
-        "@codemirror/commands": "^6.3.3",
-        "@codemirror/language": "^6.10.1",
-        "@codemirror/lint": "^6.5.0",
-        "@codemirror/search": "^6.5.6",
+        "@codemirror/autocomplete": "^6.18.3",
+        "@codemirror/commands": "^6.7.1",
+        "@codemirror/language": "^6.10.6",
+        "@codemirror/lint": "^6.8.4",
+        "@codemirror/search": "^6.5.8",
         "@codemirror/state": "^6.4.1",
-        "@codemirror/view": "^6.26.0",
-        "@ducanh2912/next-pwa": "^10.2.5",
-        "@lezer/common": "^1.2.1",
-        "@lezer/cpp": "^1.0.0",
-        "@lezer/highlight": "^1.2.0",
+        "@codemirror/view": "^6.35.0",
+        "@ducanh2912/next-pwa": "^10.2.9",
+        "@lezer/common": "^1.2.3",
+        "@lezer/cpp": "^1.1.2",
+        "@lezer/highlight": "^1.2.1",
         "@open-rpc/client-js": "^1.8.1",
-        "@primer/octicons-react": "^19.9.0",
+        "@primer/octicons-react": "^19.12.0",
         "@radix-ui/colors": "^2.1.0",
-        "@radix-ui/react-progress": "^1.0.3",
-        "@react-hook/resize-observer": "^1.2.6",
-        "@replit/codemirror-indentation-markers": "^6.5.1",
-        "@replit/codemirror-vim": "^6.2.0",
-        "allotment": "^1.20.0",
+        "@radix-ui/react-progress": "^1.1.0",
+        "@react-hook/resize-observer": "^2.0.2",
+        "@replit/codemirror-indentation-markers": "^6.5.3",
+        "@replit/codemirror-vim": "^6.2.1",
+        "allotment": "^1.20.2",
         "ansi-to-react": "^6.1.6",
         "classnames": "^2.5.1",
         "codemirror": "^6.0.1",
         "dotenv": "^16.4.5",
-        "downshift": "9.0.0",
+        "downshift": "9.0.8",
         "fast-myers-diff": "^3.2.0",
-        "framer-motion": "^11.0.18",
+        "framer-motion": "^11.12.0",
         "is-dark-color": "^1.2.0",
         "memoize-one": "^5.2.1",
-        "next": "^14.1.4",
-        "next-plausible": "^3.12.0",
+        "next": "15.0.3",
+        "next-plausible": "^3.12.4",
         "next-pwa": "^5.6.0",
-        "objdiff-wasm": "2.0.0-beta.9",
-        "react": "^18.2.0",
+        "objdiff-wasm": "2.0.0",
+        "react": "19.0.0-rc-66855b96-20241106",
         "react-colorful": "^5.6.1",
         "react-contenteditable": "^3.3.7",
         "react-date-object": "^2.1.9",
-        "react-dom": "^18.2.0",
+        "react-dom": "19.0.0-rc-66855b96-20241106",
         "react-laag": "^2.0.5",
         "react-timeago": "^7.2.0",
         "react-virtualized-auto-sizer": "^1.0.24",
         "react-window": "^1.8.10",
-        "sass": "^1.72.0",
+        "sass": "^1.81.0",
         "swr": "^2.2.5",
-        "use-debounce": "^10.0.0",
+        "use-debounce": "^10.0.4",
         "use-persisted-state": "^0.3.3",
         "vscode-languageserver-protocol": "^3.17.5"
     },
     "devDependencies": {
-        "@next/bundle-analyzer": "^14.1.4",
-        "@next/eslint-plugin-next": "^14.1.4",
+        "@next/bundle-analyzer": "15.0.3",
+        "@next/eslint-plugin-next": "15.0.3",
         "@svgr/webpack": "^8.1.0",
-        "@types/react-dom": "^18.2.22",
+        "@types/react-dom": "npm:[email protected]",
         "@types/react-timeago": "^4.1.7",
         "@types/react-virtualized-auto-sizer": "^1.0.4",
         "@types/react-window": "^1.8.8",
         "@typescript-eslint/eslint-plugin": "^7.3.1",
         "@typescript-eslint/parser": "^7.3.1",
-        "autoprefixer": "^10.4.19",
+        "autoprefixer": "^10.4.20",
         "css-loader": "^6.10.0",
         "cssnano": "^6.1.1",
         "eslint": "^8.57.0",
-        "eslint-config-next": "^14.1.4",
+        "eslint-config-next": "15.0.3",
         "eslint-formatter-rdjson": "^1.0.6",
         "eslint-plugin-css-modules": "^2.12.0",
-        "eslint-plugin-react": "^7.34.1",
+        "eslint-plugin-react": "^7.37.2",
         "eslint-plugin-react-hooks": "^4.6.0",
-        "eslint-plugin-tailwindcss": "^3.15.1",
+        "eslint-plugin-tailwindcss": "^3.17.5",
         "identity-obj-proxy": "^3.0.0",
         "next-remove-imports": "^1.0.12",
-        "postcss": "^8.4.38",
+        "postcss": "^8.4.49",
         "postcss-loader": "^8.1.1",
         "postcss-scss": "^4.0.9",
         "sass-loader": "^14.1.1",
         "style-loader": "^3.3.4",
-        "stylelint": "^16.2.1",
+        "stylelint": "^16.11.0",
         "stylelint-config-css-modules": "^4.4.0",
         "stylelint-config-standard-scss": "^13.0.0",
-        "tailwindcss": "^3.4.1",
-        "typescript": "^5.4.3",
+        "tailwindcss": "^3.4.15",
+        "typescript": "^5.7.2",
         "umd-compat-loader": "^2.1.2",
-        "webpack": "^5.91.0"
+        "webpack": "^5.96.1"
     },
     "browserslist": [
         "last 2 versions and not dead and >= 1% and supports async-functions"
-    ]
+    ],
+    "resolutions": {
+        "@types/react-dom": "npm:[email protected]"
+    }
 }
diff --git a/frontend/src/app/(navfooter)/WelcomeInfo.tsx b/frontend/src/app/(navfooter)/WelcomeInfo.tsx
@@ -1,4 +1,4 @@
-import { headers } from "next/headers"
+import { headers, type UnsafeUnwrappedHeaders } from "next/headers";
 import Link from "next/link"
 
 import { ArrowRightIcon } from "@primer/octicons-react"
@@ -12,7 +12,7 @@ import SiteStats from "./SiteStats"
 export const SITE_DESCRIPTION = "A collaborative reverse-engineering platform for working on decompilation projects with others to learn about how your favorite games work."
 
 export default function WelcomeInfo() {
-    const saveDataEnabled = headers().get("Save-Data") === "on"
+    const saveDataEnabled = (headers() as unknown as UnsafeUnwrappedHeaders).get("Save-Data") === "on"
 
     return <div className="relative overflow-x-hidden p-2">
         {!saveDataEnabled && <div className="absolute top-14 -z-10 hidden w-full opacity-80 sm:block">

diff --git a/frontend/src/app/(navfooter)/platform/[id]/page.tsx b/frontend/src/app/(navfooter)/platform/[id]/page.tsx
@@ -7,7 +7,8 @@ import ScratchList, { ScratchItemPlatformList } from "@/components/ScratchList"
 import { get } from "@/lib/api/request"
 import { PlatformMetadata } from "@/lib/api/types"
 
-export async function generateMetadata({ params }: { params: { id: number } }):Promise<Metadata> {
+export async function generateMetadata(props: { params: Promise<{ id: number }> }):Promise<Metadata> {
+    const params = await props.params;
     let platform: PlatformMetadata
 
     try {
@@ -35,7 +36,8 @@ export async function generateMetadata({ params }: { params: { id: number } }):P
     }
 }
 
-export default async function Page({ params }: { params: { id: number } }) {
+export default async function Page(props: { params: Promise<{ id: number }> }) {
+    const params = await props.params;
     let platform: PlatformMetadata
     try {
         platform = await get(`/platform/${params.id}`)

diff --git a/frontend/src/app/(navfooter)/preset/[id]/page.tsx b/frontend/src/app/(navfooter)/preset/[id]/page.tsx
@@ -8,7 +8,8 @@ import { get } from "@/lib/api/request"
 import { Preset } from "@/lib/api/types"
 import useTranslation from "@/lib/i18n/translate"
 
-export async function generateMetadata({ params }: { params: { id: number } }): Promise<Metadata> {
+export async function generateMetadata(props: { params: Promise<{ id: number }> }): Promise<Metadata> {
+    const params = await props.params;
     let preset: Preset
 
     try {
@@ -36,7 +37,8 @@ export async function generateMetadata({ params }: { params: { id: number } }):
     }
 }
 
-export default async function Page({ params }: { params: { id: number } }) {
+export default async function Page(props: { params: Promise<{ id: number }> }) {
+    const params = await props.params;
     const compilersTranslation = useTranslation("compilers")
 
     let preset: Preset

diff --git a/frontend/src/app/(navfooter)/u/[username]/page.tsx b/frontend/src/app/(navfooter)/u/[username]/page.tsx
@@ -6,7 +6,8 @@ import Profile from "@/components/user/Profile"
 import { get } from "@/lib/api/request"
 import { User } from "@/lib/api/types"
 
-export async function generateMetadata({ params }: { params: { username: string } }): Promise<Metadata> {
+export async function generateMetadata(props: { params: Promise<{ username: string }> }): Promise<Metadata> {
+    const params = await props.params;
     let user: User
 
     try {
@@ -27,7 +28,8 @@ export async function generateMetadata({ params }: { params: { username: string
     }
 }
 
-export default async function Page({ params }: { params: { username: string } }) {
+export default async function Page(props: { params: Promise<{ username: string }> }) {
+    const params = await props.params;
     let user: User
     try {
         user = await get(`/users/${params.username}`)

diff --git a/frontend/src/app/scratch/[slug]/claim/page.tsx b/frontend/src/app/scratch/[slug]/claim/page.tsx
@@ -1,16 +1,20 @@
 "use client"
 
-import { useEffect, useRef, useState } from "react"
+import { useEffect, useRef, useState, use } from "react";
 
 import { useRouter } from "next/navigation"
 
 import LoadingSkeleton from "@/app/scratch/[slug]/loading"
 import { post } from "@/lib/api/request"
 
-export default function Page({ params, searchParams }: {
-    params: { slug: string }
-    searchParams: { token: string }
-}) {
+export default function Page(
+    props: {
+        params: Promise<{ slug: string }>
+        searchParams: Promise<{ token: string }>
+    }
+) {
+    const searchParams = use(props.searchParams);
+    const params = use(props.params);
     const router = useRouter()
 
     // The POST request must happen on the client so

diff --git a/frontend/src/app/scratch/[slug]/page.tsx b/frontend/src/app/scratch/[slug]/page.tsx
@@ -3,7 +3,8 @@ import { Metadata, ResolvingMetadata } from "next"
 import getScratchDetails from "./getScratchDetails"
 import ScratchEditor from "./ScratchEditor"
 
-export async function generateMetadata({ params }: { params: { slug: string }}, parent: ResolvingMetadata):Promise<Metadata> {
+export async function generateMetadata(props: { params: Promise<{ slug: string }>}, parent: ResolvingMetadata):Promise<Metadata> {
+    const params = await props.params;
     const { scratch } = await getScratchDetails(params.slug)
     const parentData = await parent
 
@@ -24,7 +25,8 @@ export async function generateMetadata({ params }: { params: { slug: string }},
     }
 }
 
-export default async function Page({ params }: { params: { slug: string }}) {
+export default async function Page(props: { params: Promise<{ slug: string }>}) {
+    const params = await props.params;
     const { scratch, parentScratch, compilation } = await getScratchDetails(params.slug)
 
     return <ScratchEditor