@allem-sdk/auth

Authentication helpers for React. Provider-agnostic via an adapter interface that works with any auth backend.

Installation

npm install @allem-sdk/auth

Usage

import { AuthProvider, useAuth, ProtectedRoute } from "@allem-sdk/auth";

// Define an adapter for your auth provider
const myAuthAdapter = {
  getSession: async () => {
    const res = await fetch("/api/auth/session");
    if (!res.ok) return null;
    return res.json();
  },
  signIn: async (credentials) => {
    const res = await fetch("/api/auth/signin", {
      method: "POST",
      body: JSON.stringify(credentials),
    });
    return res.json();
  },
  signOut: async () => {
    await fetch("/api/auth/signout", { method: "POST" });
  },
};

function App() {
  return (
    <AuthProvider adapter={myAuthAdapter}>
      <ProtectedRoute
        fallback={<LoginPage />}
        loadingFallback={<Spinner />}
      >
        <Dashboard />
      </ProtectedRoute>
    </AuthProvider>
  );
}

function Dashboard() {
  const { user, status, signOut } = useAuth();
  return <button onClick={signOut}>Sign out, {user?.name}</button>;
}

Built-in Adapters

Pre-built adapters for popular auth providers — no need to write your own:

import { supabaseAdapter, nextAuthAdapter, clerkAdapter } from "@allem-sdk/auth";

| Adapter | Usage | Notes | |---------|-------|-------| | supabaseAdapter(supabase) | Pass your Supabase client | Wraps signInWithPassword, reads session/user | | nextAuthAdapter(options?) | { basePath?: string } | Fetches from /api/auth/session. Works with v4/v5 | | clerkAdapter(clerk) | Pass the Clerk instance | Read-only — sign-in is handled by Clerk's <SignIn /> |

// Supabase
import { createClient } from "@supabase/supabase-js";
const supabase = createClient(url, key);
<AuthProvider adapter={supabaseAdapter(supabase)}>

// NextAuth
<AuthProvider adapter={nextAuthAdapter()}>

// Clerk
<AuthProvider adapter={clerkAdapter(clerk)}>

Exports

| Export | Type | Description | |--------|------|-------------| | AuthProvider | Component | Context provider with automatic session management | | useAuth | Hook | Returns user, status, isAuthenticated, isLoading, signIn, signOut | | useSession | Hook | Returns session object and update function | | ProtectedRoute | Component | Renders children only when authenticated, with fallback support | | supabaseAdapter | Factory | Adapter for Supabase auth | | nextAuthAdapter | Factory | Adapter for NextAuth.js | | clerkAdapter | Factory | Adapter for Clerk |

Part of Allem SDK

This package can be used standalone or as part of the full SDK. Install allem-sdk to get all packages in one install.

Support

If you find Allem SDK useful, consider supporting its development:

License

MIT - Ahmed Allem