@salesforce/ui-bundle-template-app-angular-template-b2x 11.35.5 → 11.36.0

package/dist/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [11.36.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v11.35.6...v11.36.0) (2026-07-24)
+
+**Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
+
+
+
+
+
+## [11.35.6](https://github.com/salesforce-experience-platform-emu/webapps/compare/v11.35.5...v11.35.6) (2026-07-23)
+
+**Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
+
+
+
+
+
 ## [11.35.5](https://github.com/salesforce-experience-platform-emu/webapps/compare/v11.35.4...v11.35.5) (2026-07-23)
 
 **Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project

package/dist/force-app/main/default/uiBundles/angularextapp/.graphqlrc.yml

@@ -0,0 +1,2 @@
+schema: '../../../../../schema.graphql'
+documents: 'src/**/*.{graphql,ts}'

package/dist/force-app/main/default/uiBundles/angularextapp/angular.json

@@ -43,10 +43,11 @@
                 "silenceDeprecations": ["import"]
               }
             },
-            "plugins": ["./esbuild/api-version.mjs"]
+            "plugins": []
           },
           "configurations": {
             "production": {
+              "plugins": ["./esbuild/api-version.mjs"],
               "budgets": [
                 {
                   "type": "anyComponentStyle",
@@ -64,6 +65,7 @@
               }
             },
             "development": {
+              "plugins": ["./esbuild/graphql-codegen.mjs"],
               "optimization": false,
               "extractLicenses": false,
               "sourceMap": true

package/dist/force-app/main/default/uiBundles/angularextapp/codegen.yml

@@ -0,0 +1,95 @@
+schema: '../../../../../schema.graphql'
+documents: 'src/**/*.{graphql,ts}'
+generates:
+  src/app/api/graphql-operations-types.ts:
+    plugins:
+      - 'graphql-codegen-typescript-operation-types'
+      - 'typescript-operations'
+    config:
+      onlyOperationTypes: true
+      skipTypename: true
+      preResolveTypes: true
+      scalars:
+        # String-serialized scalars
+        JSON:
+          input: 'string'
+          output: 'string'
+        Date:
+          input: 'string'
+          output: 'string'
+        DateTime:
+          input: 'string'
+          output: 'string'
+        Time:
+          input: 'string'
+          output: 'string'
+        Email:
+          input: 'string'
+          output: 'string'
+        Url:
+          input: 'string'
+          output: 'string'
+        PhoneNumber:
+          input: 'string'
+          output: 'string'
+        Picklist:
+          input: 'string'
+          output: 'string'
+        MultiPicklist:
+          input: 'string'
+          output: 'string'
+        TextArea:
+          input: 'string'
+          output: 'string'
+        LongTextArea:
+          input: 'string'
+          output: 'string'
+        RichTextArea:
+          input: 'string'
+          output: 'string'
+        EncryptedString:
+          input: 'string'
+          output: 'string'
+        Base64:
+          input: 'string'
+          output: 'string'
+        IdOrRef:
+          input: 'string'
+          output: 'string'
+        # BigDecimal-serialized scalars (accepts number or string, returns number)
+        Currency:
+          input: 'number | string'
+          output: 'number'
+        BigDecimal:
+          input: 'number | string'
+          output: 'number'
+        Double:
+          input: 'number | string'
+          output: 'number'
+        Percent:
+          input: 'number | string'
+          output: 'number'
+        Longitude:
+          input: 'number | string'
+          output: 'number'
+        Latitude:
+          input: 'number | string'
+          output: 'number'
+        # Integer-like scalars
+        Long:
+          input: 'number'
+          output: 'number'
+        BigInteger:
+          input: 'number'
+          output: 'number'
+        Short:
+          input: 'number'
+          output: 'number'
+        Byte:
+          input: 'number'
+          output: 'number'
+        Char:
+          input: 'number'
+          output: 'number'
+overwrite: true
+ignoreNoDocuments: true

package/dist/force-app/main/default/uiBundles/angularextapp/esbuild/graphql-codegen.mjs

@@ -0,0 +1,13 @@
+/**
+ * GraphQL Codegen esbuild plugin — runs codegen on build start.
+ *
+ * Resolves GraphQL operations into typed TypeScript at build time using the
+ * project's `codegen.yml` configuration. Re-runs on every rebuild during
+ * `ng serve` so generated types stay in sync with schema/document changes.
+ *
+ * Referenced from angular.json: architect.build.options.plugins[].
+ */
+import { createGraphQLCodegenPlugin } from '@salesforce/angular-plugin-ui-bundle';
+
+const plugin = createGraphQLCodegenPlugin();
+export default plugin;

package/dist/force-app/main/default/uiBundles/angularextapp/package.json

@@ -14,7 +14,9 @@
     "test": "ng test",
     "lint": "ng lint",
     "build:e2e": "ng build && node scripts/rewrite-e2e-assets.mjs",
-    "e2e": "playwright test"
+    "e2e": "playwright test",
+    "graphql:schema": "node scripts/get-graphql-schema.mjs",
+    "graphql:codegen": "graphql-codegen"
   },
   "dependencies": {
     "@angular/animations": "^21.2.0",
@@ -48,7 +50,12 @@
     "tailwindcss": "^4.0.0",
     "typescript": "~5.9.2",
     "typescript-eslint": "^8.0.0",
-    "vitest": "^4.1.0"
+    "vitest": "^4.1.0",
+    "@graphql-codegen/cli": "^6.1.0",
+    "@graphql-codegen/typescript-operations": "^5.0.6",
+    "graphql": "^16.11.0",
+    "graphql-codegen-typescript-operation-types": "^2.0.2",
+    "@graphql-eslint/eslint-plugin": "^4.1.0"
   },
   "overrides": {
     "undici": "^7.28.0"

package/dist/force-app/main/default/uiBundles/angularextapp/scripts/get-graphql-schema.mjs

@@ -0,0 +1,69 @@
+/**
+ * Downloads the full GraphQL schema from a connected Salesforce org via introspection.
+ *
+ * Usage:
+ *   npm run graphql:schema
+ *   node scripts/get-graphql-schema.mjs [output-path]
+ *
+ * The default output path matches the schema location expected by codegen.yml
+ * and .graphqlrc.yml so that codegen and IDE tooling resolve it automatically.
+ */
+import { writeFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+import { getOrgInfo } from '@salesforce/ui-bundle/app';
+import { buildClientSchema, getIntrospectionQuery, printSchema } from 'graphql';
+import { pruneSchema } from '@graphql-tools/utils';
+
+const DEFAULT_SCHEMA_PATH = '../../../../../schema.graphql';
+const TARGET_ORG = process.env.SF_TARGET_ORG || undefined;
+
+async function executeSalesforceGraphQLQuery(query, variables, operationName) {
+	const orgInfo = await getOrgInfo(TARGET_ORG);
+	if (!orgInfo) {
+		throw new Error('Could not resolve a Salesforce org. Set SF_TARGET_ORG or a default org.');
+	}
+	const { rawInstanceUrl: instanceUrl, apiVersion, accessToken } = orgInfo;
+
+	const targetUrl = `${instanceUrl}/services/data/v${apiVersion}/graphql`;
+
+	console.log(`Executing introspection query against ${targetUrl}`);
+	const response = await fetch(targetUrl, {
+		method: 'POST',
+		headers: {
+			Authorization: `Bearer ${accessToken}`,
+			'Content-Type': 'application/json',
+			'X-Chatter-Entity-Encoding': 'false',
+		},
+		body: JSON.stringify({ query, variables, operationName }),
+	});
+
+	if (!response.ok) {
+		const errorText = await response.text();
+		throw new Error(
+			`Salesforce GraphQL request failed: ${response.status} ${response.statusText} - ${errorText}`,
+		);
+	}
+
+	return response.json();
+}
+
+try {
+	const outputPath = resolve(process.argv[2] || DEFAULT_SCHEMA_PATH);
+
+	const introspectionResult = await executeSalesforceGraphQLQuery(
+		getIntrospectionQuery(),
+		{},
+		'IntrospectionQuery',
+	);
+
+	const schema = buildClientSchema(introspectionResult.data);
+	const prunedSchema = pruneSchema(schema);
+	const sdl = printSchema(prunedSchema);
+
+	writeFileSync(outputPath, sdl);
+
+	console.log(`Schema saved to ${outputPath}`);
+} catch (error) {
+	console.error('Error:', error.message);
+	process.exit(1);
+}

package/dist/force-app/main/default/uiBundles/angularextapp/src/app/api/account/account-search.service.ts

@@ -16,121 +16,51 @@ import { GET_ACCOUNT_DETAIL } from "./getAccountDetail";
 import { DISTINCT_ACCOUNT_INDUSTRIES } from "./distinctAccountIndustries";
 import { DISTINCT_ACCOUNT_TYPES } from "./distinctAccountTypes";
 
+import type {
+	SearchAccountsQuery,
+	SearchAccountsQueryVariables,
+	GetAccountDetailQuery,
+	DistinctAccountIndustriesQuery,
+	DistinctAccountTypesQuery,
+} from "../graphql-operations-types";
+
+import {
+	ObjectSearchService,
+	type PicklistOption,
+	type ObjectSearchOptions,
+} from "../../features/object-search/api/object-search.service";
+
 // ---------------------------------------------------------------------------
-// Local response shape types. Codegen is PARKED for the Angular port; when it
-// lands, replace these hand-written interfaces with the generated ones from
-// graphql-operations-types (see the React reference for the equivalent).
+// Derived type aliases — replace the previously hand-written interfaces with
+// types extracted from the generated GraphQL operations
 // ---------------------------------------------------------------------------
 
-/** A Salesforce GraphQL scalar field: `{ value, displayValue }`. */
-export interface UiScalarField<T = unknown> {
-	value?: T | null;
-	displayValue?: string | null;
-}
+export type AccountSearchResult = NonNullable<SearchAccountsQuery["uiapi"]["query"]["Account"]>;
 
-/** An Account node with the fields the search + detail queries request. */
-export interface AccountNode {
-	Id: string;
-	Name?: UiScalarField<string> | null;
-	Industry?: UiScalarField<string> | null;
-	Type?: UiScalarField<string> | null;
-	Phone?: UiScalarField<string> | null;
-	Owner?: { Name?: UiScalarField<string> | null } | null;
-	AnnualRevenue?: UiScalarField<number> | null;
-	// Detail-only fields (undefined in list responses).
-	Fax?: UiScalarField<string> | null;
-	Parent?: { Name?: UiScalarField<string> | null } | null;
-	Website?: UiScalarField<string> | null;
-	NumberOfEmployees?: UiScalarField<number> | null;
-	Description?: UiScalarField<string> | null;
-	BillingStreet?: UiScalarField<string> | null;
-	BillingCity?: UiScalarField<string> | null;
-	BillingState?: UiScalarField<string> | null;
-	BillingPostalCode?: UiScalarField<string> | null;
-	BillingCountry?: UiScalarField<string> | null;
-	ShippingStreet?: UiScalarField<string> | null;
-	ShippingCity?: UiScalarField<string> | null;
-	ShippingState?: UiScalarField<string> | null;
-	ShippingPostalCode?: UiScalarField<string> | null;
-	ShippingCountry?: UiScalarField<string> | null;
-	CreatedBy?: { Name?: UiScalarField<string> | null } | null;
-	CreatedDate?: UiScalarField<string> | null;
-	LastModifiedBy?: { Name?: UiScalarField<string> | null } | null;
-	LastModifiedDate?: UiScalarField<string> | null;
-}
+export type AccountSearchNode = NonNullable<
+	NonNullable<NonNullable<AccountSearchResult["edges"]>[number]>["node"]
+>;
 
-/** GraphQL page-info block returned by the connection response. */
-export interface AccountPageInfo {
-	hasNextPage?: boolean;
-	hasPreviousPage?: boolean;
-	endCursor?: string | null;
-	startCursor?: string | null;
-}
+export type AccountDetailResult = NonNullable<GetAccountDetailQuery["uiapi"]["query"]["Account"]>;
 
-/** The `uiapi.query.Account` connection returned by the search query. */
-export interface AccountSearchResult {
-	edges: Array<{ node: AccountNode } | null> | null;
-	pageInfo: AccountPageInfo;
-	totalCount?: number;
-}
+export type AccountDetailNode = NonNullable<
+	NonNullable<NonNullable<AccountDetailResult["edges"]>[number]>["node"]
+>;
 
-/** Wire shape for the `search` query. */
-interface SearchAccountsData {
-	uiapi: { query: { Account: AccountSearchResult | null } };
-}
-
-/** Wire shape for the `getAccountDetail` query. */
-interface GetAccountDetailData {
-	uiapi: {
-		query: {
-			Account: { edges: Array<{ node: AccountNode } | null> | null } | null;
-		};
-	};
-}
+export type AccountSearchOptions = ObjectSearchOptions<
+	SearchAccountsQueryVariables["where"],
+	SearchAccountsQueryVariables["orderBy"]
+>;
 
-/** Wire shape for the distinct-value aggregate queries. */
-interface DistinctAccountData {
-	uiapi: {
-		aggregate: {
-			Account: {
-				edges: Array<{
-					node: {
-						aggregate?: Record<
-							string,
-							{
-								value?: string | null;
-								displayValue?: string | null;
-								label?: string | null;
-							} | null
-						> | null;
-					};
-				} | null> | null;
-			} | null;
-		};
-	};
-}
-
-/** Picklist option shape shared with filter components. */
-export interface PicklistOption {
-	value: string;
-	label: string;
-}
-
-/** Search args mirroring the React `AccountSearchOptions`. */
-export interface AccountSearchArgs {
-	where?: unknown;
-	orderBy?: unknown;
-	first?: number;
-	after?: string;
-}
+export type { PicklistOption };
 
 /**
  * Angular account-search data service.
  *
- * Wraps the base-app's `DataClient` with typed methods per feature query
- * (search, detail, and the two distinct-value aggregates that populate the
- * Industry / Type filter options). Provided in root; the service is stateless
- * (all state lives in `ObjectSearchStateService` per-page).
+ * Wraps `ObjectSearchService` for search/aggregate queries and `DataClient`
+ * directly for the detail query (which takes an `id` variable rather than
+ * search options). Provided in root; the service is stateless (all state lives
+ * in `ObjectSearchStateService` per-page).
  *
  * Mirrors the React `accountSearchService` module — the shape of the returned
  * data is identical so the templates can be a straight JSX-to-Angular port.
@@ -138,26 +68,20 @@ export interface AccountSearchArgs {
 @Injectable({ providedIn: "root" })
 export class AccountSearchService {
 	private readonly client = inject(DataClient);
+	private readonly objectSearch = inject(ObjectSearchService);
 
 	/** Runs the search query and returns the `Account` connection. */
-	async searchAccounts(args: AccountSearchArgs = {}): Promise<AccountSearchResult> {
-		const { where, orderBy, first = 20, after } = args;
-		const data = await this.client.execute<SearchAccountsData, AccountSearchArgs>(SEARCH_ACCOUNTS, {
-			where,
-			orderBy,
-			first,
-			after,
-		});
-		const account = data.uiapi.query.Account;
-		if (!account) {
-			throw new Error("No Account data returned");
-		}
-		return account;
+	async searchAccounts(args: AccountSearchOptions = {}): Promise<AccountSearchResult> {
+		return this.objectSearch.searchObjects<
+			AccountSearchResult,
+			SearchAccountsQuery,
+			SearchAccountsQueryVariables
+		>(SEARCH_ACCOUNTS, "Account", args);
 	}
 
 	/** Fetches a single Account by Id; returns `null` if not found. */
-	async getAccountDetail(id: string): Promise<AccountNode | null> {
-		const data = await this.client.execute<GetAccountDetailData, { id: string }>(
+	async getAccountDetail(id: string): Promise<AccountDetailNode | null> {
+		const data = await this.client.execute<GetAccountDetailQuery, { id: string }>(
 			GET_ACCOUNT_DETAIL,
 			{ id },
 		);
@@ -166,31 +90,19 @@ export class AccountSearchService {
 
 	/** Distinct `Industry` values for the picklist filter. */
 	async fetchDistinctIndustries(): Promise<PicklistOption[]> {
-		return this.fetchDistinctValues("Industry", DISTINCT_ACCOUNT_INDUSTRIES);
+		return this.objectSearch.fetchDistinctValues<DistinctAccountIndustriesQuery>(
+			DISTINCT_ACCOUNT_INDUSTRIES,
+			"Account",
+			"Industry",
+		);
 	}
 
 	/** Distinct `Type` values for the multipicklist filter. */
 	async fetchDistinctTypes(): Promise<PicklistOption[]> {
-		return this.fetchDistinctValues("Type", DISTINCT_ACCOUNT_TYPES);
-	}
-
-	/**
-	 * Shared distinct-value shape parser. Mirrors the React
-	 * `fetchDistinctValues` in `objectSearchService.ts`: pulls
-	 * `uiapi.aggregate.Account.edges[].node.aggregate[fieldName]` and derives a
-	 * `{ value, label }` option, preferring `label` -> `displayValue` -> `value`
-	 * as the display string.
-	 */
-	private async fetchDistinctValues(fieldName: string, query: string): Promise<PicklistOption[]> {
-		const data = await this.client.execute<DistinctAccountData>(query);
-		const edges = data.uiapi.aggregate.Account?.edges ?? [];
-		const options: PicklistOption[] = [];
-		for (const edge of edges) {
-			const field = edge?.node.aggregate?.[fieldName];
-			const value = field?.value;
-			if (!value) continue;
-			options.push({ value, label: field.label ?? field.displayValue ?? value });
-		}
-		return options;
+		return this.objectSearch.fetchDistinctValues<DistinctAccountTypesQuery>(
+			DISTINCT_ACCOUNT_TYPES,
+			"Account",
+			"Type",
+		);
 	}
 }