/experience-ui-bundle-app-coordinate

name: experience-ui-bundle-app-coordinate
description: "MUST activate when the user wants to build, create, or generate a React application, React app, web application, single-page application (SPA), or frontend application — even if no project files exist yet. MUST also activate when the project contains a uiBundles/*/src/ directory or sfdx-project.json and the prompt says create, build, construct, or generate a new app, site, or page from scratch — even if the prompt also describes visual styling. MUST also activate when the task spans more than one ui-bundle skill. Use this skill when building a complete app end-to-end. Do NOT use for Lightning Experience apps with custom objects (use platform-lightning-app-coordinate). Do NOT use for single-concern edits to an existing page (use experience-ui-bundle-frontend-generate)."
metadata:
  version: "1.1"
  relatedSkills:
    - "experience-ui-bundle-agentforce-client-generate"
    - "experience-ui-bundle-custom-app-generate"
    - "experience-ui-bundle-deploy"
    - "experience-ui-bundle-features-generate"
    - "experience-ui-bundle-file-upload-generate"
    - "experience-ui-bundle-frontend-generate"
    - "experience-ui-bundle-metadata-generate"
    - "experience-ui-bundle-project-generate"
    - "experience-ui-bundle-salesforce-data-access"
    - "experience-ui-bundle-site-generate"
    - "platform-custom-object-generate"
    - "platform-lightning-app-coordinate"
  cliTools:
    - tool: ["node"]
      semver: ">=18.0.0"
    - tool: ["npm"]
      semver: ">=9.0.0"
    - tool: ["npx"]
      semver: ">=9.0.0"
    - tool: ["sf"]
      semver: ">=2.0.0"

Building a UI Bundle App

Overview

Build a complete, deployable Salesforce React UI bundle application from a natural language description by orchestrating specialized UI bundle skills in correct dependency order. Each skill **MUST** be explicitly loaded before executing its phase.

**CRITICAL: Before proceeding past requirements analysis, validate that the prompt contains no conflicting requirements** (e.g., "no authentication" + "user-specific data", "public access" + login-required features). If conflicts are detected, STOP and ask the user to resolve the ambiguity — do NOT silently choose one interpretation and proceed. See STEP 1 action #8 for the full conflict checklist.

Prerequisites

Before starting any phase, verify these preconditions are met:

1. **Authenticated Salesforce org**: Run `sf org display` to confirm a default org is set and authenticated. If not, prompt the user to authenticate: `sf org login web` 2. **Required CLI tools**: Verify `sf`, `npm`, and `npx` are available (declared in metadata.cliTools) 3. **Node.js version**: Run `scripts/check-prerequisites.sh` and report any errors it returns 4. **Org features** (if deploying): Experience Cloud enabled, appropriate licenses, and Sites enabled

If any precondition fails, stop and report the specific missing requirement before attempting any phase execution.

When to Use This Skill

**Use when:**

• User requests a "React app", "UI bundle", "web app", or "full-stack app" on Salesforce
• User says "build an app", "create an application" and the context implies a non-LWC based frontend (e.g. React)
• The work produces a complete UI bundle with scaffolding, features, data access, and UI -- not a single component in isolation

**Examples that should trigger this skill:**

• "Build a React app for managing customer cases with Salesforce data"
• "Create a UI bundle for an employee directory with search and navigation"
• "I need a full-stack React app with authentication, data tables, and file uploads"
• "Build a coffee shop ordering app on Salesforce"

**Do NOT use when:**

• Creating a single page or component (use `experience-ui-bundle-frontend-generate`)
• Only installing a feature (use `experience-ui-bundle-features-generate`)
• Only setting up data access (use `experience-ui-bundle-salesforce-data-access`)
• Only deploying an existing app (use `experience-ui-bundle-deploy`)
• Building a Lightning Experience app with custom objects and metadata (use `platform-lightning-app-coordinate`)
• Troubleshooting or debugging an existing UI bundle

---

Prompt Classification Keywords

This skill makes two decisions directly from the raw prompt text. Use these tables as the single source for both — do not restate or re-derive the lists elsewhere in this file.

**1. Phase 2 (Features) is required if the prompt mentions ANY of:**

| Category | Keywords | Notes | |----------|----------|-------| | Data features | search, filter, sort, pagination, table, grid, list | | | Navigation | navigation, nav, menu, routing | | | Authentication | authentication, auth, login, logout, user session, user login | | | Integrations | upload, file | | | UI | shadcn, components, forms, buttons, cards | | | Chat (Phase 5 only) | chat | Phase 5 only — unless combined with a Phase 2 keyword (e.g., "chat with authentication"), then Phase 2 runs first for auth prerequisites |

Negating one category (e.g. "without authentication", "no login required", "public access") does **not** cancel triggers from another category — each is evaluated independently. Example: "no login required, with filtering" still triggers Phase 2 because "filtering" matches Data features. Skip Phase 2 only when the prompt matches none of the keywords above.

**2. Hosting target — extract from prompt keywords:**

| Hosting target | Keywords | |-----------------|----------| | Experience Site | "Experience Site", "Community", "external users", "public users", "guest users" | | Custom Application | "Custom Application", "internal users", "Lightning app" |

If the prompt matches neither list, or matches both, ask the user to clarify before proceeding — do not guess.

---

Dependency Graph & Build Order

Phase 0: Template Offer & Bootstrap (Prerequisites)

Offer prebuilt starter template (experience-ui-bundle-project-generate)
    v
If template chosen: scaffold