@geenius/adapters 0.1.0 → 0.3.0

package/packages/react/src/components/AdapterConfigForm.tsx

@@ -1,118 +0,0 @@
-// @geenius-adapters/react — AdapterConfigForm
-
-import { useState } from 'react'
-import type { AdapterDomain, DomainAdapterConfig } from '@geenius-adapters/shared'
-import { DOMAIN_LABELS, getProvidersForDomain } from '@geenius-adapters/shared'
-
-export interface AdapterConfigFormProps {
-  domain: AdapterDomain
-  initialConfig?: DomainAdapterConfig
-  onSave: (config: DomainAdapterConfig) => Promise<void> | void
-  onCancel?: () => void
-  className?: string
-}
-
-export function AdapterConfigForm({ domain, initialConfig, onSave, onCancel, className = '' }: AdapterConfigFormProps) {
-  const providers = getProvidersForDomain(domain)
-  const [provider, setProvider] = useState(initialConfig?.provider ?? providers[0]?.id ?? '')
-  const [apiKey, setApiKey] = useState(initialConfig?.apiKey ?? '')
-  const [baseUrl, setBaseUrl] = useState(initialConfig?.baseUrl ?? '')
-  const [isSaving, setIsSaving] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-
-  const selectedMeta = providers.find((p) => p.id === provider)
-  const needsApiKey = !['localStorage', 'noop'].includes(provider)
-  const needsBaseUrl = ['ollama', 'minio', 'neon', 'supabase'].includes(provider)
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault()
-    setError(null)
-    if (!provider) { setError('Select a provider'); return }
-    if (needsApiKey && !apiKey.trim()) { setError('API key is required'); return }
-    setIsSaving(true)
-    try {
-      await onSave({ provider, apiKey: apiKey || undefined, baseUrl: baseUrl || undefined })
-    } catch (e) {
-      setError(e instanceof Error ? e.message : 'Failed to save')
-    } finally {
-      setIsSaving(false)
-    }
-  }
-
-  return (
-    <form onSubmit={handleSubmit} className={`space-y-5 rounded-2xl border border-white/10 bg-white/[0.03] p-6 backdrop-blur-sm ${className}`} noValidate>
-      <div>
-        <h3 className="text-lg font-bold text-white/90">Configure {DOMAIN_LABELS[domain]}</h3>
-        <p className="mt-1 text-xs text-white/40">Select and configure your preferred provider.</p>
-      </div>
-
-      {error && <div className="rounded-lg border border-red-500/20 bg-red-500/10 px-4 py-3 text-sm text-red-400" role="alert">{error}</div>}
-
-      <div>
-        <label htmlFor={`adapter-${domain}-provider`} className="mb-1.5 block text-xs font-semibold uppercase tracking-wider text-white/40">Provider</label>
-        <div className="grid gap-2 sm:grid-cols-2">
-          {providers.map((p) => (
-            <button
-              key={p.id}
-              type="button"
-              onClick={() => setProvider(p.id)}
-              className={`flex flex-col rounded-xl border p-3 text-left transition-all ${
-                provider === p.id
-                  ? 'border-indigo-500/30 bg-indigo-500/10'
-                  : 'border-white/10 bg-white/[0.02] hover:bg-white/[0.04]'
-              }`}
-            >
-              <span className="text-xs font-semibold text-white/80">{p.name}</span>
-              <span className="mt-0.5 text-[0.625rem] text-white/40">{p.description}</span>
-              <span className={`mt-1 self-start rounded px-1.5 py-0.5 text-[0.5625rem] font-bold uppercase ${
-                p.tier === 'pronto' ? 'bg-emerald-500/10 text-emerald-400' : p.tier === 'mvp' ? 'bg-blue-500/10 text-blue-400' : 'bg-purple-500/10 text-purple-400'
-              }`}>{p.tier}</span>
-            </button>
-          ))}
-        </div>
-      </div>
-
-      {needsApiKey && (
-        <div>
-          <label htmlFor={`adapter-${domain}-apiKey`} className="mb-1.5 block text-xs font-semibold uppercase tracking-wider text-white/40">API Key</label>
-          <input
-            id={`adapter-${domain}-apiKey`}
-            type="password"
-            value={apiKey}
-            onChange={(e) => setApiKey(e.target.value)}
-            placeholder={`Enter ${selectedMeta?.name ?? provider} API key`}
-            autoComplete="off"
-            className="w-full rounded-xl border border-white/10 bg-white/[0.02] px-4 py-3 text-sm text-white/90 placeholder:text-white/20 focus:border-indigo-500/50 focus:outline-none focus:ring-2 focus:ring-indigo-500/20"
-          />
-        </div>
-      )}
-
-      {needsBaseUrl && (
-        <div>
-          <label htmlFor={`adapter-${domain}-url`} className="mb-1.5 block text-xs font-semibold uppercase tracking-wider text-white/40">Base URL</label>
-          <input
-            id={`adapter-${domain}-url`}
-            type="url"
-            value={baseUrl}
-            onChange={(e) => setBaseUrl(e.target.value)}
-            placeholder={`https://...`}
-            className="w-full rounded-xl border border-white/10 bg-white/[0.02] px-4 py-3 text-sm text-white/90 placeholder:text-white/20 focus:border-indigo-500/50 focus:outline-none focus:ring-2 focus:ring-indigo-500/20"
-          />
-        </div>
-      )}
-
-      <div className="flex items-center justify-end gap-3 pt-2">
-        {onCancel && (
-          <button type="button" onClick={onCancel} className="rounded-xl px-5 py-2.5 text-sm font-semibold text-white/50 hover:text-white/70">Cancel</button>
-        )}
-        <button
-          type="submit"
-          disabled={isSaving || !provider}
-          className="flex items-center gap-2 rounded-xl bg-indigo-500 px-6 py-2.5 text-sm font-semibold text-white hover:bg-indigo-400 disabled:opacity-50"
-        >
-          {isSaving ? 'Saving…' : 'Save Configuration'}
-        </button>
-      </div>
-    </form>
-  )
-}

package/packages/react/src/components/AdapterList.tsx

@@ -1,84 +0,0 @@
-// @geenius-adapters/react — AdapterList
-
-import { useState, useMemo } from 'react'
-import { useAdapters } from '../hooks'
-import { AdapterCard } from './AdapterCard'
-import { ADAPTER_DOMAINS, DOMAIN_LABELS } from '@geenius-adapters/shared'
-import type { AdapterDomain, AdapterStatusType } from '@geenius-adapters/shared'
-
-export interface AdapterListProps {
-  onSelect?: (domain: AdapterDomain) => void
-  filterStatus?: AdapterStatusType
-  className?: string
-}
-
-export function AdapterList({ onSelect, filterStatus, className = '' }: AdapterListProps) {
-  const { statuses, isLoading } = useAdapters()
-  const [search, setSearch] = useState('')
-
-  const filteredDomains = useMemo(() => {
-    let domains = [...ADAPTER_DOMAINS]
-    if (search) {
-      const q = search.toLowerCase()
-      domains = domains.filter((d) => {
-        const label = DOMAIN_LABELS[d].toLowerCase()
-        const provider = statuses[d]?.provider?.toLowerCase() ?? ''
-        return label.includes(q) || provider.includes(q) || d.includes(q)
-      })
-    }
-    if (filterStatus) {
-      domains = domains.filter((d) => statuses[d]?.status === filterStatus)
-    }
-    return domains
-  }, [search, filterStatus, statuses])
-
-  if (isLoading) {
-    return (
-      <div className={`space-y-3 ${className}`} role="status" aria-label="Loading adapters">
-        {[1, 2, 3, 4].map((i) => (
-          <div key={i} className="animate-pulse rounded-2xl border border-white/5 bg-white/[0.02] p-5">
-            <div className="flex items-start gap-4">
-              <div className="h-12 w-12 rounded-xl bg-white/10" />
-              <div className="flex-1 space-y-2">
-                <div className="h-3 w-24 rounded bg-white/10" />
-                <div className="h-2 w-48 rounded bg-white/5" />
-              </div>
-            </div>
-          </div>
-        ))}
-      </div>
-    )
-  }
-
-  return (
-    <div className={className}>
-      <div className="mb-4">
-        <input
-          type="text"
-          value={search}
-          onChange={(e) => setSearch(e.target.value)}
-          placeholder="Search adapters..."
-          aria-label="Search adapters"
-          className="w-full rounded-xl border border-white/10 bg-white/[0.02] px-4 py-2.5 text-sm text-white/90 placeholder:text-white/20 focus:border-indigo-500/50 focus:outline-none focus:ring-2 focus:ring-indigo-500/20"
-        />
-      </div>
-
-      {filteredDomains.length === 0 ? (
-        <div className="rounded-xl border border-white/5 bg-white/[0.01] p-8 text-center">
-          <p className="text-sm text-white/40">{search ? 'No adapters match your search' : 'No adapters configured'}</p>
-        </div>
-      ) : (
-        <div className="grid gap-3 sm:grid-cols-2" role="list" aria-label="Adapter list">
-          {filteredDomains.map((domain) => (
-            <AdapterCard
-              key={domain}
-              domain={domain}
-              status={statuses[domain]}
-              onClick={() => onSelect?.(domain)}
-            />
-          ))}
-        </div>
-      )}
-    </div>
-  )
-}

package/packages/react/src/components/AdapterStatusBadge.tsx

@@ -1,30 +0,0 @@
-// @geenius-adapters/react — AdapterStatusBadge
-
-import type { AdapterStatusType } from '@geenius-adapters/shared'
-
-const STATUS_STYLES: Record<AdapterStatusType, { bg: string; text: string; dot: string; label: string }> = {
-  connected:     { bg: 'bg-emerald-500/10', text: 'text-emerald-400', dot: 'bg-emerald-400', label: 'Connected' },
-  disconnected:  { bg: 'bg-white/5',        text: 'text-white/40',    dot: 'bg-white/30',    label: 'Disconnected' },
-  error:         { bg: 'bg-red-500/10',     text: 'text-red-400',     dot: 'bg-red-400',     label: 'Error' },
-  initializing:  { bg: 'bg-amber-500/10',   text: 'text-amber-400',   dot: 'bg-amber-400',   label: 'Initializing' },
-}
-
-export interface AdapterStatusBadgeProps {
-  status: AdapterStatusType
-  showLabel?: boolean
-  size?: 'sm' | 'md'
-  className?: string
-}
-
-export function AdapterStatusBadge({ status, showLabel = true, size = 'sm', className = '' }: AdapterStatusBadgeProps) {
-  const s = STATUS_STYLES[status]
-  const dotSize = size === 'sm' ? 'h-1.5 w-1.5' : 'h-2 w-2'
-  const textSize = size === 'sm' ? 'text-[0.625rem]' : 'text-xs'
-
-  return (
-    <span className={`inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 ${s.bg} ${className}`}>
-      <span className={`${dotSize} rounded-full ${s.dot} ${status === 'initializing' ? 'animate-pulse' : ''}`} />
-      {showLabel && <span className={`${textSize} font-semibold uppercase tracking-wider ${s.text}`}>{s.label}</span>}
-    </span>
-  )
-}

package/packages/react/src/components/index.ts

@@ -1,4 +0,0 @@
-export { AdapterStatusBadge, type AdapterStatusBadgeProps } from './AdapterStatusBadge'
-export { AdapterCard, type AdapterCardProps } from './AdapterCard'
-export { AdapterList, type AdapterListProps } from './AdapterList'
-export { AdapterConfigForm, type AdapterConfigFormProps } from './AdapterConfigForm'

package/packages/react/src/hooks/index.ts

@@ -1,75 +0,0 @@
-// @geenius-adapters/react — Hooks
-
-import { useMemo } from 'react'
-import { useAdapterContext } from '../provider/AdapterProvider'
-import type {
-  AuthAdapter, DbAdapter, PaymentsAdapter, AiAdapter, FileStorageAdapter, AdminAdapter,
-  AdapterDomain, AdapterStatusInfo,
-} from '@geenius-adapters/shared'
-
-// ─── Domain-specific hooks ───────────────────────────────────────────────────
-
-/** Access the database adapter */
-export function useDb(): DbAdapter {
-  return useAdapterContext().getAdapter('db')
-}
-
-/** Access the auth adapter */
-export function useAuth(): AuthAdapter {
-  return useAdapterContext().getAdapter('auth')
-}
-
-/** Access the payments adapter */
-export function usePayments(): PaymentsAdapter {
-  return useAdapterContext().getAdapter('payments')
-}
-
-/** Access the AI adapter */
-export function useAi(): AiAdapter {
-  return useAdapterContext().getAdapter('ai')
-}
-
-/** Access the file storage adapter */
-export function useStorage(): FileStorageAdapter {
-  return useAdapterContext().getAdapter('storage')
-}
-
-/** Access the admin adapter */
-export function useAdmin(): AdminAdapter {
-  return useAdapterContext().getAdapter('admin')
-}
-
-// ─── Status hooks ────────────────────────────────────────────────────────────
-
-/** Get all adapter statuses */
-export function useAdapterStatuses(): Record<AdapterDomain, AdapterStatusInfo> {
-  return useAdapterContext().statuses
-}
-
-/** Get status for a specific adapter domain */
-export function useAdapterStatus(domain: AdapterDomain): AdapterStatusInfo {
-  return useAdapterContext().statuses[domain]
-}
-
-/** Check if adapter is ready */
-export function useIsAdapterReady(domain: AdapterDomain): boolean {
-  return useAdapterContext().isReady(domain)
-}
-
-// ─── Full adapters hook ──────────────────────────────────────────────────────
-
-/** Access all adapters at once */
-export function useAdapters() {
-  const ctx = useAdapterContext()
-  return useMemo(() => ({
-    db: ctx.adapters.db,
-    auth: ctx.adapters.auth,
-    payments: ctx.adapters.payments,
-    ai: ctx.adapters.ai,
-    storage: ctx.adapters.storage,
-    admin: ctx.adapters.admin,
-    statuses: ctx.statuses,
-    isLoading: ctx.isLoading,
-    isReady: ctx.isReady,
-  }), [ctx])
-}

package/packages/react/src/index.tsx

@@ -1,44 +0,0 @@
-// @geenius-adapters/react — Barrel export
-
-/**
- * @geenius-adapters/react
- *
- * React hooks, components, and pages for the Geenius adapter ecosystem.
- * Wraps all 6 adapter domains (DB, Auth, AI, Storage, Payments, Admin)
- * behind a unified provider/hook API.
- */
-
-// Re-export shared types for convenience
-export type {
-  AuthUser, AuthSession, OAuthProvider, ListOptions, QueryFilter,
-  Plan, Subscription, CheckoutParams, CheckoutResult,
-  ChatMessage, AiOptions, ChatResponse, StoredFile,
-  AdapterDomain, DomainAdapterConfig, AdapterConfig,
-  AdapterStatusType, AdapterStatusInfo, AdapterRegistryEntry,
-  AuthAdapter, DbAdapter, PaymentsAdapter, AiAdapter, FileStorageAdapter,
-  AdminAdapter, AdminMetrics, ManagedUser,
-} from '@geenius-adapters/shared'
-
-export {
-  ADAPTER_DOMAINS, DOMAIN_LABELS, DOMAIN_ICONS, DOMAIN_DESCRIPTIONS,
-  getProvidersForDomain, getProviderMeta,
-  configureAdapters, getAdapterConfig, isAdaptersConfigured,
-} from '@geenius-adapters/shared'
-
-// Provider
-export { AdapterProvider, useAdapterContext } from './provider'
-export type { AdapterProviderProps, AdapterSet, AdapterContextValue } from './provider'
-
-// Hooks
-export {
-  useDb, useAuth, usePayments, useAi, useStorage, useAdmin,
-  useAdapters, useAdapterStatuses, useAdapterStatus, useIsAdapterReady,
-} from './hooks'
-
-// Components
-export { AdapterStatusBadge, AdapterCard, AdapterList, AdapterConfigForm } from './components'
-export type { AdapterStatusBadgeProps, AdapterCardProps, AdapterListProps, AdapterConfigFormProps } from './components'
-
-// Pages
-export { AdaptersPage, AdapterDetailPage } from './pages'
-export type { AdaptersPageProps, AdapterDetailPageProps } from './pages'

package/packages/react/src/pages/AdapterDetailPage.tsx

@@ -1,133 +0,0 @@
-// @geenius-adapters/react — AdapterDetailPage
-
-import { useState } from 'react'
-import { useAdapters, useAdapterStatus } from '../hooks'
-import { AdapterStatusBadge } from '../components/AdapterStatusBadge'
-import { AdapterConfigForm } from '../components/AdapterConfigForm'
-import type { AdapterDomain } from '@geenius-adapters/shared'
-import { DOMAIN_LABELS, DOMAIN_ICONS, DOMAIN_DESCRIPTIONS, getProvidersForDomain } from '@geenius-adapters/shared'
-
-export interface AdapterDetailPageProps {
-  domain: AdapterDomain
-  onBack?: () => void
-  className?: string
-}
-
-export function AdapterDetailPage({ domain, onBack, className = '' }: AdapterDetailPageProps) {
-  const { isLoading } = useAdapters()
-  const status = useAdapterStatus(domain)
-  const [isEditing, setIsEditing] = useState(false)
-  const providers = getProvidersForDomain(domain)
-
-  const label = DOMAIN_LABELS[domain]
-  const icon = DOMAIN_ICONS[domain]
-  const desc = DOMAIN_DESCRIPTIONS[domain]
-
-  if (isLoading) {
-    return (
-      <div className={`max-w-3xl mx-auto space-y-6 ${className}`}>
-        <div className="animate-pulse space-y-4">
-          <div className="h-6 w-32 rounded bg-white/10" />
-          <div className="h-40 rounded-2xl bg-white/[0.03]" />
-          <div className="h-60 rounded-2xl bg-white/[0.03]" />
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <div className={`max-w-3xl mx-auto space-y-8 ${className}`}>
-      {/* Back navigation */}
-      {onBack && (
-        <button onClick={onBack} className="flex items-center gap-1.5 text-sm text-white/30 hover:text-white/60 transition-colors">
-          <span>←</span> Back to Adapters
-        </button>
-      )}
-
-      {/* Header */}
-      <div className="flex items-start gap-5">
-        <div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-white/5 text-3xl">{icon}</div>
-        <div className="flex-1">
-          <div className="flex items-center gap-3">
-            <h1 className="text-2xl font-extrabold text-white/95 tracking-tight">{label}</h1>
-            <AdapterStatusBadge status={status.status} size="md" />
-          </div>
-          <p className="mt-1 text-sm text-white/40">{desc}</p>
-        </div>
-      </div>
-
-      {/* Status Card */}
-      <div className="rounded-2xl border border-white/10 bg-white/[0.03] p-6 backdrop-blur-sm">
-        <h2 className="text-xs font-semibold uppercase tracking-wider text-white/30 mb-4">Current Status</h2>
-        <div className="grid gap-4 sm:grid-cols-3">
-          <div>
-            <p className="text-[0.625rem] text-white/30 uppercase">Provider</p>
-            <p className="mt-0.5 text-sm font-semibold text-white/80">{status.provider !== 'none' ? status.provider : '—'}</p>
-          </div>
-          <div>
-            <p className="text-[0.625rem] text-white/30 uppercase">Status</p>
-            <p className="mt-0.5"><AdapterStatusBadge status={status.status} /></p>
-          </div>
-          <div>
-            <p className="text-[0.625rem] text-white/30 uppercase">Last Checked</p>
-            <p className="mt-0.5 text-sm text-white/60">{status.lastCheckedAt ? new Date(status.lastCheckedAt).toLocaleTimeString() : '—'}</p>
-          </div>
-        </div>
-        {status.error && (
-          <div className="mt-4 rounded-lg border border-red-500/20 bg-red-500/10 px-4 py-3 text-sm text-red-400">
-            <span className="font-semibold">Error:</span> {status.error}
-          </div>
-        )}
-        {status.latency && (
-          <div className="mt-4">
-            <p className="text-[0.625rem] text-white/30 uppercase mb-1">Latency</p>
-            <div className="h-2 w-full rounded-full bg-white/5 overflow-hidden">
-              <div className={`h-full rounded-full transition-all ${status.latency < 100 ? 'bg-emerald-400' : status.latency < 500 ? 'bg-amber-400' : 'bg-red-400'}`}
-                style={{ width: `${Math.min(100, (status.latency / 1000) * 100)}%` }} />
-            </div>
-            <p className="mt-1 text-xs text-white/40">{status.latency}ms</p>
-          </div>
-        )}
-      </div>
-
-      {/* Available Providers */}
-      <div className="rounded-2xl border border-white/10 bg-white/[0.03] p-6 backdrop-blur-sm">
-        <div className="flex items-center justify-between mb-4">
-          <h2 className="text-xs font-semibold uppercase tracking-wider text-white/30">Available Providers</h2>
-          <span className="text-xs text-white/20">{providers.length} providers</span>
-        </div>
-        <div className="divide-y divide-white/5">
-          {providers.map(p => (
-            <div key={p.id} className="flex items-center justify-between py-3 first:pt-0 last:pb-0">
-              <div>
-                <p className="text-sm font-semibold text-white/80">{p.name}</p>
-                <p className="text-xs text-white/30">{p.description}</p>
-              </div>
-              <span className={`self-start rounded px-2 py-0.5 text-[0.625rem] font-bold uppercase ${
-                p.tier === 'pronto' ? 'bg-emerald-500/10 text-emerald-400' : p.tier === 'mvp' ? 'bg-blue-500/10 text-blue-400' : 'bg-purple-500/10 text-purple-400'
-              }`}>{p.tier}</span>
-            </div>
-          ))}
-        </div>
-      </div>
-
-      {/* Configuration */}
-      <div>
-        {isEditing ? (
-          <AdapterConfigForm
-            domain={domain}
-            onSave={async () => setIsEditing(false)}
-            onCancel={() => setIsEditing(false)}
-          />
-        ) : (
-          <button
-            onClick={() => setIsEditing(true)}
-            className="w-full rounded-2xl border border-dashed border-white/10 bg-white/[0.01] p-6 text-center text-sm text-white/30 hover:border-white/20 hover:text-white/50 transition-all"
-          >
-            ⚙️ Configure {label} Adapter
-          </button>
-        )}
-      </div>
-    </div>
-  )
-}

package/packages/react/src/pages/AdaptersPage.tsx

@@ -1,111 +0,0 @@
-// @geenius-adapters/react — AdaptersPage
-
-import { useState } from 'react'
-import { useAdapters } from '../hooks'
-import { AdapterList } from '../components/AdapterList'
-import { AdapterConfigForm } from '../components/AdapterConfigForm'
-import { AdapterStatusBadge } from '../components/AdapterStatusBadge'
-import { ADAPTER_DOMAINS, ADAPTER_STATUSES, DOMAIN_LABELS } from '@geenius-adapters/shared'
-import type { AdapterDomain, AdapterStatusType } from '@geenius-adapters/shared'
-
-export interface AdaptersPageProps {
-  onNavigateDetail?: (domain: AdapterDomain) => void
-  className?: string
-}
-
-export function AdaptersPage({ onNavigateDetail, className = '' }: AdaptersPageProps) {
-  const { statuses, isLoading } = useAdapters()
-  const [selectedDomain, setSelectedDomain] = useState<AdapterDomain | null>(null)
-  const [filterStatus, setFilterStatus] = useState<AdapterStatusType | undefined>()
-
-  // Status summary counts
-  const counts = {
-    connected: ADAPTER_DOMAINS.filter(d => statuses[d]?.status === 'connected').length,
-    error: ADAPTER_DOMAINS.filter(d => statuses[d]?.status === 'error').length,
-    total: ADAPTER_DOMAINS.length,
-  }
-
-  if (isLoading) {
-    return (
-      <div className={`max-w-4xl mx-auto space-y-6 ${className}`}>
-        <div className="animate-pulse space-y-4">
-          <div className="h-8 w-48 rounded bg-white/10" />
-          <div className="h-4 w-72 rounded bg-white/5" />
-          <div className="grid gap-3 sm:grid-cols-3">{[1,2,3].map(i => <div key={i} className="h-20 rounded-2xl bg-white/[0.03]" />)}</div>
-          <div className="grid gap-3 sm:grid-cols-2">{[1,2,3,4].map(i => <div key={i} className="h-28 rounded-2xl bg-white/[0.03]" />)}</div>
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <div className={`max-w-4xl mx-auto space-y-8 ${className}`}>
-      {/* Header */}
-      <div>
-        <h1 className="text-2xl font-extrabold text-white/95 tracking-tight">Adapters</h1>
-        <p className="mt-1 text-sm text-white/40">Manage your infrastructure adapters — database, auth, AI, storage, payments, and admin.</p>
-      </div>
-
-      {/* Status Summary */}
-      <div className="grid gap-3 sm:grid-cols-3">
-        <div className="rounded-2xl border border-white/10 bg-white/[0.03] p-4 backdrop-blur-sm">
-          <p className="text-xs font-semibold uppercase tracking-wider text-white/30">Total</p>
-          <p className="mt-1 text-2xl font-extrabold text-white/90">{counts.total}</p>
-          <p className="text-[0.625rem] text-white/30">adapter domains</p>
-        </div>
-        <div className="rounded-2xl border border-emerald-500/10 bg-emerald-500/[0.03] p-4 backdrop-blur-sm">
-          <p className="text-xs font-semibold uppercase tracking-wider text-emerald-400/60">Connected</p>
-          <p className="mt-1 text-2xl font-extrabold text-emerald-400">{counts.connected}</p>
-          <p className="text-[0.625rem] text-emerald-400/40">active adapters</p>
-        </div>
-        {counts.error > 0 && (
-          <div className="rounded-2xl border border-red-500/10 bg-red-500/[0.03] p-4 backdrop-blur-sm">
-            <p className="text-xs font-semibold uppercase tracking-wider text-red-400/60">Errors</p>
-            <p className="mt-1 text-2xl font-extrabold text-red-400">{counts.error}</p>
-            <p className="text-[0.625rem] text-red-400/40">need attention</p>
-          </div>
-        )}
-      </div>
-
-      {/* Filters */}
-      <div className="flex items-center gap-2">
-        <button
-          onClick={() => setFilterStatus(undefined)}
-          className={`rounded-lg px-3 py-1.5 text-xs font-semibold transition-all ${!filterStatus ? 'bg-white/10 text-white/80' : 'text-white/30 hover:text-white/50'}`}
-        >All</button>
-        {ADAPTER_STATUSES.map(s => (
-          <button
-            key={s}
-            onClick={() => setFilterStatus(s)}
-            className={`flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-semibold transition-all ${filterStatus === s ? 'bg-white/10 text-white/80' : 'text-white/30 hover:text-white/50'}`}
-          >
-            <AdapterStatusBadge status={s} showLabel={false} size="sm" />
-            {s}
-          </button>
-        ))}
-      </div>
-
-      {/* Adapter Grid */}
-      <AdapterList
-        onSelect={(domain) => {
-          if (onNavigateDetail) { onNavigateDetail(domain) }
-          else { setSelectedDomain(domain) }
-        }}
-        filterStatus={filterStatus}
-      />
-
-      {/* Inline Config Modal */}
-      {selectedDomain && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-sm" onClick={() => setSelectedDomain(null)}>
-          <div className="max-w-lg w-full mx-4" onClick={e => e.stopPropagation()}>
-            <AdapterConfigForm
-              domain={selectedDomain}
-              onSave={async () => { setSelectedDomain(null) }}
-              onCancel={() => setSelectedDomain(null)}
-            />
-          </div>
-        </div>
-      )}
-    </div>
-  )
-}

package/packages/react/src/pages/index.ts

@@ -1,2 +0,0 @@
-export { AdaptersPage, type AdaptersPageProps } from './AdaptersPage'
-export { AdapterDetailPage, type AdapterDetailPageProps } from './AdapterDetailPage'