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

240 lines
5.8 KiB
Markdown

# 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:
```bash
pnpm --filter web build
```
Expected: PASS
**Step 4: Commit**
```bash
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:
```bash
pnpm --filter web build
```
Expected: PASS
**Step 4: Commit**
```bash
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:
```bash
pnpm --filter web build
```
Expected: PASS
**Step 4: Commit**
```bash
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:
```bash
pnpm --filter web build
```
Expected: PASS
**Step 4: Commit**
```bash
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:
```bash
pnpm --filter web build
```
Expected: PASS
**Step 4: Commit**
```bash
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:
```bash
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**
```bash
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"
```