You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: skills/building-ui-bundle-app/SKILL.md
+33-8Lines changed: 33 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,7 +3,7 @@ name: building-ui-bundle-app
3
3
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. This is the orchestrator that coordinates scaffolding, features, data access, frontend UI, integrations, and deployment in the correct dependency order. Without it, phases execute out of order and the app breaks. Do NOT use for Lightning Experience apps with custom objects (use generating-lightning-app). Do NOT use for single-concern edits to an existing page (use building-ui-bundle-frontend)."
Copy file name to clipboardExpand all lines: skills/generating-custom-application/SKILL.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
---
2
2
name: generating-custom-application
3
-
description: "Use this skill when users need to create or configure Salesforce Custom Applications. Trigger when users mention custom apps, application metadata, app navigation, or organizing tabs into applications. Use when users want to create app containers for tabs and pages. Always use this skill for custom application work."
3
+
description: "Use this skill when users need to create or configure tab-based Salesforce Custom Applications with navigation, branding, and action overrides. Trigger when users mention custom apps, application metadata, app navigation, or organizing tabs into applications. Use when users want to create app containers for tabs and pages. Do NOT use when the goal is hosting a React UI bundle in the App Launcher — use generating-ui-bundle-custom-app for that case."
description: "MUST activate when the project contains a uiBundles/*/src/ directory and the task involves creating or configuring a Custom Application for hosting a UI bundle in Lightning Experience. Use this skill when creating a CustomApplication metadata record to surface the UI bundle in the App Launcher. Activate when files matching applications/*.app-meta.xml exist and need modification, or when the user wants to expose their app via the Lightning App Launcher without a Digital Experience Site. Do NOT use generating-custom-application for this — UI bundle apps do not use tabs, action overrides, or flexipages."
4
+
metadata:
5
+
version: "1.0"
6
+
---
7
+
8
+
# Custom Application for React UI Bundles
9
+
Create and configure a Salesforce Custom Application that hosts a React UI bundle in Lightning Experience. This skill generates the CustomApplication metadata so the app appears in the Lightning App Launcher and can be accessed by internal users.
10
+
11
+
Custom Applications differ from Experience Sites: they don't need Networks, CustomSite, DigitalExperienceConfig, or DigitalExperienceBundle metadata. The Custom Application acts as a thin launcher entry that delegates rendering to the React UI bundle referenced by `uiBundle`.
12
+
13
+
## Required Properties
14
+
Resolve all properties before generating any metadata. Each has a fallback chain — work through each option in order until a value is found.
15
+
16
+
| Property | Format | How to Resolve |
17
+
|----------|--------|----------------|
18
+
|**appName**|`lowercamelcase` (e.g., `myInternalApp`) | The UI bundle name from `uiBundles/<name>/` directory |
19
+
|**appNamespace**| String |`namespace` in `sfdx-project.json` → `sf data query -q "SELECT NamespacePrefix FROM Organization" --target-org ${usernameOrAlias}` → default `c`|
20
+
|**appLabel**| Human-readable string | User-provided, or derive from appName by converting camelCase to Title Case |
21
+
22
+
The `appNamespace` and `appName` connect the Custom Application to the correct React UI bundle. In newer API versions this uses `<uiBundle>{appNamespace}__{appName}</uiBundle>`; in older versions it uses `<webApplication>{appName}</webApplication>`. Getting this wrong means the app launcher entry exists but shows a blank page. Step 2 of the workflow determines which field to use.
23
+
24
+
## Generation Workflow
25
+
### Step 1: Resolve All Required Properties
26
+
Determine values for all properties before constructing anything. Use the resolution strategies in the table above.
27
+
28
+
### Step 2: Query API Context (Version-Aware Field Discovery)
29
+
Call `salesforce-api-context` MCP tools to discover which fields exist for the target org's API version. This ensures the generated metadata is compatible with the user's Salesforce version.
30
+
31
+
**Required calls:**
32
+
1. Call `get_metadata_type_fields` for `CustomApplication` — check whether the `uiBundle` field exists
33
+
2. Call `get_metadata_type_fields` for `UIBundle` — check whether the `target` field exists
34
+
35
+
**Field resolution based on API response:**
36
+
37
+
| Field Check | If present | If absent (older API version) |
**Note:**`<sourceDir>` is determined from `sfdx-project.json`. Read `packageDirectories[]` and use the entry where `"default": true`; the full source directory is `<path>/main/default`. If no default is set, use the first entry. Commonly `force-app/main/default`, but this path is configurable.
52
+
53
+
### Step 4: Populate All Metadata Fields
54
+
Use the default template in the doc below. Values in `{braces}` are resolved property references — substitute them with the actual values from Step 1. Apply the field resolution from Step 2 to determine which XML elements to use.
### Execution Note for Step 4: Load and use the doc
61
+
- Agents MUST read the full contents of the docs/*.md file referenced in Step 4 before attempting to populate metadata fields.
62
+
- Read the file in full, replace placeholders (e.g. `{appName}`) with the resolved values, then use the expanded template to populate the metadata XML content.
63
+
- If Step 2 determined the older field names apply, substitute `<uiBundle>` with `<webApplication>` in the generated output.
64
+
65
+
### Step 5: Update UI Bundle Meta XML
66
+
If Step 2 confirmed the `target` field exists on `UIBundle`, add `<target>CustomApplication</target>` to the `.uibundle-meta.xml` file (skip if the field doesn't exist in the org's API version):
This configuration file creates a **net-new, default** CustomApplication metadata record for a Lightning Experience app that hosts a React UI bundle. It is not intended to edit or modify an existing CustomApplication record. Use this template only when provisioning a brand-new Custom Application for a UI bundle.
5
+
6
+
## File Location
7
+
```
8
+
<sourceDir>/applications/{appName}.app-meta.xml
9
+
```
10
+
11
+
**Note:** Determine `<sourceDir>` from `sfdx-project.json` → `packageDirectories[]` → find the entry with `"default": true` → use its `path` value + `/main/default`. Commonly `force-app/main/default`, but this is configurable.
12
+
13
+
## Default Template (newer API versions — `uiBundle` field available)
|`label`| Yes | All | Human-readable label shown in the App Launcher and app switcher. |
67
+
|`navType`| Yes | All | Navigation type. Use `Standard` for standard Lightning navigation. |
68
+
|`uiBundle`| Conditional | Newer | Namespace-qualified developer name of the UI bundle (`{appNamespace}__{appName}`). Use when `get_metadata_type_fields` confirms this field exists on `CustomApplication`. |
69
+
|`webApplication`| Conditional | Older | Developer name of the UI bundle (`{appName}`, no namespace). Use when `uiBundle` field is not available. |
70
+
|`uiType`| Yes | All | UI framework type. Must be `Lightning` for UI bundle apps. |
Copy file name to clipboardExpand all lines: skills/generating-ui-bundle-metadata/SKILL.md
+39-1Lines changed: 39 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -24,6 +24,7 @@ After generation:
24
24
1. Replace all default boilerplate — "React App", "Vite + React", default `<title>`, placeholder text
25
25
2. Populate the home page with real content (landing section, banners, hero, navigation)
26
26
3. Update navigation and placeholders (see the `building-ui-bundle-frontend` skill)
27
+
4.**Configure a hosting target** — a UI bundle without a `<target>` in its meta XML will not be visible in the org. Use `generating-ui-bundle-custom-app` for internal (App Launcher) apps or `generating-ui-bundle-site` for external (Experience Site) apps.
27
28
28
29
Always install dependencies before running any scripts in the UI bundle directory.
29
30
@@ -39,7 +40,44 @@ A UIBundle bundle lives under `uiBundles/<AppName>/` and must contain:
A `<target>` is **required** for the app to be accessible in a Salesforce org. A UI bundle deployed without a target will not appear anywhere — no App Launcher entry, no Experience Site URL. Always pair the bundle with one of:
0 commit comments