refactor(browser-sdk): refactor API for setting overrides

Author: roncohen

packages/browser-sdk/src/client.ts

@@ -330,6 +330,17 @@ export interface Feature {
   requestFeedback: (
     options: Omit<RequestFeedbackData, "featureKey" | "featureId">,
   ) => void;
+
+  /**
+   * The current override status of isEnabled for the feature.
+   */
+  isEnabledOverride: boolean | null;
+
+  /**
+   * Set the override status for isEnabled for the feature.
+   * Set to `null` to remove the override.
+   */
+  setIsEnabledOverride(isEnabled: boolean | null): void;
 }
 
 function shouldShowToolbar(opts: InitOptions) {
@@ -737,17 +748,13 @@ export class BucketClient {
           ...options,
         });
       },
+      isEnabledOverride: this.featuresClient.getFeatureOverride(key),
+      setIsEnabledOverride(isEnabled: boolean | null) {
+        fClient.setFeatureOverride(key, isEnabled);
+      },
     };
   }
 
-  setFeatureOverride(key: string, isEnabled: boolean | null) {
-    this.featuresClient.setFeatureOverride(key, isEnabled);
-  }
-
-  getFeatureOverride(key: string): boolean | null {
-    return this.featuresClient.getFeatureOverride(key);
-  }
-
   sendCheckEvent(checkEvent: CheckEvent) {
     return this.featuresClient.sendCheckEvent(checkEvent);
   }

packages/browser-sdk/src/toolbar/Toolbar.tsx

@@ -46,7 +46,7 @@ export default function Toolbar({
           (feature) =>
             ({
               key: feature.key,
-              localOverride: bucketClient.getFeatureOverride(feature?.key),
+              localOverride: feature.isEnabledOverride,
               isEnabled: feature.isEnabled,
             }) satisfies FeatureItem,
         ),
@@ -101,9 +101,9 @@ export default function Toolbar({
         <DialogContent>
           <FeaturesTable
             features={searchedFeatures}
-            setEnabledOverride={bucketClient.setFeatureOverride.bind(
-              bucketClient,
-            )}
+            setEnabledOverride={(key: string, value: boolean | null) =>
+              bucketClient.getFeature(key).setIsEnabledOverride(value)
+            }
             appBaseUrl={appBaseUrl}
           />
         </DialogContent>

packages/browser-sdk/test/client.test.ts

@@ -70,7 +70,9 @@ describe("BucketClient", () => {
       await client.initialize();
       expect(featuresResult["featureA"].isEnabled).toBe(true);
       expect(client.getFeature("featureA").isEnabled).toBe(true);
-      client.setFeatureOverride("featureA", false);
+
+      client.getFeature("featureA").setIsEnabledOverride(false);
+
       expect(client.getFeature("featureA").isEnabled).toBe(false);
     });
   });

packages/browser-sdk/test/usage.test.ts

@@ -79,6 +79,8 @@ describe("usage", () => {
       isEnabled: false,
       track: expect.any(Function),
       requestFeedback: expect.any(Function),
+      isEnabledOverride: null,
+      setIsEnabledOverride: expect.any(Function),
       config: { key: undefined, payload: undefined },
     });
   });
@@ -413,6 +415,8 @@ describe(`sends "check" events `, () => {
         config: { key: undefined, payload: undefined },
         track: expect.any(Function),
         requestFeedback: expect.any(Function),
+        isEnabledOverride: null,
+        setIsEnabledOverride: expect.any(Function),
       });
 
       expect(client.getFeature("featureB")).toStrictEqual({
@@ -426,13 +430,17 @@ describe(`sends "check" events `, () => {
         },
         track: expect.any(Function),
         requestFeedback: expect.any(Function),
+        isEnabledOverride: null,
+        setIsEnabledOverride: expect.any(Function),
       });
 
       expect(client.getFeature("featureC")).toStrictEqual({
         isEnabled: false,
         config: { key: undefined, payload: undefined },
         track: expect.any(Function),
         requestFeedback: expect.any(Function),
+        isEnabledOverride: null,
+        setIsEnabledOverride: expect.any(Function),
       });
     });
 
@@ -561,6 +569,8 @@ describe(`sends "check" events `, () => {
         track: expect.any(Function),
         requestFeedback: expect.any(Function),
         config: { key: undefined, payload: undefined },
+        isEnabledOverride: null,
+        setIsEnabledOverride: expect.any(Function),
       });
 
       vi.spyOn(client, "track");
@@ -580,6 +590,8 @@ describe(`sends "check" events `, () => {
         track: expect.any(Function),
         requestFeedback: expect.any(Function),
         config: { key: undefined, payload: undefined },
+        isEnabledOverride: null,
+        setIsEnabledOverride: expect.any(Function),
       });
 
       vi.spyOn(client, "requestFeedback");