gemi 0.1.0

package/.eslintrc.js

@@ -0,0 +1,10 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: ["@repo/eslint-config/react-internal.js"],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    project: "./tsconfig.lint.json",
+    tsconfigRootDir: __dirname,
+  },
+};

package/client/Form.tsx

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+
+export const Form = ({ children }: { children: ReactNode }) => {
+  return (
+    <form method="" id="" action="">
+      {children}
+    </form>
+  );
+};

package/client/index.ts

@@ -0,0 +1,2 @@
+export { useRouter } from "./useRouter";
+export { Form } from "./Form";

package/client/useRouter.ts

@@ -0,0 +1 @@
+export function useRouter() {}

package/http/ApiRouter.ts

@@ -0,0 +1 @@
+export class ApiRouter {}

package/http/Controller.ts

@@ -0,0 +1 @@
+export class Controller {}

package/http/ViewRouter.ts

@@ -0,0 +1 @@
+export class ViewRouter {}

package/http/index.ts

@@ -0,0 +1,3 @@
+export { Controller } from "./Controller";
+export { ApiRouter } from "./ApiRouter";
+export { ViewRouter } from "./ViewRouter";

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "gemi",
+  "version": "0.1.0",
+  "devDependencies": {
+    "@repo/eslint-config": "*",
+    "@repo/typescript-config": "*",
+    "@types/eslint": "^8.56.5",
+    "@types/node": "^20.11.24",
+    "@types/react": "^18.2.61",
+    "@types/react-dom": "^18.2.19",
+    "eslint": "^8.57.0",
+    "react": "^18.2.0",
+    "tsup": "^8.1.0",
+    "typescript": "^5.3.3"
+  },
+  "exports": {
+    "./http": "./dist/http/index.mjs",
+    "./client": "./dist/client/index.mjs",
+    "./server": "./dist/server/index.mjs"
+  },
+  "private": false,
+  "modulel": true,
+  "scripts": {
+    "lint": "eslint . --max-warnings 0",
+    "build": "tsup ./http/index.ts ./client/index.ts ./server/index.ts --format esm --no-splitting --external vite",
+    "build:types": "tsc"
+  },
+  "dependencies": {
+    "urlpattern-polyfill": "^10.0.0"
+  }
+}

package/server/Server.ts

@@ -0,0 +1,42 @@
+type RequestHandler = (
+  req: Request,
+  next: () => Response | Promise<Response>,
+) => Response | Promise<Response>;
+
+export class Server {
+  requestHandlers = new Map<string, RequestHandler>();
+
+  constructor(private urlPattern: any) {}
+
+  public use(pattern: string, ...requestHandlers: RequestHandler[]) {
+    const requestHandler = requestHandlers.reverse().reduce(
+      (acc, handler) => {
+        return (req: Request) =>
+          handler(req, () => acc(req, () => new Response("404")));
+      },
+      () => new Response("404", { status: 404 }),
+    );
+    this.requestHandlers.set(pattern, requestHandler);
+  }
+
+  public fetch(req: Request) {
+    const { pathname } = new URL(req.url);
+    const handlerCandidates: [string, RequestHandler][] = [];
+
+    for (const [p, rh] of this.requestHandlers.entries()) {
+      const pattern = new this.urlPattern({ pathname: p });
+      if (pattern.test({ pathname })) {
+        handlerCandidates.push([p, rh]);
+      }
+    }
+    const [, handler] = handlerCandidates.sort(
+      ([pa], [pb]) => pb.length - pa.length,
+    )[0];
+
+    if (handler) {
+      return handler(req, () => new Response("404"));
+    } else {
+      return new Response("404 not found", { status: 404 });
+    }
+  }
+}

package/server/dev.ts

@@ -0,0 +1,176 @@
+import "react";
+import path from "path";
+import { Server } from "./Server";
+import { createElement } from "react";
+import { renderToReadableStream } from "react-dom/server.browser";
+
+const rootDir = process.cwd();
+
+const appDir = path.join(rootDir, "app");
+const frameworkDir = path.join(rootDir, "framework");
+
+export async function startDevServer() {
+  console.log("Starting server...");
+  const root = process.cwd();
+
+  const { URLPattern } = await import("urlpattern-polyfill");
+  const server = new Server(URLPattern);
+
+  const vite = await (
+    await import("vite")
+  ).createServer({
+    root,
+    logLevel: "error",
+    server: {
+      watch: {
+        usePolling: true,
+        interval: 100,
+      },
+      hmr: {
+        clientPort: 5174,
+      },
+    },
+    appType: "custom",
+    resolve: {
+      alias: {
+        "@/app": appDir,
+        "@/framework": frameworkDir,
+      },
+    },
+  });
+
+  const { app } = await vite.ssrLoadModule(
+    path.join(rootDir, "app/bootstrap.ts"),
+  );
+
+  vite.watcher.on("change", async (filePath) => {
+    if (filePath.includes("/app/views")) {
+      return;
+    }
+    const m = await vite.moduleGraph.getModuleByUrl(filePath, true);
+    if (m) {
+      await vite.reloadModule(m);
+    }
+  });
+
+  server.use(
+    "*",
+    async (req, next) => {
+      const { pathname } = new URL(req.url);
+      const res = await fetch(`http://localhost:5174/${pathname}`);
+      if (res.ok) {
+        return res;
+      } else {
+        return await next();
+      }
+    },
+
+    async (req) => {
+      const styles = [];
+      for (const [file, modules] of vite.moduleGraph.fileToModulesMap) {
+        for (const mod of modules) {
+          if (
+            mod.file &&
+            mod.file.includes(".css") &&
+            !mod.file.includes("app.css")
+          ) {
+            const { default: css } = await vite.ssrLoadModule(file);
+            const currentFiles: string[] = styles.map((s) => s.file);
+            if (currentFiles.includes(mod.file)) {
+              continue;
+            }
+            styles.push({
+              file: mod.file,
+              css,
+            });
+          }
+        }
+      }
+
+      const result = await app.handleRequest(req);
+
+      if (result.kind === "viewError") {
+        const { kind, ...payload } = result;
+        return new Response(null, {
+          ...payload,
+        });
+      }
+
+      if (result.kind === "apiError") {
+        const { kind, data, ...payload } = result;
+        return new Response(JSON.stringify(data), {
+          ...payload,
+        });
+      }
+
+      if (!result) {
+        return new Response("Not found", { status: 404 });
+      }
+
+      const { default: Root } = await vite.ssrLoadModule("framework/Root.tsx");
+
+      if (result.kind === "viewData") {
+        const { data, headers, head } = result;
+        return new Response(
+          JSON.stringify({
+            data,
+            head,
+          }),
+          {
+            headers: {
+              ...headers,
+              "Content-Type": "application/json",
+            },
+          },
+        );
+      }
+
+      if (result.kind === "view") {
+        const { data, headers, head, status = 200 } = result;
+        const stream = await renderToReadableStream(
+          createElement(Root, { data, styles: [], head }),
+          {
+            bootstrapScriptContent: `window.__GEMI_DATA__ = ${JSON.stringify(data)};`,
+            bootstrapModules: [
+              "/framework/refresh.js",
+              "/framework/main.tsx",
+              "http://localhost:5173/@vite/client",
+            ],
+          },
+        );
+
+        return new Response(stream, {
+          status,
+          headers: { ...headers, "Content-Type": "text/html" },
+        });
+      } else if (result.kind === "api") {
+        const { data, headers, status } = result;
+        return new Response(JSON.stringify(data), {
+          status,
+          headers: {
+            "Content-Type": "application/json",
+            ...headers,
+          },
+        });
+      } else if (result.kind === "api_404") {
+        return new Response("Not found", { status: 404 });
+      }
+    },
+  );
+
+  await vite.listen(5174);
+
+  process.env.ROOT_DIR = rootDir;
+  process.env.APP_DIR = appDir;
+
+  Bun.serve({
+    fetch: (req, s) => {
+      if (s.upgrade(req)) {
+        return;
+      }
+      return server.fetch.call(server, req);
+    },
+    port: process.env.PORT || 5173,
+    websocket: app.websocket,
+  });
+}

package/server/index.ts

@@ -0,0 +1 @@
+export { startDevServer } from "./dev";

package/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "extends": "@repo/typescript-config/react-library.json",
+  "compilerOptions": {
+    "outDir": "dist",
+    "emitDeclarationOnly": true,
+    "moduleResolution": "nodenext"
+  },
+  "include": ["http", "client", "server"],
+  "exclude": ["node_modules", "dist"]
+}

package/tsconfig.lint.json

@@ -0,0 +1,8 @@
+{
+  "extends": "@repo/typescript-config/react-library.json",
+  "compilerOptions": {
+    "outDir": "dist"
+  },
+  "include": ["src", "turbo"],
+  "exclude": ["node_modules", "dist"]
+}