feat: add initial support web via wasm (#35)

Reviewed-on: #35

web/src/lib.rs

@@ -1,4 +1,5 @@
 use gpui::*;
+use ui::Root;
 use wasm_bindgen::prelude::*;
 
 #[wasm_bindgen]
@@ -14,13 +15,39 @@ pub fn run() -> Result<(), JsValue> {
     #[cfg(target_family = "wasm")]
     gpui_platform::web_init();
 
-    #[cfg(not(target_family = "wasm"))]
-    let app = gpui_platform::application();
+    gpui_platform::application().run(|cx| {
+        cx.open_window(WindowOptions::default(), |window, cx| {
+            cx.new(|cx| {
+                // Initialize components
+                ui::init(cx);
 
-    #[cfg(target_family = "wasm")]
-    let app = gpui_platform::single_threaded_web();
+                // Initialize theme registry
+                theme::init(cx);
 
-    app.run(|_cx| {});
+                // Initialize settings
+                settings::init(window, cx);
+
+                // Initialize the nostr client
+                state::init(window, cx);
+
+                // Initialize person registry
+                person::init(window, cx);
+
+                // Initialize device signer
+                //
+                // NIP-4e: https://github.com/nostr-protocol/nips/blob/per-device-keys/4e.md
+                device::init(window, cx);
+
+                // Initialize app registry
+                chat::init(window, cx);
+
+                // Root Entity
+                Root::new(workspace::init(window, cx).into(), window, cx)
+            })
+        })
+        .expect("Failed to open window. Please restart the application.");
+        cx.activate(true);
+    });
 
     Ok(())
 }

web/src/www/index.html

@@ -72,6 +72,6 @@
                 <p>Loading Coop...</p>
             </div>
         </div>
-        <script type="module" src="/src/main.js"></script>
+        <script type="module" src="main.js"></script>
     </body>
 </html>

web/src/www/main.js

@@ -0,0 +1,35 @@
+async function init() {
+  const loadingEl = document.getElementById('loading');
+  const appEl = document.getElementById('app');
+
+  try {
+    // Import the WASM module
+    const wasm = await import('./wasm/coop_web.js');
+    await wasm.default();
+
+    // Initialize the story gallery
+    await wasm.run();
+
+    // Hide loading indicator
+    if (appEl) {
+      appEl.remove();
+    }
+  } catch (error) {
+    console.error('Failed to initialize:', error);
+
+    // Show error message
+    if (loadingEl) {
+      loadingEl.innerHTML = `
+        <div class="error">
+          <h2>Failed to load the application</h2>
+          <p>${error.message || error}</p>
+          <p style="margin-top: 10px; font-size: 14px;">
+            Please check the console for more details.
+          </p>
+        </div>
+      `;
+    }
+  }
+}
+
+init();

web/src/www/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "coop-web",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "wasm": "cargo build --target wasm32-unknown-unknown --release && wasm-bindgen ../../../target/wasm32-unknown-unknown/release/gpui_component_story_web.wasm --out-dir ./src/wasm --target web --no-typescript"
+  },
+  "devDependencies": {
+    "vite": "^8",
+    "vite-plugin-static-copy": "^3.2.0",
+    "vite-plugin-wasm": "^3.3.0"
+  }
+}

web/src/www/vite.config.js

@@ -0,0 +1,75 @@
+import { defineConfig } from "vite";
+import wasm from "vite-plugin-wasm";
+import { viteStaticCopy } from "vite-plugin-static-copy";
+import path from "path";
+import { fileURLToPath } from "url";
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+export default defineConfig({
+  plugins: [
+    wasm(),
+    viteStaticCopy({
+      targets: [
+        {
+          src: path.resolve(__dirname, "../../../assets/icons"),
+          dest: "assets",
+        },
+      ],
+    }),
+    {
+      name: "serve-assets",
+      configureServer(server) {
+        server.middlewares.use(
+          "/coop/assets",
+          (req, res, next) => {
+            const assetsPath = path.resolve(__dirname, "../../../assets");
+            const filePath = path.join(
+              assetsPath,
+              req.url.replace("/assets", ""),
+            );
+
+            // Try to serve the file
+            import("fs").then(({ default: fs }) => {
+              if (fs.existsSync(filePath) && fs.statSync(filePath).isFile()) {
+                res.setHeader("Access-Control-Allow-Origin", "*");
+                if (filePath.endsWith(".svg")) {
+                  res.setHeader("Content-Type", "image/svg+xml");
+                }
+                fs.createReadStream(filePath).pipe(res);
+              } else {
+                next();
+              }
+            });
+          },
+        );
+      },
+    },
+  ],
+  build: {
+    target: "esnext",
+    minify: true,
+    sourcemap: false,
+    rollupOptions: {
+      output: {
+        manualChunks: undefined,
+      },
+    },
+  },
+  server: {
+    port: 3000,
+    open: true,
+    fs: {
+      strict: false,
+      allow: [".."],
+    },
+    headers: {
+      "Cross-Origin-Embedder-Policy": "require-corp",
+      "Cross-Origin-Opener-Policy": "same-origin",
+    },
+  },
+  optimizeDeps: {
+    exclude: ["./src/wasm"],
+  },
+  base: "/",
+});