Streamlines feature flag handling in various components

(#5092, gitkraken/vscode-gitlens-private#78)

Author: sergeibbb

src/constants.storage.ts

@@ -6,6 +6,7 @@ import type { SubscriptionState } from './constants.subscription.js';
 import type { TrackedUsage, TrackedUsageKeys } from './constants.telemetry.js';
 import type { GroupableTreeViewTypes, TreeViewTypes } from './constants.views.js';
 import type { Environment } from './container.js';
+import type { FeatureFlagMap } from './featureFlags/featureFlagService.js';
 import type { FeaturePreviews } from './features.js';
 import type { OrganizationSettings } from './plus/gk/models/organization.js';
 import type { PaidSubscriptionPlanIds, Subscription } from './plus/gk/models/subscription.js';
@@ -95,6 +96,7 @@ interface GlobalStorageCore {
 	'graph:useNaturalLanguageSearch': boolean;
 	'views:scm:grouped:welcome:dismissed': boolean;
 	'integrations:configured': StoredIntegrationConfigurations;
+	'featureFlags:flags': FeatureFlagMap;
 }
 
 type GlobalStorageDynamic = Record<`plus:preview:${FeaturePreviews}:usages`, StoredFeaturePreviewUsagePeriod[]> &

src/extension.ts

@@ -312,7 +312,7 @@ async function setFeatureFlagTelemetryGlobalAttributes(container: Container): Pr
 		const featureFlags = await container.featureFlags;
 		if (featureFlags == null) return;
 
-		const flags = await featureFlags.getAllFlags();
+		const flags = featureFlags.getAllFlags();
 		if (Object.keys(flags).length === 0) return;
 
 		container.telemetry.setGlobalAttribute(

src/featureFlags/featureFlagService.ts

@@ -1,4 +1,4 @@
-import type { deserializeConfig, IConfigCatCache, IConfigCatClient, SettingTypeOf } from '@configcat/sdk';
+import type { deserializeConfig, IConfigCatCache, IConfigCatClient } from '@configcat/sdk';
 import type * as FeatureFlagProjectConfigModule from '@configcat/sdk/lib/esm/ProjectConfig.js';
 import { env as vscodeEnv } from 'vscode';
 import { fetch } from '@env/fetch.js';
@@ -11,13 +11,13 @@ type DeserializeFeatureFlagConfig = typeof deserializeConfig;
 
 export type FeatureFlagValue = boolean | string | number;
 export enum FeatureFlagKey {
-	WelcomeTitle = 'glensWelcomeTitle',
+	WelcomeTitleVariant = 'glensWelcomeTitleVariant',
 }
-export type FeatureFlagMap = Partial<Record<FeatureFlagKey, FeatureFlagValue>>;
+export type FeatureFlagMap = Readonly<Partial<Record<FeatureFlagKey, FeatureFlagValue>>>;
 export interface FeatureFlagService {
 	dispose(): void;
-	getFlag<T extends FeatureFlagValue>(key: FeatureFlagKey, defaultValue: T): Promise<FeatureFlagValue>;
-	getAllFlags(): Promise<FeatureFlagMap>;
+	getFlag<T extends FeatureFlagValue>(key: FeatureFlagKey, defaultValue: T): T;
+	getAllFlags(): FeatureFlagMap;
 }
 
 const _featureFlagKeys: ReadonlySet<string> = new Set<FeatureFlagKey>(Object.values(FeatureFlagKey));
@@ -50,95 +50,68 @@ class PrefetchedConfigCache implements IConfigCatCache {
 }
 
 export class ConfigCatFeatureFlagService implements FeatureFlagService {
-	private readonly _client: Promise<IConfigCatClient | undefined>;
+	private readonly _flags: FeatureFlagMap;
 
 	constructor(private readonly container: Container) {
-		this._client = this.loadClient();
-	}
+		this._flags = Object.freeze(this.container.storage.get('featureFlags:flags') ?? {});
 
-	dispose(): void {
-		void this._client.then(
-			client => {
-				client?.dispose();
-			},
-			() => {},
-		);
+		// Fire background fetch to evaluate flags and store them for the NEXT activation
+		void this.fetchAndCacheFlags();
 	}
 
-	async getFlag<T extends FeatureFlagValue>(key: FeatureFlagKey, defaultValue: T): Promise<SettingTypeOf<T> | T> {
-		using scope = maybeStartScopedLogger(`${getLoggableName(this)}.getFlag`);
-
-		const client = await this._client;
-		if (client == null) return defaultValue;
+	dispose(): void {}
 
-		try {
-			const details = await client.getValueDetailsAsync<T>(key, defaultValue);
-			return details.value;
-		} catch (ex) {
-			Logger.debug(ex, scope, `Failed to evaluate feature flag '${key}'; return default value`);
+	getFlag<T extends FeatureFlagValue>(key: FeatureFlagKey, defaultValue: T): T {
+		const value = this._flags[key];
+		if (value == null || typeof value !== typeof defaultValue) {
 			return defaultValue;
 		}
+		return value as T;
 	}
 
-	async getAllFlags(): Promise<FeatureFlagMap> {
-		using scope = maybeStartScopedLogger(`${getLoggableName(this)}.getAllFlags`);
-
-		const client = await this._client;
-		if (client == null) return {};
-
-		try {
-			const values = await client.getAllValuesAsync();
-			const flags: FeatureFlagMap = {};
-
-			for (const { settingKey, settingValue } of values) {
-				if (
-					isFeatureFlagKey(settingKey) &&
-					(typeof settingValue === 'boolean' ||
-						typeof settingValue === 'number' ||
-						typeof settingValue === 'string')
-				) {
-					flags[settingKey] = settingValue;
-				}
-			}
-
-			return flags;
-		} catch (ex) {
-			Logger.debug(ex, scope, 'Failed to evaluate feature flags; returning no flags');
-			return {};
-		}
+	getAllFlags(): FeatureFlagMap {
+		return this._flags;
 	}
 
-	private async loadClient(): Promise<IConfigCatClient | undefined> {
-		using scope = maybeStartScopedLogger(`${getLoggableName(this)}.loadClient`);
+	/**
+	 * Fetches fresh config from the API, evaluates all flags via ConfigCat SDK,
+	 * and stores the resolved flag map in globalState for the next activation.
+	 * Fire-and-forget — errors are logged but never propagated.
+	 */
+	private async fetchAndCacheFlags(): Promise<void> {
+		using scope = maybeStartScopedLogger(`${getLoggableName(this)}.fetchAndCacheFlags`);
 
 		try {
 			const response = await fetch(this.container.urls.getGkApiUrl('feature-flags', 'config'), {
 				headers: { Accept: 'application/json' },
 			});
 
 			if (!response.ok) {
-				Logger.debug(
-					scope,
-					`Failed to fetch feature flags config (${response.status} ${response.statusText}); using defaults`,
-				);
-				return undefined;
+				Logger.debug(scope, `Failed to fetch feature flags config (${response.status} ${response.statusText})`);
+				return;
 			}
 
 			const configJson = await response.text();
 			if (!configJson) {
-				Logger.debug(scope, 'Feature flags config response was empty; using defaults');
-				return undefined;
+				Logger.debug(scope, 'Feature flags config response was empty');
+				return;
 			}
 
-			return await this.createClient(configJson);
+			const flags = await this.evaluateFlags(configJson);
+			if (flags != null) {
+				await this.container.storage.store('featureFlags:flags', flags);
+			}
 		} catch (ex) {
-			Logger.debug(ex, scope, 'Failed to fetch feature flags config; using defaults');
-			return undefined;
+			Logger.debug(ex, scope, 'Failed to fetch and cache feature flags');
 		}
 	}
 
-	private async createClient(configJson: string): Promise<IConfigCatClient | undefined> {
-		using scope = maybeStartScopedLogger(`${getLoggableName(this)}.createClient`);
+	/**
+	 * Creates a temporary ConfigCat client to evaluate all flags from the given config JSON,
+	 * then disposes it immediately.
+	 */
+	private async evaluateFlags(configJson: string): Promise<FeatureFlagMap | undefined> {
+		using scope = maybeStartScopedLogger(`${getLoggableName(this)}.evaluateFlags`);
 
 		const [sdkResult, projectConfigResult] = await Promise.allSettled([
 			import(/* webpackChunkName: "feature-flags" */ '@configcat/sdk'),
@@ -149,26 +122,44 @@ export class ConfigCatFeatureFlagService implements FeatureFlagService {
 		const projectConfigModule = getSettledValue(projectConfigResult);
 
 		if (sdk == null || projectConfigModule == null) {
-			Logger.debug(scope, 'Failed to load ConfigCat SDK modules; using defaults');
+			Logger.debug(scope, 'Failed to load ConfigCat SDK modules');
 			return undefined;
 		}
 
+		let client: IConfigCatClient | undefined;
 		try {
 			const cache = new PrefetchedConfigCache(
 				this.serializeProjectConfig(configJson, sdk.deserializeConfig, projectConfigModule),
 			);
-			const client = sdk.getClient(localSdkKey, sdk.PollingMode.ManualPoll, {
+			client = sdk.getClient(localSdkKey, sdk.PollingMode.ManualPoll, {
 				cache: cache,
-				defaultUser: { identifier: vscodeEnv.machineId, country: 'ES' },
+				defaultUser: { identifier: vscodeEnv.machineId },
 				offline: true,
 			});
 
 			await client.waitForReady();
 			await client.forceRefreshAsync();
-			return client;
+
+			const values = await client.getAllValuesAsync();
+			const flags: Partial<Record<FeatureFlagKey, FeatureFlagValue>> = {};
+
+			for (const { settingKey, settingValue } of values) {
+				if (
+					isFeatureFlagKey(settingKey) &&
+					(typeof settingValue === 'boolean' ||
+						typeof settingValue === 'number' ||
+						typeof settingValue === 'string')
+				) {
+					flags[settingKey] = settingValue;
+				}
+			}
+
+			return flags;
 		} catch (ex) {
-			Logger.debug(ex, scope, 'Failed to initialize ConfigCat feature flag client; using defaults');
+			Logger.debug(ex, scope, 'Failed to evaluate feature flags');
 			return undefined;
+		} finally {
+			client?.dispose();
 		}
 	}
 

src/webviews/welcome/welcomeWebview.ts

@@ -110,7 +110,7 @@ export class WelcomeWebviewProvider implements WebviewProvider<State, State, Wel
 
 	private async getWelcomeTitleVariant(): Promise<string | undefined> {
 		const featureFlags = await this.container.featureFlags;
-		const showVariant = (await featureFlags?.getFlag(FeatureFlagKey.WelcomeTitle, false)) ?? false;
+		const showVariant = featureFlags?.getFlag(FeatureFlagKey.WelcomeTitleVariant, false) ?? false;
 		return showVariant ? 'Welcome' : undefined;
 	}