@questpie/admin 0.0.1 → 1.0.1

package/src/views/layout/admin-router.tsx

@@ -1,206 +0,0 @@
-/**
- * AdminRouter Component
- *
- * Automatic routing for all collections from CMS + admin config
- *
- * URL Patterns:
- * - /admin -> Dashboard
- * - /admin/:collection -> List view
- * - /admin/:collection/new -> Create form
- * - /admin/:collection/:id -> Edit form
- */
-
-import * as React from "react";
-import { CollectionList } from "../collection/collection-list";
-import { CollectionForm } from "../collection/collection-form";
-import { AutoFormFields } from "../collection/auto-form-fields";
-import { LocaleSwitcher } from "../common/locale-switcher";
-import type { ComponentRegistry } from "../../config/component-registry";
-
-export interface AdminRouterProps {
-	/**
-	 * Admin configuration
-	 */
-	config: {
-		collections?: Record<
-			string,
-			{
-				label?: string;
-				list?: {
-					defaultColumns?: string[];
-					defaultSort?: { field: string; direction: "asc" | "desc" };
-					with?: string[];
-				};
-				fields?: Record<
-					string,
-					{
-						label?: string;
-						list?: {
-							renderCell?: string | React.ComponentType;
-						};
-					}
-				>;
-			}
-		>;
-	};
-
-	/**
-	 * Current route segments (parsed from URL)
-	 * Example: ["barbers", "123"] for /admin/barbers/123
-	 */
-	segments: string[];
-
-	/**
-	 * Navigate function (router-specific)
-	 */
-	navigate: (path: string) => void;
-
-	/**
-	 * Custom dashboard component
-	 */
-	DashboardComponent?: React.ComponentType;
-
-	/**
-	 * Custom collection components override
-	 */
-	collectionComponents?: Record<
-		string,
-		{
-			List?: React.ComponentType;
-			Form?: React.ComponentType;
-		}
-	>;
-
-	/**
-	 * Render custom form fields for collection
-	 * If not provided, will use default field detection
-	 */
-	renderFormFields?: (collection: string) => React.ReactNode;
-
-	/**
-	 * Component registry
-	 */
-	registry?: ComponentRegistry;
-}
-
-/**
- * Default Dashboard
- */
-function DefaultDashboard() {
-	return (
-		<div className="container py-8">
-			<h1 className="mb-8 text-3xl font-bold">Dashboard</h1>
-			<div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-4">
-				<div className="rounded-lg border bg-card p-6">
-					<h3 className="font-semibold">Collections</h3>
-					<p className="mt-2 text-3xl font-bold">--</p>
-				</div>
-			</div>
-		</div>
-	);
-}
-
-export function AdminRouter({
-	config,
-	segments,
-	navigate,
-	DashboardComponent,
-	collectionComponents,
-	renderFormFields,
-	registry,
-}: AdminRouterProps): React.ReactElement {
-	// Dashboard: no segments
-	if (segments.length === 0) {
-		const Dashboard = DashboardComponent || DefaultDashboard;
-		return <Dashboard />;
-	}
-
-	const [collection, idOrNew] = segments;
-	const collectionConfig = config.collections?.[collection];
-
-	// Custom collection component override
-	const customComponents = collectionComponents?.[collection];
-
-	// List view: /admin/:collection
-	if (!idOrNew) {
-		if (customComponents?.List) {
-			return <customComponents.List />;
-		}
-
-		// Auto-generate columns from config
-		const columns = collectionConfig?.list?.defaultColumns?.map((field) => ({
-			accessorKey: field,
-			header: collectionConfig.fields?.[field]?.label || field,
-		})) || [{ accessorKey: "id", header: "ID" }];
-
-		const withRelations = collectionConfig?.list?.with;
-
-		return (
-			<div className="container py-8">
-				<CollectionList
-					collection={collection as any}
-					columns={columns as any}
-					baseFindOptions={
-						withRelations
-							? {
-									with: withRelations.reduce((acc, rel) => {
-										acc[rel] = true;
-										return acc;
-									}, {} as any),
-								}
-							: undefined
-					}
-					realtime={true}
-					headerActions={
-						<div className="flex items-center gap-2">
-							<LocaleSwitcher />
-							<button
-								type="button"
-								onClick={() => navigate(`/admin/${collection}/new`)}
-								className="rounded bg-primary px-4 py-2 text-primary-foreground"
-							>
-								Create {collectionConfig?.label || collection}
-							</button>
-						</div>
-					}
-					onRowClick={(item: any) => {
-						navigate(`/admin/${collection}/${item.id}`);
-					}}
-				/>
-			</div>
-		);
-	}
-
-	// Form view: /admin/:collection/new or /admin/:collection/:id
-	const id = idOrNew === "new" ? undefined : idOrNew;
-
-	if (customComponents?.Form) {
-		return <customComponents.Form />;
-	}
-
-	return (
-		<div className="container max-w-2xl py-8">
-			<CollectionForm
-				collection={collection as any}
-				id={id}
-				title={
-					id
-						? `Edit ${collectionConfig?.label || collection}`
-						: `New ${collectionConfig?.label || collection}`
-				}
-				headerActions={<LocaleSwitcher />}
-				onSuccess={() => navigate(`/admin/${collection}`)}
-				onCancel={() => navigate(`/admin/${collection}`)}
-			>
-				{renderFormFields?.(collection) || (
-					<AutoFormFields
-						collection={collection as any}
-						config={collectionConfig}
-						registry={registry}
-						allCollectionsConfig={config.collections}
-					/>
-				)}
-			</CollectionForm>
-		</div>
-	);
-}

package/src/views/layout/admin-sidebar.tsx

@@ -1,185 +0,0 @@
-/**
- * AdminSidebar Component
- *
- * Automatically generated sidebar from admin config
- * Fully customizable via config overrides
- */
-
-import * as React from "react";
-import { cn } from "../../lib/utils";
-
-export interface AdminSidebarProps {
-	/**
-	 * Admin configuration
-	 */
-	config: {
-		app?: {
-			brand?: {
-				name?: string;
-				logo?: React.ComponentType;
-				homeRoute?: string;
-			};
-		};
-		collections?: Record<
-			string,
-			{
-				label?: string;
-				icon?: string | React.ComponentType;
-				group?: string;
-			}
-		>;
-	};
-
-	/**
-	 * Current active route (e.g., "/admin/barbers")
-	 */
-	activeRoute?: string;
-
-	/**
-	 * Link component (router-specific)
-	 * Must accept: to, className, children
-	 */
-	LinkComponent: React.ComponentType<{
-		to: string;
-		className?: string;
-		children: React.ReactNode;
-		activeProps?: { className?: string };
-	}>;
-
-	/**
-	 * Custom class for sidebar container
-	 */
-	className?: string;
-
-	/**
-	 * Custom class for brand section
-	 */
-	brandClassName?: string;
-
-	/**
-	 * Custom class for nav section
-	 */
-	navClassName?: string;
-
-	/**
-	 * Render custom brand content
-	 */
-	renderBrand?: (config: AdminSidebarProps["config"]) => React.ReactNode;
-
-	/**
-	 * Render custom nav item
-	 */
-	renderNavItem?: (params: {
-		collectionName: string;
-		config: NonNullable<AdminSidebarProps["config"]["collections"]>[string];
-		isActive: boolean;
-	}) => React.ReactNode;
-}
-
-export function AdminSidebar({
-	config,
-	activeRoute,
-	LinkComponent,
-	className,
-	brandClassName,
-	navClassName,
-	renderBrand,
-	renderNavItem,
-}: AdminSidebarProps): React.ReactElement {
-	const brand = config.app?.brand;
-	const collections = config.collections || {};
-
-	// Group collections if needed
-	const groupedCollections = React.useMemo(() => {
-		const groups: Record<string, typeof collections> = { "": {} };
-
-		Object.entries(collections).forEach(([name, collectionConfig]) => {
-			const group = collectionConfig.group || "";
-			if (!groups[group]) groups[group] = {};
-			groups[group][name] = collectionConfig;
-		});
-
-		return groups;
-	}, [collections]);
-
-	return (
-		<aside
-			className={cn(
-				"w-64 border-r bg-neutral-50 dark:bg-neutral-900",
-				className,
-			)}
-		>
-			{/* Brand Section */}
-			<div className={cn("p-4", brandClassName)}>
-				{renderBrand ? (
-					renderBrand(config)
-				) : (
-					<>
-						{brand?.logo && <brand.logo />}
-						<h1 className="text-xl font-bold">{brand?.name || "Admin"}</h1>
-					</>
-				)}
-			</div>
-
-			{/* Navigation */}
-			<nav className={cn("space-y-1 p-2", navClassName)}>
-				{Object.entries(groupedCollections).map(
-					([groupName, groupCollections]) => (
-						<div key={groupName}>
-							{/* Group Label */}
-							{groupName && (
-								<div className="px-3 py-2 text-xs font-semibold uppercase text-neutral-500">
-									{groupName}
-								</div>
-							)}
-
-							{/* Collection Links */}
-							{Object.entries(groupCollections).map(
-								([collectionName, collectionConfig]) => {
-									const isActive = activeRoute === `/admin/${collectionName}`;
-
-									if (renderNavItem) {
-										return (
-											<React.Fragment key={collectionName}>
-												{renderNavItem({
-													collectionName,
-													config: collectionConfig,
-													isActive,
-												})}
-											</React.Fragment>
-										);
-									}
-
-									return (
-										<LinkComponent
-											key={collectionName}
-											to={`/admin/${collectionName}`}
-											className="block rounded px-3 py-2 hover:bg-neutral-100 dark:hover:bg-neutral-800"
-											activeProps={{
-												className:
-													"bg-neutral-100 dark:bg-neutral-800 font-medium",
-											}}
-										>
-											{/* Icon */}
-											{collectionConfig.icon &&
-												typeof collectionConfig.icon === "string" && (
-													<span className="mr-2">{collectionConfig.icon}</span>
-												)}
-											{collectionConfig.icon &&
-												typeof collectionConfig.icon !== "string" && (
-													<collectionConfig.icon />
-												)}
-
-											{/* Label */}
-											{collectionConfig.label || collectionName}
-										</LinkComponent>
-									);
-								},
-							)}
-						</div>
-					),
-				)}
-			</nav>
-		</aside>
-	);
-}

package/src/views/layout/index.ts

@@ -1,12 +0,0 @@
-/**
- * Layout views - admin layout and navigation
- */
-
-export { AdminLayout } from "./admin-layout";
-export type { AdminLayoutProps } from "./admin-layout";
-
-export { AdminSidebar } from "./admin-sidebar";
-export type { AdminSidebarProps } from "./admin-sidebar";
-
-export { AdminRouter } from "./admin-router";
-export type { AdminRouterProps } from "./admin-router";

package/tsconfig.json

@@ -1,13 +0,0 @@
-{
-	"extends": "@questpie/typescript-config/react-library.json",
-	"compilerOptions": {
-		"outDir": "./dist",
-		"rootDir": "./src",
-		"baseUrl": ".",
-		"paths": {
-			"#questpie/admin/*": ["./src/*"]
-		}
-	},
-	"include": ["src/**/*"],
-	"exclude": ["node_modules", "dist", "**/*.spec.ts", "**/*.test.ts"]
-}