create-fluxstack 1.12.1 → 1.14.0

package/app/client/src/live/RoomChatDemo.tsx

@@ -47,11 +47,11 @@ export function RoomChatDemo() {
   }
 
   return (
-    <div className="flex h-[600px] bg-gray-900 rounded-2xl overflow-hidden border border-white/10">
+    <div className="flex flex-col md:flex-row h-[calc(100vh-200px)] md:h-[600px] w-full max-w-4xl mx-auto bg-gray-900 rounded-2xl overflow-hidden border border-white/10">
       {/* Sidebar */}
-      <div className="w-64 bg-gray-800/50 border-r border-white/10 flex flex-col">
+      <div className={`${activeRoom ? 'hidden md:flex' : 'flex'} w-full md:w-64 bg-gray-800/50 md:border-r border-white/10 flex-col ${!activeRoom ? 'flex-1 md:flex-initial' : ''}`}>
         <div className="p-4 border-b border-white/10">
-          <h2 className="text-lg font-bold text-white mb-2">💬 Room Chat</h2>
+          <h2 className="text-lg font-bold text-white mb-2">Room Chat</h2>
           <div className="flex items-center gap-2">
             <div className={`w-2 h-2 rounded-full ${chat.$connected ? 'bg-emerald-400' : 'bg-red-400'}`} />
             <span className="text-sm text-gray-400">{chat.$state.username}</span>
@@ -94,15 +94,23 @@ export function RoomChatDemo() {
       </div>
 
       {/* Chat Area */}
-      <div className="flex-1 flex flex-col">
+      <div className={`${!activeRoom ? 'hidden md:flex' : 'flex'} flex-1 flex-col`}>
         {activeRoom ? (
           <>
             <div className="px-4 py-3 border-b border-white/10 flex items-center justify-between">
-              <div>
-                <h3 className="text-white font-semibold">
-                  {chat.$state.rooms.find(r => r.id === activeRoom)?.name || activeRoom}
-                </h3>
-                <p className="text-xs text-gray-500">{activeMessages.length} mensagens</p>
+              <div className="flex items-center gap-3">
+                <button
+                  onClick={() => chat.switchRoom({ roomId: '' })}
+                  className="md:hidden px-2 py-1 text-sm text-gray-400 hover:text-white"
+                >
+                  ←
+                </button>
+                <div>
+                  <h3 className="text-white font-semibold">
+                    {chat.$state.rooms.find(r => r.id === activeRoom)?.name || activeRoom}
+                  </h3>
+                  <p className="text-xs text-gray-500">{activeMessages.length} mensagens</p>
+                </div>
               </div>
               <button
                 onClick={() => chat.leaveRoom({ roomId: activeRoom })}
@@ -110,7 +118,7 @@ export function RoomChatDemo() {
               >Sair</button>
             </div>
 
-            <div className="flex-1 overflow-auto p-4 space-y-3">
+            <div className="flex-1 overflow-auto p-3 sm:p-4 space-y-3">
               {activeMessages.length === 0 ? (
                 <div className="text-center text-gray-500 py-8">
                   <p>Nenhuma mensagem ainda</p>
@@ -119,9 +127,9 @@ export function RoomChatDemo() {
               ) : (
                 activeMessages.map(msg => (
                   <div key={msg.id} className={`flex flex-col ${msg.user === chat.$state.username ? 'items-end' : 'items-start'}`}>
-                    <div className={`max-w-[80%] rounded-2xl px-4 py-2 ${msg.user === chat.$state.username ? 'bg-purple-500/30 text-purple-100' : 'bg-white/10 text-gray-200'}`}>
+                    <div className={`max-w-[85%] sm:max-w-[80%] rounded-2xl px-3 sm:px-4 py-2 ${msg.user === chat.$state.username ? 'bg-purple-500/30 text-purple-100' : 'bg-white/10 text-gray-200'}`}>
                       <p className="text-xs text-gray-400 mb-1">{msg.user}</p>
-                      <p>{msg.text}</p>
+                      <p className="text-sm sm:text-base">{msg.text}</p>
                     </div>
                     <span className="text-xs text-gray-600 mt-1">{new Date(msg.timestamp).toLocaleTimeString()}</span>
                   </div>
@@ -130,19 +138,19 @@ export function RoomChatDemo() {
               <div ref={messagesEndRef} />
             </div>
 
-            <div className="p-4 border-t border-white/10">
+            <div className="p-3 sm:p-4 border-t border-white/10">
               <div className="flex gap-2">
                 <input
                   value={text}
                   onChange={(e) => setText(e.target.value)}
                   onKeyDown={(e) => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); handleSendMessage() } }}
                   placeholder="Digite uma mensagem..."
-                  className="flex-1 px-4 py-2 rounded-xl bg-white/10 border border-white/20 text-white placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-purple-500/50"
+                  className="flex-1 px-3 sm:px-4 py-2 rounded-xl bg-white/10 border border-white/20 text-white placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-purple-500/50 text-sm sm:text-base"
                 />
                 <button
                   onClick={handleSendMessage}
                   disabled={!text.trim()}
-                  className="px-6 py-2 rounded-xl bg-purple-500/30 text-purple-200 hover:bg-purple-500/40 disabled:opacity-50"
+                  className="px-4 sm:px-6 py-2 rounded-xl bg-purple-500/30 text-purple-200 hover:bg-purple-500/40 disabled:opacity-50 text-sm sm:text-base"
                 >Enviar</button>
               </div>
             </div>
@@ -150,7 +158,7 @@ export function RoomChatDemo() {
         ) : (
           <div className="flex-1 flex items-center justify-center text-gray-500">
             <div className="text-center">
-              <p className="text-4xl mb-4">👈</p>
+              <p className="text-4xl mb-4">←</p>
               <p>Selecione uma sala para começar</p>
             </div>
           </div>

package/app/client/src/main.tsx

@@ -1,13 +1,13 @@
-import { StrictMode } from 'react'
-import { createRoot } from 'react-dom/client'
-import { BrowserRouter } from 'react-router'
-import './index.css'
-import App from './App.tsx'
-
-createRoot(document.getElementById('root')!).render(
-  <StrictMode>
-    <BrowserRouter>
-      <App />
-    </BrowserRouter>
-  </StrictMode>,
-)
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { BrowserRouter } from 'react-router'
+import './index.css'
+import App from './App.tsx'
+
+createRoot(document.getElementById('root')!).render(
+  <StrictMode>
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>
+  </StrictMode>,
+)

package/app/client/src/pages/ApiTestPage.tsx

@@ -15,10 +15,10 @@ export function ApiTestPage({
   onCreateUser: () => void
 }) {
   return (
-    <div className="container mx-auto px-4 py-8 max-w-4xl">
-      <div className="flex items-center gap-4 mb-8">
+    <div className="container mx-auto px-3 sm:px-4 py-6 sm:py-8 max-w-4xl">
+      <div className="flex items-center gap-3 sm:gap-4 mb-6 sm:mb-8">
         <BackButton />
-        <h1 className="text-3xl font-bold bg-gradient-to-r from-blue-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">
+        <h1 className="text-2xl sm:text-3xl font-bold bg-gradient-to-r from-blue-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">
           Eden Treaty API Test
         </h1>
       </div>
@@ -50,7 +50,7 @@ export function ApiTestPage({
         />
       </div>
 
-      <div className="bg-black/40 backdrop-blur-sm border border-white/10 rounded-2xl p-6">
+      <div className="bg-black/40 backdrop-blur-sm border border-white/10 rounded-2xl p-4 sm:p-6">
         <div className="flex items-center justify-between mb-4">
           <h2 className="text-lg font-semibold text-white">Response</h2>
           {isLoading && (
@@ -67,7 +67,7 @@ export function ApiTestPage({
         </pre>
       </div>
 
-      <div className="mt-8 bg-white/5 border border-white/10 rounded-xl p-6">
+      <div className="mt-6 sm:mt-8 bg-white/5 border border-white/10 rounded-xl p-4 sm:p-6">
         <h3 className="text-lg font-semibold text-white mb-3">How it works</h3>
         <div className="text-gray-400 text-sm space-y-2">
           <p>OK <code className="text-purple-400">api.health.get()</code> - Full type inference from server</p>
@@ -98,7 +98,7 @@ function ActionCard({
     <button
       onClick={onClick}
       disabled={disabled}
-      className={`px-6 py-4 border rounded-xl font-medium transition-all disabled:opacity-50 ${className}`}
+      className={`px-4 sm:px-6 py-3 sm:py-4 border rounded-xl font-medium transition-all disabled:opacity-50 text-sm sm:text-base ${className}`}
     >
       <div className="text-2xl mb-2">{icon}</div>
       <div>{title}</div>

package/app/client/src/pages/HomePage.tsx

@@ -1,76 +1,104 @@
-import { Link } from 'react-router'
-import { FaFire } from 'react-icons/fa'
+import FluxStack from '@client/src/assets/fluxstack.svg'
 
 export function HomePage({ apiStatus }: { apiStatus: 'checking' | 'online' | 'offline' }) {
   return (
-    <div className="flex flex-col items-center justify-center min-h-[calc(100vh-72px)] px-6 text-center">
-      <div className="mb-8 animate-pulse-slow">
-        <FaFire className="text-8xl text-orange-500 drop-shadow-2xl" />
-      </div>
+    <div className="flex flex-col items-center justify-center min-h-[calc(100vh-72px)] px-4 sm:px-6 py-12 text-center relative overflow-hidden">
 
-      <h1 className="text-6xl md:text-7xl font-bold mb-4 bg-gradient-to-r from-blue-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">
-        FluxStack
-      </h1>
+      {/* Background glow */}
+      <div className="absolute top-1/4 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[400px] h-[400px] bg-purple-500/10 rounded-full blur-[120px] pointer-events-none" />
 
-      <p className="text-xl md:text-2xl text-gray-300 mb-8 max-w-2xl">
-        Full-stack TypeScript framework with{' '}
-        <span className="text-purple-400 font-semibold">Bun</span>,{' '}
-        <span className="text-blue-400 font-semibold">Elysia</span>, and{' '}
-        <span className="text-cyan-400 font-semibold">React</span>
-      </p>
+      <div className="relative z-10 flex flex-col items-center w-full max-w-3xl">
 
-      <div className="mb-12">
-        <div className={`inline-flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-all ${
-          apiStatus === 'online'
-            ? 'bg-emerald-500/20 text-emerald-300 border border-emerald-500/30'
-            : apiStatus === 'offline'
-            ? 'bg-red-500/20 text-red-300 border border-red-500/30'
-            : 'bg-yellow-500/20 text-yellow-300 border border-yellow-500/30'
-        }`}>
-          <div className={`w-2 h-2 rounded-full ${
-            apiStatus === 'online' ? 'bg-emerald-400' : apiStatus === 'offline' ? 'bg-red-400' : 'bg-yellow-400'
-          }`}></div>
-          <span>{apiStatus === 'checking' ? 'Checking API...' : apiStatus === 'online' ? 'API Online' : 'API Offline'}</span>
+        {/* Icon */}
+        <div className="relative mb-5">
+          <div className="absolute inset-0 bg-purple-500/20 rounded-full blur-2xl animate-pulse-slow" />
+          <img
+            src={FluxStack}
+            alt="FluxStack"
+            className="relative w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 drop-shadow-[0_0_24px_rgba(168,85,247,0.35)] animate-float"
+          />
         </div>
-      </div>
 
-      <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-12 max-w-4xl">
-        <div className="bg-white/5 backdrop-blur-sm border border-white/10 rounded-2xl p-6 hover:bg-white/10 transition-all">
-          <div className="text-3xl mb-3">⚡</div>
-          <h3 className="text-lg font-semibold text-white mb-2">Ultra Rápido</h3>
-          <p className="text-gray-400 text-sm">Bun runtime 3x mais rápido que Node.js</p>
-        </div>
+        {/* Title */}
+        <h1 className="text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-extrabold mb-3 bg-gradient-to-r from-cyan-400 via-purple-400 to-pink-400 bg-clip-text text-transparent tracking-tight leading-none">
+          FluxStack
+        </h1>
 
-        <div className="bg-white/5 backdrop-blur-sm border border-white/10 rounded-2xl p-6 hover:bg-white/10 transition-all">
-          <div className="text-3xl mb-3">🔒</div>
-          <h3 className="text-lg font-semibold text-white mb-2">Type Safe</h3>
-          <p className="text-gray-400 text-sm">Eden Treaty com inferência automática</p>
-        </div>
+        {/* Subtitle */}
+        <p className="text-sm sm:text-base md:text-lg text-gray-400 mb-6 leading-relaxed">
+          <span className="text-purple-400 font-semibold">Bun</span>
+          {' + '}
+          <span className="text-indigo-400 font-semibold">Elysia</span>
+          {' + '}
+          <span className="text-cyan-400 font-semibold">React</span>
+          {' = '}
+          <span className="text-white font-semibold">FluxStack</span>
+        </p>
 
-        <div className="bg-white/5 backdrop-blur-sm border border-white/10 rounded-2xl p-6 hover:bg-white/10 transition-all">
-          <div className="text-3xl mb-3">🔥</div>
-          <h3 className="text-lg font-semibold text-white mb-2">Live Components</h3>
-          <p className="text-gray-400 text-sm">Estado reativo no servidor estilo Livewire</p>
+        {/* API Status */}
+        <div className="mb-10 md:mb-12">
+          <div className={`inline-flex items-center gap-2 px-3 py-1.5 rounded-full text-[10px] sm:text-xs font-medium tracking-wide uppercase transition-all ${
+            apiStatus === 'online'
+              ? 'bg-emerald-500/10 text-emerald-400 border border-emerald-500/20'
+              : apiStatus === 'offline'
+              ? 'bg-red-500/10 text-red-400 border border-red-500/20'
+              : 'bg-yellow-500/10 text-yellow-400 border border-yellow-500/20'
+          }`}>
+            <div className={`w-1.5 h-1.5 rounded-full animate-pulse ${
+              apiStatus === 'online' ? 'bg-emerald-400' : apiStatus === 'offline' ? 'bg-red-400' : 'bg-yellow-400'
+            }`} />
+            <span>{apiStatus === 'checking' ? 'Checking API...' : apiStatus === 'online' ? 'API Online' : 'API Offline'}</span>
+          </div>
         </div>
-      </div>
 
-      <div className="mt-4 text-gray-500 text-sm">
-        Use a navegação no topo para acessar as demos.
-      </div>
+        {/* Feature cards */}
+        <div className="grid grid-cols-1 sm:grid-cols-3 gap-3 sm:gap-4 w-full mb-12">
+          <div className="group bg-white/[0.03] border border-white/[0.06] rounded-xl p-4 sm:p-5 hover:bg-white/[0.06] hover:border-purple-500/20 transition-all duration-300">
+            <div className="w-8 h-8 rounded-lg bg-purple-500/10 flex items-center justify-center mb-3 group-hover:bg-purple-500/20 transition-colors">
+              <span className="text-sm">⚡</span>
+            </div>
+            <h3 className="text-xs sm:text-sm font-semibold text-white mb-1 text-left">Ultra Rápido</h3>
+            <p className="text-gray-500 text-[11px] sm:text-xs text-left leading-relaxed">Bun runtime com performance 3x superior ao Node.js</p>
+          </div>
 
-      <div className="mt-16 text-gray-500 text-sm">
-        <p>Desenvolvido com ❤️ usando TypeScript</p>
+          <div className="group bg-white/[0.03] border border-white/[0.06] rounded-xl p-4 sm:p-5 hover:bg-white/[0.06] hover:border-indigo-500/20 transition-all duration-300">
+            <div className="w-8 h-8 rounded-lg bg-indigo-500/10 flex items-center justify-center mb-3 group-hover:bg-indigo-500/20 transition-colors">
+              <span className="text-sm">🔒</span>
+            </div>
+            <h3 className="text-xs sm:text-sm font-semibold text-white mb-1 text-left">Type Safe</h3>
+            <p className="text-gray-500 text-[11px] sm:text-xs text-left leading-relaxed">Eden Treaty com inferência end-to-end automática</p>
+          </div>
+
+          <div className="group bg-white/[0.03] border border-white/[0.06] rounded-xl p-4 sm:p-5 hover:bg-white/[0.06] hover:border-cyan-500/20 transition-all duration-300">
+            <div className="w-8 h-8 rounded-lg bg-cyan-500/10 flex items-center justify-center mb-3 group-hover:bg-cyan-500/20 transition-colors">
+              <span className="text-sm">🔥</span>
+            </div>
+            <h3 className="text-xs sm:text-sm font-semibold text-white mb-1 text-left">Live Components</h3>
+            <p className="text-gray-500 text-[11px] sm:text-xs text-left leading-relaxed">Estado reativo no servidor inspirado no Livewire</p>
+          </div>
+        </div>
+
+        <p className="text-gray-600 text-[11px] tracking-wide">
+          Desenvolvido com ❤️ usando TypeScript
+        </p>
       </div>
 
       <style>{`
         @keyframes pulse-slow {
           0%, 100% { opacity: 1; }
-          50% { opacity: 0.8; }
+          50% { opacity: 0.5; }
+        }
+        @keyframes float {
+          0%, 100% { transform: translateY(0); }
+          50% { transform: translateY(-6px); }
         }
         .animate-pulse-slow {
-          animation: pulse-slow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+          animation: pulse-slow 4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+        }
+        .animate-float {
+          animation: float 5s ease-in-out infinite;
         }
       `}</style>
     </div>
   )
-}
+}

package/app/server/auth/AuthManager.ts

@@ -0,0 +1,213 @@
+/**
+ * FluxStack Auth - Auth Manager
+ *
+ * Orquestrador central do sistema de autenticação.
+ * Factory pattern com lazy resolution e cache de guards.
+ *
+ * Inspirado no AuthManager do Laravel:
+ * - Resolve guards por nome (ou default)
+ * - Extensível com extend() para guards customizados
+ * - Resolve providers automaticamente da config
+ *
+ * ```ts
+ * // Usar guard padrão
+ * const user = await auth.guard().user()
+ *
+ * // Usar guard específico
+ * const apiUser = await auth.guard('api').user()
+ *
+ * // Registrar guard customizado
+ * auth.extend('jwt', (name, config, provider) => new JWTGuard(...))
+ * ```
+ */
+
+import type {
+  Guard,
+  UserProvider,
+  GuardConfig,
+  GuardFactory,
+  RequestContext,
+} from './contracts'
+import { SessionGuard } from './guards/SessionGuard'
+import { TokenGuard } from './guards/TokenGuard'
+import { SessionManager } from './sessions/SessionManager'
+import { cacheManager } from '@server/cache'
+
+export interface AuthManagerConfig {
+  defaults: {
+    guard: string
+    provider: string
+  }
+  guards: Record<string, GuardConfig>
+  providers: Record<string, ProviderConfig>
+}
+
+export interface ProviderConfig {
+  driver: string
+  [key: string]: unknown
+}
+
+export class AuthManager {
+  private config: AuthManagerConfig
+  private guards = new Map<string, Guard>()
+  private customGuardFactories = new Map<string, GuardFactory>()
+  private providerInstances = new Map<string, UserProvider>()
+  private customProviderFactories = new Map<string, (config: ProviderConfig) => UserProvider>()
+  private sessionManager: SessionManager
+
+  constructor(config: AuthManagerConfig, sessionManager: SessionManager) {
+    this.config = config
+    this.sessionManager = sessionManager
+  }
+
+  /**
+   * Retorna um guard por nome (ou o default).
+   * Guards são criados uma vez e reutilizados.
+   */
+  guard(name?: string): Guard {
+    const guardName = name ?? this.config.defaults.guard
+
+    if (this.guards.has(guardName)) {
+      return this.guards.get(guardName)!
+    }
+
+    const guard = this.resolve(guardName)
+    this.guards.set(guardName, guard)
+    return guard
+  }
+
+  /**
+   * Inicializa todos os guards com o contexto da request.
+   * Deve ser chamado no middleware, antes de qualquer uso.
+   */
+  setRequest(context: RequestContext): void {
+    for (const guard of this.guards.values()) {
+      guard.setRequest(context)
+    }
+    // Também resetar guards não-instanciados para forçar re-resolve com novo context
+  }
+
+  /**
+   * Cria um guard novo (sem cache) com o context da request.
+   * Útil quando precisa de um guard fresco para cada request.
+   */
+  freshGuard(name?: string, context?: RequestContext): Guard {
+    const guardName = name ?? this.config.defaults.guard
+    const guard = this.resolve(guardName)
+    if (context) {
+      guard.setRequest(context)
+    }
+    return guard
+  }
+
+  /**
+   * Registra um guard driver customizado.
+   *
+   * ```ts
+   * auth.extend('jwt', (name, config, provider) => {
+   *   return new JWTGuard(name, provider, config.secret)
+   * })
+   * ```
+   */
+  extend(driver: string, factory: GuardFactory): void {
+    this.customGuardFactories.set(driver, factory)
+  }
+
+  /**
+   * Registra um provider customizado.
+   *
+   * ```ts
+   * auth.extendProvider('drizzle', (config) => {
+   *   return new DrizzleUserProvider(db, config.table)
+   * })
+   * ```
+   */
+  extendProvider(driver: string, factory: (config: ProviderConfig) => UserProvider): void {
+    this.customProviderFactories.set(driver, factory)
+  }
+
+  /**
+   * Registra uma instância de provider diretamente.
+   */
+  registerProvider(name: string, provider: UserProvider): void {
+    this.providerInstances.set(name, provider)
+  }
+
+  /** Retorna o nome do guard padrão */
+  getDefaultGuardName(): string {
+    return this.config.defaults.guard
+  }
+
+  /** Retorna a config */
+  getConfig(): AuthManagerConfig {
+    return this.config
+  }
+
+  /** Resolve um guard por nome */
+  private resolve(name: string): Guard {
+    const guardConfig = this.config.guards[name]
+    if (!guardConfig) {
+      throw new Error(
+        `Auth guard '${name}' not configured. ` +
+        `Available: ${Object.keys(this.config.guards).join(', ')}`
+      )
+    }
+
+    // Resolver provider
+    const provider = this.resolveProvider(guardConfig.provider)
+
+    // Verificar custom factory primeiro
+    if (this.customGuardFactories.has(guardConfig.driver)) {
+      return this.customGuardFactories.get(guardConfig.driver)!(name, guardConfig, provider)
+    }
+
+    // Built-in drivers
+    switch (guardConfig.driver) {
+      case 'session':
+        return new SessionGuard(name, provider, this.sessionManager)
+
+      case 'token':
+        return new TokenGuard(
+          name,
+          provider,
+          cacheManager.driver(),
+          guardConfig.tokenTtl as number | undefined
+        )
+
+      default:
+        throw new Error(
+          `Auth guard driver '${guardConfig.driver}' not supported. ` +
+          `Use auth.extend('${guardConfig.driver}', factory) to register it.`
+        )
+    }
+  }
+
+  /** Resolve um provider por nome */
+  private resolveProvider(name: string): UserProvider {
+    // Cache de instâncias
+    if (this.providerInstances.has(name)) {
+      return this.providerInstances.get(name)!
+    }
+
+    const providerConfig = this.config.providers[name]
+    if (!providerConfig) {
+      throw new Error(
+        `Auth provider '${name}' not configured. ` +
+        `Available: ${Object.keys(this.config.providers).join(', ')}`
+      )
+    }
+
+    // Custom factory
+    if (this.customProviderFactories.has(providerConfig.driver)) {
+      const provider = this.customProviderFactories.get(providerConfig.driver)!(providerConfig)
+      this.providerInstances.set(name, provider)
+      return provider
+    }
+
+    throw new Error(
+      `Auth provider driver '${providerConfig.driver}' not supported. ` +
+      `Use auth.extendProvider('${providerConfig.driver}', factory) to register it, ` +
+      `or use auth.registerProvider('${name}', providerInstance) to register directly.`
+    )
+  }
+}

package/app/server/auth/DevAuthProvider.ts

@@ -0,0 +1,66 @@
+// 🧪 DevAuthProvider - Provider de desenvolvimento para testes de auth
+//
+// Aceita tokens simples para facilitar testes da demo de autenticação.
+// NÃO USAR EM PRODUÇÃO!
+//
+// Tokens válidos:
+//   - "admin-token" → role: admin, permissions: all
+//   - "user-token"  → role: user, permissions: básicas
+//   - "mod-token"   → role: moderator, permissions: moderação
+
+import type {
+  LiveAuthProvider,
+  LiveAuthCredentials,
+  LiveAuthContext,
+} from '@core/server/live/auth/types'
+import { AuthenticatedContext } from '@core/server/live/auth/LiveAuthContext'
+
+interface DevUser {
+  id: string
+  name: string
+  roles: string[]
+  permissions: string[]
+}
+
+const DEV_USERS: Record<string, DevUser> = {
+  'admin-token': {
+    id: 'admin-1',
+    name: 'Admin User',
+    roles: ['admin', 'user'],
+    permissions: ['users.read', 'users.write', 'users.delete', 'chat.read', 'chat.write', 'chat.admin'],
+  },
+  'user-token': {
+    id: 'user-1',
+    name: 'Regular User',
+    roles: ['user'],
+    permissions: ['chat.read', 'chat.write'],
+  },
+  'mod-token': {
+    id: 'mod-1',
+    name: 'Moderator',
+    roles: ['moderator', 'user'],
+    permissions: ['chat.read', 'chat.write', 'chat.moderate'],
+  },
+}
+
+export class DevAuthProvider implements LiveAuthProvider {
+  readonly name = 'dev'
+
+  async authenticate(credentials: LiveAuthCredentials): Promise<LiveAuthContext | null> {
+    const token = credentials.token as string
+    if (!token) return null
+
+    const user = DEV_USERS[token]
+    if (!user) return null
+
+    return new AuthenticatedContext(
+      {
+        id: user.id,
+        name: user.name,
+        roles: user.roles,
+        permissions: user.permissions,
+      },
+      token
+    )
+  }
+}