From 92d091dec86d99c136a169ad40c2d1438f97a8a6 Mon Sep 17 00:00:00 2001
From: Bilawal Hameed <bil@spotify.com>
Date: Thu, 26 Mar 2020 17:05:53 +0100
Subject: [PATCH] [core/apis] consolidated methods to get/set

---
 docs/reference/createPlugin-feature-flags.md  |  4 +--
 .../src/api/apis/definitions/featureFlags.ts  | 16 ++-------
 packages/core/src/api/app/FeatureFlags.tsx    | 35 +++++--------------
 .../components/WelcomePage/WelcomePage.tsx    |  8 +++--
 4 files changed, 19 insertions(+), 44 deletions(-)

diff --git a/docs/reference/createPlugin-feature-flags.md b/docs/reference/createPlugin-feature-flags.md
index 6da8d6b084..8226efc129 100644
--- a/docs/reference/createPlugin-feature-flags.md
+++ b/docs/reference/createPlugin-feature-flags.md
@@ -35,7 +35,7 @@ import { featureFlagsApiRef, useApi } from '@backstage/core';
 
 const ExampleButton: FC<{}> = () => {
   const featureFlagsApi = useApi(featureFlagsApiRef);
-  const handleClick = () => featureFlagsApi.enable('enable-example-feature');
+  const handleClick = () => featureFlagsApi.set('enable-example-feature', .Enabled);
 
   return (
     <Button variant="contained" color="primary" onClick={handleClick}>
@@ -55,7 +55,7 @@ import { Button } from '@material-ui/core';
 import { FeatureFlags } from '@backstage/core';
 
 const ExampleButton: FC<{}> = () => {
-  const handleClick = () => FeatureFlags.enable('enable-example-feature');
+  const handleClick = () => FeatureFlags.set('enable-example-feature', .Enabled);
 
   return (
     <Button variant="contained" color="primary" onClick={handleClick}>
diff --git a/packages/core/src/api/apis/definitions/featureFlags.ts b/packages/core/src/api/apis/definitions/featureFlags.ts
index 5874bfb052..750798d4b1 100644
--- a/packages/core/src/api/apis/definitions/featureFlags.ts
+++ b/packages/core/src/api/apis/definitions/featureFlags.ts
@@ -40,22 +40,12 @@ export type FeatureFlagsApi = {
    *
    * @returns bool True if the current user has enabled the feature flag
    */
-  getItem(name: FeatureFlagName): FeatureFlagState;
+  get(name: FeatureFlagName): FeatureFlagState;
 
   /**
-   * Enable an registered feature flag.
+   * Set the state of a Feature Flag
    */
-  enable(name: FeatureFlagName): void;
-
-  /**
-   * Disable an registered feature flag.
-   */
-  disable(name: FeatureFlagName): void;
-
-  /**
-   * Toggle an registered feature flag on or off.
-   */
-  toggle(name: FeatureFlagName): void;
+  set(name: FeatureFlagName, state: FeatureFlagState): void;
 };
 
 export const featureFlagsApiRef = new ApiRef<FeatureFlagsApi>({
diff --git a/packages/core/src/api/app/FeatureFlags.tsx b/packages/core/src/api/app/FeatureFlags.tsx
index 8373e538c2..ff3ff10481 100644
--- a/packages/core/src/api/app/FeatureFlags.tsx
+++ b/packages/core/src/api/app/FeatureFlags.tsx
@@ -43,12 +43,15 @@ class FeatureFlagsImpl implements FeatureFlagsApi {
     }
   }
 
-  private saveUserEnabledFeatureFlags(flags: Set<FeatureFlagName>): void {
-    if (!('localStorage' in window)) {
-      throw new Error(
-        'Feature Flags are not supported on browsers without the Local Storage API',
-      );
-    }
+  get(name: FeatureFlagName): FeatureFlagState {
+    return this.getUserEnabledFeatureFlags().has(name) as FeatureFlagState;
+  }
+
+  set(name: FeatureFlagName, state: FeatureFlagState): void {
+    const flags = this.getUserEnabledFeatureFlags();
+
+    if (state === FeatureFlagState.NotEnabled) flags.delete(name);
+    if (state === FeatureFlagState.Enabled) flags.add(name);
 
     window.localStorage.setItem(
       this.localStorageKey,
@@ -57,26 +60,6 @@ class FeatureFlagsImpl implements FeatureFlagsApi {
       ),
     );
   }
-
-  getItem(name: FeatureFlagName): FeatureFlagState {
-    return this.getUserEnabledFeatureFlags().has(name) as FeatureFlagState;
-  }
-
-  enable(name: FeatureFlagName): void {
-    const flags = this.getUserEnabledFeatureFlags();
-    flags.add(name);
-    this.saveUserEnabledFeatureFlags(flags);
-  }
-
-  disable(name: FeatureFlagName): void {
-    const flags = this.getUserEnabledFeatureFlags();
-    flags.delete(name);
-    this.saveUserEnabledFeatureFlags(flags);
-  }
-
-  toggle(name: FeatureFlagName): void {
-    (this.getItem(name) ? this.disable : this.enable).bind(this)(name);
-  }
 }
 
 export const FeatureFlags = new FeatureFlagsImpl();
diff --git a/plugins/welcome/src/components/WelcomePage/WelcomePage.tsx b/plugins/welcome/src/components/WelcomePage/WelcomePage.tsx
index f8db59479c..7d64b1470a 100644
--- a/plugins/welcome/src/components/WelcomePage/WelcomePage.tsx
+++ b/plugins/welcome/src/components/WelcomePage/WelcomePage.tsx
@@ -36,7 +36,6 @@ import {
   SupportButton,
   featureFlagsApiRef,
   useApi,
-  FeatureFlagsContext,
 } from '@backstage/core';
 import ErrorButton from './ErrorButton';
 
@@ -132,11 +131,14 @@ const WelcomePage: FC<{}> = () => {
                 variant="contained"
                 color="secondary"
                 onClick={() => {
-                  featureFlagsApi.toggle('enable-welcome-box');
+                  featureFlagsApi.set(
+                    'enable-welcome-box',
+                    !featureFlagsApi.get('enable-welcome-box'),
+                  );
                   window.location.reload();
                 }}
               >
-                {featureFlagsApi.getItem('enable-welcome-box')
+                {featureFlagsApi.get('enable-welcome-box')
                   ? 'Disable '
                   : 'Enable '}{' '}
                 'enable-welcome-box' feature flag