@salesforce/templates 66.14.0 → 66.16.0

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/package.json

@@ -7,6 +7,7 @@
     "node": ">=22"
   },
   "scripts": {
+    "postinstall": "patch-package",
     "dev": "vite",
     "dev:design": "vite --mode design",
     "build": "tsc -b && vite build",
@@ -18,8 +19,8 @@
     "graphql:schema": "node scripts/get-graphql-schema.mjs"
   },
   "dependencies": {
-    "@salesforce/platform-sdk": "^11.64.0",
-    "@salesforce/ui-bundle": "^11.64.0",
+    "@salesforce/platform-sdk": "^12.4.5",
+    "@salesforce/ui-bundle": "^12.4.5",
     "@tailwindcss/vite": "^4.1.17",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -46,8 +47,8 @@
     "@graphql-eslint/eslint-plugin": "^4.1.0",
     "@graphql-tools/utils": "^11.0.0",
     "@playwright/test": "^1.49.0",
-    "@salesforce/graphiti": "^11.64.0",
-    "@salesforce/vite-plugin-ui-bundle": "^11.64.0",
+    "@salesforce/graphiti": "^12.4.5",
+    "@salesforce/vite-plugin-ui-bundle": "^12.4.5",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.1.0",
     "@testing-library/user-event": "^14.5.2",
@@ -64,6 +65,7 @@
     "graphql": "^16.11.0",
     "graphql-codegen-typescript-operation-types": "^2.0.2",
     "jsdom": "^25.0.1",
+    "patch-package": "^8.0.1",
     "serve": "^14.2.5",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.46.4",

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/patches/aria-hidden+1.2.6.patch

@@ -0,0 +1,45 @@
+diff --git a/node_modules/aria-hidden/dist/es2015/index.js b/node_modules/aria-hidden/dist/es2015/index.js
+index 00aa2ea..1d2f61e 100644
+--- a/node_modules/aria-hidden/dist/es2015/index.js
++++ b/node_modules/aria-hidden/dist/es2015/index.js
+@@ -131,7 +131,9 @@ export var hideOthers = function (originalTarget, parentNode, markerName) {
+     // we should not hide aria-live elements - https://github.com/theKashey/aria-hidden/issues/10
+     // and script elements, as they have no impact on accessibility.
+     targets.push.apply(targets, Array.from(activeParentNode.querySelectorAll('[aria-live], script')));
+-    return applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
++    return supportsInert()
++        ? inertOthers(targets, activeParentNode, markerName)
++        : applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
+ };
+ /**
+  * Marks everything except given node(or nodes) as inert
+diff --git a/node_modules/aria-hidden/dist/es2019/index.js b/node_modules/aria-hidden/dist/es2019/index.js
+index 17404da..a444872 100644
+--- a/node_modules/aria-hidden/dist/es2019/index.js
++++ b/node_modules/aria-hidden/dist/es2019/index.js
+@@ -126,7 +126,9 @@ export const hideOthers = (originalTarget, parentNode, markerName = 'data-aria-h
+     // we should not hide aria-live elements - https://github.com/theKashey/aria-hidden/issues/10
+     // and script elements, as they have no impact on accessibility.
+     targets.push(...Array.from(activeParentNode.querySelectorAll('[aria-live], script')));
+-    return applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
++    return supportsInert()
++        ? inertOthers(targets, activeParentNode, markerName)
++        : applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
+ };
+ /**
+  * Marks everything except given node(or nodes) as inert
+diff --git a/node_modules/aria-hidden/dist/es5/index.js b/node_modules/aria-hidden/dist/es5/index.js
+index 1b86f56..863f83e 100644
+--- a/node_modules/aria-hidden/dist/es5/index.js
++++ b/node_modules/aria-hidden/dist/es5/index.js
+@@ -134,7 +134,9 @@ var hideOthers = function (originalTarget, parentNode, markerName) {
+     // we should not hide aria-live elements - https://github.com/theKashey/aria-hidden/issues/10
+     // and script elements, as they have no impact on accessibility.
+     targets.push.apply(targets, Array.from(activeParentNode.querySelectorAll('[aria-live], script')));
+-    return applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
++    return supportsInert()
++        ? inertOthers(targets, activeParentNode, markerName)
++        : applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
+ };
+ exports.hideOthers = hideOthers;
+ /**

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/authentication/pages/Login.tsx

@@ -46,8 +46,9 @@ export default function Login() {
 				});
 				const result = await handleApiResponse<AuthResponse>(response);
 				if (result?.redirectUrl) {
-					// Hard navigate to the URL which establishes the server session cookie
-					window.location.replace(result.redirectUrl);
+					// Hard navigate with assign (not replace) so /login stays in history and the
+					// browser Back button returns here after an MFA/verification screen.
+					window.location.assign(result.redirectUrl);
 				} else {
 					// In case redirectUrl is null, navigate to home
 					navigate("/", { replace: true });

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/authentication/pages/Register.tsx

@@ -58,8 +58,9 @@ export default function Register() {
 				});
 				const result = await handleApiResponse<AuthResponse>(response);
 				if (result?.redirectUrl) {
-					// Hard navigate to the URL which logs the new user in
-					window.location.replace(result.redirectUrl);
+					// Hard navigate with assign (not replace) so this page stays in history and
+					// the browser Back button returns here after an MFA/verification screen.
+					window.location.assign(result.redirectUrl);
 				} else {
 					// In case redirectUrl is null, redirect to the login page
 					navigate(ROUTES.LOGIN.PATH, { replace: true });

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/adapters/cms/api/searchableContentTypesService.ts

@@ -60,13 +60,16 @@ function isSearchable(entry: RawContentTypeEntry): boolean {
 	return true;
 }
 
-/**
- * Extracts the prefixed FQN from an entry. `id` is the current field; the
- * others are fallbacks for alternate/legacy payloads. `name` is intentionally
- * NOT read here — it is the bare (unprefixed) developer name and would fail
- * `isValidCmsFqn`.
- */
+/** ManagedContentType key prefix — the `id` custom content types carry instead of an FQN. */
+const CONTENT_TYPE_RECORD_ID_PATTERN = /^0T1[a-zA-Z0-9]{12,15}$/;
+
+/** Extracts the prefixed FQN from an entry, rebuilding `c__<name>` when `id` is a custom-type record id. */
 function entryFqn(entry: RawContentTypeEntry): string | undefined {
+	// Custom types put a ManagedContentType id in `id`; the FQN the GraphQL filter
+	// accepts is `c__<name>`.
+	if (entry.id && CONTENT_TYPE_RECORD_ID_PATTERN.test(entry.id)) {
+		return entry.name ? `c__${entry.name}` : undefined;
+	}
 	return entry.id ?? entry.contentType ?? entry.fqn ?? entry.developerName;
 }
 

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/adapters/cms/cmsQueryFragment.ts

@@ -5,7 +5,8 @@
  *
  * The `$cmsContentTypeFQNs` declaration, its `contentTypeFQNs:` argument, and
  * its variable value are all emitted only when a non-empty content-type list is
- * passed; on the bootstrap call (no types known) they are omitted entirely.
+ * passed; on the bootstrap call (no types known) they are omitted entirely. The
+ * `$cmsLanguage` pieces follow the same conditional pattern.
  */
 
 import type { QueryFragmentContribution } from "../types";
@@ -26,6 +27,8 @@ export interface BuildCmsFragmentParams {
 	 * `isValidCmsFqn`-validated values.
 	 */
 	contentTypes?: string[] | null;
+	/** User language tag for the `language` argument; emitted only when a non-empty string. */
+	language?: string | null;
 }
 
 /**
@@ -33,9 +36,10 @@ export interface BuildCmsFragmentParams {
  * included only when `params.contentTypes` is a non-empty array.
  */
 export function buildCmsQueryFragment(params: BuildCmsFragmentParams): QueryFragmentContribution {
-	const { keyword, uiBundleId, offset, limit, contentTypes } = params;
+	const { keyword, uiBundleId, offset, limit, contentTypes, language } = params;
 
 	const hasContentTypes = Array.isArray(contentTypes) && contentTypes.length > 0;
+	const hasLanguage = typeof language === "string" && language.length > 0;
 
 	const variableDeclarations = [
 		"$cmsKeyword: String!",
@@ -61,12 +65,19 @@ export function buildCmsQueryFragment(params: BuildCmsFragmentParams): QueryFrag
 		variables.cmsContentTypeFQNs = contentTypes;
 	}
 
+	// Top-level `language: String` arg, emitted only when a non-empty tag is provided.
+	const languageArg = hasLanguage ? "\n          language: $cmsLanguage" : "";
+	if (hasLanguage) {
+		variableDeclarations.push("$cmsLanguage: String");
+		variables.cmsLanguage = language;
+	}
+
 	const fragment = `managed_content {
   search {
     searchContentInChannels(
       searchIdentifiers: { uibundleIds: [$UIBundleId] }
       keyword: $cmsKeyword
-      pagination: { limit: $cmsLimit, offset: $cmsOffset }${contentTypesArg}
+      pagination: { limit: $cmsLimit, offset: $cmsOffset }${languageArg}${contentTypesArg}
     ) {
       total
       offset

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/adapters/cms/contentTypeUtils.ts

@@ -8,21 +8,23 @@
 
 /**
  * Formats a CMS content type FQN into a human-readable label.
- * Strips "sfdc_cms__" prefix, splits camelCase, title-cases each word.
+ * Strips the "sfdc_cms__" (OOTB) or "c__" (custom) prefix, splits camelCase, title-cases each word.
  *
  * Examples:
  *   "sfdc_cms__blogPost" → "Blog Post"
  *   "sfdc_cms__news" → "News"
- *   "sfdc_cms__document" → "Document"
- *   "sfdc_cms__pressRelease" → "Press Release"
+ *   "c__NewsArticle" → "News Article"
+ *   "c__Recipe" → "Recipe"
  */
 export function formatContentTypeLabel(fqn: string): string {
-	const stripped = fqn.replace(/^sfdc_cms__/, "");
+	const stripped = fqn.replace(/^(?:sfdc_cms__|c__)/, "");
 	const words = stripped.replace(/([a-z])([A-Z])/g, "$1 $2");
 	return words.charAt(0).toUpperCase() + words.slice(1);
 }
 
-export const CMS_FQN_PATTERN = /^sfdc_cms__[a-zA-Z][a-zA-Z0-9]{0,39}$/;
+// OOTB content types are namespaced `sfdc_cms__<name>`; custom types created in
+// a namespace-less org take the default `c__<name>` prefix. Both are valid FQNs.
+export const CMS_FQN_PATTERN = /^(?:sfdc_cms__|c__)[a-zA-Z][a-zA-Z0-9]{0,39}$/;
 
 export function isValidCmsFqn(fqn: string): boolean {
 	return CMS_FQN_PATTERN.test(fqn);

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/adapters/cms/index.ts

@@ -44,6 +44,7 @@ function buildCmsRequest(request: SourceRequest<CmsSourceConfig>): QueryFragment
 		offset,
 		limit: request.pageSize,
 		contentTypes: contentTypes && contentTypes.length > 0 ? contentTypes : null,
+		language: request.language ?? null,
 	});
 }
 

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/adapters/cms/searchChannel.ts

@@ -1,4 +1,5 @@
-import { getCurrentApp } from "@salesforce/platform-sdk";
+import { createDataSDK, getCurrentApp } from "@salesforce/platform-sdk";
+import { fetchI18nContext } from "@salesforce/platform-sdk/i18n";
 
 /** Returns the UIBundle id for CMS search, resolved from the running app. */
 export async function getUIBundleId(): Promise<string> {
@@ -6,6 +7,21 @@ export async function getUIBundleId(): Promise<string> {
 	return app.identity?.bundleId ?? "";
 }
 
+/** Fallback language tag used when the user's own language can't be resolved. */
+export const DEFAULT_LANGUAGE = "en-US";
+
+/** Returns the current user's language tag (e.g. `"en-US"`), falling back to {@link DEFAULT_LANGUAGE}. */
+export async function getUserLanguage(): Promise<string> {
+	try {
+		const sdk = await createDataSDK();
+		if (!sdk?.graphql) return DEFAULT_LANGUAGE;
+		const ctx = await fetchI18nContext(sdk);
+		return ctx.lang || DEFAULT_LANGUAGE;
+	} catch {
+		return DEFAULT_LANGUAGE;
+	}
+}
+
 /** Shape guard for a UIBundle record id (9YE + 12-15 alphanumerics). */
 export const UI_BUNDLE_ID_PATTERN = /^9YE[a-zA-Z0-9]{12,15}$/;
 

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/adapters/types.ts

@@ -81,6 +81,8 @@ export interface SourceRequest<T extends SourceConfig = SourceConfig> {
 	 * synchronous. Ignored by non-CMS adapters.
 	 */
 	uiBundleId?: string;
+	/** CMS-only, optional. The current user's language tag fed to the CMS search `language` argument. */
+	language?: string;
 }
 
 /**

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/components/MergedSearchResults.tsx

@@ -40,6 +40,7 @@ import { FilterProvider, FilterResetButton } from "./filters/FilterContext";
 import { PaginationControls } from "./controls/PaginationControls";
 import { SortControl } from "./controls/SortControl";
 import { resolveResultRenderer, type ResultRenderer } from "./results/resolveResultRenderer";
+import { MIN_QUERY_LENGTH } from "../constants";
 import { ALL_SCOPE, type SearchHandle, type SourceController } from "../types";
 
 export interface MergedSearchResultsProps {
@@ -52,6 +53,8 @@ export interface MergedSearchResultsProps {
 	renderResult?: Record<string, ResultRenderer>;
 	/** Message shown when there are no results. Defaults to "No results found." */
 	emptyMessage?: string;
+	/** Message shown when the query is below {@link MIN_QUERY_LENGTH}. Defaults to "Start your search…" */
+	shortQueryMessage?: string;
 	/** Number of skeleton placeholders to show while loading. Defaults to `pageSize`. */
 	skeletonCount?: number;
 	/** Extra classes on the grid container. Defaults to a responsive 1/2/3-column grid. */
@@ -81,11 +84,16 @@ export function MergedSearchResults({
 	handle,
 	renderResult,
 	emptyMessage,
+	shortQueryMessage = "Start your search…",
 	skeletonCount,
 	gridClassName = DEFAULT_GRID_CLASS,
 	className,
 }: MergedSearchResultsProps) {
-	const { globalPagination: page, mergedResults, loading, error } = handle;
+	const { globalPagination: page, mergedResults, loading, error, q } = handle;
+	// Distinguishes "haven't typed enough yet" (useSearch short-circuits below
+	// MIN_QUERY_LENGTH without fetching) from a genuine zero-match search — both
+	// otherwise present identically as loading=false, mergedResults=[].
+	const isShortQuery = q.trim().length < MIN_QUERY_LENGTH;
 
 	// A single source is in scope when the scope is narrowed (selected from the
 	// dropdown) or locked (`lockedScope` / restrictTo). Its filter chrome can
@@ -111,9 +119,11 @@ export function MergedSearchResults({
 		? "Searching…"
 		: error
 			? "Search failed."
-			: mergedResults.length === 0
-				? (emptyMessage ?? "No results found.")
-				: `${page.totalCount} result${page.totalCount === 1 ? "" : "s"}`;
+			: isShortQuery
+				? shortQueryMessage
+				: mergedResults.length === 0
+					? (emptyMessage ?? "No results found.")
+					: `${page.totalCount} result${page.totalCount === 1 ? "" : "s"}`;
 
 	return (
 		<div className={`space-y-6 ${className ?? ""}`}>
@@ -161,6 +171,8 @@ export function MergedSearchResults({
 						<Skeleton key={i} className="h-48 w-full rounded-lg" />
 					))}
 				</div>
+			) : isShortQuery ? (
+				<p className="py-12 text-center text-sm text-muted-foreground">{shortQueryMessage}</p>
 			) : mergedResults.length === 0 ? (
 				<p className="py-12 text-center text-sm text-muted-foreground">
 					{emptyMessage ?? "No results found."}

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/components/SearchResults.tsx

@@ -80,6 +80,7 @@ export function SearchResults({
 						renderFilters={resolvedRenderFilters}
 						hideFilterChrome={filtersHidden}
 						emptyMessage={emptyMessages?.[key]}
+						q={handle.q}
 					/>
 				);
 			})}

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/components/SourceSection.tsx

@@ -9,13 +9,14 @@
  */
 
 import type { ReactNode } from "react";
-import { AlertCircle, SearchX } from "lucide-react";
+import { AlertCircle, Search, SearchX } from "lucide-react";
 import { Alert, AlertDescription, AlertTitle } from "../../../components/ui/alert";
 import { Skeleton } from "../../../components/ui/skeleton";
 import { ActiveFilters } from "./filters/ActiveFilters";
 import { FilterProvider, FilterResetButton } from "./filters/FilterContext";
 import { PaginationControls } from "./controls/PaginationControls";
 import { SortControl } from "./controls/SortControl";
+import { MIN_QUERY_LENGTH } from "../constants";
 import type { SourceController } from "../types";
 
 interface SourceSectionProps {
@@ -35,6 +36,15 @@ interface SourceSectionProps {
 	 */
 	hideFilterChrome?: boolean;
 	emptyMessage?: string;
+	/**
+	 * The current search query. Used to distinguish a not-yet-started search
+	 * (query below {@link MIN_QUERY_LENGTH}, so no fetch was issued) from a
+	 * genuine zero-match result, so the empty state can prompt instead of
+	 * claiming "No … found."
+	 */
+	q?: string;
+	/** Message shown when the query is below {@link MIN_QUERY_LENGTH}. Defaults to "Start your search…" */
+	shortQueryMessage?: string;
 	className?: string;
 }
 
@@ -44,6 +54,8 @@ export function SourceSection({
 	renderFilters,
 	hideFilterChrome,
 	emptyMessage,
+	q = "",
+	shortQueryMessage = "Start your search…",
 	className,
 }: SourceSectionProps) {
 	const { config, result, loading, error, filters, sort, pagination } = controller;
@@ -51,6 +63,9 @@ export function SourceSection({
 	const totalCount = result?.totalCount;
 	const showResults = !loading && !error && nodes.length > 0;
 	const showEmpty = !loading && !error && nodes.length === 0;
+	// A query below MIN_QUERY_LENGTH never triggers a fetch, so an empty result
+	// means "not searched yet" — prompt rather than report zero matches.
+	const isShortQuery = q.trim().length < MIN_QUERY_LENGTH;
 
 	const pageSizeOptions = pagination.pageSizeOptions ?? [pagination.pageSize];
 
@@ -70,7 +85,9 @@ export function SourceSection({
 		: error
 			? `Failed to load ${config.label}.`
 			: showEmpty
-				? (emptyMessage ?? `No ${config.label.toLowerCase()} found.`)
+				? isShortQuery
+					? shortQueryMessage
+					: (emptyMessage ?? `No ${config.label.toLowerCase()} found.`)
 				: totalCount != null
 					? `${config.label}: ${totalCount} ${totalCount === 1 ? "result" : "results"}`
 					: "";
@@ -153,9 +170,15 @@ export function SourceSection({
 
 					{showEmpty && (
 						<div className="flex flex-col items-center justify-center py-10 text-center">
-							<SearchX className="size-10 text-muted-foreground mb-3" />
+							{isShortQuery ? (
+								<Search className="size-10 text-muted-foreground mb-3" />
+							) : (
+								<SearchX className="size-10 text-muted-foreground mb-3" />
+							)}
 							<p className="text-sm text-muted-foreground">
-								{emptyMessage ?? `No ${config.label.toLowerCase()} found.`}
+								{isShortQuery
+									? shortQueryMessage
+									: (emptyMessage ?? `No ${config.label.toLowerCase()} found.`)}
 							</p>
 						</div>
 					)}

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/hooks/useSearch.ts

@@ -40,7 +40,11 @@ import { MIN_QUERY_LENGTH } from "../constants";
 // `resolveChannelId` derives the discovery channel id from a CMS result;
 // `useSearchableContentTypes` is the session-cached discovery hook;
 // `isValidCmsFqn` validates a selected FQN before it enters state or a query.
-import { getUIBundleId, isConfiguredUIBundleId } from "../adapters/cms/searchChannel";
+import {
+	getUIBundleId,
+	getUserLanguage,
+	isConfiguredUIBundleId,
+} from "../adapters/cms/searchChannel";
 import { getOrgSupportsCmsSearch } from "../adapters/cms/api/orgApiVersionService";
 import { resolveChannelId } from "../adapters/cms/channelResolver";
 import { useSearchableContentTypes } from "../adapters/cms/hooks/useSearchableContentTypes";
@@ -98,7 +102,7 @@ interface ResolvedPagination {
 }
 
 /** Resolves the single global pagination config, filling in defaults. */
-function resolvePagination(config: SearchConfig): ResolvedPagination {
+export function resolvePagination(config: SearchConfig): ResolvedPagination {
 	const p = config.pagination;
 	const pageSizeOptions =
 		p?.pageSizeOptions && p.pageSizeOptions.length > 0
@@ -119,7 +123,7 @@ function validatePageSize(pagination: ResolvedPagination, size: number): number
 	return valid.includes(size) ? size : pagination.pageSize;
 }
 
-function initSourceState(
+export function initSourceState(
 	source: SourceConfig,
 	params: URLSearchParams,
 	pagination: ResolvedPagination,
@@ -135,7 +139,8 @@ function initSourceState(
 		filters: read.filters,
 		sort,
 		pageSize,
-		pageIndex: read.pageIndex,
+		// Cursors aren't persisted to the URL, so always seed the first page (page param ignored on read).
+		pageIndex: 0,
 		afterCursor: undefined,
 		cursorStack: [],
 	};
@@ -503,8 +508,8 @@ export function useSearch(config: SearchConfig, options?: UseSearchOptions): Sea
 		// page-level error — content-type narrowing is an enhancement, not a
 		// hard requirement. Read in `.catch` below.
 		let isDiscoveryRefetch = false;
-		Promise.all([getUIBundleId(), getOrgSupportsCmsSearch()])
-			.then(([uiBundleId, orgSupportsCmsSearch]) => {
+		Promise.all([getUIBundleId(), getUserLanguage(), getOrgSupportsCmsSearch()])
+			.then(([uiBundleId, userLanguage, orgSupportsCmsSearch]) => {
 				if (cancelled || generation !== fetchGenRef.current) return;
 
 				const requests: SourceRequest[] = activeSources.flatMap((source) => {
@@ -541,7 +546,7 @@ export function useSearch(config: SearchConfig, options?: UseSearchOptions): Sea
 					if (!cmsFqn && discoveredContentTypeFqns.length > 0) {
 						isDiscoveryRefetch = true;
 					}
-					return [{ ...base, uiBundleId, contentTypes }];
+					return [{ ...base, uiBundleId, language: userLanguage, contentTypes }];
 				});
 
 				// Every in-scope source was gated out (e.g. a CMS-only scope while CMS

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/_f_/search/utils/filterUtils.ts

@@ -208,12 +208,17 @@ function toEndOfDay(d: string) {
 	return `${d}T23:59:59.999Z`;
 }
 
+/** Escapes LIKE metacharacters (`\`, `%`, `_`) so user input is matched literally. */
+function escapeLikePattern(value: string): string {
+	return value.replace(/[\\%_]/g, "\\$&");
+}
+
 function buildSingleFilter(filter: ActiveFilterValue, config?: FilterFieldConfig): unknown {
 	const { field, type, value, min, max } = filter;
 	switch (type) {
 		case "text": {
 			if (!value) return null;
-			return { [field]: { like: `%${value}%` } };
+			return { [field]: { like: `%${escapeLikePattern(value)}%` } };
 		}
 		case "picklist": {
 			if (!value) return null;
@@ -228,8 +233,13 @@ function buildSingleFilter(filter: ActiveFilterValue, config?: FilterFieldConfig
 				if (config?.max != null) n = Math.min(n, config.max);
 				return n;
 			};
-			if (min) ops.gte = clamp(Number(min));
-			if (max) ops.lte = clamp(Number(max));
+			// Drop any endpoint that isn't finite — NaN/Infinity serialize to null on the wire.
+			const lo = Number(min);
+			if (min && Number.isFinite(lo)) ops.gte = clamp(lo);
+			const hi = Number(max);
+			if (max && Number.isFinite(hi)) ops.lte = clamp(hi);
+			// If both endpoints were dropped as invalid, emit no clause at all.
+			if (Object.keys(ops).length === 0) return null;
 			return { [field]: ops };
 		}
 		case "boolean": {
@@ -284,7 +294,7 @@ export function buildGlobalQueryClause(q: string, searchableFields: string[]): u
 	if (!trimmed || searchableFields.length === 0) return undefined;
 	const clauses = searchableFields.map((path) => {
 		const parts = path.split(".");
-		let clause: Record<string, unknown> = { like: `%${trimmed}%` };
+		let clause: Record<string, unknown> = { like: `%${escapeLikePattern(trimmed)}%` };
 		for (let i = parts.length - 1; i >= 0; i--) {
 			clause = { [parts[i]]: clause };
 		}

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/appLayout.tsx

@@ -1,6 +1,6 @@
 import { Outlet, Link, useLocation } from "react-router";
 import { getAllRoutes } from "./router-utils";
-import { useState } from "react";
+import { useEffect, useId, useRef, useState } from "react";
 import { AuthMenu } from "./features/authentication/menu/AuthMenu";
 import { Button } from "./components/ui/button";
 import CustomerWebClientChat from "./components/CustomerWebClientChat";
@@ -8,6 +8,21 @@ import CustomerWebClientChat from "./components/CustomerWebClientChat";
 export default function AppLayout() {
 	const [isOpen, setIsOpen] = useState(false);
 	const location = useLocation();
+	const navId = useId();
+	const outletWrapperRef = useRef<HTMLDivElement>(null);
+	const previousPathname = useRef<string | null>(null);
+
+	useEffect(() => {
+		if (previousPathname.current !== null && previousPathname.current !== location.pathname) {
+			const wrapper = outletWrapperRef.current;
+			const target = wrapper?.querySelector<HTMLElement>("h1, main, [role='main']") ?? wrapper;
+			if (target) {
+				if (!target.hasAttribute("tabindex")) target.setAttribute("tabindex", "-1");
+				target.focus();
+			}
+		}
+		previousPathname.current = location.pathname;
+	}, [location.pathname]);
 
 	const isActive = (path: string) => location.pathname === path;
 
@@ -30,6 +45,20 @@ export default function AppLayout() {
 
 	return (
 		<>
+			<a
+				href="#main-content"
+				onClick={(e) => {
+					e.preventDefault();
+					const content = outletWrapperRef.current;
+					if (content) {
+						if (!content.hasAttribute("tabindex")) content.setAttribute("tabindex", "-1");
+						content.focus();
+					}
+				}}
+				className="sr-only focus:not-sr-only focus:absolute focus:z-50 focus:top-2 focus:left-2 focus:rounded-md focus:bg-white focus:px-4 focus:py-2 focus:text-gray-900 focus:shadow focus:ring-2 focus:ring-gray-900"
+			>
+				Skip to main content
+			</a>
 			<nav className="bg-white border-b border-gray-200">
 				<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
 					<div className="flex justify-between items-center h-16">
@@ -44,8 +73,12 @@ export default function AppLayout() {
 								onClick={toggleMenu}
 								aria-label="Toggle menu"
 								aria-expanded={isOpen}
+								aria-controls={navId}
 							>
-								<div className="w-6 h-6 flex flex-col justify-center space-y-1.5">
+								<div
+									aria-hidden="true"
+									className="w-6 h-6 flex flex-col justify-center space-y-1.5"
+								>
 									<span
 										className={`block h-0.5 w-6 bg-current transition-all ${
 											isOpen ? "rotate-45 translate-y-2" : ""
@@ -63,8 +96,8 @@ export default function AppLayout() {
 							</Button>
 						</div>
 					</div>
-					{isOpen && (
-						<div className="pb-4">
+					<div id={navId} className="pb-4" hidden={!isOpen}>
+						{isOpen && (
 							<div className="flex flex-col space-y-1">
 								{navigationRoutes.map((item) => (
 									<Button
@@ -79,11 +112,13 @@ export default function AppLayout() {
 									</Button>
 								))}
 							</div>
-						</div>
-					)}
+						)}
+					</div>
 				</div>
 			</nav>
-			<Outlet />
+			<div id="main-content" ref={outletWrapperRef}>
+				<Outlet />
+			</div>
 			<CustomerWebClientChat
 				orgId="<ORG_ID_15_OR_18_CHAR_00D...>"
 				deploymentName="<EMBEDDED_SERVICE_DEPLOYMENT_NAME>"

package/lib/templates/project/reactexternalapp/_p_/_m_/_w_/_a_/src/components/ObjectBreadcrumb.tsx

@@ -9,11 +9,7 @@ import {
 } from "./ui/breadcrumb";
 import { Skeleton } from "./ui/skeleton";
 
-/**
- * Home → List → Record breadcrumb for object pages. Previously imported from
- * feature-react-object-search; inlined here so the app no longer depends on
- * that feature.
- */
+/** Home → List → Record breadcrumb, shared so every object page renders the same navigation trail. */
 interface ObjectBreadcrumbProps {
 	listPath: string;
 	listLabel: string;