$npx -y skills add microsoft/power-platform-skills --skill create-mobile-appUse when the user wants to start a new Power Apps mobile app (Expo / React Native / TypeScript, targeting iOS and Android) from scratch.
| 1 | **📋 Shared instructions: [shared-instructions.md](${CLAUDE_SKILL_DIR}/../../shared/shared-instructions.md)** — read first. Covers safety guardrails, memory bank usage, preferred-environment policy, connector-first rule, Windows CLI compat, command-failure handling. |
| 2 | |
| 3 | # Create Power Apps Code App (Native) |
| 4 | |
| 5 | Top-level orchestrator. Owns the user-visible flow; delegates planning to the `native-app-planner` agent and per-domain mutation to dedicated `/add-*` skills. |
| 6 | |
| 7 | ## Workflow |
| 8 | |
| 9 | 0. Resume check + fresh-template gate → 1. Prerequisites → 2. Gather requirements → 2b. Requirements discovery → 2c. Plan preview (rough cost + abort gate) → 3. Plan (planner agent + 4 gates) → 4. Auth & environment → 5. Prepare existing template → 6. `npx power-apps init` → 6.5 verify `npm install` → **6.5b SafeAreaProvider gate (always runs, idempotent)** → 6.6 scaffold `tsc` smoke check → 6.7 seed memory bank → **6.85 Offline profile (always asked)** → 7. Auth config → 8. Apply data model → 9. Apply native capabilities → 9b. Design system → 10. Add connectors → 10b. Wire navigation layout → 11. Build screens (parallel) → 11.4 Stylistic fix sweep → 12. Start Metro (`npx expo start`) → 12.5 Optional debug handoff → 13. Summary |
| 10 | |
| 11 | --- |
| 12 | |
| 13 | ## Fresh-template working-directory mode |
| 14 | |
| 15 | This skill assumes the user already has a **fresh** `pa-wrap-tools/templates/expo-app-standalone` template materialized with `degit` in the target working directory and has already run `npm install` there. The skill turns that fresh template into an app; it does not clone, degit, or copy a template itself. |
| 16 | |
| 17 | **Fresh template required.** If the working directory is not a template, or if it already looks like an app created by this skill, STOP and tell the user to materialize a fresh `expo-app-standalone` template with `degit` into a new folder, run `npm install`, then rerun `/create-mobile-app --working-dir <fresh-template-dir>`. |
| 18 | |
| 19 | Use these markers: |
| 20 | |
| 21 | | State | Detection | Action | |
| 22 | |---|---|---| |
| 23 | | Fresh template | `package.json`, `app.config.js`, `auth.config.json`, `tamagui.config.ts` exist; `node_modules/expo` exists; `memory-bank.md`, `native-app-plan.md`, `.datamodel-manifest.json`, and generated Dataverse services are absent | Proceed. | |
| 24 | | Template not installed | Fresh-template files exist but `node_modules/expo` is absent | STOP: ask user to run `npm install` in the template folder, then rerun. Do not provision ADO npm tokens here. | |
| 25 | | Already-created app | `memory-bank.md`, `native-app-plan.md`, `.datamodel-manifest.json`, or `src/generated/services/*.ts` exists | STOP: this is not a fresh create target. Ask user to materialize a fresh template folder with `degit`. | |
| 26 | | Not template | Required template files are missing | STOP: ask user to materialize `pa-wrap-tools/templates/expo-app-standalone` into the working directory with `degit` and run `npm install`. | |
| 27 | |
| 28 | This gate is intentionally simple: `/create-mobile-app` creates a new app from a fresh template. It does not adopt, repair, resume, or overwrite an already-created app. |
| 29 | |
| 30 | --- |
| 31 | |
| 32 | ## TypeScript Gate Policy — no quality compromise |
| 33 | |
| 34 | `tsc` is a **phase gate**, not a reflex after every tiny edit. The app may not advance past a gate until TypeScript is clean. |
| 35 | |
| 36 | **Required gates:** |
| 37 | - **Scaffold gate:** Step 6.6 after existing-template preparation, `npx power-apps init`, and dependency verification. |
| 38 | - **Dataverse/generated-services gate:** immediately after Step 8 returns and generated services/models are refreshed. |
| 39 | - **Navigation/skeleton gate:** after Step 10b layouts and Step 10.8 shared code/skeletons are written, before Step 11 builders launch. |
| 40 | - **Screen-wave gate:** after each Step 11 screen-builder wave returns, before launching the next wave. |
| 41 | - **Final gate:** before Step 12 starts the dev server. |
| 42 | |
| 43 | **When a gate fails:** |
| 44 | 1. Capture the full `tsc --noEmit` output once. |
| 45 | 2. Classify errors by root cause (for example: generated model names, service option shapes, invalid UI props, typed percentage values, create/update payload typing, missing imports). |
| 46 | 3. Repair in a batch. |
| 47 | 4. Re-run the same gate once after the batch. |
| 48 | 5. Continue only when the gate is clean, or stop/block according to the retry policy. |
| 49 | |
| 50 | **Do not run full-app `tsc` after every microscopic local edit inside the same repair pass.** That is slower and encourages line-by-line patching. Batch root-cause fixes, then re-run the gate. This is a speed improvement only; it does **not** lower the quality bar. |
| 51 | |
| 52 | **Hard stops:** |
| 53 | - Do not launch data-source work from a broken scaffold gate. |
| 54 | - Do not launch screen-builders from broken generated services, layouts, shared code, or skeletons. |
| 55 | - Do not launch wave N+1 until wave N passes its `tsc` gate. |