INTERFACES / LOCAL WEB UI

A visual desk for the same pipeline.

The dashboard is a consumer of the CLI/SDK architecture. It helps a person inspect findings, configure policy, review operations, fit a pipeline, preview rows, and export code without introducing a separate data-cleaning engine.

localhost only by defaultsession-scoped stateReact + FastAPI

Start locally →

1. Start the local dashboard

Terminalbackend serves built frontend
python -m pip install "datadoc-cli[ui]"
datadoc ui data.csv --port 8000

The command initializes a local session, starts Uvicorn on 127.0.0.1, and opens the browser. The frontend build is served from web/dist when it exists.

Development API base

When running Vite separately, set VITE_DATADOC_API_URL=http://127.0.0.1:8000/api so the browser talks to the backend instead of the Vite port.

2. Use the workspace

01ProfileReview roles, findings, null counts, and cardinality. The loaded file name and shape appear in the header.

02SettingsDeclare target/task/scaling; opt into identifier dropping, deduplication, IQR clipping, cyclical datetime, or rare-category grouping only after review.

03PlanInspect each operation and rationale before fitting.

04FitCreate session-scoped state, then preview the output schema, preview rows, and lineage panel.

05ExportDownload transformed CSV or the executable Python wrapper (python pipeline.py in.csv out.csv).

UI is not a replacement for a deployment split.

For model performance claims, fit on train data and transform validation/test with the saved artifact. The UI’s loaded file is primarily an exploratory local workspace.

3. Command palette and lineage

Press Ctrl+K (or Cmd+K) anywhere in the dashboard to fuzzy-search actions: go to views, build a plan, fit, refresh, download CSV, or load the export. After fitting, the sidebar shows a lineage panel with train provenance (schema fingerprint, row counts, deduplicated rows) and input/output column counts. Full detail is available at GET /api/pipeline/lineage, and drift checks at GET /api/pipeline/drift.

4. Develop the frontend

PowerShellfrom web/
npm ci
$env:VITE_DATADOC_API_URL = "http://127.0.0.1:8000/api"
npm run dev

# production build
npm run build

The entry point is web/src/App.jsx. It uses the backend metadata, profile, plan, fit, preview, lineage, drift, and export endpoints — every number on screen comes from a live API response, never bundled mock data. Keep data behavior in datadoc/core/pipeline.py; keep UI state and presentation in React. Rebuild with npm run build so web/dist matches the source before running datadoc ui.

5. Security and sessions

Concern	DATADOC behavior	Developer responsibility
Network binding	Localhost by default.	Do not expose Uvicorn publicly without an auth/reverse-proxy plan.
CORS	Configured local origins, no wildcard credentials.	Set `DATADOC_UI_ORIGINS` deliberately for development.
State	Session-scoped pipeline/profile/plan objects.	Use a durable job store before multi-user deployment.
AI	Optional; generated code is never executed by the pipeline.	Minimize metadata and validate any advisory plan.

JavaScriptsession header
const SESSION_HEADERS = {
  "X-DATADOC-SESSION": "local",
};
await axios.get("/api/pipeline/preview", {
  headers: SESSION_HEADERS,
});

6. UI error recovery

“Fit a pipeline before preview.”

Click Build plan first if you want to review, then click Fit pipeline before preview, lineage, drift, or code export.

“Unable to connect to the local DATADOC server.”

Start datadoc ui data.csv, verify the port, and set VITE_DATADOC_API_URL when using a separate frontend dev server.