create-fluxstack 1.5.5 → 1.7.0

package/core/client/index.ts

@@ -1,5 +1,21 @@
 // 🔥 FluxStack Client Core - Main Export
 
+// Live Components Provider (Singleton WebSocket Connection)
+export {
+  LiveComponentsProvider,
+  useLiveComponents,
+  // Deprecated exports for backward compatibility
+  WebSocketProvider,
+  useWebSocketContext
+} from './LiveComponentsProvider'
+export type {
+  LiveComponentsProviderProps,
+  LiveComponentsContextValue,
+  // Deprecated types for backward compatibility
+  WebSocketProviderProps,
+  WebSocketContextValue
+} from './LiveComponentsProvider'
+
 // Hooks
 export { useWebSocket } from './hooks/useWebSocket'
 export { useHybridLiveComponent } from './hooks/useHybridLiveComponent'

package/core/framework/server.ts

@@ -1,6 +1,6 @@
 import { Elysia } from "elysia"
 import type { FluxStackConfig, FluxStackContext } from "../types"
-import type { Plugin, PluginContext, PluginUtils } from "../plugins/types"
+import type { FluxStack, PluginContext, PluginUtils } from "../plugins/types"
 import { PluginRegistry } from "../plugins/registry"
 import { PluginManager } from "../plugins/manager"
 import { getConfigSync, getEnvironmentInfo } from "../config"
@@ -16,6 +16,7 @@ export class FluxStackFramework {
   private pluginManager: PluginManager
   private pluginContext: PluginContext
   private isStarted: boolean = false
+  private requestTimings: Map<string, number> = new Map()
 
   constructor(config?: Partial<FluxStackConfig>) {
     // Load the full configuration
@@ -32,7 +33,7 @@ export class FluxStackFramework {
 
     this.app = new Elysia()
     this.pluginRegistry = new PluginRegistry()
-    
+
 
 
     // Create plugin utilities
@@ -68,22 +69,33 @@ export class FluxStackFramework {
       }
     }
 
-    // Create a logger wrapper that implements the full Logger interface
-    const pluginLogger = {
-      debug: (message: string, meta?: any) => logger.debug(message, meta),
-      info: (message: string, meta?: any) => logger.info(message, meta),
-      warn: (message: string, meta?: any) => logger.warn(message, meta),
-      error: (message: string, meta?: any) => logger.error(message, meta),
-      child: (context: any) => (logger as any).child ? (logger as any).child(context) : logger,
-      time: (label: string) => (logger as any).time(label),
-      timeEnd: (label: string) => (logger as any).timeEnd(label),
+    // Create plugin-compatible logger interface
+    interface PluginLogger {
+      debug: (message: string, meta?: unknown) => void
+      info: (message: string, meta?: unknown) => void
+      warn: (message: string, meta?: unknown) => void
+      error: (message: string, meta?: unknown) => void
+      child: (context: Record<string, unknown>) => PluginLogger
+      time: (label: string) => void
+      timeEnd: (label: string) => void
+      request: (method: string, path: string, status?: number, duration?: number) => void
+    }
+
+    const pluginLogger: PluginLogger = {
+      debug: (message: string, meta?: unknown) => logger.debug(message, meta),
+      info: (message: string, meta?: unknown) => logger.info(message, meta),
+      warn: (message: string, meta?: unknown) => logger.warn(message, meta),
+      error: (message: string, meta?: unknown) => logger.error(message, meta),
+      child: (context: Record<string, unknown>) => pluginLogger,
+      time: (label: string) => logger.time(label),
+      timeEnd: (label: string) => logger.timeEnd(label),
       request: (method: string, path: string, status?: number, duration?: number) =>
         logger.request(method, path, status, duration)
     }
 
     this.pluginContext = {
       config: fullConfig,
-      logger: pluginLogger,
+      logger: pluginLogger as any,
       app: this.app,
       utils: pluginUtils
     }
@@ -97,6 +109,7 @@ export class FluxStackFramework {
 
     this.setupCors()
     this.setupHeadHandler()
+    this.setupElysiaHeadBugFilter()
     this.setupHooks()
     this.setupErrorHandling()
 
@@ -104,7 +117,7 @@ export class FluxStackFramework {
       environment: envInfo.name,
       port: fullConfig.server.port
     })
-    
+
     // Initialize automatic plugin discovery in background
     this.initializeAutomaticPlugins().catch(error => {
       logger.error('Failed to initialize automatic plugins', { error })
@@ -147,7 +160,7 @@ export class FluxStackFramework {
     // Global HEAD handler to prevent Elysia's automatic HEAD conversion bug
     this.app.head("*", ({ request, set }) => {
       const url = new URL(request.url)
-      
+
       // Handle API routes
       if (url.pathname.startsWith(this.context.config.server.apiPrefix)) {
         set.status = 200
@@ -155,7 +168,7 @@ export class FluxStackFramework {
         set.headers['Content-Length'] = '0'
         return ""
       }
-      
+
       // Handle static files (assume they're HTML if no extension)
       const isStatic = url.pathname === '/' || !url.pathname.includes('.')
       if (isStatic) {
@@ -165,7 +178,7 @@ export class FluxStackFramework {
         set.headers['Cache-Control'] = 'no-cache'
         return ""
       }
-      
+
       // Handle other file types
       set.status = 200
       set.headers['Content-Type'] = 'application/octet-stream'
@@ -174,12 +187,61 @@ export class FluxStackFramework {
     })
   }
 
+  private setupElysiaHeadBugFilter() {
+    // Only filter in development mode to avoid affecting production logs
+    if (process.env.NODE_ENV !== 'development') {
+      return
+    }
+
+    // Store original stderr.write to restore if needed
+    const originalStderrWrite = process.stderr.write
+
+    // Override stderr.write to filter Elysia HEAD bug errors
+    process.stderr.write = function (
+      chunk: string | Uint8Array,
+      encoding?: BufferEncoding | ((error?: Error) => void),
+      callback?: (error?: Error) => void
+    ): boolean {
+      const str = chunk.toString()
+
+      // Filter out known Elysia HEAD bug error patterns
+      if (str.includes("TypeError: undefined is not an object (evaluating '_res.headers.set')") ||
+        str.includes("HEAD - / failed") ||
+        (str.includes("HEAD - ") && str.includes(" failed"))) {
+        // Silently ignore these specific errors
+        if (typeof encoding === 'function') {
+          encoding() // encoding is actually the callback
+        } else if (callback) {
+          callback()
+        }
+        return true
+      }
+
+      // Pass through all other stderr output
+      if (typeof encoding === 'function') {
+        return originalStderrWrite.call(process.stderr, chunk, encoding)
+      } else {
+        return originalStderrWrite.call(process.stderr, chunk, encoding, callback)
+      }
+    }
+
+      // Store reference to restore original behavior if needed
+      ; (this as any)._originalStderrWrite = originalStderrWrite
+  }
+
   private setupHooks() {
     // Setup onRequest hook and onBeforeRoute hook
     this.app.onRequest(async ({ request, set }) => {
       const startTime = Date.now()
       const url = new URL(request.url)
-      
+
+      // Store start time for duration calculation (using request URL as key)
+      const requestKey = `${request.method}-${url.pathname}-${startTime}`
+      this.requestTimings.set(requestKey, startTime)
+
+      // Store key in set.headers for retrieval in onAfterHandle
+      set.headers['x-request-timing-key'] = requestKey
+
       const requestContext = {
         request,
         path: url.pathname,
@@ -197,24 +259,33 @@ export class FluxStackFramework {
         handled: false,
         response: undefined
       }
-      
+
       // Execute onRequest hooks for all plugins first (logging, auth, etc.)
       await this.executePluginHooks('onRequest', requestContext)
-      
+
       // Execute onBeforeRoute hooks - allow plugins to handle requests before routing
       const handledResponse = await this.executePluginBeforeRouteHooks(requestContext)
-      
+
       // If a plugin handled the request, return the response
       if (handledResponse) {
         return handledResponse
       }
     })
 
-    // Setup onResponse hook  
+    // Setup onResponse hook
     this.app.onAfterHandle(async ({ request, response, set }) => {
-      const startTime = Date.now()
       const url = new URL(request.url)
-      
+
+      // Retrieve start time using the timing key
+      const requestKey = set.headers['x-request-timing-key']
+      const startTime = requestKey ? this.requestTimings.get(String(requestKey)) : undefined
+      const duration = startTime ? Date.now() - startTime : 0
+
+      // Clean up timing entry
+      if (requestKey) {
+        this.requestTimings.delete(String(requestKey))
+      }
+
       const responseContext = {
         request,
         path: url.pathname,
@@ -229,11 +300,21 @@ export class FluxStackFramework {
         query: Object.fromEntries(url.searchParams.entries()),
         params: {},
         response,
-        statusCode: (response as any)?.status || set.status || 200,
-        duration: Date.now() - startTime,
+        statusCode: Number((response as any)?.status || set.status || 200),
+        duration,
         startTime
       }
-      
+
+      // Log the request automatically (if not disabled in config)
+      if (this.context.config.server.enableRequestLogging !== false) {
+        // Ensure status is always a number (HTTP status code)
+        const status = typeof responseContext.statusCode === 'number'
+          ? responseContext.statusCode
+          : Number(set.status) || 200
+
+        logger.request(request.method, url.pathname, status, duration)
+      }
+
       // Execute onResponse hooks for all plugins
       await this.executePluginHooks('onResponse', responseContext)
     })
@@ -248,7 +329,7 @@ export class FluxStackFramework {
     this.app.onError(async ({ error, request, path, set }) => {
       const startTime = Date.now()
       const url = new URL(request.url)
-      
+
       const errorContext = {
         request,
         path: url.pathname,
@@ -267,17 +348,17 @@ export class FluxStackFramework {
         handled: false,
         startTime
       }
-      
+
       // Execute onError hooks for all plugins - allow them to handle the error
       const handledResponse = await this.executePluginErrorHooks(errorContext)
-      
+
       // If a plugin handled the error, return the response
       if (handledResponse) {
         return handledResponse
       }
-      
+
       // Vite proxy logic is now handled by the Vite plugin via onBeforeRoute hook
-      
+
       // Convert Elysia error to standard Error if needed
       const standardError = error instanceof Error ? error : new Error(String(error))
       return errorHandler(standardError, request, path)
@@ -286,18 +367,18 @@ export class FluxStackFramework {
 
   private async executePluginHooks(hookName: string, context: any): Promise<void> {
     const loadOrder = this.pluginRegistry.getLoadOrder()
-    
+
     for (const pluginName of loadOrder) {
       const plugin = this.pluginRegistry.get(pluginName)
       if (!plugin) continue
-      
+
       const hookFn = (plugin as any)[hookName]
       if (typeof hookFn === 'function') {
         try {
           await hookFn(context)
         } catch (error) {
-          logger.error(`Plugin '${pluginName}' ${hookName} hook failed`, { 
-            error: (error as Error).message 
+          logger.error(`Plugin '${pluginName}' ${hookName} hook failed`, {
+            error: (error as Error).message
           })
         }
       }
@@ -306,86 +387,86 @@ export class FluxStackFramework {
 
   private async executePluginBeforeRouteHooks(requestContext: any): Promise<Response | null> {
     const loadOrder = this.pluginRegistry.getLoadOrder()
-    
+
     for (const pluginName of loadOrder) {
       const plugin = this.pluginRegistry.get(pluginName)
       if (!plugin) continue
-      
+
       const onBeforeRouteFn = (plugin as any).onBeforeRoute
       if (typeof onBeforeRouteFn === 'function') {
         try {
           await onBeforeRouteFn(requestContext)
-          
+
           // If this plugin handled the request, return the response
           if (requestContext.handled && requestContext.response) {
             return requestContext.response
           }
         } catch (error) {
-          logger.error(`Plugin '${pluginName}' onBeforeRoute hook failed`, { 
-            error: (error as Error).message 
+          logger.error(`Plugin '${pluginName}' onBeforeRoute hook failed`, {
+            error: (error as Error).message
           })
         }
       }
     }
-    
+
     return null
   }
 
   private async executePluginErrorHooks(errorContext: any): Promise<Response | null> {
     const loadOrder = this.pluginRegistry.getLoadOrder()
-    
+
     for (const pluginName of loadOrder) {
       const plugin = this.pluginRegistry.get(pluginName)
       if (!plugin) continue
-      
+
       const onErrorFn = (plugin as any).onError
       if (typeof onErrorFn === 'function') {
         try {
           await onErrorFn(errorContext)
-          
+
           // If this plugin handled the error, check if it provides a response
           if (errorContext.handled) {
             // For Vite plugin, we'll handle the proxy here
             if (pluginName === 'vite' && errorContext.error.constructor.name === 'NotFoundError') {
               return await this.handleViteProxy(errorContext)
             }
-            
+
             // For other plugins, return a basic success response
             return new Response('OK', { status: 200 })
           }
         } catch (error) {
-          logger.error(`Plugin '${pluginName}' onError hook failed`, { 
-            error: (error as Error).message 
+          logger.error(`Plugin '${pluginName}' onError hook failed`, {
+            error: (error as Error).message
           })
         }
       }
     }
-    
+
     return null
   }
 
   private async handleViteProxy(errorContext: any): Promise<Response> {
     const vitePort = this.context.config.client?.port || 5173
     const url = new URL(errorContext.request.url)
-    
+
     try {
       const viteUrl = `http://localhost:${vitePort}${url.pathname}${url.search}`
-      
+
       // Forward request to Vite
       const response = await fetch(viteUrl, {
         method: errorContext.method,
         headers: errorContext.headers
       })
-      
+
       // Return a proper Response object with all headers and status
       const body = await response.arrayBuffer()
-      
+
       return new Response(body, {
         status: response.status,
         statusText: response.statusText,
         headers: response.headers
       })
-      
+
     } catch (viteError) {
       // If Vite fails, return error response
       return new Response(`Vite server not ready on port ${vitePort}. Error: ${viteError}`, {
@@ -401,16 +482,16 @@ export class FluxStackFramework {
       if (this.pluginRegistry.has(plugin.name)) {
         throw new Error(`Plugin '${plugin.name}' is already registered`)
       }
-      
+
       // Store plugin without calling setup - setup will be called in start()
       // We need to manually set the plugin since register() is async but we need sync
       (this.pluginRegistry as any).plugins.set(plugin.name, plugin)
-      
+
       // Update dependencies tracking
-      if (plugin.dependencies) {
-        (this.pluginRegistry as any).dependencies.set(plugin.name, plugin.dependencies)
+      if ((plugin as FluxStack.Plugin).dependencies) {
+        (this.pluginRegistry as any).dependencies.set(plugin.name, (plugin as FluxStack.Plugin).dependencies)
       }
-      
+
       // Update load order by calling the private method
       try {
         (this.pluginRegistry as any).updateLoadOrder()
@@ -418,12 +499,12 @@ export class FluxStackFramework {
         // Fallback: create basic load order
         const plugins = (this.pluginRegistry as any).plugins as Map<string, Plugin>
         const loadOrder = Array.from(plugins.keys())
-        ;(this.pluginRegistry as any).loadOrder = loadOrder
+          ; (this.pluginRegistry as any).loadOrder = loadOrder
       }
-      
+
       logger.debug(`Plugin '${plugin.name}' registered`, {
-        version: plugin.version,
-        dependencies: plugin.dependencies
+        version: (plugin as FluxStack.Plugin).version,
+        dependencies: (plugin as FluxStack.Plugin).dependencies
       })
       return this
     } catch (error) {
@@ -445,7 +526,7 @@ export class FluxStackFramework {
 
     try {
       // Validate plugin dependencies before starting
-      const plugins = (this.pluginRegistry as any).plugins as Map<string, Plugin>
+      const plugins = (this.pluginRegistry as any).plugins as Map<string, FluxStack.Plugin>
       for (const [pluginName, plugin] of plugins) {
         if (plugin.dependencies) {
           for (const depName of plugin.dependencies) {

package/core/index.ts

@@ -8,6 +8,7 @@ export * from './server/services/index.js'
 export * from './server/middleware/index.js'
 
 // Client exports  
+export * from './client/index.js'
 export * from './client/state/index.js'
 export * from './client/hooks/index.js'
 
@@ -22,4 +23,6 @@ export * from './framework/server.js'
 export * from './framework/client.js'
 export * from './plugins/index.js'
 export * from './utils/logger/index.js'
-export * from './utils/errors/index.js'
+export * from './utils/errors/index.js'// Ve
+rsion exports
+export { FLUXSTACK_VERSION, getVersion, getVersionInfo } from './utils/version.js'

package/core/plugins/built-in/monitoring/index.ts

@@ -3,7 +3,7 @@
  * Provides performance monitoring, metrics collection, and system monitoring
  */
 
-import type { Plugin, PluginContext, RequestContext, ResponseContext, ErrorContext } from "../../types"
+import type { FluxStack, PluginContext, RequestContext, ResponseContext, ErrorContext } from "../../types"
 import { MetricsCollector } from "../../../utils/monitoring"
 import * as os from 'os'
 import * as fs from 'fs'

package/core/plugins/built-in/static/index.ts

@@ -1,6 +1,6 @@
 import { join, extname } from "path"
 import { existsSync, statSync } from "fs"
-import type { Plugin, PluginContext } from "../../types"
+import type { FluxStack, PluginContext } from "../../types"
 
 export const staticPlugin: Plugin = {
   name: "static",

package/core/plugins/built-in/swagger/index.ts

@@ -1,5 +1,5 @@
 import { swagger } from '@elysiajs/swagger'
-import type { Plugin, PluginContext } from '../../types'
+import type { FluxStack, PluginContext } from '../../types'
 
 export const swaggerPlugin: Plugin = {
   name: 'swagger',

package/core/plugins/built-in/vite/index.ts

@@ -1,4 +1,4 @@
-import type { Plugin, PluginContext, RequestContext } from "../../types"
+import type { FluxStack, PluginContext, RequestContext } from "../../types"
 import { createServer, type ViteDevServer } from 'vite'
 
 let viteServer: ViteDevServer | null = null

package/core/plugins/config.ts

@@ -3,7 +3,7 @@
  * Handles plugin-specific configuration validation and management
  */
 
-import type { Plugin, PluginConfigSchema, PluginValidationResult } from "./types"
+import type { FluxStack, PluginConfigSchema, PluginValidationResult } from "./types"
 import type { FluxStackConfig } from "../config/schema"
 import type { Logger } from "../utils/logger/index"
 

package/core/plugins/discovery.ts

@@ -3,7 +3,7 @@
  * Handles automatic discovery and loading of plugins from various sources
  */
 
-import type { Plugin, PluginManifest, PluginLoadResult, PluginDiscoveryOptions } from "./types"
+import type { FluxStack, PluginManifest, PluginLoadResult, PluginDiscoveryOptions } from "./types"
 import type { Logger } from "../utils/logger/index"
 import { readdir, readFile } from "fs/promises"
 import { join, resolve } from "path"

package/core/plugins/executor.ts

@@ -4,7 +4,7 @@
  */
 
 import type { 
-  Plugin, 
+  FluxStack, 
   PluginHook, 
   PluginHookResult,
   PluginPriority,

package/core/plugins/index.ts

@@ -27,6 +27,7 @@ export type {
     BuildContext
 } from './types'
 
+export type { FluxStack }
 export type Plugin = FluxStack.Plugin
 
 // Plugin registry

package/core/server/live/ComponentRegistry.ts

@@ -794,12 +794,14 @@ export class ComponentRegistry {
   }
 
   // Update component activity
-  updateComponentActivity(componentId: string): void {
+  updateComponentActivity(componentId: string): boolean {
     const metadata = this.metadata.get(componentId)
     if (metadata) {
       metadata.lastActivity = new Date()
       metadata.state = 'active'
+      return true
     }
+    return false
   }
 
   // Record component metrics

package/core/server/live/WebSocketConnectionManager.ts

@@ -134,7 +134,17 @@ export class WebSocketConnectionManager extends EventEmitter {
     if (!metrics) return
 
     // Handle incoming messages
-    ws.on('message', (data: any) => {
+    const addListener = (event: string, handler: (...args: any[]) => void) => {
+      if (typeof ws.on === 'function') {
+        ws.on(event, handler)
+      } else if (typeof ws.addEventListener === 'function') {
+        ws.addEventListener(event as any, handler as any)
+      } else if (typeof ws.addListener === 'function') {
+        ws.addListener(event, handler)
+      }
+    }
+
+    addListener('message', (data: any) => {
       metrics.messagesReceived++
       metrics.lastActivity = new Date()
       metrics.bytesTransferred += Buffer.byteLength(data)
@@ -143,20 +153,20 @@ export class WebSocketConnectionManager extends EventEmitter {
     })
 
     // Handle connection close
-    ws.on('close', () => {
+    addListener('close', () => {
       metrics.status = 'disconnected'
       this.handleConnectionClose(connectionId)
     })
 
     // Handle connection errors
-    ws.on('error', (error: Error) => {
+    addListener('error', (error: Error) => {
       metrics.errorCount++
       metrics.status = 'error'
       this.handleConnectionError(connectionId, error)
     })
 
     // Handle pong responses for latency measurement
-    ws.on('pong', () => {
+    addListener('pong', () => {
       const now = Date.now()
       const pingTime = (ws as any)._pingTime
       if (pingTime) {