@salesforce/webapp-template-feature-react-authentication-experimental 1.12.0 → 1.14.0

package/dist/.a4drules/skills/install-feature/SKILL.md

@@ -0,0 +1,58 @@
+---
+name: install-feature
+description: Install a feature into the current app. Use when the user asks to add a feature, capability, or functionality like authentication, search, charts, or navigation to their React web app.
+---
+
+# Install feature
+
+When the user asks to add a feature to their app, follow this workflow.
+
+## 1. Match the request to a feature
+
+Available features (npm packages):
+
+
+| Feature                | Package                                                                 | Description                                                            |
+| ---------------------- | ----------------------------------------------------------------------- | ---------------------------------------------------------------------- |
+| **Authentication**     | `@salesforce/webapp-template-feature-react-authentication-experimental` | Login, register, password reset, protected routes                      |
+| **Global search**      | `@salesforce/webapp-template-feature-react-global-search-experimental`  | Search Salesforce objects with filters and pagination                  |
+| **Navigation menu**    | `@salesforce/webapp-template-feature-react-nav-menu-experimental`       | App layout with responsive navigation menu                             |
+| **Analytics charts**   | `@salesforce/webapp-template-feature-react-chart-experimental`         | Recharts line/bar charts with theming (AnalyticsChart, ChartContainer) |
+| **Shared UI (shadcn)** | `@salesforce/webapp-template-feature-react-shadcn-experimental`         | Button, Card, Input, Select, Table, Tabs, etc.                         |
+
+
+If no feature matches, tell the user and offer to build it from scratch following the project's existing patterns.
+
+## 2. Install the npm package
+
+```bash
+npm install <package-name>
+```
+
+## 3. Copy skills and rules from the package
+
+After install, check the package in `node_modules/<package-name>/` for:
+
+- `**skills/**` – If it exists, copy each skill folder into the current project's skills directory (e.g. `.cline/skills/` or `.cursor/skills/`).
+- `**rules/**` – If it exists, copy each rule file into the current project's rules directory (e.g. `.clinerules/` or `.cursor/rules/`).
+
+Not every package has skills or rules; skip this step if neither directory exists.
+
+## 4. Read the feature's exports and components
+
+Read the package's entry point (usually `index.ts` or the `main` field in its `package.json`) to understand what components and types it exports.
+
+Also read the `feature.ts` file if it exists — it lists dependencies on other features (e.g. shadcn) and any npm dependencies the feature needs (e.g. `recharts`). Install any missing dependencies.
+
+## 5. Implement the feature in the current app
+
+- **If the package exports reusable components** (e.g. `AnalyticsChart`, `ChartContainer`): import and use them directly. Follow the package's README or skill instructions for props, data shapes, and usage patterns.
+- **If the package is a reference implementation** (e.g. authentication pages, search pages): read its source code under `src/` as a reference, then create equivalent pages/components in the current app following the app's existing patterns and conventions.
+
+Place new routes inside the existing app's router (e.g. `routes.tsx`). Do not replace the app shell; add the feature as new routes or sections within it.
+
+## 6. Verify
+
+- Confirm the app builds without errors.
+- Confirm any new routes are accessible and render correctly.
+

package/dist/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.14.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v1.13.0...v1.14.0) (2026-02-06)
+
+**Note:** Version bump only for package @salesforce/webapp-template-base-sfdx-project-experimental
+
+
+
+
+
+# [1.13.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v1.12.0...v1.13.0) (2026-02-06)
+
+
+### Features
+
+* adding a sample feature package for reference ([#77](https://github.com/salesforce-experience-platform-emu/webapps/issues/77)) ([94b4d8e](https://github.com/salesforce-experience-platform-emu/webapps/commit/94b4d8e5e89c10888868b8b014c1032ff4b6177d))
+
+
+
+
+
 # [1.12.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v1.11.2...v1.12.0) (2026-02-06)
 
 **Note:** Version bump only for package @salesforce/webapp-template-base-sfdx-project-experimental

package/dist/force-app/main/default/classes/WebAppAuthUtils.cls

@@ -53,4 +53,16 @@ public without sharing class WebAppAuthUtils {
         
         return defaultUrl + url;
     }
+
+    /**
+     * Logs an error message and stack trace to the system debug log.
+     * It is only captured if a Trace Flag is active for the user.
+     * 
+     * @param ex The exception to log.
+     * @param level The logging level to use.
+     */
+    public static void debugLog(Exception ex, LoggingLevel level) {
+        System.debug(level, 'Message: ' + ex.getMessage());
+        System.debug(level, 'Stack Trace: ' + ex.getStackTraceString());
+    }
 }

package/dist/force-app/main/default/classes/WebAppChangePassword.cls

@@ -0,0 +1,77 @@
+/**
+ * Web Applications REST endpoint for authenticated user password changes.
+ * 
+ * Endpoint: POST /services/apexrest/auth/change-password
+ * 
+ * Allows authenticated users to change their password by providing their current password
+ * and a new password. The new password is validated against org password policies.
+ * 
+ * Security: Uses 'with sharing' to enforce user-level security. Only authenticated users
+ * can change their own password.
+ */
+@RestResource(urlMapping='/auth/change-password')
+global with sharing class WebAppChangePassword {
+
+    /**
+     * Changes the password for the currently authenticated user.
+     * 
+     * @param newPassword The new password to set.
+     * @param currentPassword The user's current password for verification.
+     * @return SuccessPasswordChangeResponse on success, ErrorPasswordChangeResponse on failure.
+     */
+    @HttpPost
+    global static PasswordChangeResponse changePassword(String newPassword, String currentPassword) {
+        Savepoint sp = Database.setSavepoint();
+        try {
+            // newPassword and confirmPassword should be validated to be the same value on the client
+            Site.changePassword(newPassword, newPassword, currentPassword);
+            return new SuccessPasswordChangeResponse();
+        } catch (Exception ex) {
+            Database.rollback(sp);
+
+            // System.SecurityException is a user error but treat others as system errors
+            if (ex instanceof System.SecurityException) {
+                RestContext.response.statusCode = 400;
+                return new ErrorPasswordChangeResponse(ex.getMessage());     
+            }
+
+            // Logs are only captured if a Trace Flag is active for the user
+            WebAppAuthUtils.debugLog(ex, LoggingLevel.ERROR);
+            
+            RestContext.response.statusCode = 500;
+            return new ErrorPasswordChangeResponse('Password change failed');
+        }
+    }
+
+    /** Base response class for password change operations. */
+    global abstract class PasswordChangeResponse {
+        
+        /** Success or failure of the password change operation */
+        private Boolean success;
+    }
+
+    /** Success response for password change. */
+    global class SuccessPasswordChangeResponse extends PasswordChangeResponse {
+
+        /** Constructs a success response. */
+        private SuccessPasswordChangeResponse() {
+            this.success = true;
+        }
+    }
+
+    /** Error response for password change. */
+    global class ErrorPasswordChangeResponse extends PasswordChangeResponse {
+
+        /** Error message describing the failure reason */
+        private String error;
+        
+        /**
+         * Constructs an error response with the specified error message.
+         * @param error The error message to return to the client.
+         */
+        private ErrorPasswordChangeResponse(String error) {
+            this.success = false;
+            this.error = error;
+        }
+    }
+}

package/dist/force-app/main/default/classes/WebAppChangePassword.cls-meta.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<ApexClass xmlns="http://soap.sforce.com/2006/04/metadata">
+    <apiVersion>66.0</apiVersion>
+    <status>Active</status>
+</ApexClass>

package/dist/force-app/main/default/webapplications/feature-react-authentication/src/components/forms/auth-form.tsx

@@ -18,6 +18,7 @@ interface AuthFormProps extends Omit<React.ComponentProps<"form">, "onSubmit"> {
 	submit: {
 		text: string;
 		loadingText?: string;
+		disabled?: boolean;
 	};
 	footer?: {
 		text?: string;
@@ -68,6 +69,7 @@ export function AuthForm({
 						form={id}
 						label={submit.text}
 						loadingLabel={submit.loadingText}
+						disabled={submit.disabled}
 						className="mt-6"
 					/>
 				</form>

package/dist/force-app/main/default/webapplications/feature-react-authentication/src/components/forms/submit-button.tsx

@@ -3,7 +3,7 @@ import { Spinner } from "../ui/spinner";
 import { cn } from "../../lib/utils";
 import { useFormContext } from "../../hooks/form";
 
-interface SubmitButtonProps extends Omit<React.ComponentProps<typeof Button>, "type" | "disabled"> {
+interface SubmitButtonProps extends Omit<React.ComponentProps<typeof Button>, "type"> {
 	/** Button text when not submitting */
 	label: string;
 	/** Button text while submitting */
@@ -18,15 +18,15 @@ const isSubmittingSelector = (state: { isSubmitting: boolean }) => state.isSubmi
  * Submit button that subscribes to form submission state.
  * UX Best Practice:
  * 1. Disables interaction immediately upon click (via isLoading) to prevent
- * accidental double-submissions which can cause race conditions in Auth APIs.
- * 2. Provides immediate visual feedback (Spinner) because Auth calls (e.g. hashing passwords,
- * generating sessions) can have variable latency.
+ * accidental double-submissions.
+ * 2. Provides immediate visual feedback (Spinner).
  */
 export function SubmitButton({
 	label,
 	loadingLabel = "Submitting…",
 	className,
 	form: formId,
+	disabled,
 	...props
 }: SubmitButtonProps) {
 	const form = useFormContext();
@@ -37,7 +37,7 @@ export function SubmitButton({
 					type="submit"
 					form={formId}
 					className={cn("w-full", className)}
-					disabled={isSubmitting}
+					disabled={isSubmitting || disabled}
 					{...props}
 				>
 					{isSubmitting && <Spinner className="mr-2" aria-hidden="true" />}

package/dist/force-app/main/default/webapplications/feature-react-authentication/src/pages/ChangePassword.tsx

@@ -7,7 +7,6 @@ import { AuthForm } from "../components/forms/auth-form";
 import { useAppForm } from "../hooks/form";
 import { ROUTES, AUTH_PLACEHOLDERS } from "../utils/authenticationConfig";
 import { newPasswordSchema, handleApiResponse, getErrorMessage } from "../utils/helpers";
-import { getUser } from "../context/AuthContext";
 
 const changePasswordSchema = z
 	.object({
@@ -18,25 +17,19 @@ const changePasswordSchema = z
 export default function ChangePassword() {
 	const [success, setSuccess] = useState(false);
 	const [submitError, setSubmitError] = useState<string | null>(null);
-	const user = getUser();
 
 	const form = useAppForm({
 		defaultValues: { currentPassword: "", newPassword: "", confirmPassword: "" },
 		validators: { onChange: changePasswordSchema, onSubmit: changePasswordSchema },
-		onSubmit: async ({ value }) => {
+		onSubmit: async ({ value: formFieldValues }) => {
 			setSubmitError(null);
 			setSuccess(false);
 			try {
 				// [Dev Note] Custom Apex Endpoint: /auth/change-password
-				// Security Critical:
-				// We must pass the `user.id` (from AuthContext) to the Apex endpoint
-				// to ensure the password change is applied to the correct user.
-				// The Apex backend should also verify that the authenticated session matches this ID.
 				// You must ensure this Apex class exists in your org
-				const response = await baseClient.post("/services/apexrest/auth/change-password", {
-					userId: user.id,
-					currentPassword: value.currentPassword,
-					newPassword: value.newPassword,
+				const response = await baseClient.post("/sfdcapi/services/apexrest/auth/change-password", {
+					currentPassword: formFieldValues.currentPassword,
+					newPassword: formFieldValues.newPassword,
 				});
 				await handleApiResponse(response, "Password change failed");
 				setSuccess(true);
@@ -65,7 +58,7 @@ export default function ChangePassword() {
 							</>
 						)
 					}
-					submit={{ text: "Change Password", loadingText: "Changing…" }}
+					submit={{ text: "Change Password", loadingText: "Changing…", disabled: success }}
 					footer={{ link: ROUTES.PROFILE.PATH, linkText: "Back to Profile" }}
 				>
 					<form.AppField name="currentPassword">

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/webapp-template-base-sfdx-project-experimental",
-  "version": "1.12.0",
+  "version": "1.14.0",
   "description": "Base SFDX project template",
   "private": true,
   "files": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/webapp-template-feature-react-authentication-experimental",
-  "version": "1.12.0",
+  "version": "1.14.0",
   "description": "Authentication feature for web applications",
   "license": "SEE LICENSE IN LICENSE.txt",
   "author": "",
@@ -19,7 +19,7 @@
     "watch": "npx tsx ../../cli/src/index.ts watch-patches packages/template/feature/feature-react-authentication packages/template/base-app/base-react-app packages/template/feature/feature-react-authentication/dist"
   },
   "devDependencies": {
-    "@salesforce/webapp-experimental": "^1.12.0",
+    "@salesforce/webapp-experimental": "^1.14.0",
     "@tanstack/react-form": "^1.27.7",
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
@@ -27,5 +27,5 @@
     "react-router": "^7.10.1",
     "vite": "^7.3.1"
   },
-  "gitHead": "503a8f0d9d00f1c3dea58b7457dbf288b14a3e5a"
+  "gitHead": "b7dd7bcfba3476266327ccfbe859927846abd506"
 }