create-aphex 0.1.3 → 0.2.1

package/templates/base/src/routes/(protected)/admin/organizations/+page.svelte

@@ -1,31 +0,0 @@
-<script lang="ts">
-	import { page } from '$app/state';
-	import CreateOrganization from './_components/CreateOrganization.svelte';
-	import OrganizationsList from './_components/OrganizationsList.svelte';
-	import type { PageData } from './$types';
-
-	let { data }: { data: PageData } = $props();
-
-	const userRole = $derived(page.data?.sidebarData?.user?.role);
-	const isSuperAdmin = $derived(userRole === 'super_admin');
-</script>
-
-<svelte:head>
-	<title>Aphex CMS - Organizations</title>
-</svelte:head>
-
-<div class="flex flex-1 flex-col gap-4 p-4 md:gap-8 md:p-8">
-	<div class="mx-auto flex w-full max-w-6xl items-center justify-between">
-		<div>
-			<h1 class="text-3xl font-semibold">Organizations</h1>
-			<p class="text-muted-foreground">Manage your organizations</p>
-		</div>
-		{#if isSuperAdmin}
-			<CreateOrganization />
-		{/if}
-	</div>
-
-	<div class="mx-auto grid w-full max-w-6xl gap-6">
-		<OrganizationsList orgs={data.organizations} />
-	</div>
-</div>

package/templates/base/src/routes/(protected)/admin/organizations/_components/CreateOrganization.svelte

@@ -1,141 +0,0 @@
-<script lang="ts">
-	import { goto, invalidateAll } from '$app/navigation';
-	import { Button } from '@aphexcms/ui/shadcn/button';
-	import { Input } from '@aphexcms/ui/shadcn/input';
-	import { Label } from '@aphexcms/ui/shadcn/label';
-	import * as Dialog from '@aphexcms/ui/shadcn/dialog';
-	import { organizations } from '@aphexcms/cms-core/client';
-
-	let open = $state(false);
-	let name = $state('');
-	let slug = $state('');
-	let isSubmitting = $state(false);
-	let error = $state<string | null>(null);
-
-	function generateSlug(text: string): string {
-		return text
-			.toLowerCase()
-			.trim()
-			.replace(/[^\w\s-]/g, '')
-			.replace(/[\s_-]+/g, '-')
-			.replace(/^-+|-+$/g, '');
-	}
-
-	function handleNameInput(event: Event) {
-		const target = event.target as HTMLInputElement;
-		name = target.value;
-		if (!slug || slug === generateSlug(name.slice(0, -1))) {
-			slug = generateSlug(name);
-		}
-	}
-
-	function handleSlugInput(event: Event) {
-		const target = event.target as HTMLInputElement;
-		slug = target.value.toLowerCase().replace(/[^a-z0-9-]/g, '');
-	}
-
-	function resetForm() {
-		name = '';
-		slug = '';
-		error = null;
-	}
-
-	async function handleSubmit(event: Event) {
-		event.preventDefault();
-		error = null;
-
-		if (!name.trim() || !slug.trim()) {
-			error = 'Name and slug are required';
-			return;
-		}
-
-		isSubmitting = true;
-		try {
-			const result = await organizations.create({
-				name: name.trim(),
-				slug: slug.trim()
-			});
-
-			if (!result.success || !result.data) {
-				throw new Error('Failed to create organization');
-			}
-
-			resetForm();
-			open = false;
-			await invalidateAll();
-			await goto(`/admin?orgId=${result.data.id}`);
-		} catch (err) {
-			error = err instanceof Error ? err.message : 'Failed to create organization';
-		} finally {
-			isSubmitting = false;
-		}
-	}
-</script>
-
-<Dialog.Root bind:open onOpenChange={(v) => !v && resetForm()}>
-	<Dialog.Trigger>
-		{#snippet child({ props })}
-			<Button {...props}>Create Organization</Button>
-		{/snippet}
-	</Dialog.Trigger>
-	<Dialog.Content class="sm:max-w-[480px]">
-		<Dialog.Header>
-			<Dialog.Title>Create Organization</Dialog.Title>
-			<Dialog.Description>Create a new organization for your instance</Dialog.Description>
-		</Dialog.Header>
-		<form onsubmit={handleSubmit} class="grid gap-4 py-4">
-			<div>
-				<Label for="org-name">Organization name</Label>
-				<Input
-					id="org-name"
-					value={name}
-					oninput={handleNameInput}
-					placeholder="My Organization"
-					disabled={isSubmitting}
-					class="mt-1"
-				/>
-			</div>
-			<div>
-				<Label for="org-slug">Slug</Label>
-				<div class="mt-1 flex gap-2">
-					<Input
-						id="org-slug"
-						value={slug}
-						oninput={handleSlugInput}
-						placeholder="my-organization"
-						disabled={isSubmitting}
-						class="flex-1"
-					/>
-					<Button
-						type="button"
-						variant="outline"
-						size="sm"
-						onclick={() => (slug = generateSlug(name))}
-						disabled={!name.trim() || isSubmitting}
-					>
-						Generate
-					</Button>
-				</div>
-				<p class="text-muted-foreground mt-1 text-xs">
-					Lowercase letters, numbers, and hyphens only.
-				</p>
-			</div>
-			{#if error}
-				<p class="text-destructive text-sm">{error}</p>
-			{/if}
-			<Dialog.Footer>
-				<Button
-					type="button"
-					variant="outline"
-					onclick={() => (open = false)}
-					disabled={isSubmitting}
-				>
-					Cancel
-				</Button>
-				<Button type="submit" disabled={isSubmitting || !name.trim()}>
-					{isSubmitting ? 'Creating...' : 'Create'}
-				</Button>
-			</Dialog.Footer>
-		</form>
-	</Dialog.Content>
-</Dialog.Root>

package/templates/base/src/routes/(protected)/admin/organizations/_components/OrganizationsList.svelte

@@ -1,102 +0,0 @@
-<script lang="ts">
-	import { goto, invalidateAll } from '$app/navigation';
-	import * as AlertDialog from '@aphexcms/ui/shadcn/alert-dialog';
-	import { Badge } from '@aphexcms/ui/shadcn/badge';
-	import { ExternalLink } from '@lucide/svelte';
-	import { organizations } from '@aphexcms/cms-core/client';
-
-	type OrgItem = {
-		id: string;
-		name: string;
-		slug: string;
-		role: string;
-		isActive: boolean;
-		memberCount: number;
-		ownerEmail?: string;
-	};
-
-	let { orgs = [] }: { orgs: OrgItem[] } = $props();
-
-	let switchingOrgId = $state<string | null>(null);
-
-	async function handleOrgClick(org: OrgItem) {
-		if (switchingOrgId) return;
-
-		if (org.isActive) {
-			goto('/admin');
-			return;
-		}
-
-		switchingOrgId = org.id;
-		try {
-			const result = await organizations.switch({ organizationId: org.id });
-
-			if (!result.success) {
-				throw new Error(result.error || 'Failed to switch organization');
-			}
-
-			await invalidateAll();
-			goto('/admin');
-		} catch (err) {
-			console.error('Failed to switch organization:', err);
-		} finally {
-			switchingOrgId = null;
-		}
-	}
-
-	function getInitials(name: string): string {
-		return name
-			.split(' ')
-			.map((word) => word[0])
-			.join('')
-			.toUpperCase()
-			.slice(0, 2);
-	}
-</script>
-
-{#if orgs.length === 0}
-	<p class="text-muted-foreground text-sm">No organizations yet</p>
-{:else}
-	<div class="divide-y rounded-lg border">
-		{#each orgs as org (org.id)}
-			<div class="hover:bg-muted/50 flex items-center gap-4 p-4 transition-colors">
-				<!-- Avatar -->
-				<div
-					class="bg-sidebar-primary text-sidebar-primary-foreground flex size-10 shrink-0 items-center justify-center rounded-lg text-sm font-semibold"
-				>
-					{getInitials(org.name)}
-				</div>
-
-				<!-- Info -->
-				<div class="min-w-0 flex-1">
-					<div class="flex items-baseline gap-2">
-						<span class="font-medium">{org.name}</span>
-						<span class="text-muted-foreground">/</span>
-						<span class="text-muted-foreground text-sm">[{org.slug}]</span>
-						{#if org.isActive}
-							<Badge variant="default" class="text-xs">Active</Badge>
-						{/if}
-					</div>
-					<div class="text-muted-foreground text-sm">
-						{#if org.ownerEmail}
-							Owned by: {org.ownerEmail}
-						{/if}
-					</div>
-					<div class="text-muted-foreground text-sm">
-						Total members: {org.memberCount}
-					</div>
-				</div>
-
-				<!-- Actions -->
-				<button
-					class="text-muted-foreground hover:text-foreground hover:bg-muted rounded-md p-2 transition-colors"
-					onclick={() => handleOrgClick(org)}
-					disabled={switchingOrgId !== null}
-					title={org.isActive ? 'Go to dashboard' : 'Switch to this organization'}
-				>
-					<ExternalLink class="size-4" />
-				</button>
-			</div>
-		{/each}
-	</div>
-{/if}

package/templates/base/src/routes/(protected)/admin/settings/+layout.server.ts

@@ -1,42 +0,0 @@
-import type { LayoutServerLoad } from './$types';
-import { organizationService } from '$lib/server/services/organization';
-
-export const load: LayoutServerLoad = async ({ locals }) => {
-	const auth = locals.auth;
-
-	if (!auth || auth.type !== 'session') {
-		throw new Error('No session found');
-	}
-
-	const databaseAdapter = locals.aphexCMS.databaseAdapter;
-	let activeOrganization = null;
-	let currentUserOrgRole = null;
-
-	if (auth.organizationId) {
-		const orgData = await organizationService.getOrganizationWithMembers(auth.organizationId);
-		if (orgData) {
-			activeOrganization = {
-				...orgData.organization,
-				members: orgData.members.map((m) => ({
-					...m.member,
-					user: m.user,
-					invitedEmail: m.invitedEmail
-				}))
-			};
-
-			const currentMember = orgData.members.find((m) => m.user.id === auth.user.id);
-			currentUserOrgRole = currentMember?.member.role || null;
-		}
-	}
-
-	return {
-		user: {
-			id: auth.user.id,
-			email: auth.user.email,
-			name: auth.user.name,
-			role: auth.user.role,
-			organizationRole: currentUserOrgRole
-		},
-		activeOrganization
-	};
-};

package/templates/base/src/routes/(protected)/admin/settings/+layout.svelte

@@ -1,116 +0,0 @@
-<script lang="ts">
-	import { page } from '$app/state';
-	import type { Capability } from '@aphexcms/cms-core';
-
-	let { children } = $props();
-
-	const basePath = '/admin/settings';
-
-	// Resolve capabilities once — exposed by /admin/+layout.server.ts and
-	// inherited through the layout data chain.
-	const capabilities = $derived(page.data.rbac?.capabilities ?? []);
-	function has(cap: Capability): boolean {
-		return capabilities.includes(cap);
-	}
-
-	// `requires: null` means everyone with a session (e.g. Profile), `requires`
-	// with a capability hides the tab from users who don't have it. Members
-	// stays visible to anyone in an org since viewing who's in the org is not
-	// privileged information, but mutation controls on the page itself are
-	// already capability-gated server-side.
-	type Tab = { label: string; href: string; requires: Capability | null };
-
-	const orgTabs: Tab[] = $derived(
-		(
-			[
-				{ label: 'General', href: basePath, requires: 'org.settings' as Capability },
-				{ label: 'Members', href: `${basePath}/members`, requires: null },
-				{ label: 'Roles', href: `${basePath}/roles`, requires: 'role.manage' as Capability }
-			] satisfies Tab[]
-		).filter((t) => t.requires === null || has(t.requires))
-	);
-
-	const accountTabs: Tab[] = $derived(
-		(
-			[
-				{ label: 'Profile', href: `${basePath}/account`, requires: null },
-				{
-					label: 'API Keys',
-					href: `${basePath}/api-keys`,
-					requires: 'apiKey.manage' as Capability
-				}
-			] satisfies Tab[]
-		).filter((t) => t.requires === null || has(t.requires))
-	);
-
-	function isActive(href: string) {
-		if (href === basePath) return page.url.pathname === basePath;
-		return page.url.pathname.startsWith(href);
-	}
-</script>
-
-<div class="flex flex-1 flex-col gap-4 overflow-y-auto p-4 md:gap-8 md:p-8">
-	<div class="mx-auto grid w-full max-w-6xl gap-2">
-		<h1 class="text-3xl font-semibold">Settings</h1>
-		<p class="text-muted-foreground">Manage your organization and account</p>
-	</div>
-
-	<!-- Mobile tabs -->
-	<div class="mx-auto w-full max-w-6xl md:hidden">
-		<div class="border-b">
-			<div class="flex gap-4 overflow-x-auto">
-				{#each [...orgTabs, ...accountTabs] as tab}
-					<a
-						href={tab.href}
-						class="border-b-2 px-1 pb-2 text-sm font-medium whitespace-nowrap transition-colors {isActive(
-							tab.href
-						)
-							? 'border-primary text-primary'
-							: 'text-muted-foreground hover:text-foreground border-transparent'}"
-					>
-						{tab.label}
-					</a>
-				{/each}
-			</div>
-		</div>
-	</div>
-
-	<div
-		class="mx-auto grid w-full max-w-6xl items-start gap-6 md:grid-cols-[180px_1fr] lg:grid-cols-[250px_1fr]"
-	>
-		<!-- Desktop sidebar nav -->
-		<nav class="text-muted-foreground hidden gap-1 text-sm md:grid">
-			<p
-				class="text-muted-foreground/60 px-1 pt-2 pb-1 text-xs font-semibold tracking-wider uppercase"
-			>
-				Organization
-			</p>
-			{#each orgTabs as tab}
-				<a
-					href={tab.href}
-					class="rounded-md px-2 py-1.5 {isActive(tab.href)
-						? 'text-primary bg-muted font-semibold'
-						: ''}"
-				>
-					{tab.label}
-				</a>
-			{/each}
-			<p
-				class="text-muted-foreground/60 px-1 pt-4 pb-1 text-xs font-semibold tracking-wider uppercase"
-			>
-				Account
-			</p>
-			{#each accountTabs as tab}
-				<a
-					href={tab.href}
-					class="rounded-md px-2 py-1.5 {isActive(tab.href)
-						? 'text-primary bg-muted font-semibold'
-						: ''}"
-				>
-					{tab.label}
-				</a>
-			{/each}
-		</nav>
-		{@render children()}
-	</div>
-</div>

package/templates/base/src/routes/(protected)/admin/settings/+page.server.ts

@@ -1,16 +0,0 @@
-import type { PageServerLoad } from './$types';
-import { redirect } from '@sveltejs/kit';
-import { hasCapability } from '@aphexcms/cms-core';
-
-export const load: PageServerLoad = async ({ locals }) => {
-	const auth = locals.auth;
-
-	// Users without org.settings can't do anything on the General tab — route
-	// them to their profile (always available) so the default settings URL
-	// doesn't land them on a locked page.
-	if (auth?.type === 'session' && !hasCapability(auth, 'org.settings')) {
-		throw redirect(302, '/admin/settings/account');
-	}
-
-	return {};
-};

package/templates/base/src/routes/(protected)/admin/settings/+page.svelte

@@ -1,32 +0,0 @@
-<script lang="ts">
-	import * as Card from '@aphexcms/ui/shadcn/card';
-	import type { PageData } from './$types';
-	import OrganizationsSettings from './_components/OrganizationsSettings.svelte';
-
-	let { data }: { data: PageData } = $props();
-</script>
-
-<svelte:head>
-	<title>Aphex CMS - Organization Settings</title>
-</svelte:head>
-
-<div class="grid gap-6">
-	<div class="hidden sm:block">
-		<h2 class="text-xl font-semibold">General</h2>
-		<p class="text-muted-foreground text-sm">Manage your organization settings and preferences.</p>
-	</div>
-
-	{#if data.activeOrganization}
-		<OrganizationsSettings
-			activeOrganization={data.activeOrganization}
-			currentUserId={data.user.id}
-		/>
-	{:else}
-		<Card.Root>
-			<Card.Content class="py-12 text-center">
-				<p class="text-muted-foreground text-lg">No active organization</p>
-				<p class="text-muted-foreground mt-2 text-sm">You need to be added to an organization</p>
-			</Card.Content>
-		</Card.Root>
-	{/if}
-</div>

package/templates/base/src/routes/(protected)/admin/settings/_components/AccountSettings.svelte

@@ -1,177 +0,0 @@
-<script lang="ts">
-	import { Button } from '@aphexcms/ui/shadcn/button';
-	import { Input } from '@aphexcms/ui/shadcn/input';
-	import { Label } from '@aphexcms/ui/shadcn/label';
-	import { Badge } from '@aphexcms/ui/shadcn/badge';
-	import { Switch } from '@aphexcms/ui/shadcn/switch';
-	import * as Card from '@aphexcms/ui/shadcn/card';
-	import * as Avatar from '@aphexcms/ui/shadcn/avatar';
-	import { Separator } from '@aphexcms/ui/shadcn/separator';
-	import { invalidateAll } from '$app/navigation';
-	import type { CMSUser, UserSessionPreferences } from '@aphexcms/cms-core';
-	import { user as userApi } from '@aphexcms/cms-core/client';
-	import { Building2, Lock } from '@lucide/svelte';
-	import { toast } from 'svelte-sonner';
-
-	type Props = {
-		user: CMSUser;
-		userPreferences?: UserSessionPreferences | null;
-		hasChildOrganizations?: boolean;
-	};
-
-	let { user, userPreferences = null, hasChildOrganizations = false }: Props = $props();
-
-	let userName = $state(user.name || '');
-	let isUpdating = $state(false);
-	let includeChildOrganizations = $state(userPreferences?.includeChildOrganizations ?? false);
-	let isUpdatingPreferences = $state(false);
-
-	const userInitials = $derived(
-		user.name
-			? user.name
-					.split(' ')
-					.map((w) => w[0])
-					.join('')
-					.toUpperCase()
-					.slice(0, 2)
-			: user.email[0].toUpperCase()
-	);
-
-	function getRoleBadgeVariant(role: string): 'default' | 'secondary' | 'outline' | 'destructive' {
-		switch (role) {
-			case 'super_admin':
-				return 'default';
-			case 'admin':
-				return 'secondary';
-			default:
-				return 'outline';
-		}
-	}
-
-	function formatRole(role: string): string {
-		return role.replace(/_/g, ' ');
-	}
-
-	async function updateProfile() {
-		if (!userName.trim()) {
-			toast.error('Please enter your name');
-			return;
-		}
-
-		isUpdating = true;
-		try {
-			const result = await userApi.updateProfile({ name: userName.trim() });
-
-			if (!result.success) {
-				throw new Error(result.error || result.message || 'Failed to update profile');
-			}
-
-			toast.success('Profile updated successfully');
-			await invalidateAll();
-		} catch (error) {
-			toast.error(error instanceof Error ? error.message : 'Failed to update profile');
-		} finally {
-			isUpdating = false;
-		}
-	}
-
-	async function updatePreferences(prefs: Partial<UserSessionPreferences>) {
-		isUpdatingPreferences = true;
-		try {
-			const result = await userApi.updatePreferences(prefs);
-
-			if (!result.success) {
-				throw new Error(result.error || result.message || 'Failed to update preferences');
-			}
-		} catch (error) {
-			toast.error(error instanceof Error ? error.message : 'Failed to update preferences');
-			// Revert on error
-			if (prefs.includeChildOrganizations !== undefined) {
-				includeChildOrganizations = !prefs.includeChildOrganizations;
-			}
-		} finally {
-			isUpdatingPreferences = false;
-		}
-	}
-</script>
-
-<div class="space-y-6">
-	<!-- Profile Information -->
-	<Card.Root>
-		<Card.Header>
-			<div class="flex items-center gap-4">
-				<Avatar.Root class="h-14 w-14 text-lg">
-					{#if user.image}
-						<Avatar.Image src={user.image} alt={user.name || user.email} />
-					{/if}
-					<Avatar.Fallback>{userInitials}</Avatar.Fallback>
-				</Avatar.Root>
-				<div class="min-w-0 flex-1">
-					<div class="flex items-center gap-2">
-						<Card.Title class="text-lg">{user.name || user.email}</Card.Title>
-						<Badge variant={getRoleBadgeVariant(user.role)} class="capitalize">
-							{formatRole(user.role)}
-						</Badge>
-					</div>
-					<p class="text-muted-foreground mt-0.5 text-sm">{user.email}</p>
-				</div>
-			</div>
-		</Card.Header>
-
-		<Card.Content>
-			<Separator class="mb-4" />
-
-			<div class="space-y-4">
-				<div>
-					<Label for="user-name">Display Name</Label>
-					<Input id="user-name" bind:value={userName} placeholder="Your name" class="mt-2" />
-				</div>
-				<div>
-					<Label for="user-email">Email</Label>
-					<div class="relative mt-1">
-						<Input id="user-email" type="email" value={user.email} disabled class="pr-9" />
-						<Lock
-							class="text-muted-foreground absolute top-1/2 right-3 h-3.5 w-3.5 -translate-y-1/2"
-						/>
-					</div>
-					<p class="text-muted-foreground mt-1 text-xs">Managed by your authentication provider</p>
-				</div>
-			</div>
-		</Card.Content>
-		<Card.Footer class="border-t px-6 py-4">
-			<Button onclick={updateProfile} disabled={isUpdating}>
-				{isUpdating ? 'Saving...' : 'Save Changes'}
-			</Button>
-		</Card.Footer>
-	</Card.Root>
-
-	<!-- Preferences -->
-	{#if hasChildOrganizations}
-		<Card.Root>
-			<Card.Header>
-				<Card.Title>Content Preferences</Card.Title>
-			</Card.Header>
-			<Card.Content>
-				<div class="flex items-center justify-between">
-					<div class="flex items-center gap-3">
-						<Building2 class="text-muted-foreground h-5 w-5" />
-						<div>
-							<Label class="text-base font-medium">Include child organizations</Label>
-							<p class="text-muted-foreground text-sm">
-								Show documents from child organizations in your content lists
-							</p>
-						</div>
-					</div>
-					<Switch
-						checked={includeChildOrganizations}
-						disabled={isUpdatingPreferences}
-						onCheckedChange={(checked) => {
-							includeChildOrganizations = checked;
-							updatePreferences({ includeChildOrganizations: checked });
-						}}
-					/>
-				</div>
-			</Card.Content>
-		</Card.Root>
-	{/if}
-</div>