EmboFlow/docs/plans/2026-03-30-project-dataset-template-implementation.md

EmboFlow Project Dataset Template Implementation Plan

For Claude: REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.

Goal: Turn the current runtime shell into a project-centric product surface with project switching, project creation, workflow templates, and first-class dataset/storage management.

Architecture: Reuse the existing Mongo runtime store and HTTP API for storage connections, datasets, dataset versions, and workflow templates. Extend the web runtime shell so the active project becomes selectable, project resources reload against the selected project, and workflows can be created from templates or from a blank canvas. Keep Asset as raw input and Dataset as the project data product.

Tech Stack: React, TypeScript, React Flow, Express runtime API, MongoDB, tsx --test, Python unittest, and repo guardrails.

---

Task 1: Add Project Runtime API Client Support

Files:

• Modify: apps/web/src/runtime/api-client.ts

Step 1: Write the failing test

Use the existing runtime integration coverage as the external contract and add a focused web runtime helper test only if a new pure helper is introduced.

Step 2: Implement the minimal API additions

Add:

• listProjects(workspaceId)
• createProject({ workspaceId, name, description, createdBy })

Keep the current request/response style unchanged.

Step 3: Verify

Run:

pnpm --filter web build

Expected: PASS

Step 4: Commit

git add apps/web/src/runtime/api-client.ts
git commit -m ":sparkles: add project runtime api client support"

Task 2: Make The Shell Project-Aware

Files:

• Modify: apps/web/src/runtime/app.tsx
• Modify: apps/web/src/runtime/i18n.tsx
• Modify: apps/web/src/styles.css

Step 1: Write the failing test

Add a focused runtime state or pure helper test if needed for active project resolution.

Step 2: Implement

Add:

• active project state in App
• project list loading after bootstrap
• project selector in the header
• quick create project action
• route-safe project switching behavior
• a Projects nav item and page entry

Step 3: Verify

Run:

pnpm --filter web build

Expected: PASS

Step 4: Commit

git add apps/web/src/runtime/app.tsx apps/web/src/runtime/i18n.tsx apps/web/src/styles.css
git commit -m ":sparkles: add project-aware shell state"

Task 3: Add A Dedicated Projects Page

Files:

• Modify: apps/web/src/runtime/app.tsx
• Modify: apps/web/src/runtime/i18n.tsx

Step 1: Write the failing test

Add a web runtime test or browser validation script target if a helper is introduced.

Step 2: Implement

Create a projects workspace view that:

• lists projects for the current workspace
• marks the active project
• creates a project
• lets the user switch into a project
• shows lightweight resource counts derived from existing APIs

Step 3: Verify

Run:

pnpm --filter web build

Expected: PASS

Step 4: Commit

git add apps/web/src/runtime/app.tsx apps/web/src/runtime/i18n.tsx
git commit -m ":sparkles: add projects workspace"

Task 4: Turn Workflows Landing Into A Template Entry Surface

Files:

• Modify: apps/web/src/runtime/app.tsx
• Modify: apps/web/src/runtime/i18n.tsx

Step 1: Write the failing test

Add a focused browser validation script or pure helper test for template naming if needed.

Step 2: Implement

Update the workflows landing page to:

• load workflow templates for the active workspace/project
• render template cards
• create a workflow from a template
• still support blank workflow creation
• route into the created workflow editor

Step 3: Verify

Run:

pnpm --filter web build

Expected: PASS

Step 4: Commit

git add apps/web/src/runtime/app.tsx apps/web/src/runtime/i18n.tsx
git commit -m ":sparkles: add workflow template entry flow"

Task 5: Add Save-As-Template In The Workflow Editor

Files:

• Modify: apps/web/src/runtime/app.tsx
• Modify: apps/web/src/runtime/i18n.tsx

Step 1: Write the failing test

Add a minimal helper test if a template payload builder is introduced.

Step 2: Implement

Add editor controls to:

• enter template name and description
• save the current draft/version payload as a workflow template
• keep the large canvas and node runtime editing behavior intact

Step 3: Verify

Run:

pnpm --filter web build

Expected: PASS

Step 4: Commit

git add apps/web/src/runtime/app.tsx apps/web/src/runtime/i18n.tsx
git commit -m ":sparkles: add save as template workflow action"

Task 6: Update Docs And Run Full Verification

Files:

• Modify: README.md
• Modify: design/00-overview/emboflow-platform-overview.md
• Modify: design/04-ui-ux/information-architecture-and-key-screens.md
• Modify: docs/plans/2026-03-26-emboflow-v1-foundation-and-mvp.md

Step 1: Update docs

Document:

• project selector and projects workspace
• dataset/storage management as first-class project features
• workflow template entry and save-as-template flow

Step 2: Run verification

Run:

make test
make guardrails
pnpm --filter web build

Expected: PASS

Step 3: Browser validation

Validate locally that:

• the active project can be changed
• a new project can be created
• a workflow can be created from a template
• a blank workflow can still be created
• an edited workflow can be saved as a template

Step 4: Commit

git add README.md design/00-overview/emboflow-platform-overview.md design/04-ui-ux/information-architecture-and-key-screens.md docs/plans/2026-03-26-emboflow-v1-foundation-and-mvp.md docs/plans/2026-03-30-project-dataset-template-design.md docs/plans/2026-03-30-project-dataset-template-implementation.md
git commit -m ":memo: document project dataset and template flow"