[webui] Put Baselines behind feature flag

snowflakedb · Feb 25, 2020 · d98f0a6 · d98f0a6
1 parent c7225d4
commit d98f0a6
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 34 deletions.
diff --git a/src/webui/frontend/src/common/menu.ts b/src/webui/frontend/src/common/menu.ts
@@ -4,17 +4,18 @@ function isNotNull<T>(value: T | null): value is T {
   return value !== null;
 }
 
-const menuData: stateTypes.MenuData = [
+export const getMenuData = () => [
   {
     name: 'Data Connectors',
     icon: 'api',
     path: '/dashboard/connectors/',
   },
-  {
-    name: 'Baselines',
-    icon: 'line-chart',
-    path: '/dashboard/baselines/',
-  },
+  localStorage.getItem('enable_baselines')
+    ? {
+      name: 'Baselines',
+      icon: 'line-chart',
+      path: '/dashboard/baselines/',
+    } : null,
   {
     name: 'Alerts',
     icon: 'alert',
@@ -45,30 +46,3 @@ const menuData: stateTypes.MenuData = [
     ],
   },
 ].filter(isNotNull);
-
-function isUrl(path: string) {
-  // tslint:disable
-  // eslint-disable-next-line
-  const URL_REG = /(((^https?:(?:\/\/)?)(?:[-;:&=+$,\w]+@)?[A-Za-z0-9.-]+|(?:www.|[-;:&=+$,\w]+@)[A-Za-z0-9.-]+)((?:\/[+~%\/.\w-_]*)?\??(?:[-+=&;%@.\w_]*)#?(?:[\w]*))?)$/g;
-
-  return URL_REG.test(path);
-}
-
-function formatter(data: stateTypes.MenuData, parentPath: string = '', parentRoles: string[] = []) {
-  return data.map(item => {
-    // Generate roles and absolute paths recursively.
-    let {path} = item;
-    if (!isUrl(path)) {
-      path = parentPath + item.path;
-    }
-    const result = {
-      ...item,
-      path,
-      roles: item.roles || parentRoles,
-    };
-    result.children = item.children ? formatter(item.children, `${parentPath}${item.path}/`, item.roles) : [];
-    return result;
-  });
-}
-
-export const getMenuData = () => formatter(menuData);
diff --git a/src/webui/frontend/src/components/GlobalHeader/GlobalHeader.styl b/src/webui/frontend/src/components/GlobalHeader/GlobalHeader.styl
@@ -26,6 +26,9 @@
     display: inline-block
     vertical-align: middle
 
+.ant-dropdown-menu-item
+  .ant-checkbox-wrapper
+    user-select: none;
 
 .menu
   :global(.anticon)

diff --git a/src/webui/frontend/src/components/GlobalHeader/GlobalHeader.tsx b/src/webui/frontend/src/components/GlobalHeader/GlobalHeader.tsx
@@ -1,7 +1,7 @@
 import {
   Avatar,
   Button,
-  // Divider,
+  Checkbox,
   Dropdown,
   Icon,
   Layout,
@@ -67,6 +67,17 @@ class GlobalHeader extends React.PureComponent<GlobalHeaderProps> {
     }
   };
 
+  toggleFeatureFlag (feature: string, toggle: boolean) {
+    if (toggle) {
+      localStorage.setItem(`enable_${feature}`, "yes")
+    } else {
+      localStorage.removeItem(`enable_${feature}`)
+    }
+    window.setTimeout(() => {
+      window.location.reload()
+    }, 150)
+  }
+
   render() {
     const account = localStorage.getItem('account') || '';
     type Auth = {
@@ -93,6 +104,27 @@ class GlobalHeader extends React.PureComponent<GlobalHeaderProps> {
                     Account {auth.account}
                   </Menu.Item>
                   <Menu.Divider />
+                  <Menu.SubMenu title='Feature Flags'>
+                    {/*
+                    <Menu.Item disabled={true}>
+                      <Checkbox
+                        defaultChecked={localStorage.getItem('enable_policies') === 'yes'}
+                        onChange={(e) => this.toggleFeatureFlag('policies', e.target.checked)}
+                      >
+                        Policies
+                      </Checkbox>
+                    </Menu.Item>
+                    */}
+                    <Menu.Item disabled={true}>
+                      <Checkbox
+                        defaultChecked={localStorage.getItem('enable_baselines') === 'yes'}
+                        onChange={(e) => this.toggleFeatureFlag('baselines', e.target.checked)}
+                      >
+                        Baselines
+                      </Checkbox>
+                    </Menu.Item>
+                  </Menu.SubMenu>
+                  <Menu.Divider />
                   <Menu.Item>
                     <a href="https://snowalert.readthedocs.io/en/latest/">Documentation</a>
                   </Menu.Item>