Header Bar
Overview
The Terminal Header Bar sits at the bottom of the workspace and provides controls for managing your project's runtime, switching between the terminal and agentic agents, and accessing project settings.
Controls
Generated Media
Opens the Generated Media panel where all AI-generated images and videos are collected.
Code
Switches to the Agentic Agents section, bringing up your AI agent tabs and chat interface.
Terminal
Shows the terminal console. Click the dropdown arrow to switch between multiple terminal instances.
Start / Stop
Start the project dev server or stop a running process. The button changes based on the current execution state.
Project Settings
Open the project settings modal via the gear icon to configure project type, start command, web app port, and more.
Terminal Console
Overview
The Terminal Console is a full terminal emulator embedded in the project workspace. It provides a real terminal experience with ANSI color support, scrollable history, and real-time output streaming — all without leaving Kaiju Hub AI.
Features
Real-Time Output
Command output streams to the terminal in real-time. You can watch build logs, dev server output, and command results as they happen.
ANSI Color Support
Full ANSI escape code support means colored output from tools like Jest, ESLint, and build systems displays correctly with proper formatting.
Scrollable History
Scroll back through terminal output to review previous commands and their results. History is preserved for the duration of the session.
Command Input
Type commands at the bottom of the terminal. Supports standard terminal input with command history navigation using up/down arrow keys.
Auto-Scroll
The terminal automatically scrolls to show new output as it arrives. Manual scrolling pauses auto-scroll so you can review earlier output.
Terminal Theming
The terminal respects your Kaiju Hub AI theme settings, applying matching colors for the background, text, and cursor.
Generated Media
Overview
The Generated Media panel is where all AI-generated images and videos are collected. When you ask an AI agent to generate an image or video, the output appears here automatically. Click the media icon in the terminal header bar to open this panel.
Features
Automatic Collection
Images and videos generated by AI agents are automatically collected and displayed here as they are created.
Thumbnail Grid
Browse generated media as thumbnails in a grid layout for quick scanning.
Full-Size Viewer
Click any thumbnail to open the media in a full-size viewer for detailed inspection.
Media Count
The panel header shows the total number of generated media items for the current project.
Code Button
Overview
The Code button in the terminal header bar switches the view from the terminal to the Agentic Agents section. Clicking it brings up your AI agent tabs and chat interface, allowing you to quickly toggle between running commands in the terminal and working with AI agents.
Project Settings
Overview
The Project Settings modal (gear icon in the terminal header) lets you configure how your project runs. Access it to set the project type, start command, web app port, and browsing preferences.
Settings
Project Type
Override the auto-detected project type if it was incorrectly identified. Choose from options like Tauri, React, Node.js, Python, and more.
Start Command
Select how the project should be started when you click the Start button. Auto Detect chooses the appropriate command based on the project type.
Web App Port
Set the port your web application runs on for preview and debugging. This is used when opening the built-in browser preview.
Use HTTPS
Enable secure HTTPS connections for local development. Useful when testing features that require a secure context.
Private Browsing
Open in incognito/private window when using the browser button. Prevents cached data from interfering with your development preview.