effect-start 0.11.1 → 0.13.0

package/README.md

@@ -14,96 +14,62 @@ by checking out `examples/` directory.
 It exports a layer that applies configuration and changes the behavior of the server:
 
 ```typescript
-import { Start } from "effect-start"
-import { BunTailwindPlugin } from "effect-start/bun"
-
-export default Start.make(
-  // enable file-based router
-  Start.router(() => import("./routes/_manifest")),
-  // bundle client-side code for the browser
-  Start.bundleClient({
-    entrypoints: [
-      "src/index.html",
-    ],
-    plugins: [
-      // enable TailwindCSS for client bundle
-      BunTailwindPlugin.make(),
-    ],
+import {
+  FileRouter,
+  Start,
+} from "effect-start"
+
+export default Start.layer(
+  FileRouter.layer({
+    load: () => import("./routes/manifest.ts"),
+    path: import.meta.resolve("./routes/manifest.ts"),
   }),
 )
+
+if (import.meta.main) {
+  Start.serve(() => import("./server.ts"))
+}
 ```
 
 ### File-based Routing
 
-Effect Start provides automatic file-based routing with support for frontend pages, backend endpoints, and stackable layouts.
+Effect Start provides automatic file-based routing with support for frontend pages, backend endpoints, and stackable middlewares called Route Layers.
 
 ```
-src/routes/
-├── _layout.tsx          # Root layout
-├── _page.tsx            # Home page (/)
-├── about/
-│   ├── _layout.tsx      # Nested layout for /about/*
-│   └── _page.tsx        # Static route (/about)
-├── users/
-│   ├── _page.tsx        # Users list (/users)
-│   └── $id/_page.tsx    # Dynamic route (/users/:id)
-└── $/_page.tsx          # Splat/catch-all (/**)
-```
-
-```ts
-import { FileRouter } from "effect-start"
-
-// Generate route manifest and watch for changes
-const routerLayer = FileRouter.layer(import.meta.resolve("routes"))
+$ tree src/routes
+src/routes
+├── [[...frontend]]
+│   └── route.ts
+├── admin
+│   ├── data.json
+│   │   └── route.tsx
+│   ├── layer.tsx
+│   └── route.tsx
+├── layer.tsx
+├── manifest.ts
+└── route.tsx
 ```
 
-**Note:** Ensure `FileRouter.layer` is provided after any bundle layer to guarantee the manifest file is properly generated before bundling.
-
 ### Tailwind CSS Support
 
-Effect Start includes built-in support for Tailwind CSS:
-
-```ts
-import { Start } from "effect-start"
-import { BunTailwindPlugin } from "effect-start/bun"
+Effect Start comes with native Tailwind support that is lightweight and
+works with minimal setup.
 
-const ClientBundle = Start.bundleClient({
-  entrypoints: [
-    "./src/index.html",
-  ],
-  plugins: [
-    BunTailwindPlugin.make(),
-  ],
-})
-
-export default Start.make(
-  ClientBundle,
-)
+First, install Tailwind package:
 
-if (import.meta.main) {
-  Start.serve(() => import("./server"))
-}
+```sh
+bun add tailwindcss
 ```
 
-Then in your main CSS files add following file:
+Then, register a plugin in `bunfig.toml`:
 
-```css
-@import "tailwindcss";
+```toml
+[serve.static]
+plugins = ["effect-start/x/tailwind/plugin"]
 ```
 
-### Cloudflare Tunnel
-
-Tunnel your local server to the Internet with `cloudflared`
-
-```ts
-import { Start } from "effect-start"
-import { CloudflareTunnel } from "effect-start/x/cloudflare"
+Finally, include it in your `src/app.css`:
 
-export default Start.make(
-  CloudflareTunnel.layer(),
-)
-
-if (import.meta.main) {
-  Start.serve(() => import("./server"))
-}
+```html
+@import "tailwindcss";
 ```

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "effect-start",
-  "version": "0.11.1",
+  "version": "0.13.0",
   "type": "module",
   "license": "MIT",
   "exports": {
     ".": "./src/index.ts",
-    "./Router": "./src/Router.ts",
+    "./FileRouter": "./src/FileRouter.ts",
     "./Route": "./src/Route.ts",
     "./EncryptedCookies": "./src/EncryptedCookies.ts",
     "./bun": "./src/bun/index.ts",
@@ -16,6 +16,7 @@
     "./jsx-dev-runtime": "./src/jsx-runtime.ts",
     "./hyper": "./src/hyper/index.ts",
     "./x/*": "./src/x/*/index.ts",
+    "./x/tailwind/plugin": "./src/x/tailwind/plugin.ts",
     "./middlewares/BasicAuthMiddleware": "./src/middlewares/BasicAuthMiddleware.ts",
     "./assets.d.ts": "./src/assets.d.ts"
   },
@@ -47,7 +48,6 @@
     "@types/react-dom": "^19.2.3",
     "dprint-cli": "^0.4.1",
     "dprint-markup": "nounder/dprint-markup",
-    "effect": "^3.19.10",
     "effect-memfs": "^0.8.0",
     "ts-namespace-import": "nounder/ts-namespace-import#140c405"
   },

package/src/Commander.test.ts

@@ -1,6 +1,7 @@
 import * as t from "bun:test"
 import * as Effect from "effect/Effect"
 import * as Schema from "effect/Schema"
+import * as assert from "node:assert"
 import * as Commander from "./Commander.ts"
 
 t.describe(`${Commander.make.name}`, () => {
@@ -1216,10 +1217,8 @@ t.describe("error handling", () => {
       Effect.either(Commander.parse(cmd, ["--port", "invalid"])),
     )
 
-    t.expect(result._tag).toBe("Left")
-    if (result._tag === "Left") {
-      t.expect(result.left.message).toContain("Invalid value")
-    }
+    assert.strictEqual(result._tag, "Left")
+    t.expect(result.left.message).toContain("Invalid value")
   })
 
   t.it("should fail on invalid choice", async () => {

package/src/FileHttpRouter.test.ts

@@ -1,14 +1,12 @@
 import * as Error from "@effect/platform/Error"
 import * as FileSystem from "@effect/platform/FileSystem"
-import * as HttpApp from "@effect/platform/HttpApp"
 import * as HttpRouter from "@effect/platform/HttpRouter"
-import * as HttpServerResponse from "@effect/platform/HttpServerResponse"
 import * as t from "bun:test"
 import * as Data from "effect/Data"
 import * as Effect from "effect/Effect"
 import * as FileHttpRouter from "./FileHttpRouter.ts"
+import * as FileRouter from "./FileRouter.ts"
 import * as Route from "./Route.ts"
-import * as Router from "./Router.ts"
 import * as TestHttpClient from "./TestHttpClient.ts"
 import { effectFn } from "./testing.ts"
 
@@ -31,13 +29,7 @@ const SampleRoutes = [
   },
 ] as const
 
-const SampleRouteManifest: Router.RouterManifest = {
-  routes: SampleRoutes,
-}
-
-const routerLayer = Router.layerPromise(async () => SampleRouteManifest)
-
-const effect = effectFn(routerLayer)
+const effect = effectFn()
 
 t.it("HttpRouter Requirement and Error types infers", () =>
   effect(function*() {
@@ -53,7 +45,7 @@ t.it("HttpRouter Requirement and Error types infers", () =>
 
 t.it("HTTP methods", () =>
   effect(function*() {
-    const allMethodsRoute: Router.LazyRoute = {
+    const allMethodsRoute: FileRouter.LazyRoute = {
       path: "/",
       load: async () => ({
         default: Route
@@ -111,40 +103,11 @@ t.it("router handles requests correctly", () =>
       .toBe("User created")
   }))
 
-t.it("middleware falls back to original app on 404", () =>
-  effect(function*() {
-    const middleware = FileHttpRouter.middleware()
-    const fallbackApp = Effect.succeed(HttpServerResponse.text("fallback"))
-    const middlewareApp = middleware(fallbackApp)
-
-    const client = TestHttpClient.make(middlewareApp)
-
-    const existingRouteResponse = yield* client.get("/users")
-
-    t
-      .expect(existingRouteResponse.status)
-      .toBe(200)
-
-    t
-      .expect(yield* existingRouteResponse.text)
-      .toBe("Users list")
-
-    const notFoundResponse = yield* client.get("/nonexistent")
-
-    t
-      .expect(notFoundResponse.status)
-      .toBe(200)
-
-    t
-      .expect(yield* notFoundResponse.text)
-      .toBe("fallback")
-  }))
-
 t.it(
   "handles routes with special characters (tilde and hyphen)",
   () =>
     effect(function*() {
-      const specialCharRoutes: Router.LazyRoute[] = [
+      const specialCharRoutes: FileRouter.LazyRoute[] = [
         {
           path: "/api-v1",
           load: async () => ({
@@ -204,7 +167,7 @@ t.it(
   "layer routes can wrap inner routes using next()",
   () =>
     effect(function*() {
-      const routeWithLayer: Router.LazyRoute = {
+      const routeWithLayer: FileRouter.LazyRoute = {
         path: "/page",
         load: async () => ({
           default: Route.html(Effect.succeed("<h1>Page Content</h1>")),
@@ -236,7 +199,7 @@ t.it(
 
 t.it("nested layers compose correctly with next()", () =>
   effect(function*() {
-    const routeWithNestedLayers: Router.LazyRoute = {
+    const routeWithNestedLayers: FileRouter.LazyRoute = {
       path: "/nested",
       load: async () => ({
         default: Route.html(Effect.succeed("content")),

package/src/FileHttpRouter.ts

@@ -192,18 +192,3 @@ export function make<
     return router as HttpRouterFromServerRoutes<Routes>
   })
 }
-
-export function middleware() {
-  return HttpMiddleware.make((app) =>
-    Effect.gen(function*() {
-      const routerContext = yield* Router.Router
-      const router = yield* make(
-        routerContext.routes as ReadonlyArray<Router.LazyRoute>,
-      )
-      const res = yield* router.pipe(
-        Effect.catchTag("RouteNotFound", () => app),
-      )
-      return res
-    })
-  )
-}

package/src/FileRouter.ts

@@ -1,6 +1,7 @@
 import type { PlatformError } from "@effect/platform/Error"
 import * as FileSystem from "@effect/platform/FileSystem"
 import * as Array from "effect/Array"
+import * as Context from "effect/Context"
 import * as Effect from "effect/Effect"
 import * as Function from "effect/Function"
 import * as Layer from "effect/Layer"
@@ -11,17 +12,33 @@ import * as NUrl from "node:url"
 import * as FileRouterCodegen from "./FileRouterCodegen.ts"
 import * as FileRouterPattern from "./FileRouterPattern.ts"
 import * as FileSystemExtra from "./FileSystemExtra.ts"
+import * as Route from "./Route.ts"
 import * as Router from "./Router.ts"
 
+export type RouteModule = {
+  default: Route.RouteSet.Default
+}
+
+export type LazyRoute = {
+  path: `/${string}`
+  load: () => Promise<RouteModule>
+  layers?: ReadonlyArray<() => Promise<unknown>>
+}
+
+type Manifest = {
+  routes: readonly LazyRoute[]
+}
+
+export class FileRouter extends Context.Tag("effect-start/FileRouter")<
+  FileRouter,
+  Manifest
+>() {}
+
 export type GroupSegment<Name extends string = string> =
   FileRouterPattern.GroupSegment<Name>
 
 export type Segment = FileRouterPattern.Segment
 
-export type RouteManifest = {
-  routes: readonly Router.LazyRoute[]
-}
-
 export type RouteHandle = {
   handle: "route" | "layer"
   // eg. `about/route.tsx`, `users/[userId]/route.tsx`, `(admin)/users/route.tsx`
@@ -119,8 +136,8 @@ export function parseRoute(
 /**
  * Generates a manifest file that references all routes.
  */
-export function layerManifest(options: {
-  load: () => Promise<unknown>
+export function layer(options: {
+  load: () => Promise<Manifest>
   path: string
 }) {
   let manifestPath = options.path
@@ -135,44 +152,69 @@ export function layerManifest(options: {
   const manifestFilename = NPath.basename(manifestPath)
   const resolvedManifestPath = NPath.resolve(routesPath, manifestFilename)
 
-  return Layer.scopedDiscard(
-    Effect.gen(function*() {
-      yield* FileRouterCodegen.update(routesPath, manifestFilename)
-
-      const stream = Function.pipe(
-        FileSystemExtra.watchSource({
-          path: routesPath,
-          filter: (e) => !e.path.includes("node_modules"),
-        }),
-        Stream.onError((e) => Effect.logError(e)),
-      )
-
-      yield* Function.pipe(
-        stream,
-        // filter out edits to gen file
-        Stream.filter(e => e.path !== resolvedManifestPath),
-        Stream.runForEach(() =>
-          FileRouterCodegen.update(routesPath, manifestFilename)
-        ),
-        Effect.fork,
-      )
-    }),
-  )
-}
-
-export function layer(options: {
-  load: () => Promise<Router.RouterManifest>
-  path: string
-}) {
   return Layer.provide(
     Layer.effect(
-      Router.Router,
+      FileRouter,
       Effect.promise(() => options.load()),
     ),
-    layerManifest(options),
+    Layer.scopedDiscard(
+      Effect.gen(function*() {
+        yield* FileRouterCodegen.update(routesPath, manifestFilename)
+
+        const stream = Function.pipe(
+          FileSystemExtra.watchSource({
+            path: routesPath,
+            filter: (e) => !e.path.includes("node_modules"),
+          }),
+          Stream.onError((e) => Effect.logError(e)),
+        )
+
+        yield* Function.pipe(
+          stream,
+          // filter out edits to gen file
+          Stream.filter(e => e.path !== resolvedManifestPath),
+          Stream.runForEach(() =>
+            FileRouterCodegen.update(routesPath, manifestFilename)
+          ),
+          Effect.fork,
+        )
+      }),
+    ),
   )
 }
 
+export function fromManifest(
+  manifest: Manifest,
+): Effect.Effect<Router.Router.Any> {
+  return Effect.gen(function*() {
+    const loadedEntries = yield* Effect.forEach(
+      manifest.routes,
+      (lazyRoute) =>
+        Effect.gen(function*() {
+          const routeModule = yield* Effect.promise(() => lazyRoute.load())
+          const layerModules = lazyRoute.layers
+            ? yield* Effect.forEach(
+              lazyRoute.layers,
+              (loadLayer) => Effect.promise(() => loadLayer()),
+            )
+            : []
+
+          const layers = layerModules
+            .map((m: any) => m.default)
+            .filter(Route.isRouteLayer)
+
+          return {
+            path: lazyRoute.path,
+            route: routeModule.default,
+            layers,
+          }
+        }),
+    )
+
+    return Router.make(loadedEntries, [])
+  })
+}
+
 export function walkRoutesDirectory(
   dir: string,
 ): Effect.Effect<