Unclassified

v0 Prompt: IntegrateWise One Access Network — Universal Identity, Connection, Discovery, Capability & Spine

Context Summary

This prompt builds the One Access Network frontend UI surfaces (apps/one-access) — the universal identity, connection, discovery, capability, and semantic Spine layer that is consumed by all IntegrateWise applications, agents, hosts, plugins, and MCP clients.

What Already Exists (Backend APIs Ready)

  • API Routes in apps/one-access/src/app/api/v1/:
    • /auth — Universal identity, tenant, consent, delegation
    • /marketplace/connectors — Universal marketplace catalog
    • /connectors — Universal connection management
    • /discovery — Universal discovery engine
    • /capabilities — Effective access view
    • /spine — Tenant Spine (schema, business context, KPIs, knowledge, capability bindings)
    • /connected-tools — Connected tool matrix (hosts/tenants/agents/tools)
    • /tool-capabilities — Tool capability matrix (actions and permissions)

What This Prompt Builds

The One Access Network UI — a host-neutral control surface with these routes:

/auth                           → Universal identity, consent, shared-access management
/marketplace                    → Public & authenticated universal marketplace
/connectors                     → Universal connection-management workspace
/discovery                      → Universal discovery engine UI
/capabilities                   → Complete capability explorer
/capability-matrix              → Effective access comparison matrix
/connected-tool-matrix          → Who connects to which tools
/tool-capability-matrix         → What each connected tool can do
/spine                          → Semantic & operational Spine network view
/spine/business-context         → Business Context Studio
/spine/kpis                     → KPI Studio
/spine/knowledge                → Business Knowledge workspace
/spine/schema                   → Schema Studio (generic tenant schema)
/spine/mappings                 → Schema Mappings (source → tenant)
/spine/lineage                  → Lineage graph/timeline/table
/hosts                          → Host registry & capability projection
/grants                         → Grant management
/activity                       → Unified activity & audit
/settings                       → Platform settings

Design Direction

Use the existing IntegrateWise design identity:

Quiet enterprise — Paper and forest — Neutral light and dark surfaces — Forest green accent (#1a3a2a) — Dense but highly readable operational layouts — Strong information hierarchy — Minimal decorative gradients — Subtle borders and restrained shadows — Desktop-first, responsive down to tablet and mobile — Accessible keyboard navigation

Use existing design-system tokens where possible. The UI should feel like one connected product, not a collection of unrelated dashboards.

Global Application Shell

Create a complete shell with:

  • Product logo and product name ("IntegrateWise One Access")
  • Tenant selector (multi-tenant)
  • Workspace selector (workbench context)
  • Host selector (IntegrateWise Web, IntegrateWise Platform, ChatGPT, Claude, MCP Client, Agent Runtime, External Application)
  • Environment selector (development, staging, production)
  • Global search (Cmd+K)
  • Command palette button
  • Notifications
  • Help
  • User profile menu
  • Collapsible left navigation
  • Context-sensitive right inspector
  • Breadcrumbs
  • Page title and page actions
  • Global status banner
  • Connection health indicator
  • Mock current user, tenant, workspace, and host context

Changing the host should visually update capability and access states using mock data.

1. Auth UI Surfaces (/auth)

Universal identity, consent, and shared-access management experience.

Tabs/Subpages:

  • Sign In — Hosted login screen with IntegrateWise branding, email input, Continue button, SSO options, Passkey option, Trust/privacy message, Approved client card, Requested scopes summary, Redirect destination summary
  • Client Applications — List + detail: Client name, Client ID, Redirect URIs, Allowed scopes, Allowed hosts, Environment, Status, Last activity, Active grants, Edit/Disable actions
  • Sessions — Active sessions table with revoke action
  • Consent — Granted consents, scopes, expiry, revoke
  • Grants — Issued grants to hosts/agents/apps
  • Connected Providers — Provider connections with status
  • Security — MFA, passkeys, security keys
  • Audit — Auth audit log

Mock Flows Only

Buttons move between mocked states. No real login/OAuth/token exchange.

2. Marketplace (/marketplace)

Public and authenticated universal marketplace.

Artifact Types:

Connectors | MCP Servers | Plugins | Agents | Models | Workbench Templates | Automation Templates

Features:

  • Search, Categories, Featured, Popular, Installed, Available
  • Publisher filters, Host compatibility filters, Capability filters, Auth method filters, Risk-level filters

Marketplace Card:

Name, Icon, Type, Publisher, Description, Supported hosts, Capability count, Authentication type, Installation status, Health, Trust/verification badge

Detail Page (Tabs):

Overview | Capabilities | Authentication | Required Scopes | Host Compatibility | Schema | Business Context | KPI Relevance | Versions | Activity | Publisher

Actions (Mocked):

Connect Provider | Grant to Application | Assign to Agent | Add to Workbench | View Capabilities | Install | Request Approval

3. Connectors (/connectors)

Universal connection-management workspace.

Views (Tabs):

All Connections | Connected | Configuration Required | Authorization Expired | Degraded | Suspended | Available to Connect

Table & Card Toggle

Connector Row:

Provider, Connection name, Tenant, Connected account, Authentication method, Granted scopes, Authorized hosts, Used by agents, Health, Last sync, Status, Expiry, Actions

Connector Detail Workspace (Tabs):

Overview | Authorization | Configuration | Capabilities | Source Schema | Tenant Schema | Schema Mappings | Business Context | KPI Impact | Activation | Executions | Health | Lineage | Audit

Mock Flows:

Reconnect flow, Scope review flow, Host assignment flow

4. Discovery (/discovery)

Universal discovery engine UI.

Discovery Source Types:

Host platforms | Workspace connections | Connector catalog | MCP servers | OpenAPI specs | GraphQL schemas | Databases | Plugins | Agents | Knowledge sources

Three-Pane Layout:

Discovery Sources (left) | Discovered Resources (center) | Discovery Inspector (right)

Features:

Start discovery button | Discovery progress | Live discovery events | Source health | Deduplication status | Confidence scores | Proposed mappings | Conflicts | Import status | Activation status

Discovered Resource Types:

Connector | Tool | Capability | Entity | Schema | Event | Prompt | Resource | Knowledge source | Agent

Inspector:

Technical metadata | Authentication requirements | Input/output schemas | Source authority | Duplicate matches | Proposed tenant mapping | Business-context relationships | KPI relationships | Risk | Approval state

Mock Discovery Run Detail:

Timeline view

5. Capability Explorer (/capabilities)

Complete capability explorer.

Sections:

Available to me | Installed | Connector capabilities | MCP tools | Plugin capabilities | Agent capabilities | AI capabilities | Native platform capabilities | Recently used | Recommended

Capability Card:

Name, Provider, Capability type, Read/Write status, Risk level, Approval requirement, Connected state, Host availability, Agent availability, Input schema summary, Output schema summary, Health, Last used

Detail View (Tabs):

Overview | Input Schema | Output Schema | Permissions | Required Scopes | Hosts | Agents | Connections | Business Context | KPI Impact | Execution History | Policies | Versions | Audit

Actions:

Run | Add to Workbench | Assign to Agent | Grant to Host | Add to Automation | Ask Twin | Inspect Schema | View Lineage

Schema-Driven Invocation Form:

Mock JSON schema form with validation

6. Capability Matrix (/capability-matrix)

Compares effective access across:

Rows:

Connectors | Tools | Agents | Hosts | Roles | Workspaces

Columns:

Capabilities | Permissions | Environments | Providers | Host platforms

Cell States (10):

Available | Connected | Missing authorization | Missing permission | Approval required | Policy denied | Provider degraded | Not installed | Unsupported by host | Configuration required

Features:

Freeze rows/columns | Search | Filters | Grouping | Column selection | Density toggle | Export | Compare mode | Cell inspector | Mock bulk assignment

Distinct icons, labels, tooltips — not color-only.

7. Connected Tool Matrix (/connected-tool-matrix)

Shows which tenants, workspaces, hosts, applications, agents connect to which tools.

Rows (Switchable):

Hosts | Applications | Agents | Workspaces | Tenants

Columns (Tools/Providers):

Slack, GitHub, Stripe, Salesforce, Notion, Snowflake, OpenAI, Anthropic, Custom MCP Server, etc.

Cell States:

Connected | Shared | Authorized | Expired | Revoked | Configuration required | Policy denied | Available but unassigned

Cell Click → Right Inspector:

Connection, Granted scopes, Authorized capabilities, Assigned host/agent, Environment, Last use, Grant expiry, Policy, Audit events

8. Tool Capability Matrix (/tool-capability-matrix)

Shows what each connected tool can actually do.

Rows:

Tools/Providers (nested groups)

Columns:

Read | Create | Update | Delete | Search | Trigger | Subscribe | Execute | Export | Administrative

Example GitHub:

  • Repository: read, create, update, delete, search
  • Issue: read, create, update, delete
  • Pull Request: read, create, update, merge
  • Workflow: trigger

Example Stripe:

  • Customer: read, create, update
  • Invoice: read, create
  • Subscription: read, create, update, cancel
  • Refund: create

Cell States:

Supported | Unsupported | Scope missing | Approval required | Restricted | Host incompatible | Agent restricted

Detailed Capability Inspector on click

9. Spine Overview (/spine)

Semantic and operational network view.

Node Types (16):

Tenant, Workspace, Host, User, Agent, Connector, Tool, Capability, Entity Type, Entity, Business Process, Business Objective, KPI, Knowledge Source, Memory, Policy, Execution, Deployment

Edge Types (15):

Provides, Uses, Reads, Writes, Triggers, Calls, Shares data with, Authorized by, Governed by, Affects KPI, Participates in process, Mapped from, Deployed to, Depends on

Graph Canvas Controls:

Zoom, Pan, Fit view, Minimap, Filters, Grouping, Expand neighbors, Collapse groups, Time-window selector, Live-event toggle, Layout selector, Search, Path tracing, Upstream/downstream tracing

Node Inspector:

Metadata, Business meaning, Related capabilities, Related KPIs, Related hosts, Related agents, Source mappings, Activity, Health, Policies, Lineage

Mock Graph Data

10. Business Context (/spine/business-context)

Business-context studio for arbitrary tenants.

Three-Pane Layout:

Context Tree (left) | Context Canvas (center) | Context Inspector (right)

Sections:

Organization, Industry, Departments, Functions, Business Objectives, Processes, Terminology, Policies, Roles, Owners, Related KPIs, Related Entities, Related Capabilities, Related Knowledge

Actions:

Create context, Link entity, Link KPI, Link capability, Link process, Link knowledge, Version history, Compare versions, Publish draft

Mock Examples:

Software development, Sales, Finance, Operations — but UI is generic

11. KPI Studio (/spine/kpis)

Views:

KPI Catalog | KPI Definitions | Targets | Dimensions | Data Sources | Related Processes | Related Capabilities | Owners | Calculation History

Visual Differentiation:

Raw metric (neutral) | Derived metric (blue) | Business KPI (green) | Operational indicator (amber) | Agent metric (purple) | Platform health metric (red)

KPI Cards + Detailed Editor

KPI Detail:

Name, Business purpose, Formula, Unit, Current value, Target, Warning threshold, Critical threshold, Trend, Data sources, Related entities, Related processes, Related capabilities, Owners, Agent influence, Version, Last calculated

12. Business Knowledge (/spine/knowledge)

Knowledge Types:

Policy, SOP, Runbook, Playbook, Contract, Product documentation, Process documentation, Decision, Meeting outcome, Exception, Lesson learned

Workspace:

Source list, Document viewer, Provenance, Related business context, Related entities, Related capabilities, Related KPIs, Related agents, Freshness, Sensitivity, Retention, Version

13. Schema Studio (/spine/schema)

Generic tenant schema studio.

Three-Pane Layout:

Schema Navigator (left) | Schema Canvas/Table (center) | Schema Inspector (right)

Navigator Tree:

Generic Spine Schema → Tenant Schema → Source Schemas → Entity Types → Fields → Relationships → Events → Domain Packs → Versions

Per Entity Type:

Technical name, Business name, Description, Fields, Relationships, Source mappings, Business contexts, KPIs, Capabilities (read/write), Agents, Policies, Lineage

Schema-Driven Mock Data (not hardcoded layouts)

14. Schema Mappings (/spine/mappings)

Source-to-tenant schema mappings.

Table Columns:

Source system, Source object, Tenant entity type, Field mappings, Transformations, Confidence, Mapping status, Reviewer, Version, Last sync, Conflicts, Validation errors

Visual Mapper:

Drag-and-drop mapping lines, Suggested mappings, Conflict resolution, Mapping inspector

States:

Draft, Review, Approve, Activate

15. Lineage (/spine/lineage)

Columns:

Source system → Source object → Transformation → Tenant entity → Capability → Agent → Workbench → KPI → Destination → Memory write

Modes:

Graph mode | Timeline mode | Table mode

Features:

Upstream trace, Downstream trace, Sensitive-data filter, Export, Impact analysis

16. Hosts (/hosts)

List:

IntegrateWise Web, IntegrateWise Platform, ChatGPT, Claude, MCP Clients, Agent Runtimes, Plugins, External Applications

Host Detail:

Host type, Client ID, Status, Allowed scopes, Granted connections, Available capabilities, Unsupported capabilities, Active sessions, Grants, Last activity, Environment, Policies, Audit

Capability Projection Preview:

What that host would receive (MCP tool list, scopes, entity access)

17. Grants (/grants)

Fields:

Grant ID, Subject, Audience, Tenant, Workspace, Host, Connection, Capability scopes, Purpose, Environment, Issued at, Expires at, Status, Policy version, Last used

Actions:

Revoke, Extend, Duplicate, Inspect

Filter:

Expiring soon

Grant Creation Drawer:

Mock state

18. Activity & Audit (/activity)

Unified Event Types:

Login, Consent, Connection created, Connection revoked, Discovery started, Capability discovered, Schema mapped, Grant issued, Tool invoked, Approval requested, Policy denied, Data shared, KPI updated, Host projection generated

Views:

Timeline, Table

Filters:

Search, Actor, Tenant, Host, Agent, Tool, Outcome, Risk, Correlation ID

Trace Inspector:

Actor, Tenant, Host, Agent, Tool, Outcome, Risk, Correlation ID

Shared Reusable Components

Create reusable components for:

  • Status badges, Risk badges, Host badges, Provider logos
  • Capability cards, Connection cards, Matrix cells
  • Schema viewers, JSON schema forms, Timeline events
  • Graph node inspector, Filter toolbar, Search command
  • Empty states, Loading states, Error states
  • Unauthorized state, Forbidden state, Offline state
  • Stale-data banner, Approval banner, Mock notifications

Mock Data Requirements

Rich mock datasets for:

  • Multiple tenants (4+)
  • Multiple workspaces per tenant
  • Multiple hosts (all 7 types)
  • 12+ connectors
  • 30+ capabilities
  • 8+ agents
  • 15+ business entities
  • 10+ KPIs
  • 10+ knowledge sources
  • 50+ activity events
  • Multiple schema mappings
  • Multiple grant states
  • Multiple connection states

UI demonstrates: Healthy, empty, loading, partial data, degraded providers, expired auth, policy denial, approval required, unsupported host capability, schema conflict, stale business context

Technical Constraints

Frontend Only

  • React + TypeScript
  • Next.js App Router conventions
  • Tailwind CSS
  • Reusable components
  • Local mock data
  • Local component state

No Backend Implementation

  • No real authentication, OAuth, API calls, database, secrets, provider credentials, token creation, MCP connection, provider SDKs
  • No hardcoded business-domain assumptions in reusable components

Production-quality UI shells with realistic data density, navigation, detail pages, inspectors, tables, matrices, graphs, drawers, dialogs, filters, responsive states

Integration with Platform App Shell

The One Access Network UI (apps/one-access) is inherited by the Platform App Shell (apps/platform):

apps/platform (Platform App Shell)
├── Inherits from apps/one-access:
│   ├── /auth → One Auth
│   ├── /marketplace → Marketplace
│   ├── /connectors → Connection Management
│   ├── /discovery → Discovery Engine
│   ├── /capabilities → Capability Registry
│   ├── /connected-tool-matrix → Connected Tool Matrix
│   ├── /tool-capability-matrix → Tool Capability Matrix
│   └── /spine → Tenant Spine (schema, business context, KPIs, knowledge, mappings, lineage)
│
└── Owns Platform UI:
    ├── Twin Orchestrator, 5 Platform Agents
    ├── 12 Department Workbenches
    ├── Configuration, Activation, Governance
    ├── Memory, Deployments, Observability
    ├── Hosts, Grants, Activity
    └── Settings

The Platform App Shell extends One Access with privileged control-plane surfaces.