Construct a complete, production-ready, full-stack autonomou...

Prompt

Construct a complete, production-ready, full-stack autonomous AI workflow automation and task execution platform. The backend must be completely implemented in a single server file, and the entire frontend must be contained in a single index.html file including all subviews, styles, logic, and modals. The implementation must be fully functional, robust, unabridged, and free of placeholders, mocks, stubs, or simulated logic. ### 1. ARCHITECTURAL REQUIREMENTS - Single-File Backend: Implement all REST APIs, dual WebSocket servers, task orchestration logic, database abstractions, authentication routines, and tool execution pipelines in one server file. Use an in-memory datastore with atomic file persistence or SQLite. - Single-File Frontend: Implement the full application in a single index.html file containing all HTML markup, inline CSS styles with design system variables, client routing, state management, and real-time communication logic. - Dual WebSocket Architecture: Implement a Task/Chat Streaming Socket for bidirectional real-time prompts, thought trees, tool execution logs, and token streaming; and a Notification/Event Socket for asynchronous job updates and status alerts. - Autonomous Execution Engine: Implement a multi-step task planner, tool invocation pipeline, code interpreter sandbox interface, file transformation subsystem, and structured output generator. ### 2. BACKEND IMPLEMENTATION SPECIFICATIONS (SINGLE FILE) - Server Setup and Middleware: Initialize the HTTP server, attach both WebSocket servers to distinct endpoints, and configure JSON body parsing with large payload support for file/directory uploads, CORS, security headers, request logging, and JWT authentication middleware. - Data Storage and Schema: - Users: ID, email, display name, avatar URL, referral credits balance, account creation date, and preferences. - Projects: ID, user ID, project title, creation/update timestamps, and associated task session IDs. - Task Sessions: ID, user ID, project ID, category icon identifier (book-learning, archive-folder, document-analysis, brain-reasoning, code-transpile), title, pinned status, timestamps, configuration parameters, and complete message logs. - Session Messages: ID, session ID, sender role (user, agent, system, tool), message content (markdown, LaTeX, formatted code), tool execution metadata (tool name, input arguments, stdout/stderr streams, status, output artifacts), and timestamps. - Plugins and Tools: Tool registry storing ID, name, icon, argument schemas, credentials, and execution handlers (file parser, code interpreter, web searcher, data transformer, desktop automation bridge). - Scheduled Jobs: Job ID, user ID, task blueprint, recurrence schedule, execution logs, active state, and next execution timestamp. - RESTful API Endpoints: - Authentication: User registration, login, token refresh, profile retrieval, settings persistence, and referral balance updates. - Projects API: CRUD operations for creating, reading, updating, reordering, and deleting projects. - Tasks and Sessions API: Endpoints to list paginated/virtualized sessions, create sessions, retrieve complete execution histories, rename sessions, toggle pinned status, assign to projects, and delete sessions. - Tools and Plugins API: Query tool catalogue, register custom tools, toggle tool activation per session, and run health checks. - Scheduled Tasks API: Endpoints to create, view, pause, resume, and remove scheduled recurring automation jobs. - File and Directory Ingestion API: Multipart and JSON endpoints accepting single files or complete recursive directory trees, generating file tree models, extracting text, and attaching artifacts to sessions. - Export API: Package session histories, execution logs, and generated artifacts into downloadable archives. - WebSocket Communication Engine: - Handle client authentication, handshake validation, and heartbeat keep-alive. - Ingest client task payloads containing prompt text, model tier selections, attached files/folders, and active tool flags. - Stream real-time events: reasoning steps, thought log accordions, tool invocation lifecycle states (started, running stdout/stderr, completed, failed), and token streaming. - Support execution interruption frames to terminate running tool and task loops on demand. - Notification Socket: Push background task completion, credit changes, and system broadcasts. - Autonomous Execution Loop: - Analyze prompt intent and construct an execution plan. - Stream reasoning status frames to the client. - Dynamically call registered tools with validated parameters. - Capture stdout/stderr, store intermediate artifacts, and append logs to the session. - Iteratively process steps until the goal is achieved or maximum loop depth is reached, then stream final markdown response. ### 3. FRONTEND IMPLEMENTATION SPECIFICATIONS (INDEX.HTML) - Design System and Theme: - Dark/light theme engine defaulting to high-contrast dark mode using CSS custom properties for surfaces, borders, text hierarchies, brand accents, status colors, and hover states. - Fluid panel transitions, custom slim scrollbars, container queries, and accessibility focus rings. - Collapsible Navigation Sidebar (300px fixed width with responsive off-canvas drawer): - Header: Application brand mark, global search modal trigger, and sidebar collapse/expand toggle. - Action Controls: "New task" button with keyboard shortcut badge (Command+Shift+O / Ctrl+Shift+O), and primary workspace switcher. - Navigation Menu: Links to Plugins, Scheduled Tasks, and Library views. - Projects Section: Sticky header with collapse toggle, project reordering, quick-add button, project items with task counters, and inline "New project" trigger. - Tasks and History Section: Sticky header with collapse toggle, virtualized/scrollable task list with intent-specific category icons, truncated title labels with tooltips, and a contextual three-dot menu (Rename, Move to Project, Pin/Unpin, Export Archive, Delete). Display animated skeleton loading bars during data fetches. - Footer: Referral banner ("Share with a friend - Get credits"), user profile pill with avatar and display name, account menu dropdown, desktop client link/status indicator, and notification center bell button with badge. - Workspace Header: - Mobile menu toggle, session breadcrumb title, model/engine tier dropdown selector with promotional badges, and session settings modal trigger. - Interactive Workspace and Chat Canvas: - Empty / Hero Greeting View: Centered layout with greeting headline ("What can I do for you?"). - Active Task Stream: Message thread with alternating user prompts and agent execution cards. - Reasoning Logs: Collapsible accordion panels showing real-time thought chains, tool invocations, and execution status. - Rich Formatting: Streaming markdown support, tables, math formulas (LaTeX formatting), and styled code blocks with language labels, copy-to-clipboard, and file download actions. - Action Bars: Copy message, regenerate response, branch conversation, and feedback buttons below agent messages. - Multimodal Prompt Console: - Rich Input Area: Multi-line auto-expanding content-editable editor with placeholder ("Ask anything, no credits charged"). Key bindings: Enter to send, Shift+Enter for newline, Escape to clear/dismiss. - Console Controls: Attachment button (+) for file selection, directory upload mode for recursive folder trees, tool/sandbox connector pills (desktop automation, browser sandbox, execution environment), microphone voice recording button with active audio pulse indicator, speech synthesis toggle, and dynamic Send/Stop action button. - Modals and Overlays: - Full-screen drag-and-drop overlay distinguishing single file drops from folder tree ingestions. - Search / Command palette modal for searching tasks, projects, and executing quick actions. - Project management modal for creating, tagging, and organizing projects. - Scheduled task modal for configuring cron schedules, engines, and notification webhooks. - Plugin settings modal for configuring API keys and testing tool health. - Stacked toast notification system for success, info, warning, and error alerts. - Client State Store: - Manage user auth, session lists, active task streams, project hierarchy, token accumulator buffers, active tool timelines, theme selection, and modal/toast state. - Persist tokens, theme settings, and UI preferences in localStorage and cookies. ### 4. FUNCTIONAL WORKFLOWS - New Task Lifecycle: User submits prompt -> client creates optimistic session and sends payload via WebSocket -> backend initializes task loop -> backend streams reasoning and tool logs -> backend executes tools and streams outputs -> backend streams synthesized markdown -> client finalizes UI, updates session title/icon, and re-enables input. - Folder/File Ingestion: User drops directory -> frontend parses file tree, sizes, and MIME types -> payload sent to backend -> backend indexes files into session memory -> agent loop searches, parses, and edits files. - Scheduled Task Execution: Backend timer triggers job -> executes headless reasoning and tool pipeline -> saves session and artifacts -> pushes alert over Notification WebSocket -> frontend increments badge and shows toast. ### 5. IMPLEMENTATION STANDARDS - Single-file backend and single-file index.html frontend. - Production-ready, unabridged code without any placeholders, dummy stubs, or omissions. - Fully wired event handlers, functional API calls, and live WebSocket connectivity across all components.

A system prompt was added to support web rendering