gchimp-web-www: fix nextjs build

gchimp-web/www/next.config.ts

@@ -2,11 +2,46 @@ import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
   /* config options here */
-  webpack(config, options) {
-    config.experiments = { ...config.experiments, asyncWebAssembly: true };
+  webpack(config, { isServer, dev }) {
+    config.experiments = {
+      ...config.experiments,
+      asyncWebAssembly: true,
+      layers: true,
+    };
+
+    // config.output.webassemblyModuleFilename =
+    //   isServer && !dev ? "../static/wasm/[id].wasm" : "static/wasm/[id].wasm";
+    if (!dev && isServer) {
+      config.output.webassemblyModuleFilename = "chunks/[id].wasm";
+      config.plugins.push(new WasmChunksFixPlugin());
+    }
 
     return config;
+  },
+  outputFileTracingIncludes: {
+    '/api/**/*': ['./node_modules/**/*.wasm', './node_modules/**/*.proto'],
   }
 };
 
+// HOLY FUCK. I AM GOING TO KILL WHOEVER GETS PAID TO DO THIS
+// https://github.com/vercel/next.js/issues/29362#issuecomment-971377869
+class WasmChunksFixPlugin {
+  apply(compiler: any) {
+    compiler.hooks.thisCompilation.tap("WasmChunksFixPlugin", (compilation: any) => {
+      compilation.hooks.processAssets.tap(
+        { name: "WasmChunksFixPlugin" },
+        (assets: any) =>
+          Object.entries(assets).forEach(([pathname, source]) => {
+            if (!pathname.match(/\.wasm$/)) return;
+            compilation.deleteAsset(pathname);
+
+            const name = pathname.split("/")[1];
+            const info = compilation.assetsInfo.get(pathname);
+            compilation.emitAsset(name, source, info);
+          })
+      );
+    });
+  }
+}
+
 export default nextConfig;

gchimp-web/www/package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "gchimp-web": "file:../pkg",
-    "next": "15.0.3",
+    "next": "^15.0.3",
     "react": "19.0.0-rc-66855b96-20241106",
     "react-dom": "19.0.0-rc-66855b96-20241106"
   },

gchimp-web/www/src/programs/wave-loop/index.tsx

@@ -8,8 +8,8 @@ import { UploadButton } from "@/components/upload-button";
 export const WaveLoop = () => {
     const [name, setName] = useState<string | undefined>(undefined);
     const [file, setFile] = useState<File | null>(null);
-    const [_status, setStatus] = useState<string>("Status: Idle");
-    const [output, setOutput] = useState<Uint8Array<ArrayBufferLike> | null>(null);
+    // const [status, setStatus] = useState<string>("Status: Idle");
+    const [output, setOutput] = useState<Uint8Array | null>(null);
 
     const submitButton = createRef<HTMLInputElement>();
 
@@ -26,7 +26,7 @@ export const WaveLoop = () => {
         };
 
         if (!file) {
-            setStatus("No file selected")
+            // setStatus("No file selected")
             return;
         }
 
@@ -45,8 +45,6 @@ export const WaveLoop = () => {
 
         const file = e.dataTransfer.files.item(0);
 
-        console.log(e.dataTransfer.files);
-
         if (file?.name)
             setName(file?.name);