fastapi-fullstack 0.1.7__py3-none-any.whl

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/hooks/use-local-chat.ts

@@ -0,0 +1,165 @@
+"use client";
+
+import { useCallback, useState } from "react";
+import { nanoid } from "nanoid";
+import { useWebSocket } from "./use-websocket";
+import { useLocalChatStore } from "@/stores/local-chat-store";
+import type { ChatMessage, ToolCall, WSEvent } from "@/types";
+import { WS_URL } from "@/lib/constants";
+
+export function useLocalChat() {
+  const {
+    currentConversationId,
+    getCurrentMessages,
+    createConversation,
+    addMessage,
+    updateMessage,
+    addToolCall,
+    updateToolCall,
+    clearCurrentMessages,
+  } = useLocalChatStore();
+
+  const messages = getCurrentMessages();
+  const [isProcessing, setIsProcessing] = useState(false);
+  const [currentMessageId, setCurrentMessageId] = useState<string | null>(null);
+
+  const handleWebSocketMessage = useCallback(
+    (event: MessageEvent) => {
+      const wsEvent: WSEvent = JSON.parse(event.data);
+
+      switch (wsEvent.type) {
+        case "model_request_start": {
+          const newMsgId = nanoid();
+          setCurrentMessageId(newMsgId);
+          addMessage({
+            id: newMsgId,
+            role: "assistant",
+            content: "",
+            timestamp: new Date(),
+            isStreaming: true,
+            toolCalls: [],
+          });
+          break;
+        }
+
+        case "text_delta": {
+          if (currentMessageId) {
+            const content = (wsEvent.data as { index: number; content: string })
+              .content;
+            updateMessage(currentMessageId, (msg) => ({
+              ...msg,
+              content: msg.content + content,
+            }));
+          }
+          break;
+        }
+
+        case "tool_call": {
+          if (currentMessageId) {
+            const { tool_name, args, tool_call_id } = wsEvent.data as {
+              tool_name: string;
+              args: Record<string, unknown>;
+              tool_call_id: string;
+            };
+            const toolCall: ToolCall = {
+              id: tool_call_id,
+              name: tool_name,
+              args,
+              status: "running",
+            };
+            addToolCall(currentMessageId, toolCall);
+          }
+          break;
+        }
+
+        case "tool_result": {
+          if (currentMessageId) {
+            const { tool_call_id, content } = wsEvent.data as {
+              tool_call_id: string;
+              content: string;
+            };
+            updateToolCall(currentMessageId, tool_call_id, {
+              result: content,
+              status: "completed",
+            });
+          }
+          break;
+        }
+
+        case "final_result": {
+          if (currentMessageId) {
+            updateMessage(currentMessageId, (msg) => ({
+              ...msg,
+              isStreaming: false,
+            }));
+          }
+          setIsProcessing(false);
+          setCurrentMessageId(null);
+          break;
+        }
+
+        case "error": {
+          if (currentMessageId) {
+            updateMessage(currentMessageId, (msg) => ({
+              ...msg,
+              content: msg.content + "\n\n[Error occurred]",
+              isStreaming: false,
+            }));
+          }
+          setIsProcessing(false);
+          break;
+        }
+
+        case "complete": {
+          setIsProcessing(false);
+          break;
+        }
+      }
+    },
+    [currentMessageId, addMessage, updateMessage, addToolCall, updateToolCall]
+  );
+
+  const wsUrl = `${WS_URL}/api/v1/ws/agent`;
+
+  const { isConnected, connect, disconnect, sendMessage } = useWebSocket({
+    url: wsUrl,
+    onMessage: handleWebSocketMessage,
+  });
+
+  const sendChatMessage = useCallback(
+    (content: string) => {
+      let convId = currentConversationId;
+      if (!convId) {
+        convId = createConversation();
+      }
+
+      const userMessage: ChatMessage = {
+        id: nanoid(),
+        role: "user",
+        content,
+        timestamp: new Date(),
+      };
+      addMessage(userMessage);
+
+      setIsProcessing(true);
+      sendMessage({ message: content });
+    },
+    [addMessage, sendMessage, currentConversationId, createConversation]
+  );
+
+  const startNewChat = useCallback(() => {
+    createConversation();
+  }, [createConversation]);
+
+  return {
+    messages,
+    currentConversationId,
+    isConnected,
+    isProcessing,
+    connect,
+    disconnect,
+    sendMessage: sendChatMessage,
+    clearMessages: clearCurrentMessages,
+    startNewChat,
+  };
+}

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/hooks/use-websocket.ts

@@ -0,0 +1,105 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+
+interface UseWebSocketOptions {
+  url: string;
+  onMessage?: (event: MessageEvent) => void;
+  onOpen?: () => void;
+  onClose?: () => void;
+  onError?: (error: Event) => void;
+  reconnect?: boolean;
+  reconnectInterval?: number;
+  maxReconnectAttempts?: number;
+}
+
+export function useWebSocket({
+  url,
+  onMessage,
+  onOpen,
+  onClose,
+  onError,
+  reconnect = true,
+  reconnectInterval = 3000,
+  maxReconnectAttempts = 5,
+}: UseWebSocketOptions) {
+  const [isConnected, setIsConnected] = useState(false);
+  const wsRef = useRef<WebSocket | null>(null);
+  const reconnectTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const reconnectAttemptsRef = useRef(0);
+
+  // Use refs for callbacks to avoid recreating connect function
+  const onMessageRef = useRef(onMessage);
+  const onOpenRef = useRef(onOpen);
+  const onCloseRef = useRef(onClose);
+  const onErrorRef = useRef(onError);
+
+  // Keep refs updated
+  useEffect(() => {
+    onMessageRef.current = onMessage;
+    onOpenRef.current = onOpen;
+    onCloseRef.current = onClose;
+    onErrorRef.current = onError;
+  }, [onMessage, onOpen, onClose, onError]);
+
+  const connect = useCallback(() => {
+    if (wsRef.current?.readyState === WebSocket.OPEN) return;
+
+    const ws = new WebSocket(url);
+    wsRef.current = ws;
+
+    ws.onopen = () => {
+      setIsConnected(true);
+      reconnectAttemptsRef.current = 0;
+      onOpenRef.current?.();
+    };
+
+    ws.onmessage = (event) => {
+      onMessageRef.current?.(event);
+    };
+
+    ws.onclose = () => {
+      setIsConnected(false);
+      onCloseRef.current?.();
+
+      if (reconnect && reconnectAttemptsRef.current < maxReconnectAttempts) {
+        reconnectTimeoutRef.current = setTimeout(() => {
+          reconnectAttemptsRef.current += 1;
+          connect();
+        }, reconnectInterval);
+      }
+    };
+
+    ws.onerror = (error) => {
+      onErrorRef.current?.(error);
+    };
+  }, [url, reconnect, reconnectInterval, maxReconnectAttempts]);
+
+  const disconnect = useCallback(() => {
+    if (reconnectTimeoutRef.current) {
+      clearTimeout(reconnectTimeoutRef.current);
+    }
+    wsRef.current?.close();
+    wsRef.current = null;
+  }, []);
+
+  const sendMessage = useCallback((data: string | object) => {
+    if (wsRef.current?.readyState === WebSocket.OPEN) {
+      const message = typeof data === "string" ? data : JSON.stringify(data);
+      wsRef.current.send(message);
+    }
+  }, []);
+
+  useEffect(() => {
+    return () => {
+      disconnect();
+    };
+  }, [disconnect]);
+
+  return {
+    isConnected,
+    connect,
+    disconnect,
+    sendMessage,
+  };
+}

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/i18n.ts

@@ -0,0 +1,37 @@
+{%- if cookiecutter.enable_i18n %}
+import { getRequestConfig } from "next-intl/server";
+
+// Supported locales
+export const locales = ["en", "pl"] as const;
+export type Locale = (typeof locales)[number];
+
+export const defaultLocale: Locale = "en";
+
+export default getRequestConfig(async ({ requestLocale }) => {
+  // This typically corresponds to the `[locale]` segment
+  let locale = await requestLocale;
+
+  // Ensure that a valid locale is used
+  if (!locale || !locales.includes(locale as Locale)) {
+    locale = defaultLocale;
+  }
+
+  return {
+    locale,
+    messages: (await import(`../messages/${locale}.json`)).default,
+  };
+});
+
+export function getLocaleLabel(locale: Locale): string {
+  const labels: Record<Locale, string> = {
+    en: "English",
+    pl: "Polski",
+  };
+  return labels[locale];
+}
+{%- else %}
+// i18n is disabled
+export const locales = ["en"] as const;
+export type Locale = (typeof locales)[number];
+export const defaultLocale: Locale = "en";
+{%- endif %}

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/lib/api-client.ts

@@ -0,0 +1,90 @@
+/**
+ * Client-side API client.
+ * All requests go through Next.js API routes (/api/*), never directly to the backend.
+ * This keeps the backend URL hidden from the browser.
+ */
+
+export class ApiError extends Error {
+  constructor(
+    public status: number,
+    public message: string,
+    public data?: unknown
+  ) {
+    super(message);
+    this.name = "ApiError";
+  }
+}
+
+interface RequestOptions extends Omit<RequestInit, "body"> {
+  params?: Record<string, string>;
+  body?: unknown;
+}
+
+class ApiClient {
+  private async request<T>(
+    endpoint: string,
+    options: RequestOptions = {}
+  ): Promise<T> {
+    const { params, body, ...fetchOptions } = options;
+
+    let url = `/api${endpoint}`;
+
+    if (params) {
+      const searchParams = new URLSearchParams(params);
+      url += `?${searchParams.toString()}`;
+    }
+
+    const response = await fetch(url, {
+      ...fetchOptions,
+      headers: {
+        "Content-Type": "application/json",
+        ...fetchOptions.headers,
+      },
+      body: body ? JSON.stringify(body) : undefined,
+    });
+
+    if (!response.ok) {
+      let errorData;
+      try {
+        errorData = await response.json();
+      } catch {
+        errorData = null;
+      }
+      throw new ApiError(
+        response.status,
+        errorData?.detail || errorData?.message || "Request failed",
+        errorData
+      );
+    }
+
+    // Handle empty responses
+    const text = await response.text();
+    if (!text) {
+      return null as T;
+    }
+
+    return JSON.parse(text);
+  }
+
+  get<T>(endpoint: string, options?: RequestOptions) {
+    return this.request<T>(endpoint, { ...options, method: "GET" });
+  }
+
+  post<T>(endpoint: string, body?: unknown, options?: RequestOptions) {
+    return this.request<T>(endpoint, { ...options, method: "POST", body });
+  }
+
+  put<T>(endpoint: string, body?: unknown, options?: RequestOptions) {
+    return this.request<T>(endpoint, { ...options, method: "PUT", body });
+  }
+
+  patch<T>(endpoint: string, body?: unknown, options?: RequestOptions) {
+    return this.request<T>(endpoint, { ...options, method: "PATCH", body });
+  }
+
+  delete<T>(endpoint: string, options?: RequestOptions) {
+    return this.request<T>(endpoint, { ...options, method: "DELETE" });
+  }
+}
+
+export const apiClient = new ApiClient();

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/lib/constants.ts

@@ -0,0 +1,39 @@
+/**
+ * Application constants.
+ */
+
+export const APP_NAME = "{{ cookiecutter.project_name }}";
+export const APP_DESCRIPTION = "{{ cookiecutter.project_description }}";
+
+// API Routes (Next.js internal routes)
+export const API_ROUTES = {
+  // Auth
+  LOGIN: "/auth/login",
+  REGISTER: "/auth/register",
+  LOGOUT: "/auth/logout",
+  REFRESH: "/auth/refresh",
+  ME: "/auth/me",
+
+  // Health
+  HEALTH: "/health",
+
+  // Users
+  USERS: "/users",
+
+  // Chat (AI Agent)
+  CHAT: "/chat",
+} as const;
+
+// Navigation routes
+export const ROUTES = {
+  HOME: "/",
+  LOGIN: "/login",
+  REGISTER: "/register",
+  DASHBOARD: "/dashboard",
+  CHAT: "/chat",
+  PROFILE: "/profile",
+  SETTINGS: "/settings",
+} as const;
+
+// WebSocket URL (for chat - this needs to be direct to backend for WS)
+export const WS_URL = process.env.NEXT_PUBLIC_WS_URL || "ws://localhost:8000";

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/lib/server-api.ts

@@ -0,0 +1,78 @@
+/**
+ * Server-side API client for calling the FastAPI backend.
+ * This module is used by Next.js API routes to proxy requests.
+ * IMPORTANT: This file should only be imported in server-side code (API routes, Server Components).
+ */
+
+const BACKEND_URL = process.env.BACKEND_URL || "http://localhost:8000";
+
+export class BackendApiError extends Error {
+  constructor(
+    public status: number,
+    public statusText: string,
+    public data?: unknown
+  ) {
+    super(`Backend API error: ${status} ${statusText}`);
+    this.name = "BackendApiError";
+  }
+}
+
+interface RequestOptions extends RequestInit {
+  params?: Record<string, string>;
+}
+
+/**
+ * Make a request to the FastAPI backend.
+ * This should only be called from Next.js API routes or Server Components.
+ */
+export async function backendFetch<T>(
+  endpoint: string,
+  options: RequestOptions = {}
+): Promise<T> {
+  const { params, ...fetchOptions } = options;
+
+  let url = `${BACKEND_URL}${endpoint}`;
+
+  if (params) {
+    const searchParams = new URLSearchParams(params);
+    url += `?${searchParams.toString()}`;
+  }
+
+  const response = await fetch(url, {
+    ...fetchOptions,
+    headers: {
+      "Content-Type": "application/json",
+      ...fetchOptions.headers,
+    },
+  });
+
+  if (!response.ok) {
+    let errorData;
+    try {
+      errorData = await response.json();
+    } catch {
+      errorData = null;
+    }
+    throw new BackendApiError(response.status, response.statusText, errorData);
+  }
+
+  // Handle empty responses
+  const text = await response.text();
+  if (!text) {
+    return null as T;
+  }
+
+  return JSON.parse(text);
+}
+
+/**
+ * Forward authorization header from the incoming request to the backend.
+ */
+export function getAuthHeaders(
+  authHeader: string | null
+): Record<string, string> {
+  if (!authHeader) {
+    return {};
+  }
+  return { Authorization: authHeader };
+}

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/lib/utils.test.ts

@@ -0,0 +1,44 @@
+{%- if cookiecutter.use_frontend %}
+import { describe, it, expect } from "vitest";
+import { cn } from "./utils";
+
+describe("cn utility function", () => {
+  it("should merge class names", () => {
+    const result = cn("class1", "class2");
+    expect(result).toBe("class1 class2");
+  });
+
+  it("should handle conditional classes", () => {
+    const result = cn("base", { active: true, disabled: false });
+    expect(result).toContain("base");
+    expect(result).toContain("active");
+    expect(result).not.toContain("disabled");
+  });
+
+  it("should handle undefined and null values", () => {
+    const result = cn("base", undefined, null, "extra");
+    expect(result).toBe("base extra");
+  });
+
+  it("should merge tailwind classes correctly", () => {
+    // tailwind-merge should handle conflicting utilities
+    const result = cn("px-2 py-1", "px-4");
+    expect(result).toContain("px-4");
+    expect(result).toContain("py-1");
+  });
+
+  it("should handle empty input", () => {
+    const result = cn();
+    expect(result).toBe("");
+  });
+
+  it("should handle array of classes", () => {
+    const result = cn(["class1", "class2"]);
+    expect(result).toContain("class1");
+    expect(result).toContain("class2");
+  });
+});
+{%- else %}
+/* Utils tests - frontend not configured */
+export {};
+{%- endif %}

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/lib/utils.ts

@@ -0,0 +1,44 @@
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+/**
+ * Merge Tailwind CSS classes with clsx.
+ * This is the standard utility used by shadcn/ui components.
+ */
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
+
+/**
+ * Format a date to a human-readable string.
+ */
+export function formatDate(date: Date | string): string {
+  const d = typeof date === "string" ? new Date(date) : date;
+  return d.toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+  });
+}
+
+/**
+ * Format a date to include time.
+ */
+export function formatDateTime(date: Date | string): string {
+  const d = typeof date === "string" ? new Date(date) : date;
+  return d.toLocaleString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+  });
+}
+
+/**
+ * Truncate a string to a maximum length.
+ */
+export function truncate(str: string, maxLength: number): string {
+  if (str.length <= maxLength) return str;
+  return str.slice(0, maxLength - 3) + "...";
+}

fastapi_gen/template/{{cookiecutter.project_slug}}/frontend/src/middleware.ts

@@ -0,0 +1,31 @@
+{%- if cookiecutter.enable_i18n %}
+import createMiddleware from "next-intl/middleware";
+import { locales, defaultLocale } from "./i18n";
+
+export default createMiddleware({
+  // A list of all locales that are supported
+  locales,
+
+  // Used when no locale matches
+  defaultLocale,
+
+  // Don't prefix the default locale (e.g., /about instead of /en/about)
+  localePrefix: "as-needed",
+});
+
+export const config = {
+  // Match only internationalized pathnames
+  matcher: [
+    // Match all pathnames except for:
+    // - /api (API routes)
+    // - /_next (Next.js internals)
+    // - /static (inside /public)
+    // - /_vercel (Vercel internals)
+    // - All root files like favicon.ico, robots.txt, etc.
+    "/((?!api|_next|_vercel|static|.*\\..*).*)",
+  ],
+};
+{%- else %}
+// Middleware is disabled when i18n is not enabled
+export {};
+{%- endif %}