TotalApp Docs
Ctrl K
Home
EN | TR
Go to App

Developer Tools

Full engineering toolkit — visual workflow editor, AI terminals, graph analytics, and security auditing.

What's Included

TotalApp's Developer Tools mode contains 8 specialised screens built for engineers and power users. Each screen is purpose-built for a specific engineering workflow — from visual automation design to live security auditing. Activate Developer Tools mode from the mode switcher in the top header.

Built for Engineers and Power Users

All developer screens are designed for technical users. They expose raw data, command-line interfaces, and AI-assisted code analysis that would overwhelm a typical business user. If you're building automations, debugging code, or auditing security, these are your primary tools.

Feature Grid

Workflow Editor

Visual node-based automation builder. Drag nodes from the palette, connect them with edges, and run data pipelines end-to-end. Supports AI content generation, file output, email sending, and custom JS scripting.

Dev Hub Terminal

AI-assisted developer terminal with structured block output. Run git commands, query GitHub/GitLab/Bitbucket, and invoke AI analysis on your code — all in one multi-block session.

Security Hub

Automated security auditing with AI-powered vulnerability analysis. Scan dependencies, check for secrets in code, audit permissions, and generate a full security report with severity-ranked findings.

Graph View

Data visualisation terminal for charts, git stats, and BERT NLP analysis. Render bar, line, pie, and scatter charts from commands. Visualise commit history and authorship patterns.

Terminal Editor

The superset terminal with 75+ commands. Supports all block types (Text, Run, Select, Diff, Pipe), persistent session history, chart rendering, and the full Claude AI command set.

Database Manager

Visual browser for TotalApp's server-backed JSON data stores. Inspect all /api/data/* endpoints, view individual records, and edit data directly from the browser.

API Playground

Interactive HTTP request builder for TotalApp's internal API. Select endpoint, edit request body, send, and inspect formatted JSON responses with status codes and timing.

Terminal Architecture

TotalApp has 5 terminal components. Rather than duplicating logic across each, they share a common infrastructure layer located at src/terminal/. Understanding this shared layer helps you predict how commands behave across different terminals.

Shared Infrastructure

  • useTerminalState — Generic state hook that manages blocks, input history, abort controllers, and auto-scroll for every terminal. Each terminal passes its own block union type.
  • BlockViews — Shared rendering components for all block types. Accepts a compact prop for tighter display in Dev Hub and Security Hub.
  • useGitHubCommands — Pure async data-fetcher functions for GitHub, GitLab, and Bitbucket commands. Returns Promise<{ output: string; count: number }> — terminals handle their own block state.
  • useClaudeCommands — Exports callClaude, fetchBrainstorm, fetchSummarize, and fetchAskDoc. Each returns structured output that terminals render into the appropriate block type.

Block Types

Not Every Block Appears in Every Terminal

Each terminal uses only the block types relevant to its purpose. For example, DiffBlock (before/after code) only appears in Dev Hub. SelectBlock (interactive multi-option) only appears in Terminal Editor and Security Hub. This keeps each terminal's UI focused.

  • TextBlock — Plain text output, optionally with an embedded ChartView. Used in Terminal Editor, Dev Hub, Security Hub, and Canvas Terminal.
  • RunBlock — Multi-step progress block. Each step transitions: pending → running → done/error. Used in Terminal Editor, Dev Hub, and Security Hub.
  • SelectBlock — Interactive choice prompt. Used in Terminal Editor and Security Hub for scoped audit flows.
  • DiffBlock — Side-by-side before/after code diff. Used exclusively in Dev Hub for refactor and analysis results.
  • PipeBlock — Pipeline stage tracker. Used in Terminal Editor, Dev Hub, and Security Hub for chained command sequences.

AI Integration

Three terminals have built-in AI capabilities powered by Claude (via Anthropic API, Claude CLI, or Cohere depending on your Writer Engine setting):

  • Dev Hub Terminal — AI code analysis (analyze-performance, explain-function, refactor-file). Results render as DiffBlock with before/after code.
  • Security Hub — AI vulnerability explanations and remediation suggestions. Each finding is annotated with severity, exploitability, and suggested fix.
  • Terminal Editor — Full Claude command set (claude ask, brainstorm, summarize, ask-doc). Responses streamed into TextBlock.

The Writer Engine setting (Settings → Terminal) controls which AI backend is used: API (Anthropic/Cohere), Local CLI (claude --print), or Local LLM (BERT for classification only — text generation not supported).

Getting Started

  1. Activate Developer Tools mode — click the mode switcher in the top header and select Developer mode.
  2. Build a workflow — open Workflow Editor, drag a Text Input node and a Blog node from the palette, connect them, and click Run to generate your first AI-powered content pipeline.
  3. Explore your git history — open Dev Hub Terminal and type git log --oneline to see a structured RunBlock of recent commits.
  4. Run a security audit — open Security Hub and type security-analysis . to scan your project root. The AI will annotate each finding with severity and remediation steps.
  5. Visualise data — open Graph View and type git-stats commits-by-author to render an interactive bar chart of commit activity.