@effectify/react-remix 0.2.0 → 0.4.1

package/README.md

@@ -41,7 +41,7 @@ Use the Effect-based loaders and actions in your Remix routes:
 ```typescript
 // routes/home.tsx
 import type * as Route from "./+types.home";
-import { Ok, LoaderArgsContext } from "@effectify/react-remix";
+import { httpSuccess, httpFailure, LoaderArgsContext } from "@effectify/react-remix";
 import { withLoaderEffect } from "~/lib/server-runtime";
 import * as Effect from "effect/Effect"
 
@@ -49,7 +49,12 @@ export const loader = withLoaderEffect(
   Effect.gen(function* () {
     const { request } = yield* LoaderArgsContext
     yield* Effect.log("request", request)
-    return yield* Effect.succeed(new Ok({ data: { hello: 'world' }}))
+    
+    // Improved DX: Simple syntax for success responses
+    return yield* httpSuccess({ hello: 'world' })
+    
+    // For error responses, use:
+    // return yield* httpFailure("Something went wrong")
   })
 )
 
@@ -61,6 +66,23 @@ export default function Home({ loaderData }: Route.ComponentProps) {
     </div>
   )
 }
+
+### Error Responses
+
+For error handling, use the `httpFailure` helper:
+```typescript
+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')
+// or with custom status/headers
+return yield* httpRedirect('/dashboard', { status: 301 })
 ```
 
 ## API
@@ -88,9 +110,49 @@ Effect context providing access to Remix loader arguments including:
 
 ### Response Types
 
-- `Ok(data)`: Successful response with data
-- `Redirect(url)`: Redirect response
-- `Error(message)`: Error response
+- `HttpResponseSuccess<T>(data)`: Successful HTTP response with data
+- `HttpResponseFailure<T>(cause)`: Failed HTTP response with cause
+- `HttpResponseRedirect(to, init?)`: HTTP redirect response
+
+### Helper Functions
+
+- `httpSuccess<T>(data: T)`: Creates a successful Effect with HttpResponseSuccess
+- `httpFailure<T>(cause: T)`: Creates a successful Effect with HttpResponseFailure
+- `httpRedirect(to: string, init?: ResponseInit)`: Creates a successful Effect with HttpResponseRedirect
+
+### Error Handling & Logging
+
+The library provides comprehensive error handling with full ErrorBoundary support:
+
+- **Automatic Error Logging**: Errors are automatically logged using `Effect.logError`
+- **ErrorBoundary Compatible**: Loader errors are properly thrown as `Response` objects for Remix ErrorBoundary
+- **Configurable Logging**: Users can configure their own logging system through Effect layers
+- **Non-blocking**: Logging doesn't block the main thread
+- **Structured Logging**: Errors are logged with context and structured data
+- **Error Preservation**: Original error context is preserved for better debugging
+
+```typescript
+// The library automatically logs errors like this:
+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
+// - HttpResponseFailure → Response with { ok: false, errors: [...] } and status 500
+// - Original Response/Error objects are preserved
+
+// Users can configure custom logging through Effect layers
+const customLogger = Logger.make(({ message, cause }) => {
+  // Custom logging implementation
+  console.log(`[${new Date().toISOString()}] ${message}`, cause)
+})
+
+const runtime = make(pipe(
+  // Your app layers
+  MyAppLayer,
+  // Custom logger layer
+  Logger.replace(Logger.defaultLogger, customLogger)
+))
+```
 
 ## Requirements
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@effectify/react-remix",
-  "version": "0.2.0",
+  "version": "0.4.1",
   "description": "Integration of Remix with Effect for React applications",
   "type": "module",
   "main": "./dist/index.js",
@@ -22,11 +22,11 @@
     "!**/*.tsbuildinfo"
   ],
   "dependencies": {
-    "@effect/platform": "0.91.1",
-    "@effect/platform-node": "0.97.1",
-    "effect": "3.17.14",
-    "@remix-run/react": "2.17.1",
-    "@remix-run/node": "2.17.1"
+    "@effect/platform": "0.94.0",
+    "@effect/platform-node": "0.104.0",
+    "effect": "3.19.13",
+    "@remix-run/react": "2.17.2",
+    "@remix-run/node": "2.17.2"
   },
   "devDependencies": {},
   "peerDependencies": {},

package/dist/src/index.d.ts

@@ -1,3 +0,0 @@
-export * from './lib/context.js';
-export * from './lib/http-response.js';
-export * as Runtime from './lib/runtime.js';

package/dist/src/index.js

@@ -1,3 +0,0 @@
-export * from './lib/context.js';
-export * from './lib/http-response.js';
-export * as Runtime from './lib/runtime.js';

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

@@ -1,9 +0,0 @@
-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

@@ -1,5 +0,0 @@
-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-response.d.ts

@@ -1,21 +0,0 @@
-declare const Ok_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: "Ok";
-};
-export declare class Ok<T> extends Ok_base<{
-    readonly data: T;
-}> {
-}
-declare const Redirect_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: "Redirect";
-};
-export declare class Redirect extends Redirect_base<{
-    readonly to: string;
-    readonly init?: number | ResponseInit | undefined;
-}> {
-}
-export type HttpResponse<T> = Redirect | Ok<T>;
-export declare const matchHttpResponse: <T>() => <P extends {
-    readonly Ok: (_: Ok<T>) => any;
-    readonly Redirect: (_: Redirect) => any;
-} & { readonly [Tag in Exclude<keyof P, "Ok" | "Redirect">]: never; }>(fields: P) => (input: HttpResponse<T>) => import("effect/Unify").Unify<ReturnType<P[keyof P]>>;
-export {};

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

@@ -1,7 +0,0 @@
-import * as Data from 'effect/Data';
-import * as Match from 'effect/Match';
-export class Ok extends Data.TaggedClass('Ok') {
-}
-export class Redirect extends Data.TaggedClass('Redirect') {
-}
-export const matchHttpResponse = () => Match.typeTags();

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

@@ -1,21 +0,0 @@
-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>, B, R | LoaderArgsContext>) => (args: LoaderFunctionArgs) => Promise<{
-        ok: true;
-        data: A;
-    } | {
-        ok: false;
-        errors: string[];
-    }>;
-    withActionEffect: <A, B_1>(self: Effect.Effect<HttpResponse<A>, B_1, R | ActionArgsContext>) => (args: ActionFunctionArgs) => Promise<import("@remix-run/node").TypedResponse<{
-        ok: false;
-        errors: B_1;
-    }> | {
-        ok: true;
-        response: A;
-    } | import("@remix-run/node").TypedResponse<never>>;
-};

package/dist/src/lib/runtime.js

@@ -1,49 +0,0 @@
-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));
-        return runtime.runPromiseExit(runnable).then(Exit.match({
-            onFailure: (cause) => {
-                console.error(cause);
-                if (cause._tag === 'Fail') {
-                    throw pipe(cause.error);
-                }
-                // biome-ignore lint/style/useThrowOnlyError: <library uses non-Error throws>
-                throw { ok: false, errors: ['Something went wrong'] };
-            },
-            onSuccess: matchHttpResponse()({
-                Ok: ({ data: response }) => {
-                    return { ok: true, data: response };
-                },
-                Redirect: ({ to, init = {} }) => {
-                    redirect(to, init);
-                    return { ok: false, errors: ['Redirecting...'] };
-                },
-            }),
-        }));
-    };
-    // 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.match({
-            onFailure: (errors) => json({ ok: false, errors }, { status: 400 }),
-            onSuccess: matchHttpResponse()({
-                Ok: ({ data: response }) => {
-                    return { ok: true, response };
-                },
-                Redirect: ({ to, init = {} }) => {
-                    return redirect(to, init);
-                },
-            }),
-        }));
-        return runtime.runPromise(runnable);
-    };
-    return { withLoaderEffect, withActionEffect };
-};