frontend-hamroun 1.2.84 → 1.2.88

package/templates/fullstack-app/src/client.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=client.d.ts.map

package/templates/fullstack-app/src/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["client.js"],"names":[],"mappings":""}

package/templates/fullstack-app/src/components/ClientHome.d.ts

@@ -0,0 +1 @@
+//# sourceMappingURL=ClientHome.d.ts.map

package/templates/fullstack-app/src/components/ClientHome.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClientHome.d.ts","sourceRoot":"","sources":["ClientHome.tsx"],"names":[],"mappings":""}

package/templates/fullstack-app/src/components/ClientHome.js

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

package/templates/fullstack-app/src/components/ErrorBoundary.d.ts

@@ -0,0 +1,7 @@
+interface ErrorBoundaryProps {
+    children: any;
+    fallback?: (error: Error, reset: () => void) => any;
+}
+export declare function ErrorBoundary({ children, fallback }: ErrorBoundaryProps): any;
+export {};
+//# sourceMappingURL=ErrorBoundary.d.ts.map

package/templates/fullstack-app/src/components/ErrorBoundary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["ErrorBoundary.tsx"],"names":[],"mappings":"AAEA,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,GAAG,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,IAAI,KAAK,GAAG,CAAC;CACrD;AAED,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,kBAAkB,OA4BvE"}

package/templates/fullstack-app/src/components/ErrorBoundary.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "frontend-hamroun/jsx-runtime";
+import { useErrorBoundary } from 'frontend-hamroun';
+export function ErrorBoundary({ children, fallback }) {
+    const [error, resetError] = useErrorBoundary();
+    if (error) {
+        if (fallback) {
+            return fallback(error, resetError);
+        }
+        return (_jsxs("div", { className: "error-boundary p-4 border border-red-500 rounded bg-red-50", children: [_jsx("h3", { className: "text-lg font-medium text-red-800 mb-2", children: "Something went wrong" }), _jsx("p", { className: "text-red-600 mb-2", children: error.message }), _jsx("button", { onClick: resetError, className: "px-3 py-1 bg-red-600 text-white rounded hover:bg-red-700", children: "Try again" }), process.env.NODE_ENV !== 'production' && (_jsx("pre", { className: "mt-3 text-xs overflow-auto p-2 bg-gray-100", children: error.stack }))] }));
+    }
+    return children;
+}

package/templates/fullstack-app/src/components/Layout.d.ts

@@ -0,0 +1,7 @@
+interface LayoutProps {
+    children: any;
+    title?: string;
+}
+export default function Layout({ children, title }: LayoutProps): JSX.Element;
+export {};
+//# sourceMappingURL=Layout.d.ts.map

package/templates/fullstack-app/src/components/Layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["Layout.tsx"],"names":[],"mappings":"AAEA,UAAU,WAAW;IACnB,QAAQ,EAAE,GAAG,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,KAA8B,EAAE,EAAE,WAAW,eAkCvF"}

package/templates/fullstack-app/src/components/Layout.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "frontend-hamroun/jsx-runtime";
+export default function Layout({ children, title = 'Frontend Hamroun App' }) {
+    return (_jsxs("div", { className: "min-h-screen flex flex-col bg-gray-50", children: [_jsx("header", { className: "bg-blue-600 text-white", children: _jsxs("div", { className: "container mx-auto px-4 py-4 flex justify-between items-center", children: [_jsx("h1", { className: "text-xl font-bold", children: _jsx("a", { href: "/", className: "hover:text-blue-100", children: title }) }), _jsx("nav", { children: _jsxs("ul", { className: "flex space-x-6", children: [_jsx("li", { children: _jsx("a", { href: "/", className: "hover:text-blue-100", children: "Home" }) }), _jsx("li", { children: _jsx("a", { href: "/about", className: "hover:text-blue-100", children: "About" }) })] }) })] }) }), _jsx("main", { className: "flex-grow container mx-auto px-4 py-8", children: children }), _jsx("footer", { className: "bg-gray-800 text-white", children: _jsx("div", { className: "container mx-auto px-4 py-6", children: _jsxs("p", { className: "text-center text-gray-400", children: ["\u00A9 ", new Date().getFullYear(), " Frontend Hamroun App. All rights reserved."] }) }) })] }));
+}

package/templates/fullstack-app/src/components/StateDemo.d.ts

@@ -0,0 +1,2 @@
+export default function StateDemo(): JSX.Element;
+//# sourceMappingURL=StateDemo.d.ts.map

package/templates/fullstack-app/src/components/StateDemo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StateDemo.d.ts","sourceRoot":"","sources":["StateDemo.tsx"],"names":[],"mappings":"AASA,MAAM,CAAC,OAAO,UAAU,SAAS,gBAqMhC"}

package/templates/fullstack-app/src/components/StateDemo.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "frontend-hamroun/jsx-runtime";
+import { useState, useMemo } from 'frontend-hamroun';
+export default function StateDemo() {
+    // More comprehensive state with history tracking
+    const [state, setState] = useState({
+        count: 0,
+        lastUpdated: null,
+        history: []
+    });
+    // Track UI state separately
+    const [isLoading, setIsLoading] = useState(false);
+    const [showHistory, setShowHistory] = useState(false);
+    // Check for server-side rendering
+    const isSSR = typeof window === 'undefined';
+    // Calculate derived state with useMemo for performance
+    const stats = useMemo(() => {
+        // Ensure we have a valid history array
+        if (isSSR || !state || !state.history || state.history.length === 0) {
+            return { avg: 0, max: 0, min: 0 };
+        }
+        try {
+            const sum = state.history.reduce((a, b) => a + b, 0);
+            return {
+                avg: parseFloat((sum / state.history.length).toFixed(1)),
+                max: Math.max(...state.history),
+                min: Math.min(...state.history)
+            };
+        }
+        catch (error) {
+            console.error('Error calculating stats:', error);
+            return { avg: 0, max: 0, min: 0 };
+        }
+    }, [state?.history]);
+    // Handle increment with history tracking
+    const increment = () => {
+        if (isSSR)
+            return;
+        setIsLoading(true);
+        // Simulate async operation
+        setTimeout(() => {
+            setState(prevState => ({
+                count: prevState.count + 1,
+                lastUpdated: new Date().toLocaleTimeString(),
+                history: [...(prevState.history || []), prevState.count + 1]
+            }));
+            setIsLoading(false);
+        }, 300);
+    };
+    // Handle decrement with bounds checking
+    const decrement = () => {
+        if (isSSR)
+            return;
+        setIsLoading(true);
+        // Simulate async operation
+        setTimeout(() => {
+            setState(prevState => ({
+                count: Math.max(0, prevState.count - 1),
+                lastUpdated: new Date().toLocaleTimeString(),
+                history: prevState.count > 0 ? [...(prevState.history || []), prevState.count - 1] : (prevState.history || [])
+            }));
+            setIsLoading(false);
+        }, 300);
+    };
+    // Reset counter
+    const reset = () => {
+        if (isSSR)
+            return;
+        setState({
+            count: 0,
+            lastUpdated: new Date().toLocaleTimeString(),
+            history: []
+        });
+    };
+    // Toggle history visibility
+    const toggleHistory = () => {
+        if (isSSR)
+            return;
+        setShowHistory(prev => !prev);
+    };
+    // For SSR, return a simpler version of the component
+    if (isSSR) {
+        return (_jsxs("div", { className: "bg-white shadow-lg rounded-lg p-6 mb-8", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-800 mb-4", children: "State Management Demo" }), _jsxs("div", { className: "flex items-center justify-between mb-4", children: [_jsx("button", { className: "px-4 py-2 bg-gray-200 text-gray-800 rounded-lg", children: "-" }), _jsx("span", { className: "text-2xl font-bold mx-4", children: "0" }), _jsx("button", { className: "px-4 py-2 bg-blue-600 text-white rounded-lg", children: "+" })] }), _jsx("p", { className: "text-sm text-gray-500", children: "Interactive counter (client-side only)" })] }));
+    }
+    // Regular client-side render
+    return (_jsxs("div", { className: "bg-white shadow-lg rounded-lg p-6 mb-8", children: [_jsx("h2", { className: "text-xl font-semibold text-gray-800 mb-4", children: "State Management Demo" }), _jsxs("div", { className: "mb-6", children: [_jsxs("div", { className: "flex items-center justify-between mb-4", children: [_jsx("button", { onClick: decrement, className: "px-4 py-2 bg-gray-200 text-gray-800 rounded-lg hover:bg-gray-300 disabled:opacity-50", disabled: state.count === 0 || isLoading, children: isLoading ? '...' : '-' }), _jsx("span", { className: "text-2xl font-bold mx-4", children: state.count }), _jsx("button", { onClick: increment, className: "px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50", disabled: isLoading, children: isLoading ? '...' : '+' })] }), _jsx("button", { onClick: reset, className: "text-sm text-gray-600 hover:text-red-600", disabled: state.count === 0 && (!state.history || state.history.length === 0), children: "Reset Counter" })] }), state.lastUpdated && (_jsx("div", { className: "mb-4", children: _jsxs("p", { className: "text-sm text-gray-500", children: ["Last updated: ", state.lastUpdated] }) })), state.history && state.history.length > 0 && (_jsxs("div", { className: "border-t pt-4 mt-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("h3", { className: "text-md font-medium text-gray-700", children: "Statistics" }), _jsx("button", { onClick: toggleHistory, className: "text-sm text-blue-600 hover:underline", children: showHistory ? 'Hide History' : 'Show History' })] }), _jsxs("div", { className: "grid grid-cols-3 gap-2 mb-3", children: [_jsxs("div", { className: "bg-blue-50 p-2 rounded text-center", children: [_jsx("div", { className: "text-xs text-gray-500", children: "Average" }), _jsx("div", { className: "font-bold", children: stats.avg })] }), _jsxs("div", { className: "bg-green-50 p-2 rounded text-center", children: [_jsx("div", { className: "text-xs text-gray-500", children: "Maximum" }), _jsx("div", { className: "font-bold", children: stats.max })] }), _jsxs("div", { className: "bg-red-50 p-2 rounded text-center", children: [_jsx("div", { className: "text-xs text-gray-500", children: "Minimum" }), _jsx("div", { className: "font-bold", children: stats.min })] })] }), showHistory && (_jsxs("div", { className: "mt-3", children: [_jsxs("h4", { className: "text-sm font-medium text-gray-600 mb-1", children: ["History (", state.history.length, " events)"] }), _jsx("div", { className: "bg-gray-50 p-2 rounded max-h-24 overflow-y-auto text-xs", children: state.history.map((value, index) => (_jsx("span", { className: "inline-block bg-gray-200 rounded px-2 py-1 m-1", children: value }, index))) })] }))] }))] }));
+}

package/templates/fullstack-app/src/components/UserList.d.ts

@@ -0,0 +1,11 @@
+interface User {
+    id: number;
+    name: string;
+    email: string;
+}
+interface UserListProps {
+    users: User[];
+}
+export default function UserList({ users }: UserListProps): JSX.Element;
+export {};
+//# sourceMappingURL=UserList.d.ts.map

package/templates/fullstack-app/src/components/UserList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserList.d.ts","sourceRoot":"","sources":["UserList.tsx"],"names":[],"mappings":"AAEA,UAAU,IAAI;IACZ,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,aAAa;IACrB,KAAK,EAAE,IAAI,EAAE,CAAC;CACf;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,KAAK,EAAE,EAAE,aAAa,eA+BxD"}

package/templates/fullstack-app/src/components/UserList.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "frontend-hamroun/jsx-runtime";
+export default function UserList({ users }) {
+    if (!users || users.length === 0) {
+        return (_jsx("div", { className: "empty-state p-4 text-center bg-gray-50 rounded", children: _jsx("p", { className: "text-gray-500", children: "No users available" }) }));
+    }
+    return (_jsx("div", { className: "user-list", children: _jsx("ul", { className: "divide-y divide-gray-100", children: users.map(user => (_jsx("li", { className: "py-3", children: _jsxs("div", { className: "flex justify-between", children: [_jsxs("div", { children: [_jsx("p", { className: "font-medium text-gray-900", children: user.name }), _jsx("p", { className: "text-sm text-gray-500", children: user.email })] }), _jsx("a", { href: `/users/${user.id}`, className: "text-blue-600 hover:underline text-sm self-center", children: "View Profile" })] }) }, user.id))) }) }));
+}

package/templates/fullstack-app/src/config.d.ts

@@ -0,0 +1,29 @@
+export declare const AppConfig: {
+    title: string;
+    description: string;
+    navigation: {
+        path: string;
+        label: string;
+    }[];
+    api: {
+        baseUrl: string;
+        endpoints: {
+            users: string;
+            posts: string;
+        };
+    };
+    meta: {
+        viewport: string;
+        charset: string;
+        author: string;
+        keywords: string;
+    };
+    theme: {
+        primaryColor: string;
+        backgroundColor: string;
+        textColor: string;
+        fontFamily: string;
+    };
+};
+export default AppConfig;
+//# sourceMappingURL=config.d.ts.map

package/templates/fullstack-app/src/config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["config.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCrB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/templates/fullstack-app/src/config.js

@@ -0,0 +1,36 @@
+// Application configuration
+// Modify this file to customize your application without changing core files
+export const AppConfig = {
+    // App information
+    title: 'Frontend Hamroun App',
+    description: 'A full-stack application built with Frontend Hamroun',
+    // Navigation
+    navigation: [
+        { path: '/', label: 'Home' },
+        { path: '/about', label: 'About' },
+        { path: '/users', label: 'Users' }
+    ],
+    // API endpoints
+    api: {
+        baseUrl: '/api',
+        endpoints: {
+            users: '/users',
+            posts: '/posts'
+        }
+    },
+    // Default meta tags
+    meta: {
+        viewport: 'width=device-width, initial-scale=1.0',
+        charset: 'UTF-8',
+        author: 'Your Name',
+        keywords: 'frontend-hamroun, fullstack, template'
+    },
+    // Style customization
+    theme: {
+        primaryColor: '#0066cc',
+        backgroundColor: '#ffffff',
+        textColor: '#333333',
+        fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif'
+    }
+};
+export default AppConfig;

package/templates/fullstack-app/src/data/api.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Fetch data from the API with caching
+ */
+export declare function fetchApi(endpoint: string, options?: RequestInit & {
+    useCache?: boolean;
+    forceFresh?: boolean;
+}): Promise<any>;
+/**
+ * Clear the API cache
+ */
+export declare function clearApiCache(endpoint?: string): void;
+export declare const UserApi: {
+    getAll(): Promise<{
+        id: number;
+        name: string;
+        email: string;
+    }[]>;
+    getById(id: number | string): Promise<{
+        id: number;
+        name: string;
+        email: string;
+    } | null>;
+    getPosts(authorId?: number | string): Promise<{
+        id: number;
+        title: string;
+        content: string;
+        authorId: number;
+    }[]>;
+};
+export declare const WasmApi: {
+    calculate: (operation: "add" | "multiply", a: number, b: number) => Promise<any>;
+    processJson: (data: any) => Promise<any>;
+};
+export declare const batchApiCalls: <T>(apiFunctions: Array<() => Promise<T>>) => Promise<T[]>;
+//# sourceMappingURL=api.d.ts.map

package/templates/fullstack-app/src/data/api.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["api.ts"],"names":[],"mappings":"AASA;;GAEG;AACH,wBAAsB,QAAQ,CAC5B,QAAQ,EAAE,MAAM,EAChB,OAAO,GAAE,WAAW,GAAG;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;CAChB,GACL,OAAO,CAAC,GAAG,CAAC,CAwCd;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAOrD;AAmBD,eAAO,MAAM,OAAO;;;;;;gBAmBA,MAAM,GAAG,MAAM;;;;;wBAyBP,MAAM,GAAG,MAAM;;;;;;CAyB1C,CAAC;AAGF,eAAO,MAAM,OAAO;2BACK,KAAK,GAAG,UAAU,KAAK,MAAM,KAAK,MAAM;wBAG3C,GAAG;CAKxB,CAAC;AAGF,eAAO,MAAM,aAAa,GAAU,CAAC,gBACrB,KAAK,CAAC,MAAM,OAAO,CAAC,CAAC,CAAC,CAAC,KACpC,OAAO,CAAC,CAAC,EAAE,CA8Bb,CAAC"}

package/templates/fullstack-app/src/data/api.js

@@ -0,0 +1,173 @@
+/**
+ * API utilities for making requests to the backend
+ */
+import { batchUpdates } from 'frontend-hamroun';
+// Cache for API responses
+const apiCache = new Map();
+const CACHE_DURATION = 60000; // 1 minute cache
+/**
+ * Fetch data from the API with caching
+ */
+export async function fetchApi(endpoint, options = {}) {
+    const url = endpoint.startsWith('/') ? `/api${endpoint}` : `/api/${endpoint}`;
+    const { useCache = true, forceFresh = false, ...fetchOptions } = options;
+    // Check cache first if enabled
+    if (useCache && !forceFresh) {
+        const cached = apiCache.get(url);
+        if (cached && Date.now() - cached.timestamp < CACHE_DURATION) {
+            console.log(`[API] Using cached data for: ${url}`);
+            return cached.data;
+        }
+    }
+    try {
+        console.log(`[API] Fetching data from: ${url}`);
+        const response = await fetch(url, {
+            headers: {
+                'Content-Type': 'application/json',
+                'Accept': 'application/json',
+            },
+            ...fetchOptions
+        });
+        if (!response.ok) {
+            throw new Error(`API request failed: ${response.status} ${response.statusText}`);
+        }
+        const data = await response.json();
+        console.log(`[API] Successfully fetched data from: ${url}`);
+        // Cache the response if caching is enabled
+        if (useCache) {
+            apiCache.set(url, { data, timestamp: Date.now() });
+        }
+        return data;
+    }
+    catch (error) {
+        console.error(`[API] Error fetching from ${url}:`, error);
+        throw error;
+    }
+}
+/**
+ * Clear the API cache
+ */
+export function clearApiCache(endpoint) {
+    if (endpoint) {
+        const url = endpoint.startsWith('/') ? `/api${endpoint}` : `/api/${endpoint}`;
+        apiCache.delete(url);
+    }
+    else {
+        apiCache.clear();
+    }
+}
+// Sample data for development
+const sampleUsers = [
+    { id: 1, name: 'User 1', email: 'user1@example.com' },
+    { id: 2, name: 'User 2', email: 'user2@example.com' },
+    { id: 3, name: 'User 3', email: 'user3@example.com' }
+];
+const samplePosts = [
+    { id: 1, title: 'Post 1', content: 'Content for post 1', authorId: 1 },
+    { id: 2, title: 'Post 2', content: 'Content for post 2', authorId: 2 },
+    { id: 3, title: 'Post 3', content: 'Content for post 3', authorId: 1 }
+];
+// Helper to simulate network delay
+const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));
+// User API client
+export const UserApi = {
+    // Get all users
+    async getAll() {
+        try {
+            // In a real app, we'd fetch from API
+            // const response = await fetch('/api/users');
+            // if (!response.ok) throw new Error('Failed to fetch users');
+            // return await response.json();
+            // Simulate API delay
+            await delay(300);
+            return [...sampleUsers]; // Return a copy to avoid mutations
+        }
+        catch (error) {
+            console.error('Error fetching users:', error);
+            return [];
+        }
+    },
+    // Get user by ID
+    async getById(id) {
+        try {
+            // In a real app, we'd fetch from API
+            // const response = await fetch(`/api/users/${id}`);
+            // if (!response.ok) throw new Error('User not found');
+            // return await response.json();
+            // Convert ID to number if it's a string
+            const userId = typeof id === 'string' ? parseInt(id, 10) : id;
+            // Simulate API delay
+            await delay(200);
+            // Find user
+            const user = sampleUsers.find(u => u.id === userId);
+            if (!user)
+                throw new Error('User not found');
+            return { ...user }; // Return a copy to avoid mutations
+        }
+        catch (error) {
+            console.error(`Error fetching user ${id}:`, error);
+            return null;
+        }
+    },
+    // Get posts (all or by author)
+    async getPosts(authorId) {
+        try {
+            // In a real app, we'd fetch from API
+            // const url = authorId ? `/api/posts?authorId=${authorId}` : '/api/posts';
+            // const response = await fetch(url);
+            // if (!response.ok) throw new Error('Failed to fetch posts');
+            // return await response.json();
+            // Convert authorId to number if it's a string
+            const userId = authorId ? (typeof authorId === 'string' ? parseInt(authorId, 10) : authorId) : undefined;
+            // Simulate API delay
+            await delay(400);
+            // Filter posts if authorId is provided
+            const posts = userId
+                ? samplePosts.filter(p => p.authorId === userId)
+                : samplePosts;
+            return [...posts]; // Return a copy to avoid mutations
+        }
+        catch (error) {
+            console.error('Error fetching posts:', error);
+            return [];
+        }
+    }
+};
+// WASM API service
+export const WasmApi = {
+    calculate: (operation, a, b) => fetchApi(`/wasm/calculate?op=${operation}&a=${a}&b=${b}`),
+    processJson: (data) => fetchApi('/wasm/process-json', {
+        method: 'POST',
+        body: JSON.stringify(data),
+        useCache: false
+    })
+};
+// Batch multiple API calls for efficiency
+export const batchApiCalls = async (apiFunctions) => {
+    const results = [];
+    let errors = [];
+    // Execute all API calls in parallel
+    const promises = apiFunctions.map(fn => fn());
+    try {
+        const settledResults = await Promise.allSettled(promises);
+        // Process results
+        batchUpdates(() => {
+            settledResults.forEach(result => {
+                if (result.status === 'fulfilled') {
+                    results.push(result.value);
+                }
+                else {
+                    errors.push(result.reason);
+                }
+            });
+        });
+        if (errors.length) {
+            console.error('[API] Some batch API calls failed:', errors);
+        }
+        return results;
+    }
+    catch (error) {
+        console.error('[API] Batch API calls failed:', error);
+        throw error;
+    }
+};

package/templates/fullstack-app/src/main.d.ts

@@ -0,0 +1,7 @@
+import './styles.css';
+declare global {
+    interface Window {
+        __INITIAL_STATE__?: any;
+    }
+}
+//# sourceMappingURL=main.d.ts.map

package/templates/fullstack-app/src/main.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["main.tsx"],"names":[],"mappings":"AAEA,OAAO,cAAc,CAAC;AAGtB,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,iBAAiB,CAAC,EAAE,GAAG,CAAC;KACzB;CACF"}

package/templates/fullstack-app/src/main.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx, jsxs as _jsxs } from "frontend-hamroun/jsx-runtime";
+import { render, hydrate } from 'frontend-hamroun';
+// Import Tailwind CSS
+import './styles.css';
+// Get initial state from server
+const initialState = window.__INITIAL_STATE__ || {
+    route: window.location.pathname,
+    timestamp: new Date().toISOString(),
+    serverRendered: false,
+    data: {
+        users: null,
+        posts: null
+    }
+};
+console.log('[Client] Initial state:', initialState);
+// Create a mutable variable for hydration state
+let isHydrating = document.getElementById('root')?.innerHTML.trim() !== '';
+// Function to handle navigation
+async function handleRouteChange(path, isPushState = true) {
+    try {
+        console.log(`[Router] Navigating to: ${path}`);
+        // Update URL if needed
+        if (isPushState) {
+            window.history.pushState(null, '', path);
+        }
+        // Dynamically load the page component based on the path
+        const normalizedPath = path === '/' ? 'index' : path.replace(/^\//, '');
+        let Page;
+        try {
+            // Dynamic import for the page component
+            const module = await import(`./pages/${normalizedPath}.tsx`);
+            Page = module.default;
+        }
+        catch (error) {
+            console.warn(`[Router] Could not load page for ${path}, trying index file`);
+            try {
+                // Try loading index file in directory
+                const module = await import(`./pages/${normalizedPath}/index.tsx`);
+                Page = module.default;
+            }
+            catch (innerError) {
+                console.error(`[Router] Failed to load page component for ${path}`);
+                // Try to load 404 page
+                try {
+                    const notFoundModule = await import(`./pages/404.tsx`);
+                    Page = notFoundModule.default;
+                }
+                catch (notFoundError) {
+                    // If all fails, render a simple not found message
+                    const rootElement = document.getElementById('root');
+                    if (rootElement) {
+                        render(_jsxs("div", { style: { padding: '20px', maxWidth: '800px', margin: '0 auto' }, children: [_jsx("h1", { children: "Page Not Found" }), _jsx("p", { children: "The page you requested could not be found." }), _jsx("a", { href: "/", style: { color: '#0066cc' }, children: "Go to Home" })] }), rootElement);
+                    }
+                    return;
+                }
+            }
+        }
+        // Get the current page props
+        let pageProps = initialState.pageProps || {};
+        // If the page defines getServerSideProps, fetch data
+        if (Page.getServerSideProps) {
+            try {
+                const response = await fetch(`/api/__props${path}`);
+                if (response.ok) {
+                    const data = await response.json();
+                    pageProps = data.props || {};
+                }
+            }
+            catch (error) {
+                console.error('[Router] Error fetching page props:', error);
+            }
+        }
+        // Update the state with current route
+        const updatedState = {
+            ...initialState,
+            route: path,
+            pageProps
+        };
+        // Render the page
+        const rootElement = document.getElementById('root');
+        if (!rootElement)
+            return;
+        if (isHydrating && path === initialState.route) {
+            console.log('[Client] Hydrating server-rendered content');
+            hydrate(_jsx(Page, { ...pageProps, initialState: updatedState }), rootElement);
+            isHydrating = false;
+        }
+        else {
+            console.log('[Client] Rendering client-side');
+            render(_jsx(Page, { ...pageProps, initialState: updatedState }), rootElement);
+        }
+    }
+    catch (error) {
+        console.error('[Router] Navigation error:', error);
+    }
+}
+// Handle initial route
+handleRouteChange(window.location.pathname, false);
+// Handle client-side navigation
+document.addEventListener('click', (e) => {
+    let target = e.target;
+    // Find closest anchor element
+    while (target && target.tagName !== 'A') {
+        target = target.parentElement;
+        if (!target)
+            break;
+    }
+    if (target &&
+        target.tagName === 'A' &&
+        target.getAttribute('href') &&
+        target.getAttribute('href')?.startsWith('/') &&
+        !target.getAttribute('href')?.startsWith('//') &&
+        !target.getAttribute('target')) {
+        e.preventDefault();
+        const href = target.getAttribute('href') || '/';
+        handleRouteChange(href);
+    }
+});
+// Handle back/forward navigation
+window.addEventListener('popstate', () => {
+    handleRouteChange(window.location.pathname, false);
+});
+// Set up socket.io for live reload in development
+if (typeof io !== 'undefined') {
+    const socket = io();
+    socket.on('reload', () => {
+        console.log('[Dev] Reloading page due to file changes');
+        window.location.reload();
+    });
+}

package/templates/fullstack-app/src/middleware.d.ts

@@ -0,0 +1,10 @@
+import { Request, Response, NextFunction } from 'express';
+declare global {
+    namespace Express {
+        interface Request {
+            timestamp: string;
+        }
+    }
+}
+export default function middleware(req: Request, res: Response, next?: NextFunction): Promise<void>;
+//# sourceMappingURL=middleware.d.ts.map

package/templates/fullstack-app/src/middleware.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"middleware.d.ts","sourceRoot":"","sources":["middleware.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG1D,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,OAAO,CAAC;QAChB,UAAU,OAAO;YACf,SAAS,EAAE,MAAM,CAAC;SACnB;KACF;CACF;AAGD,wBAA8B,UAAU,CAAC,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,YAAY,iBAcxF"}

package/templates/fullstack-app/src/middleware.js

@@ -0,0 +1,14 @@
+// This middleware will be applied to all routes (API and pages)
+export default async function middleware(req, res, next) {
+    // Add request timestamp
+    req.timestamp = await new Date().toISOString();
+    // Log all requests in development mode
+    if (process.env.NODE_ENV !== 'production') {
+        console.log(`[${req.timestamp}] ${req.method} ${req.url}`);
+    }
+    // Example of response header modification
+    res.setHeader('X-Powered-By', 'Frontend Hamroun');
+    // Continue to next middleware
+    if (next)
+        next();
+}

package/templates/fullstack-app/src/pages/404.d.ts

@@ -0,0 +1,4 @@
+export default function NotFound({ initialState }: {
+    initialState: any;
+}): JSX.Element;
+//# sourceMappingURL=404.d.ts.map

package/templates/fullstack-app/src/pages/404.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"404.d.ts","sourceRoot":"","sources":["404.tsx"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,YAAY,EAAE;;CAAA,eAyBhD"}