@effectify/react-remix 0.4.6 → 0.5.0

package/README.md

@@ -26,7 +26,7 @@ Create a server runtime with your Effect layers:
 
 ```typescript
 // lib/server-runtime.ts
-import { Runtime } from "@effectify/react-remix";
+import { Runtime } from "@effectify/react-remix"
 import * as Layer from "effect/Layer"
 
 const layers = Layer.empty
@@ -38,7 +38,7 @@ export const { withLoaderEffect, withActionEffect } = Runtime.make(layers)
 
 Use the Effect-based loaders and actions in your Remix routes:
 
-```typescript
+````typescript
 // routes/home.tsx
 import type * as Route from "./+types.home";
 import { httpSuccess, httpFailure, LoaderArgsContext } from "@effectify/react-remix";
@@ -74,15 +74,16 @@ For error handling, use the `httpFailure` helper:
 return yield* httpFailure("Something went wrong")
 // or with more complex error objects
 return yield* httpFailure({ code: 'VALIDATION_ERROR', message: 'Invalid input' })
-```
+````
 
 ### Redirects
 
 For redirects, use the `httpRedirect` helper:
+
 ```typescript
-return yield* httpRedirect('/login')
+return yield * httpRedirect("/login")
 // or with custom status/headers
-return yield* httpRedirect('/dashboard', { status: 301 })
+return yield * httpRedirect("/dashboard", { status: 301 })
 ```
 
 ## API
@@ -98,12 +99,14 @@ Creates Effect-based runtime helpers for Remix.
 #### Returns
 
 An object containing:
+
 - `withLoaderEffect`: Wrapper for Remix loaders using Effect
 - `withActionEffect`: Wrapper for Remix actions using Effect
 
 ### `LoaderArgsContext`
 
 Effect context providing access to Remix loader arguments including:
+
 - `request`: The incoming Request object
 - `params`: Route parameters
 - `context`: Additional context data
@@ -133,7 +136,7 @@ The library provides comprehensive error handling with full ErrorBoundary suppor
 
 ```typescript
 // The library automatically logs errors like this:
-Effect.tapError((cause) => Effect.logError('Loader effect failed', cause))
+Effect.tapError((cause) => Effect.logError("Loader effect failed", cause))
 
 // Loader errors are automatically converted to Response objects for ErrorBoundary:
 // - Effect errors → Response with { ok: false, errors: [...] } and status 500
@@ -150,7 +153,7 @@ const runtime = make(pipe(
   // Your app layers
   MyAppLayer,
   // Custom logger layer
-  Logger.replace(Logger.defaultLogger, customLogger)
+  Logger.replace(Logger.defaultLogger, customLogger),
 ))
 ```
 
@@ -161,4 +164,4 @@ const runtime = make(pipe(
 
 ## License
 
-MIT
+MIT

package/dist/src/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./lib/context.js";
+export * as HttpApiHandler from "./lib/http-api-handler.js";
+export * from "./lib/http-response.js";
+export * as Runtime from "./lib/runtime.js";

package/dist/src/index.js

@@ -0,0 +1,4 @@
+export * from "./lib/context.js";
+export * as HttpApiHandler from "./lib/http-api-handler.js";
+export * from "./lib/http-response.js";
+export * as Runtime from "./lib/runtime.js";

package/dist/src/lib/context.d.ts

@@ -0,0 +1,9 @@
+import type { ActionFunctionArgs, LoaderFunctionArgs } from "@remix-run/node";
+import * as Context from "effect/Context";
+declare const ActionArgsContext_base: Context.TagClass<ActionArgsContext, "ActionArgsContext", ActionFunctionArgs>;
+export declare class ActionArgsContext extends ActionArgsContext_base {
+}
+declare const LoaderArgsContext_base: Context.TagClass<LoaderArgsContext, "LoaderArgsContext", LoaderFunctionArgs>;
+export declare class LoaderArgsContext extends LoaderArgsContext_base {
+}
+export {};

package/dist/src/lib/context.js

@@ -0,0 +1,5 @@
+import * as Context from "effect/Context";
+export class ActionArgsContext extends Context.Tag("ActionArgsContext")() {
+}
+export class LoaderArgsContext extends Context.Tag("LoaderArgsContext")() {
+}

package/dist/src/lib/http-api-handler.d.ts

@@ -0,0 +1,12 @@
+import type * as HttpApi from "@effect/platform/HttpApi";
+import * as HttpApiScalar from "@effect/platform/HttpApiScalar";
+import type { ActionFunctionArgs, LoaderFunctionArgs } from "@remix-run/node";
+import * as Layer from "effect/Layer";
+export type HttpApiOptions = {
+    apiLive: Layer.Layer<HttpApi.Api, never, never>;
+    scalar?: HttpApiScalar.ScalarConfig;
+};
+export type RoutePath = "/" | `/${string}/`;
+export declare const make: (options: HttpApiOptions & {
+    pathPrefix?: RoutePath;
+}) => ({ request }: ActionFunctionArgs | LoaderFunctionArgs) => Promise<Response>;

package/dist/src/lib/http-api-handler.js

@@ -0,0 +1,17 @@
+import * as HttpApiBuilder from "@effect/platform/HttpApiBuilder";
+import * as HttpApiScalar from "@effect/platform/HttpApiScalar";
+import * as HttpServer from "@effect/platform/HttpServer";
+import { Option } from "effect";
+import { pipe } from "effect/Function";
+import * as Layer from "effect/Layer";
+export const make = (options) => ({ request }) => pipe(Option.fromNullable(options.scalar), Option.map((scalar) => HttpApiScalar.layer({
+    path: `${options.pathPrefix || "/api/"}docs`,
+    scalar: {
+        ...scalar,
+        baseServerURL: new URL(request.url).origin,
+    },
+}).pipe(Layer.provide(options.apiLive))), Option.getOrElse(() => Layer.empty), (ApiDocsLive) => {
+    const EnvLive = Layer.mergeAll(options.apiLive, ApiDocsLive, HttpServer.layerContext);
+    const { handler } = HttpApiBuilder.toWebHandler(EnvLive);
+    return handler(request);
+});

package/dist/src/lib/http-response.d.ts

@@ -0,0 +1,34 @@
+import type { ResponseInit } from "@effect/platform-node/Undici";
+import * as Effect from "effect/Effect";
+declare const HttpResponseSuccess_base: new <A extends Record<string, any> = {}>(args: import("effect/Types").Equals<A, {}> extends true ? void : { readonly [P in keyof A as P extends "_tag" ? never : P]: A[P]; }) => Readonly<A> & {
+    readonly _tag: "HttpResponseSuccess";
+};
+export declare class HttpResponseSuccess<T> extends HttpResponseSuccess_base<{
+    readonly data: T;
+}> {
+}
+declare const HttpResponseFailure_base: new <A extends Record<string, any> = {}>(args: import("effect/Types").Equals<A, {}> extends true ? void : { readonly [P in keyof A as P extends "_tag" ? never : P]: A[P]; }) => Readonly<A> & {
+    readonly _tag: "HttpResponseFailure";
+};
+export declare class HttpResponseFailure<T = unknown> extends HttpResponseFailure_base<{
+    readonly cause: T;
+}> {
+}
+declare const HttpResponseRedirect_base: new <A extends Record<string, any> = {}>(args: import("effect/Types").Equals<A, {}> extends true ? void : { readonly [P in keyof A as P extends "_tag" ? never : P]: A[P]; }) => Readonly<A> & {
+    readonly _tag: "HttpResponseRedirect";
+};
+export declare class HttpResponseRedirect extends HttpResponseRedirect_base<{
+    readonly to: string;
+    readonly init?: number | ResponseInit | undefined;
+}> {
+}
+export type HttpResponse<T> = HttpResponseRedirect | HttpResponseSuccess<T> | HttpResponseFailure<unknown>;
+export declare const matchHttpResponse: <T>() => <P extends {
+    readonly HttpResponseSuccess: (_: HttpResponseSuccess<T>) => any;
+    readonly HttpResponseFailure: (_: HttpResponseFailure<unknown>) => any;
+    readonly HttpResponseRedirect: (_: HttpResponseRedirect) => any;
+} & { readonly [Tag in Exclude<keyof P, "HttpResponseSuccess" | "HttpResponseFailure" | "HttpResponseRedirect">]: never; }>(fields: P) => (input: HttpResponse<T>) => import("effect/Unify").Unify<ReturnType<P[keyof P]>>;
+export declare const httpSuccess: <T>(data: T) => Effect.Effect<HttpResponseSuccess<T>, never, never>;
+export declare const httpFailure: <T = unknown>(cause: T) => Effect.Effect<HttpResponseFailure<T>, never, never>;
+export declare const httpRedirect: (to: string, init?: number | ResponseInit) => Effect.Effect<HttpResponseRedirect, never, never>;
+export {};

package/dist/src/lib/http-response.js

@@ -0,0 +1,14 @@
+import * as Data from "effect/Data";
+import * as Effect from "effect/Effect";
+import * as Match from "effect/Match";
+export class HttpResponseSuccess extends Data.TaggedClass("HttpResponseSuccess") {
+}
+export class HttpResponseFailure extends Data.TaggedClass("HttpResponseFailure") {
+}
+export class HttpResponseRedirect extends Data.TaggedClass("HttpResponseRedirect") {
+}
+export const matchHttpResponse = () => Match.typeTags();
+// Helper functions for better DX
+export const httpSuccess = (data) => Effect.succeed(new HttpResponseSuccess({ data }));
+export const httpFailure = (cause) => Effect.succeed(new HttpResponseFailure({ cause }));
+export const httpRedirect = (to, init) => Effect.succeed(new HttpResponseRedirect({ to, init }));

package/dist/src/lib/runtime.d.ts

@@ -0,0 +1,25 @@
+import { Response } from "@effect/platform-node/Undici";
+import { type ActionFunctionArgs, type LoaderFunctionArgs } from "@remix-run/node";
+import * as Effect from "effect/Effect";
+import type * as Layer from "effect/Layer";
+import { ActionArgsContext, LoaderArgsContext } from "./context.js";
+import { type HttpResponse } from "./http-response.js";
+export declare const make: <R, E>(layer: Layer.Layer<R, E, never>) => {
+    withLoaderEffect: <A, B>(self: Effect.Effect<HttpResponse<A> | Response, B, R | LoaderArgsContext>) => (args: LoaderFunctionArgs) => Promise<{
+        ok: true;
+        data: A;
+    } | {
+        ok: false;
+        errors: string[];
+    }>;
+    withActionEffect: <A, B_1>(self: Effect.Effect<HttpResponse<A> | Response, B_1, R | ActionArgsContext>) => (args: ActionFunctionArgs) => Promise<import("@remix-run/node").TypedResponse<{
+        ok: false;
+        errors: string[];
+    }> | {
+        ok: true;
+        response: A;
+    } | import("@remix-run/node").TypedResponse<{
+        ok: false;
+        errors: string[];
+    }> | import("@remix-run/node").TypedResponse<never>>;
+};

package/dist/src/lib/runtime.js

@@ -0,0 +1,101 @@
+import { Response } from "@effect/platform-node/Undici";
+import { json, redirect } from "@remix-run/node";
+import * as Effect from "effect/Effect";
+import * as Exit from "effect/Exit";
+import { pipe } from "effect/Function";
+import * as Logger from "effect/Logger";
+import * as ManagedRuntime from "effect/ManagedRuntime";
+import { ActionArgsContext, LoaderArgsContext } from "./context.js";
+import { matchHttpResponse } from "./http-response.js";
+export const make = (layer) => {
+    const runtime = ManagedRuntime.make(layer);
+    const withLoaderEffect = (self) => (args) => {
+        const runnable = pipe(self, Effect.provide(Logger.pretty), Effect.provideService(LoaderArgsContext, args), Effect.tapError((cause) => Effect.logError("Loader effect failed", cause)));
+        return runtime.runPromiseExit(runnable).then(Exit.match({
+            onFailure: (cause) => {
+                if (cause._tag === "Fail") {
+                    // Preserve the original error for ErrorBoundary
+                    const error = cause.error;
+                    if (error instanceof Response) {
+                        throw error;
+                    }
+                    if (error instanceof Error) {
+                        throw error;
+                    }
+                    // Convert other errors to Response for ErrorBoundary with ok: false
+                    const errorData = { ok: false, errors: [String(error)] };
+                    throw new Response(JSON.stringify(errorData), {
+                        status: 500,
+                        headers: { "Content-Type": "application/json" },
+                    });
+                }
+                // Handle other types of failures (interrupts, defects, etc.)
+                const errorData = { ok: false, errors: ["Internal server error"] };
+                throw new Response(JSON.stringify(errorData), {
+                    status: 500,
+                    headers: { "Content-Type": "application/json" },
+                });
+            },
+            onSuccess: (result) => {
+                // If the result is a Response, throw it directly to preserve headers (including Set-Cookie)
+                // This is how React Router expects to handle Responses from loaders/actions
+                if (result instanceof Response) {
+                    throw result;
+                }
+                // Otherwise, match the HttpResponse types
+                return matchHttpResponse()({
+                    HttpResponseSuccess: ({ data: response }) => ({ ok: true, data: response }),
+                    HttpResponseFailure: ({ cause }) => {
+                        // Convert HttpResponseFailure to Response for ErrorBoundary with ok: false
+                        const errorMessage = typeof cause === "string" ? cause : String(cause);
+                        const errorData = { ok: false, errors: [errorMessage] };
+                        throw new Response(JSON.stringify(errorData), {
+                            status: 500,
+                            headers: { "Content-Type": "application/json" },
+                        });
+                    },
+                    HttpResponseRedirect: ({ to, init = {} }) => {
+                        redirect(to, init);
+                        return { ok: false, errors: ["Redirecting..."] };
+                    },
+                })(result);
+            },
+        }));
+    };
+    // Don't throw the Error requests, handle them in the normal UI. No ErrorBoundary
+    const withActionEffect = (self) => (args) => {
+        const runnable = pipe(self, Effect.provide(Logger.pretty), Effect.provideService(ActionArgsContext, args), Effect.tapError((cause) => {
+            if (!(cause instanceof Response)) {
+                return Effect.logError("Action effect failed", cause);
+            }
+            return Effect.void;
+        }));
+        return runtime.runPromiseExit(runnable).then(Exit.match({
+            onFailure: (cause) => {
+                if (cause._tag === "Fail") {
+                    const error = cause.error;
+                    // If the error is a Response, throw it directly to preserve headers
+                    if (error instanceof Response) {
+                        throw error;
+                    }
+                    return json({ ok: false, errors: [String(error)] }, { status: 400 });
+                }
+                return json({ ok: false, errors: ["Internal server error"] }, { status: 400 });
+            },
+            onSuccess: (result) => {
+                // If the result is a Response, throw it directly to preserve headers (including Set-Cookie)
+                // This is how React Router expects to handle Responses from actions
+                if (result instanceof Response) {
+                    throw result;
+                }
+                // Otherwise, match the HttpResponse types
+                return matchHttpResponse()({
+                    HttpResponseSuccess: ({ data: response }) => ({ ok: true, response }),
+                    HttpResponseFailure: ({ cause }) => json({ ok: false, errors: [String(cause)] }, { status: 400 }),
+                    HttpResponseRedirect: ({ to, init = {} }) => redirect(to, init),
+                })(result);
+            },
+        }));
+    };
+    return { withLoaderEffect, withActionEffect };
+};

package/package.json

@@ -1,20 +1,20 @@
 {
   "name": "@effectify/react-remix",
-  "version": "0.4.6",
+  "version": "0.5.0",
   "description": "Integration of Remix with Effect for React applications",
   "type": "module",
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "main": "./dist/src/index.js",
+  "module": "./dist/src/index.js",
+  "types": "./dist/src/index.d.ts",
   "publishConfig": {
     "access": "public"
   },
   "exports": {
     ".": {
       "@effectify/source": "./src/index.ts",
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "default": "./dist/index.js"
+      "types": "./dist/src/index.d.ts",
+      "import": "./dist/src/index.js",
+      "default": "./dist/src/index.js"
     }
   },
   "files": [
@@ -24,7 +24,7 @@
   "dependencies": {
     "@effect/platform": "0.94.0",
     "@effect/platform-node": "0.104.0",
-    "effect": "3.19.13",
+    "effect": "3.19.15",
     "@remix-run/react": "2.17.2",
     "@remix-run/node": "2.17.2"
   },