@devxcrew/ui 1.0.81 → 1.1.0

package/assist/documentation/CHANGELOG.md

@@ -2,14 +2,26 @@
 
 ## Version State
 
-Current version: 1.0.81
+Current version: 1.1.0
 
-Release tag: v-1.0.81
+Release tag: v-1.1.0
 
-Changelog label: v 1.0.81
+Changelog label: v 1.1.0
 
 History starts with this standalone package baseline. CXApp business history is not copied.
 
+## v-1.1.0
+
+### [v 1.1.0] 2026-10-02 1:36 pm - Shared public pages and three identity desks
+
+#### Database Changes
+
+- Database update: No (manual).
+
+#### App Codebase Changes
+
+- Added configurable public pages, three desk login forms, session-aware desk shells and logout through the app-local identity API.
+
 ## v-1.0.81
 
 ### [v 1.0.81] 2026-10-02 12:08 pm - Devxcrew replacement release

package/assist/documentation/package-reference.md

@@ -10,6 +10,8 @@ Own reusable controls, accessible interaction primitives, layout wrappers, styli
 
 ## Public exports
 
+layouts/identity-portal provides shared public pages, three login pages and desk shells. Apps supply PublicApp configuration, public policy content and business desk content. The portal uses the app-local /api/auth and /api/desks HTTP endpoints. It stores no credentials or tokens in browser storage. Server-side authorization remains mandatory.
+
 | Export                            | Responsibility                                                                    |
 | --------------------------------- | --------------------------------------------------------------------------------- |
 | components/*                      | Radix-based controls, inputs, dialogs, tables, charts, loading states and editors |

package/dist/src/index.d.ts

@@ -5,6 +5,7 @@ export * from "./layouts/admin-layout";
 export * from "./layouts/application-layout";
 export * from "./layouts/app-layout";
 export * from "./layouts/auth-layout";
+export * from "./layouts/identity-portal";
 export * from "./layouts/super-layout";
 export * from "./layouts/web-layout";
 export * from "./components/aspect-ratio";

package/dist/src/index.js

@@ -5,6 +5,7 @@ export * from "./layouts/admin-layout";
 export * from "./layouts/application-layout";
 export * from "./layouts/app-layout";
 export * from "./layouts/auth-layout";
+export * from "./layouts/identity-portal";
 export * from "./layouts/super-layout";
 export * from "./layouts/web-layout";
 export * from "./components/aspect-ratio";

package/dist/src/layouts/identity-portal.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from "react";
+type Desk = "sa" | "admin" | "tenant";
+export type PublicApp = {
+    name: string;
+    applicationId: string;
+    version: string;
+    mode: "single" | "multi";
+    clientId: string | null;
+};
+export declare function IdentityPortal({ app, deskContent, publicContent }: {
+    app: PublicApp;
+    deskContent?: Partial<Record<Desk, ReactNode>>;
+    publicContent?: Partial<Record<"about" | "privacy" | "terms", ReactNode>>;
+}): import("react").JSX.Element;
+export {};

package/dist/src/layouts/identity-portal.js

@@ -0,0 +1,115 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { AuthLayout } from "./auth-layout";
+import { AppLayout } from "./app-layout";
+import { Button } from "../components/button";
+import { Input } from "../components/input";
+import { Label } from "../components/label";
+const desks = [
+    { id: "tenant", label: "Client desk", description: "Access your company workspace." },
+    { id: "admin", label: "Administration", description: "Manage application operations." },
+    { id: "sa", label: "Super Admin", description: "Manage application administration." }
+];
+export function IdentityPortal({ app, deskContent, publicContent }) {
+    const segments = window.location.pathname.split("/").filter(Boolean);
+    const desk = desks.find((item) => item.id === segments[0]);
+    if (desk && segments.length === 2 && segments[1] === "login")
+        return _jsx(LoginPage, { app: app, desk: desk.id });
+    if (desk && segments.length === 1)
+        return (_jsx(DeskPage, { app: app, desk: desk.id, children: deskContent?.[desk.id] }));
+    const page = segments[0];
+    if (segments.length > 1 || (page && !["login", "about", "privacy", "terms"].includes(page)))
+        return (_jsxs(PublicShell, { app: app, children: [_jsx("h1", { className: "text-3xl font-semibold", children: "Page not found" }), _jsx("a", { href: "/", children: "Return home" })] }));
+    if (page === "about" || page === "privacy" || page === "terms")
+        return (_jsxs(PublicShell, { app: app, children: [_jsx("h1", { className: "text-3xl font-semibold", children: page === "about" ? `About ${app.name}` : page === "privacy" ? "Privacy" : "Terms" }), publicContent?.[page] ?? (_jsx("p", { children: "Contact your application administrator for this information." }))] }));
+    return (_jsxs(PublicShell, { app: app, children: [_jsxs("div", { className: "space-y-3", children: [_jsx("p", { className: "text-sm font-medium text-muted-foreground", children: app.name }), _jsx("h1", { className: "text-4xl font-semibold tracking-tight", children: "Your workspace, connected." }), _jsx("p", { className: "text-lg text-muted-foreground", children: "Choose your desk to sign in." })] }), _jsx("div", { className: "grid gap-6 sm:grid-cols-3", children: desks.map((item) => (_jsxs("div", { className: "space-y-4 border-t pt-5", children: [_jsx("h2", { className: "text-xl font-semibold", children: item.label }), _jsx("p", { className: "text-muted-foreground", children: item.description }), _jsx(Button, { asChild: true, children: _jsxs("a", { href: `/${item.id}/login`, children: ["Open ", item.label] }) })] }, item.id))) })] }));
+}
+function PublicShell({ app, children }) {
+    return (_jsxs("div", { className: "min-h-screen bg-background text-foreground", children: [_jsx("header", { className: "border-b", children: _jsxs("nav", { "aria-label": "Public navigation", className: "mx-auto flex max-w-6xl flex-wrap items-center justify-between gap-4 px-6 py-5", children: [_jsx("a", { className: "text-xl font-semibold", href: "/", children: app.name }), _jsxs("div", { className: "flex gap-5", children: [_jsx("a", { href: "/about", children: "About" }), _jsx("a", { href: "/login", children: "Sign in" })] })] }) }), _jsx("main", { className: "mx-auto flex max-w-6xl flex-col gap-12 px-6 py-16", children: children }), _jsxs("footer", { className: "mx-auto flex max-w-6xl gap-6 px-6 py-8 text-sm", children: [_jsx("a", { href: "/privacy", children: "Privacy" }), _jsx("a", { href: "/terms", children: "Terms" })] })] }));
+}
+function LoginPage({ app, desk }) {
+    const label = desks.find((item) => item.id === desk).label;
+    const [error, setError] = useState("");
+    const [busy, setBusy] = useState(false);
+    async function submit(event) {
+        event.preventDefault();
+        setError("");
+        setBusy(true);
+        const form = new FormData(event.currentTarget);
+        try {
+            const response = await fetch(`/api/auth/${desk}/login`, {
+                method: "POST",
+                credentials: "same-origin",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({
+                    email: form.get("email"),
+                    password: form.get("password"),
+                    clientId: app.clientId ?? form.get("clientId")
+                })
+            });
+            const result = await response.json();
+            if (!response.ok)
+                throw new Error(result.message ?? "Sign-in failed. Try again.");
+            window.location.assign(`/${desk}`);
+        }
+        catch (failure) {
+            setError(failure instanceof Error ? failure.message : "Sign-in failed.");
+            setBusy(false);
+        }
+    }
+    return (_jsx(AuthLayout, { brandName: app.name, title: `${label} login`, surface: desk, description: `Sign in to ${label}.`, afterCard: _jsx("a", { href: "/", children: "Return home" }), children: _jsxs("form", { onSubmit: submit, className: "space-y-5", children: [_jsx("h2", { className: "text-lg font-semibold", children: label }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "email", children: "Email" }), _jsx(Input, { id: "email", name: "email", type: "email", autoComplete: "username", required: true, maxLength: 255 })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "password", children: "Password" }), _jsx(Input, { id: "password", name: "password", type: "password", autoComplete: "current-password", required: true, maxLength: 256 })] }), !app.clientId && (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "clientId", children: "Client code" }), _jsx(Input, { id: "clientId", name: "clientId", autoComplete: "organization", required: true, maxLength: 64 })] })), error && (_jsx("p", { role: "alert", className: "text-sm text-destructive", children: error })), _jsx(Button, { type: "submit", className: "w-full", disabled: busy, children: busy ? "Signing in…" : "Sign in" })] }) }));
+}
+function DeskPage({ app, desk, children }) {
+    const [session, setSession] = useState(null);
+    const [error, setError] = useState("");
+    useEffect(() => {
+        const controller = new AbortController();
+        async function load() {
+            try {
+                const response = await fetch(`/api/desks/${desk}`, {
+                    signal: controller.signal,
+                    credentials: "same-origin",
+                    cache: "no-store"
+                });
+                if (response.status === 401) {
+                    window.location.replace(`/${desk}/login`);
+                    return;
+                }
+                const result = await response.json();
+                if (!response.ok)
+                    throw new Error(result.message ?? "This desk is unavailable.");
+                setSession(result.data);
+            }
+            catch (failure) {
+                if (!controller.signal.aborted)
+                    setError(failure instanceof Error ? failure.message : "This desk is unavailable.");
+            }
+        }
+        void load();
+        const refresh = window.setInterval(() => void load(), 60000);
+        return () => {
+            controller.abort();
+            window.clearInterval(refresh);
+        };
+    }, [desk]);
+    async function logout() {
+        try {
+            const response = await fetch("/api/auth/logout", {
+                method: "POST",
+                credentials: "same-origin"
+            });
+            if (!response.ok)
+                throw new Error("Sign-out failed. Try again.");
+            window.location.assign(`/${desk}/login`);
+        }
+        catch (failure) {
+            setError(failure instanceof Error ? failure.message : "Sign-out failed.");
+        }
+    }
+    const label = desks.find((item) => item.id === desk).label;
+    if (error)
+        return (_jsxs(PublicShell, { app: app, children: [_jsx("h1", { className: "text-2xl font-semibold", children: label }), _jsx("p", { role: "alert", children: error }), _jsx("a", { href: `/${desk}/login`, children: "Return to sign in" })] }));
+    if (!session)
+        return (_jsx(PublicShell, { app: app, children: _jsx("p", { role: "status", children: "Loading your desk\u2026" }) }));
+    return (_jsx(AppLayout, { brand: { title: app.name, subtitle: label, href: `/${desk}` }, title: app.name, headerTitle: label, menuItems: [], workspaceItems: [], userMenuItems: [], homeHref: `/${desk}`, versionLabel: `v${app.version}`, children: _jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-4", children: [_jsxs("div", { children: [_jsxs("h1", { className: "text-2xl font-semibold", children: ["Welcome, ", session.name] }), _jsx("p", { className: "text-muted-foreground", children: session.email })] }), _jsx(Button, { variant: "outline", onClick: () => void logout(), children: "Sign out" })] }), children ?? _jsx("p", { children: "Your application modules will appear in this workspace." })] }) }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devxcrew/ui",
-  "version": "1.0.81",
+  "version": "1.1.0",
   "private": false,
   "type": "module",
   "exports": {