Workspace
The Workspace page is the primary development interface in C3 Code. It is a full-screen environment with no left navigation menu. The workspace contains a header for mode switching and controls, a main content area that changes based on the selected mode, and a resizable AI assistant panel on the right.
Each application can have multiple workspaces. Each workspace runs its own services and its own Git branch, so changes in one workspace do not affect others. Common reasons to create additional workspaces include working on a new feature without disrupting a stable version, experimenting with a significant change, or giving a team member their own isolated environment. You can switch between workspaces from the breadcrumb in the workspace header.
Navigate to an application workspace by going to <cluster_url>/applications/:applicationId/workspaces/:workspaceId.
Workspace header
The workspace header spans the full width of the page and is always visible.
Left section
- Breadcrumb / workspace selector: Displays [Application name] / [Workspace name]. Select the workspace name to open a dropdown that lists all workspaces in this application. Select a workspace from the list to switch to it. The dropdown also includes a Create workspace option.
Mode tabs
The mode tabs control what appears in the main content area. The three modes are:
- Preview: Shows the running application in a live iframe.
- Configure: Opens a C3 Studio app interface with browser-style tabs for visual configuration.
- Code: Opens a browser-based code editor (VS Code).
Right section
- Git status: Shows the current branch name and the number of uncommitted changes. Select to open a popover with a summary of changes and options to commit.
- Deploy button: Opens the Create deployment popover to deploy the current workspace to a Staging or Production environment.
- Share button: Opens the Share Preview modal, which displays a share link and lists current collaborators.
- Settings menu (gear icon): Opens a dropdown with the following actions:
- Workspace settings: Navigates to the workspace settings page.
- Start: Starts the workspace if it is stopped.
- Stop: Stops the workspace.
- Restart: Restarts all workspace services.
- Rename: Opens a modal to rename the workspace.
- Delete: Opens a confirmation modal. Deleting a workspace permanently removes it.
- Switch to dark mode / Switch to light mode: Toggles the theme.
- Logs toggle (wrench icon): Opens or closes the Logs panel in the preview area. When package issues are present, a red dot appears on the icon. Select the icon again to return to the preview.
- AI assistant toggle (sparkles icon): Shows or hides the AI assistant panel. When the panel is hidden, the main content area expands to fill the full width.
Preview mode
Preview mode renders your application in a live iframe, showing the current state of the generated code. Use this mode to test workflows, validate data display, and review the application before deployment.
Controls
- Desktop / Mobile toggle: Switches the preview between desktop and mobile viewport widths to verify responsive layouts.
- Reload: Forces a full reload of the preview iframe. Use this when the preview appears out of sync after the AI finishes making changes or after you edit code directly in Code mode.
Overlay states
When the application cannot be displayed, an overlay appears in place of the iframe. Overlay types include:
- Workspace starting: Displays a progress indicator while the workspace services are initializing. The preview becomes available automatically when the workspace is ready.
- Service connection error: Appears when one or more workspace services are unhealthy. Shows a status summary.
- Build error: Appears when the application code has a compilation or build error. Shows the error message and a Fix with C3 AI Assistant button, which sends the error to the AI assistant panel automatically.
- Runtime error: Appears when the running application throws a behavioral or network error at runtime. Shows the message from the application and a Fix with C3 AI Assistant button. Runtime errors take priority over build errors and package issues in the overlay display.
- Package issues: Appears when required packages are missing or misconfigured. Shows a description of the issue and a Fix with C3 AI Assistant button.
Logs panel
The Logs panel replaces the preview iframe when you open it with the Logs toggle in the workspace header. It displays log entries collected from package issues and runtime errors while the workspace is running.
Each log entry shows:
- Severity: Error, Warning, Info, or Debug, indicated by a color-coded icon.
- Timestamp: The time the entry was recorded.
- Message: The log message.
Controls
- Level filter: A dropdown in the panel header. Select All Logs, Errors, Warnings, Info, or Debug to show only entries of that level.
- Copy Logs: Copies all currently visible log entries to the clipboard as plain text.
- Clear Logs: Removes all currently visible log entries from the panel.
- Close: Closes the panel and returns to the preview.
Fix with AI
Hover over any log entry to reveal the Fix with AI button (sparkles icon). Select it to send that entry to the AI assistant panel as a prompt asking the AI to investigate and fix the issue.
Configure mode
Configure mode provides a browser-style tab interface for accessing configuration and developer tools without leaving C3 Code. Open tabs persist per workspace across sessions, can be reordered by dragging, closed with ×, and added with +.
When no tabs are open, the Get started page appears. Select any option on it to open that tool in a new tab. Available options include:
C3 Studio modules: Visual configuration panels embedded as C3 Studio app iframes. Available modules depend on the application's package configuration. See C3 Studio.
Other developer tools
- Console: A JavaScript console for running C3 API calls against the workspace's application.
- Jupyter Notebooks: A JupyterHub environment for data exploration and scripting.
Code mode
Code mode opens a browser-based code editor (VS Code in the browser) connected to the workspace's file system and Git repository. Use this mode to inspect generated code, make targeted edits, or debug issues that cannot be resolved through prompts or Configure mode.
The editor has full access to the workspace's source code. Changes made in Code mode are reflected in Preview mode after the application rebuilds.
AI assistant panel
The AI assistant panel is the conversational interface on the right side of the workspace. It is visible in all three modes and can be resized by dragging the divider on its left edge.
Use the panel to describe changes, ask questions about your application, or request the AI to diagnose and fix errors. Press Enter to submit a prompt, or Shift+Enter to add a new line.
You can attach files to any prompt. Accepted formats: PDF, DOCX, TXT, MD, XLSX, CSV, PNG, JPG, JPEG. Maximum 20 MB per file and 100 MB per message.
When a file is open in Code mode, its content is automatically included as context when you send a prompt.
The panel maintains chat sessions per workspace. Use New chat to archive the current session and start a fresh conversation. When multiple sessions exist, they appear as tabs at the top of the panel; select a tab to switch between sessions.
Response feedback
Each AI response includes a thumbs-up and thumbs-down button. Use these to rate individual responses.
- Thumbs up: Marks the response as helpful. The icon fills to confirm your rating.
- Thumbs down: Opens the Feedback modal. Select any of the following reasons that apply, optionally add comments in the Additional Feedback field, then select Submit:
- This is harmful/Unsafe
- This isn't true
- This isn't helpful
- This isn't relevant to C3
After submitting, the thumbs-down icon fills to confirm your rating and a confirmation banner appears.
AI model selector
The model selector appears at the bottom of the chat input area and shows the currently active AI model for this workspace. Select it to open a dropdown and switch to a different model. The selection is saved per workspace.
Available models:
- Claude Sonnet 4.6: Faster responses, suited for most application generation and iteration tasks.
- Claude Opus 4.6: More capable for complex reasoning, architectural decisions, and difficult debugging. This is the default model. Responses are slower.
When switching models, the workspace displays a loading indicator until the switch completes. The model you select applies to all subsequent prompts in this workspace until you change it again.
Workspace settings page
The Workspace settings page (/applications/:id/workspaces/:id/settings) provides collaboration management for a specific workspace.
Tabs
- Collaborators: Manages users who have access to this workspace directly.
Collaborators tab
The Collaborators tab works identically to the Collaborators tab on the Application detail page, but scoped to a single workspace rather than the full application. See Applications.
Each row shows the collaborator's name, email, and role (Admin or User). Use the Add collaborator button (+) to grant access to a new user. Use the role dropdown or Remove action on each row to modify or revoke access.
Full-screen preview page
The Full-screen preview page (/applications/:id/workspaces/:id/preview) displays the running application without the workspace header, AI assistant panel, or navigation menu. Use this page to present the application to stakeholders or to test it in a clean, full-viewport context.
There is no editing capability on this page. To return to the workspace, use the browser's back navigation.