hightjs 0.2.42 → 0.2.45

package/src/index.ts

@@ -1,15 +1,32 @@
-import express from 'express';
 import path from 'path';
 import fs from 'fs';
-import { ExpressAdapter } from './adapters/express';
-import { build, watch, buildWithChunks, watchWithChunks } from './builder';
-import { HightJSOptions, RequestHandler, RouteConfig, BackendRouteConfig, BackendHandler, HightMiddleware } from './types';
-import { loadRoutes, findMatchingRoute, loadBackendRoutes, findMatchingBackendRoute, loadLayout, getLayout, loadNotFound, getNotFound } from './router';
-import { render } from './renderer';
-import { HightJSRequest, HightJSResponse } from './api/http';
-import { HotReloadManager } from './hotReload';
-import { FrameworkAdapterFactory } from './adapters/factory';
-import { GenericRequest, GenericResponse } from './types/framework';
+import {ExpressAdapter} from './adapters/express';
+import {build, buildWithChunks, watch, watchWithChunks} from './builder';
+import {
+    BackendHandler,
+    BackendRouteConfig,
+    HightJSOptions,
+    HightMiddleware,
+    RequestHandler,
+    RouteConfig
+} from './types';
+import {
+    findMatchingBackendRoute,
+    findMatchingRoute,
+    getLayout,
+    getNotFound,
+    loadBackendRoutes,
+    loadLayout,
+    loadNotFound,
+    loadRoutes,
+    processWebSocketRoutes,
+    setupWebSocketUpgrade
+} from './router';
+import {render} from './renderer';
+import {HightJSRequest, HightJSResponse} from './api/http';
+import {HotReloadManager} from './hotReload';
+import {FrameworkAdapterFactory} from './adapters/factory';
+import {GenericRequest, GenericResponse} from './types/framework';
 import Console, {Colors} from "./api/console"
 
 // Exporta apenas os tipos e classes para o backend
@@ -25,7 +42,8 @@ export type { GenericRequest, GenericResponse, CookieOptions } from './types/fra
 // Exporta os helpers para facilitar integração
 export { app } from './helpers';
 
-// Exporta o sistema de autenticação
+// Exporta o sistema de WebSocket
+export type { WebSocketContext, WebSocketHandler } from './types';
 
 // Função para verificar se o projeto é grande o suficiente para se beneficiar de chunks
 function isLargeProject(projectDir: string): boolean {
@@ -207,22 +225,26 @@ export default function hweb(options: HightJSOptions) {
         entryPoint = createEntryFile(dir, frontendRoutes);
     };
 
-    const app = {
+    return {
         prepare: async () => {
             const isProduction = !dev;
 
             if (!isProduction) {
-                // Inicia hot reload apenas em desenvolvimento (sem logs)
+                // Inicia hot reload apenas em desenvolvimento (com suporte ao main)
                 hotReloadManager = new HotReloadManager(dir);
                 await hotReloadManager.start();
 
-                // Adiciona callback para recarregar rotas de backend quando mudarem
+                // Adiciona callback para recarregar TUDO quando qualquer arquivo mudar
                 hotReloadManager.onBackendApiChange(() => {
+                    Console.info('🔄 Recarregando backend e dependências...');
+
                     loadBackendRoutes(userBackendRoutesDir);
+                    processWebSocketRoutes(); // Processa rotas WS após recarregar backend
                 });
 
                 // Adiciona callback para regenerar entry file quando frontend mudar
                 hotReloadManager.onFrontendChange(() => {
+                    Console.info('🔄 Regenerando frontend...');
                     regenerateEntryFile();
                 });
             }
@@ -231,13 +253,16 @@ export default function hweb(options: HightJSOptions) {
             frontendRoutes = loadRoutes(userWebRoutesDir);
             loadBackendRoutes(userBackendRoutesDir);
 
-           // Carrega layout.tsx ANTES de criar o entry file
+            // Processa rotas WebSocket após carregar backend
+            processWebSocketRoutes();
+
+            // Carrega layout.tsx ANTES de criar o entry file
             const layout = loadLayout(userWebDir);
 
-           const notFound = loadNotFound(userWebDir);
+            const notFound = loadNotFound(userWebDir);
 
             const outDir = path.join(dir, 'hweb-dist');
-            fs.mkdirSync(outDir, { recursive: true });
+            fs.mkdirSync(outDir, {recursive: true});
 
             entryPoint = createEntryFile(dir, frontendRoutes);
 
@@ -278,6 +303,15 @@ export default function hweb(options: HightJSOptions) {
                 const instrumentationPath = path.join(dir, 'src', instrumentationFile);
                 // dar require, e executar a função principal do arquivo
                 const instrumentation = require(instrumentationPath);
+
+                // Registra o listener de hot reload se existir
+                if (instrumentation.hotReloadListener && typeof instrumentation.hotReloadListener === 'function') {
+                    if (hotReloadManager) {
+                        hotReloadManager.setHotReloadListener(instrumentation.hotReloadListener);
+                        Console.info('✅ Hot reload listener registrado');
+                    }
+                }
+
                 if (typeof instrumentation === 'function') {
                     instrumentation();
                 } else if (typeof instrumentation.default === 'function') {
@@ -298,7 +332,7 @@ export default function hweb(options: HightJSOptions) {
                 (genericReq as any).hwebDev = dev;
                 (genericReq as any).hotReloadManager = hotReloadManager;
 
-                const { pathname } = new URL(genericReq.url, `http://${genericReq.headers.host || 'localhost'}`);
+                const {pathname} = new URL(genericReq.url, `http://${genericReq.headers.host || 'localhost'}`);
                 const method = genericReq.method.toUpperCase();
 
                 // 1. Verifica se é WebSocket upgrade para hot reload
@@ -456,43 +490,18 @@ export default function hweb(options: HightJSOptions) {
 
         // Método para configurar WebSocket upgrade nos servidores Express e Fastify
         setupWebSocket: (server: any) => {
-            if (hotReloadManager) {
-                // Detecta se é um servidor Express ou Fastify
-                const isExpressServer = FrameworkAdapterFactory.getCurrentAdapter() instanceof ExpressAdapter;
-
-
-                if (isExpressServer) {
-
-                    server.on('upgrade', (request: any, socket: any, head: Buffer) => {
-                        const { pathname } = new URL(request.url, `http://${request.headers.host}`);
+            // Detecta se é um servidor Express ou Fastify
+            const isExpressServer = FrameworkAdapterFactory.getCurrentAdapter() instanceof ExpressAdapter;
+            const actualServer = isExpressServer ? server : (server.server || server);
 
-                        if (pathname === '/hweb-hotreload/') {
-                            hotReloadManager!.handleUpgrade(request, socket, head);
-                        } else {
-                            socket.destroy();
-                        }
-                    });
-                } else {
-
-                    // Fastify usa um approach diferente para WebSockets
-                    const actualServer = server.server || server;
-                    actualServer.on('upgrade', (request: any, socket: any, head: Buffer) => {
-                        const { pathname } = new URL(request.url, `http://${request.headers.host}`);
-
-                        if (pathname === '/hweb-hotreload/') {
-                            hotReloadManager!.handleUpgrade(request, socket, head);
-                        } else {
-                            socket.destroy();
-                        }
-                    });
-                }
-            }
+            // Usa o sistema coordenado de WebSocket upgrade que integra hot-reload e rotas de usuário
+            setupWebSocketUpgrade(actualServer, hotReloadManager);
         },
 
         build: async () => {
             const msg = Console.dynamicLine(`  ${Colors.FgYellow}●  ${Colors.Reset}Iniciando build do cliente para produção`);
             const outDir = path.join(dir, 'hweb-dist');
-            fs.mkdirSync(outDir, { recursive: true });
+            fs.mkdirSync(outDir, {recursive: true});
 
             const routes = loadRoutes(userWebRoutesDir);
             const entryPoint = createEntryFile(dir, routes);
@@ -509,6 +518,4 @@ export default function hweb(options: HightJSOptions) {
             }
         }
     };
-
-    return app;
 }

package/src/renderer.tsx

@@ -15,7 +15,7 @@ function encodeInitialData(data: any): string {
 
 function createDecodeScript(): string {
     return `
-    const process = { env: { NODE_ENV: '${process.env.NODE_ENV || 'development'}' } };
+    
     window.__HWEB_DECODE__ = function(encoded) { const base64 = encoded.replace('hweb_', '').replace('_config', ''); const jsonStr = atob(base64); return JSON.parse(jsonStr); };
     `;
 }

package/src/router.ts

@@ -1,7 +1,12 @@
 import fs from 'fs';
 import path from 'path';
-import { RouteConfig, BackendRouteConfig, HightMiddleware } from './types';
+import { RouteConfig, BackendRouteConfig, HightMiddleware, WebSocketHandler, WebSocketContext } from './types';
+import { WebSocketServer as WSServer, WebSocket } from 'ws';
+import { IncomingMessage } from 'http';
+import { URL } from 'url';
 import Console from "./api/console"
+import {FrameworkAdapterFactory} from "./adapters/factory";
+import {HightJSRequest} from "./api/http";
 
 // --- Roteamento do Frontend ---
 
@@ -198,8 +203,19 @@ export function findMatchingRoute(pathname: string) {
     for (const route of allRoutes) {
         if (!route.pattern) continue;
 
-        // Converte o padrão da rota (ex: /users/[id]) em uma RegExp
-        const regexPattern = route.pattern.replace(/\[(\w+)\]/g, '(?<$1>[^/]+)');
+        const regexPattern = route.pattern
+            // [[...param]] → opcional catch-all
+            .replace(/\[\[\.\.\.(\w+)\]\]/g, '(?<$1>.+)?')
+            // [...param] → obrigatório catch-all
+            .replace(/\[\.\.\.(\w+)\]/g, '(?<$1>.+)')
+            // /[[param]] → opcional com barra também opcional
+            .replace(/\/\[\[(\w+)\]\]/g, '(?:/(?<$1>[^/]+))?')
+            // [[param]] → segmento opcional (sem barra anterior)
+            .replace(/\[\[(\w+)\]\]/g, '(?<$1>[^/]+)?')
+            // [param] → segmento obrigatório
+            .replace(/\[(\w+)\]/g, '(?<$1>[^/]+)');
+
+        // permite / opcional no final
         const regex = new RegExp(`^${regexPattern}/?$`);
         const match = pathname.match(regex);
 
@@ -210,9 +226,11 @@ export function findMatchingRoute(pathname: string) {
             };
         }
     }
+
     return null;
 }
 
+
 // --- Roteamento do Backend ---
 
 // Guarda todas as rotas de API encontradas
@@ -406,3 +424,212 @@ export function loadNotFound(webDir: string): { componentPath: string } | null {
 export function getNotFound(): { componentPath: string } | null {
     return notFoundComponent;
 }
+
+// --- WebSocket Functions ---
+
+// Guarda todas as rotas WebSocket encontradas
+let allWebSocketRoutes: { pattern: string; handler: WebSocketHandler; middleware?: HightMiddleware[] }[] = [];
+
+// Conexões WebSocket ativas
+let wsConnections: Set<WebSocket> = new Set();
+
+/**
+ * Processa e registra rotas WebSocket encontradas nas rotas backend
+ */
+export function processWebSocketRoutes() {
+    allWebSocketRoutes = [];
+
+    for (const route of allBackendRoutes) {
+        if (route.WS) {
+            const wsRoute = {
+                pattern: route.pattern,
+                handler: route.WS,
+                middleware: route.middleware
+            };
+
+            allWebSocketRoutes.push(wsRoute);
+            Console.info(`WebSocket route registered: ${route.pattern}`);
+        }
+    }
+}
+
+/**
+ * Encontra a rota WebSocket correspondente para uma URL
+ */
+export function findMatchingWebSocketRoute(pathname: string) {
+    for (const route of allWebSocketRoutes) {
+        if (!route.pattern) continue;
+
+        const regexPattern = route.pattern
+            .replace(/\[\[\.\.\.(\w+)\]\]/g, '(?<$1>.+)?')
+            .replace(/\[\.\.\.(\w+)\]/g, '(?<$1>.+)')
+            .replace(/\[\[(\w+)\]\]/g, '(?<$1>[^/]+)?')
+            .replace(/\[(\w+)\]/g, '(?<$1>[^/]+)');
+
+        const regex = new RegExp(`^${regexPattern}/?$`);
+        const match = pathname.match(regex);
+
+        if (match) {
+            return {
+                route,
+                params: match.groups || {}
+            };
+        }
+    }
+    return null;
+}
+
+/**
+ * Trata uma nova conexão WebSocket
+ */
+function handleWebSocketConnection(ws: WebSocket, req: IncomingMessage, hwebReq: HightJSRequest) {
+    if (!req.url) return;
+
+    const url = new URL(req.url, `http://${req.headers.host}`);
+    const pathname = url.pathname;
+
+    const matchedRoute = findMatchingWebSocketRoute(pathname);
+    if (!matchedRoute) {
+        ws.close(1000, 'Rota não encontrada');
+        return;
+    }
+
+    const params = extractWebSocketParams(pathname, matchedRoute.route.pattern);
+    const query = Object.fromEntries(url.searchParams.entries());
+
+    const context: WebSocketContext = {
+        hightReq: hwebReq,
+        ws,
+        req,
+        url,
+        params,
+        query,
+        send: (data: any) => {
+            if (ws.readyState === WebSocket.OPEN) {
+                const message = typeof data === 'string' ? data : JSON.stringify(data);
+                ws.send(message);
+            }
+        },
+        close: (code?: number, reason?: string) => {
+            ws.close(code || 1000, reason);
+        },
+        broadcast: (data: any, exclude?: WebSocket[]) => {
+            const message = typeof data === 'string' ? data : JSON.stringify(data);
+            const excludeSet = new Set(exclude || []);
+            wsConnections.forEach(connection => {
+                if (connection.readyState === WebSocket.OPEN && !excludeSet.has(connection)) {
+                    connection.send(message);
+                }
+            });
+        }
+    };
+
+    try {
+        matchedRoute.route.handler(context);
+    } catch (error) {
+        console.error('Erro no handler WebSocket:', error);
+        ws.close(1011, 'Erro interno do servidor');
+    }
+}
+
+/**
+ * Extrai parâmetros da URL para WebSocket
+ */
+function extractWebSocketParams(pathname: string, pattern: string): Record<string, string> {
+    const params: Record<string, string> = {};
+
+    const regexPattern = pattern
+        .replace(/\[\[\.\.\.(\w+)\]\]/g, '(?<$1>.+)?')
+        .replace(/\[\.\.\.(\w+)\]/g, '(?<$1>.+)')
+        .replace(/\[\[(\w+)\]\]/g, '(?<$1>[^/]+)?')
+        .replace(/\[(\w+)\]/g, '(?<$1>[^/]+)');
+
+    const regex = new RegExp(`^${regexPattern}/?$`);
+    const match = pathname.match(regex);
+
+    if (match && match.groups) {
+        Object.assign(params, match.groups);
+    }
+
+    return params;
+}
+
+/**
+ * Configura WebSocket upgrade no servidor HTTP existente
+ * @param server Servidor HTTP (Express, Fastify ou Native)
+ * @param hotReloadManager Instância do gerenciador de hot-reload para coordenação
+ */
+export function setupWebSocketUpgrade(server: any, hotReloadManager?: any) {
+    // NÃO remove listeners existentes para preservar hot-reload
+    // Em vez disso, coordena com o sistema existente
+
+    // Verifica se já existe um listener de upgrade
+    const existingListeners = server.listeners('upgrade');
+
+    // Se não há listeners, ou se o hot-reload ainda não foi configurado, adiciona o nosso
+    if (existingListeners.length === 0) {
+        server.on('upgrade', (request: any, socket: any, head: Buffer) => {
+            handleWebSocketUpgrade(request, socket, head, hotReloadManager);
+        });
+    } else {
+        // Se já existe um listener (provavelmente do hot-reload),
+        // vamos interceptar e coordenar
+        console.log('🔧 Coordenando WebSocket upgrade com sistema existente');
+    }
+}
+
+function handleWebSocketUpgrade(request: any, socket: any, head: Buffer, hotReloadManager?: any) {
+    const adapter = FrameworkAdapterFactory.getCurrentAdapter()
+    if (!adapter) {
+        console.error('❌ Framework adapter não detectado. Não é possível processar upgrade WebSocket.');
+        socket.destroy();
+        return;
+    }
+    const genericReq = adapter.parseRequest(request);
+    const hwebReq = new HightJSRequest(genericReq);
+    const { pathname } = new URL(request.url, `http://${request.headers.host}`);
+
+    // Prioridade 1: Hot reload (sistema interno)
+    if (pathname === '/hweb-hotreload/') {
+        if (hotReloadManager) {
+            hotReloadManager.handleUpgrade(request, socket, head);
+        } else {
+            socket.destroy();
+        }
+        return;
+    }
+
+    // Prioridade 2: Rotas WebSocket do usuário
+    const matchedRoute = findMatchingWebSocketRoute(pathname);
+    if (matchedRoute) {
+        // Faz upgrade para WebSocket usando noServer
+        const wss = new WSServer({
+            noServer: true,
+            perMessageDeflate: false, // Melhor performance
+            maxPayload: 1024 * 1024 // Limite de 1MB
+        });
+
+        wss.handleUpgrade(request, socket, head, (ws) => {
+            wsConnections.add(ws);
+            console.log(`✅ WebSocket conectado em ${pathname}`);
+
+            ws.on('close', () => {
+                wsConnections.delete(ws);
+                console.log(`❌ WebSocket desconectado de ${pathname}`);
+            });
+
+            ws.on('error', (error) => {
+                console.error(`💥 Erro WebSocket em ${pathname}:`, error);
+                wsConnections.delete(ws);
+            });
+
+            // Processa a conexão
+            handleWebSocketConnection(ws, request, hwebReq);
+        });
+        return;
+    }
+
+    // Nenhuma rota encontrada - rejeita conexão
+    console.log(`🚫 Nenhuma rota WebSocket encontrada para: ${pathname}`);
+    socket.destroy();
+}

package/src/types.ts

@@ -1,6 +1,21 @@
 import type { ComponentType } from 'react';
 import type { GenericRequest } from './types/framework';
 import {HightJSRequest, HightJSResponse} from "./api/http";
+import { WebSocket } from 'ws';
+import { IncomingMessage } from 'http';
+
+// Interface do contexto WebSocket simplificada
+export interface WebSocketContext {
+    ws: WebSocket;
+    req: IncomingMessage;
+    hightReq: HightJSRequest;
+    url: URL;
+    params: Record<string, string>;
+    query: Record<string, string>;
+    send: (data: any) => void;
+    close: (code?: number, reason?: string) => void;
+    broadcast: (data: any, exclude?: WebSocket[]) => void;
+}
 
 // --- Tipos do Frontend (sem alteração) ---
 export interface HightJSOptions {
@@ -42,7 +57,14 @@ export type HightMiddleware = (
 
 
 /**
- * Define a estrutura de cada rota da API, com suporte para métodos HTTP.
+ * Define o formato de uma função que manipula uma rota WebSocket.
+ */
+export type WebSocketHandler = (
+    context: WebSocketContext
+) => Promise<void> | void;
+
+/**
+ * Define a estrutura de cada rota da API, com suporte para métodos HTTP e WebSocket.
  */
 export interface BackendRouteConfig {
     pattern: string;
@@ -50,5 +72,6 @@ export interface BackendRouteConfig {
     POST?: BackendHandler;
     PUT?: BackendHandler;
     DELETE?: BackendHandler;
+    WS?: WebSocketHandler; // Suporte para WebSocket
     middleware?: HightMiddleware[]; // Permite adicionar middlewares específicos à rota
 }

package/dist/adapters/starters/express.js

@@ -1 +0,0 @@
-"use strict";

package/dist/adapters/starters/factory.js

@@ -1 +0,0 @@
-"use strict";

package/dist/adapters/starters/fastify.js

@@ -1 +0,0 @@
-"use strict";

package/dist/adapters/starters/index.js

@@ -1 +0,0 @@
-"use strict";

package/dist/adapters/starters/native.js

@@ -1 +0,0 @@
-"use strict";

package/dist/auth/example.d.ts

@@ -1,40 +0,0 @@
-/**
- * Exemplo de como usar os novos providers baseados em classes
- */
-export declare const authRoutes: {
-    pattern: string;
-    GET(req: import("..").HightJSRequest, params: {
-        [key: string]: string;
-    }): Promise<any>;
-    POST(req: import("..").HightJSRequest, params: {
-        [key: string]: string;
-    }): Promise<any>;
-    auth: import("./core").HWebAuth;
-};
-/**
- * Como usar em suas rotas API:
- *
- * // arquivo: /api/auth/[...value].ts
- * import { authRoutes } from '../../../src/auth/example';
- *
- * export const GET = authRoutes.GET;
- * export const POST = authRoutes.POST;
- */
-/**
- * Rotas disponíveis automaticamente:
- *
- * Core routes:
- * - GET  /api/auth/session - Obter sessão atual
- * - GET  /api/auth/providers - Listar providers
- * - GET  /api/auth/csrf - Obter token CSRF
- * - POST /api/auth/signin - Login
- * - POST /api/auth/signout - Logout
- *
- * Provider específico (CredentialsProvider):
- * - GET  /api/auth/credentials/config - Config do provider
- *
- * Provider específico (DiscordProvider):
- * - GET  /api/auth/signin/discord - Iniciar OAuth Discord
- * - GET  /api/auth/callback/discord - Callback OAuth Discord
- * - GET  /api/auth/discord/config - Config do provider Discord
- */

package/dist/auth/example.js

@@ -1,104 +0,0 @@
-"use strict";
-/**
- * Exemplo de como usar os novos providers baseados em classes
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.authRoutes = void 0;
-const routes_1 = require("./routes");
-const providers_1 = require("./providers");
-// Exemplo de configuração com os novos providers
-const authConfig = {
-    providers: [
-        // Provider de credenciais customizado
-        new providers_1.CredentialsProvider({
-            name: "Login com Email",
-            credentials: {
-                email: {
-                    label: "Email",
-                    type: "email",
-                    placeholder: "seu@email.com"
-                },
-                password: {
-                    label: "Senha",
-                    type: "password"
-                }
-            },
-            async authorize(credentials) {
-                // Aqui você faz a validação com seu banco de dados
-                const { email, password } = credentials;
-                // Exemplo de validação (substitua pela sua lógica)
-                if (email === "admin@example.com" && password === "123456") {
-                    return {
-                        id: "1",
-                        name: "Admin User",
-                        email: email,
-                        role: "admin"
-                    };
-                }
-                // Retorna null se credenciais inválidas
-                return null;
-            }
-        }),
-        // Provider do Discord
-        new providers_1.DiscordProvider({
-            clientId: process.env.DISCORD_CLIENT_ID,
-            clientSecret: process.env.DISCORD_CLIENT_SECRET,
-            callbackUrl: "http://localhost:3000/api/auth/callback/discord"
-        })
-    ],
-    secret: process.env.HWEB_AUTH_SECRET || "seu-super-secret-aqui-32-chars-min",
-    session: {
-        strategy: 'jwt',
-        maxAge: 86400 // 24 horas
-    },
-    pages: {
-        signIn: '/auth/signin',
-        signOut: '/auth/signout'
-    },
-    callbacks: {
-        async signIn(user, account, profile) {
-            // Lógica customizada antes do login
-            console.log(`Usuário ${user.email} fazendo login via ${account.provider}`);
-            return true; // permitir login
-        },
-        async session(session, user) {
-            // Adicionar dados customizados à sessão
-            return {
-                ...session,
-                user: {
-                    ...session.user,
-                    customData: "dados extras"
-                }
-            };
-        }
-    }
-};
-// Criar as rotas de autenticação
-exports.authRoutes = (0, routes_1.createAuthRoutes)(authConfig);
-/**
- * Como usar em suas rotas API:
- *
- * // arquivo: /api/auth/[...value].ts
- * import { authRoutes } from '../../../src/auth/example';
- *
- * export const GET = authRoutes.GET;
- * export const POST = authRoutes.POST;
- */
-/**
- * Rotas disponíveis automaticamente:
- *
- * Core routes:
- * - GET  /api/auth/session - Obter sessão atual
- * - GET  /api/auth/providers - Listar providers
- * - GET  /api/auth/csrf - Obter token CSRF
- * - POST /api/auth/signin - Login
- * - POST /api/auth/signout - Logout
- *
- * Provider específico (CredentialsProvider):
- * - GET  /api/auth/credentials/config - Config do provider
- *
- * Provider específico (DiscordProvider):
- * - GET  /api/auth/signin/discord - Iniciar OAuth Discord
- * - GET  /api/auth/callback/discord - Callback OAuth Discord
- * - GET  /api/auth/discord/config - Config do provider Discord
- */