feat: remove genai from experimental feature list and enable via `/ma…

…ster` feature switches [GAS-1016] (#9435)
determined-ai · Jun 4, 2024 · 8d64508 · 8d64508
1 parent 4d8596c
commit 8d64508
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 28 deletions.
diff --git a/webui/react/src/components/NavigationTabbar.tsx b/webui/react/src/components/NavigationTabbar.tsx
@@ -6,12 +6,14 @@ import { Loadable } from 'hew/utils/loadable';
 import React, { useCallback, useEffect, useState } from 'react';
 import { useLocation } from 'react-router-dom';
 
+import LogoGenAI from 'assets/images/logo-genai.svg?url';
 import ActionSheet, { ActionItem } from 'components/ActionSheet';
 import Link, { Props as LinkProps } from 'components/Link';
 import useUI from 'components/ThemeProvider';
 import UserSettings from 'components/UserSettings';
+import useFeature from 'hooks/useFeature';
 import usePermissions from 'hooks/usePermissions';
-import { handlePath, paths } from 'routes/utils';
+import { handlePath, paths, serverAddress } from 'routes/utils';
 import authStore from 'stores/auth';
 import clusterStore from 'stores/cluster';
 import determinedStore, { BrandingType } from 'stores/determinedInfo';
@@ -66,6 +68,7 @@ const NavigationTabbar: React.FC = () => {
   const showNavigation = isAuthenticated && ui.showChrome;
 
   const { canCreateWorkspace, canAdministrateUsers } = usePermissions();
+  const gasLinkOn = useFeature().isOn('genai');
 
   const WorkspaceCreateModal = useModal(WorkspaceCreateModalComponent);
 
@@ -122,7 +125,7 @@ const NavigationTabbar: React.FC = () => {
 
   interface OverflowActionProps {
     external?: boolean;
-    icon?: IconName;
+    icon?: IconName | JSX.Element;
     label: string;
     onClick?: (e: AnyMouseEvent) => void;
     path?: string;
@@ -183,6 +186,16 @@ const NavigationTabbar: React.FC = () => {
     },
   ];
 
+  if (gasLinkOn) {
+    overflowActionsBottom.push({
+      external: true,
+      icon: <img alt="GenAI Studio" height={24} src={LogoGenAI} width={24} />,
+      label: 'GenAI',
+      path: serverAddress('/genai'),
+      popout: true,
+    });
+  }
+
   return (
     <>
       <nav className={css.base}>

diff --git a/webui/react/src/components/UserSettings.tsx b/webui/react/src/components/UserSettings.tsx
@@ -274,32 +274,34 @@ const UserSettings: React.FC<Props> = ({ show, onClose }: Props) => {
             </Section>
             <Section divider title="Experimental">
               <div className={css.section}>
-                {Object.entries(FEATURES).map(([feature, description]) => (
-                  <InlineForm<boolean>
-                    initialValue={
-                      savedFeatureSettings?.[feature as ValidFeature] ?? description.defaultValue
-                    }
-                    key={feature}
-                    label={
-                      <Row>
-                        {description.friendlyName}
-                        <Column align="right">
-                          <Icon name="info" showTooltip title={description.description} />
-                        </Column>
-                      </Row>
-                    }
-                    valueFormatter={(value) => (value ? 'On' : 'Off')}
-                    onSubmit={(val) => {
-                      userSettings.set(FeatureSettingsConfig, FEATURE_SETTINGS_PATH, {
-                        [feature]: val,
-                      });
-                    }}>
-                    <Select searchable={false}>
-                      <Option value={true}>On</Option>
-                      <Option value={false}>Off</Option>
-                    </Select>
-                  </InlineForm>
-                ))}
+                {Object.entries(FEATURES)
+                  .filter(([, description]) => !description.noUserControl)
+                  .map(([feature, description]) => (
+                    <InlineForm<boolean>
+                      initialValue={
+                        savedFeatureSettings?.[feature as ValidFeature] ?? description.defaultValue
+                      }
+                      key={feature}
+                      label={
+                        <Row>
+                          {description.friendlyName}
+                          <Column align="right">
+                            <Icon name="info" showTooltip title={description.description} />
+                          </Column>
+                        </Row>
+                      }
+                      valueFormatter={(value) => (value ? 'On' : 'Off')}
+                      onSubmit={(val) => {
+                        userSettings.set(FeatureSettingsConfig, FEATURE_SETTINGS_PATH, {
+                          [feature]: val,
+                        });
+                      }}>
+                      <Select searchable={false}>
+                        <Option value={true}>On</Option>
+                        <Option value={false}>Off</Option>
+                      </Select>
+                    </InlineForm>
+                  ))}
               </div>
             </Section>
             <Section title="Advanced">

diff --git a/webui/react/src/hooks/useFeature.ts b/webui/react/src/hooks/useFeature.ts
@@ -19,6 +19,7 @@ type FeatureDescription = {
   friendlyName: string;
   description: string;
   defaultValue: boolean;
+  noUserControl?: boolean;
 };
 
 export const FEATURES: Record<ValidFeature, FeatureDescription> = {
@@ -37,6 +38,7 @@ export const FEATURES: Record<ValidFeature, FeatureDescription> = {
     defaultValue: false,
     description: 'Enable links to Generative AI Studio',
     friendlyName: 'Generative AI Studio (genai)',
+    noUserControl: true,
   },
   rp_binding: {
     defaultValue: true,
@@ -90,6 +92,8 @@ const IsOn = (
   featureSwitches.includes(feature) && (isOn = true);
   featureSwitches.includes(`-${feature}`) && (isOn = false);
 
+  if (FEATURES[feature]?.noUserControl) return isOn;
+
   // Read from user settings
   if (settings && feature in settings) {
     const userValue = settings[feature];