feat: Salesforce Multi-Framework React 19 POC & Dual Deployments

[sumitkrgupta05]

Summary of Implementation

This PR introduces native Salesforce Multi-Framework Development using React 19, Vite 7, TypeScript, and Tailwind CSS v4 via the UIBundle metadata architecture. It implements and documents dual deployment pathways for both internal employees (App Launcher) and external public visitors (Experience Cloud LWR).

🚀 Key Capabilities Added:

1. Multi-Framework React UI Bundle (ReactExperiencePoc):

   • Native React 19 Single Page Application built with Vite and TypeScript.
   • Interactive local reactive state and direct Salesforce UI API GraphQL integration via @salesforce/platform-sdk without custom Apex.
   • Configured routing with ui-bundle.json SPA fallback.

2. Pathway A: Internal Application Deployment (App Launcher):

   • CustomApplication (ReactExperienceApp.app-meta.xml) referencing c__ReactExperiencePoc.
   • PermissionSet (ReactExperienceAppAccess.permissionset-meta.xml) granting application visibility in the Salesforce 9-dot App Launcher.
   • Inherits active user session cookies and platform security context automatically.

3. Pathway B: External Experience Cloud Site Deployment (LWR):

   • Configured ReactExperienceSite network and custom site for unauthenticated public guest access (AUTHENTICATED_WITH_PUBLIC_ACCESS_ENABLED).
   • Replaced default LWR desert illustration placeholder in sfdc_cms__view/home/content.json with c:reactExperienceViewer.
   • Built
     eactExperienceViewer LWC component and ReactExperienceController.cls running in WITH USER_MODE.
   • Created dedicated ReactExperienceGuestAccess permission set omitting standard apps to comply with guest licensing limits (TABSET_LIMIT_EXCEEDED).
   • Documented the required Experience Builder Publish workflow to distribute draft CMS changes to the public CDN.

4. Comprehensive Documentation:

   • docs/SALESFORCE_MULTI_FRAMEWORK_REACT_GUIDE.md: Full architectural reference and troubleshooting guide.
   • docs-html/SALESFORCE_MULTI_FRAMEWORK_REACT_GUIDE.html: Interactive dark-mode HTML documentation with sticky navigation bar, Mermaid diagrams, and code copy buttons.

[sumitkrgupta05]

📋 Detailed Implementation Notes & Verification Checklist

1. Internal Application Architecture

• Metadata: CustomApplication (ReactExperienceApp) + UIBundle (ReactExperiencePoc) + PermissionSet (ReactExperienceAppAccess).
• Authentication: Seamless session token inheritance without Connected Apps or OAuth credentials.
• Verification: Verified in learn_dc via App Launcher -> React Experience App (/lightning/app/c__ReactExperienceApp).

2. External Experience Cloud Site Architecture (LWR)

• Metadata: Network (ReactExperienceSite, Status: Live) + CustomSite (active: true) + DigitalExperienceBundle (ReactExperienceSite1) + sfdc_cms__view/home (Mounted: c:reactExperienceViewer) + ReactExperienceController.cls + ReactExperienceGuestAccess.
• Guest Licensing Resolution: Avoided TABSET_LIMIT_EXCEEDED by granting only <classAccesses> in the guest permission set and zero <applicationVisibilities>.
• Publish Step: Tested and verified that the manual/UI Publish in Experience Builder is required to push draft CMS changes to the public CDN.
• Verification: Public unauthenticated access verified at https://orgfarm-60a150fdc3-dev-ed.develop.my.site.com/reactsite/ (HTTP 200).

3. Documentation Reference

• Full guides provided in Markdown (docs/) and standalone interactive HTML (docs-html/) with Dark themes, responsive sticky navbar, and architecture flowcharts.

[github-actions]

⚡ GitHub Action AI Reviewer Report

Reviewer Engine: GitHub Actions AI Agent (Zero-Token Code Review)
Verdict: ✅ APPROVED

Summary

All code changes comply with Salesforce engineering best practices, security guardrails, and XML syntax standards.

Best Practices & Quality Audit

• [PASS] 🛡️ Security Guardrails: Zero foreign client or unauthorized org references detected.
• [PASS] 📄 XML Metadata Syntax: All modified Salesforce XML files are well-formed.
• [PASS] ⚡ Apex Bulkification: Zero SOQL queries or DML statements found inside loops.

✨ Code is clean, well-formed, and ready for deployment into main!