chore(settings): add show gen ai sample docs setting feature flag (#5781

)

packages/compass-preferences-model/src/feature-flags.ts

@@ -19,6 +19,7 @@ export type FeatureFlags = {
   showInsights: boolean;
   enableRenameCollectionModal: boolean;
   enableNewMultipleConnectionSystem: boolean;
+  showGenAIPassSampleDocumentsSetting: boolean;
 };
 
 export const featureFlags: Required<{
@@ -73,4 +74,17 @@ export const featureFlags: Required<{
       long: 'Allows users to open multiple connections in the same window.',
     },
   },
+
+  /**
+   * Feature flag for showing the option to pass sample documents with our query and aggregation generation requests.
+   * Enables showing the `enableGenAISampleDocumentPassing` setting in the settings UI so folks can turn it on.
+   * Epic: COMPASS-7584
+   */
+  showGenAIPassSampleDocumentsSetting: {
+    stage: 'development',
+    description: {
+      short: 'Enable showing the sample document gen ai setting.',
+      long: 'Allows users to show a setting to enable the passing of sample field values with our query and aggregation generation requests.',
+    },
+  },
 };

packages/compass-settings/src/components/settings/gen-ai-settings.spec.tsx

@@ -0,0 +1,97 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { expect } from 'chai';
+import { Provider } from 'react-redux';
+
+import { GenAISettings } from './gen-ai-settings';
+import configureStore from '../../../test/configure-store';
+import { fetchSettings } from '../../stores/settings';
+
+function renderGenAiSettings({
+  store = configureStore(),
+  props,
+}: {
+  store: ReturnType<typeof configureStore>;
+  props?: Partial<React.ComponentProps<typeof GenAISettings>>;
+}) {
+  return render(
+    <Provider store={store}>
+      <GenAISettings
+        isAIFeatureEnabled
+        showGenAIPassSampleDocumentsSetting={false}
+        {...props}
+      />
+    </Provider>
+  );
+}
+
+const sampleDocsSettingText =
+  'Enable sending sample field values with query and aggregation generation requests';
+const atlasLoginSettingText = 'You must log in with an Atlas account to use ';
+
+describe('GenAISettings', function () {
+  let container: HTMLElement;
+  let store: ReturnType<typeof configureStore>;
+
+  describe('when the isAIFeatureEnabled prop is false', function () {
+    beforeEach(async function () {
+      store = configureStore();
+      await store.dispatch(fetchSettings());
+      renderGenAiSettings({
+        store,
+        props: {
+          isAIFeatureEnabled: false,
+        },
+      });
+      container = screen.getByTestId('gen-ai-settings');
+    });
+
+    it('does not show the atlas login setting', function () {
+      expect(container).to.not.include.text(atlasLoginSettingText);
+    });
+  });
+
+  describe('when the isAIFeatureEnabled setting is true', function () {
+    beforeEach(async function () {
+      store = configureStore();
+      await store.dispatch(fetchSettings());
+    });
+
+    it('shows the atlas login setting', function () {
+      renderGenAiSettings({
+        store,
+      });
+      container = screen.getByTestId('gen-ai-settings');
+      expect(container).to.include.text(atlasLoginSettingText);
+    });
+
+    describe('when the showGenAIPassSampleDocumentsSetting feature flag is disabled', function () {
+      beforeEach(function () {
+        renderGenAiSettings({
+          store,
+        });
+        container = screen.getByTestId('gen-ai-settings');
+      });
+
+      it('does not show the enableGenAISampleDocumentPassing setting', function () {
+        expect(container).to.not.include.text(sampleDocsSettingText);
+      });
+    });
+
+    describe('when the showGenAIPassSampleDocumentsSetting feature flag is enabled', function () {
+      beforeEach(function () {
+        renderGenAiSettings({
+          store,
+          props: {
+            showGenAIPassSampleDocumentsSetting: true,
+          },
+        });
+        container = screen.getByTestId('gen-ai-settings');
+      });
+
+      it('does not show the enableGenAISampleDocumentPassing setting', function () {
+        expect(container).to.include.text(sampleDocsSettingText);
+      });
+    });
+  });
+});

packages/compass-settings/src/components/settings/gen-ai-settings.tsx

@@ -12,7 +12,8 @@ const atlasSettingsContainerStyles = css({
 
 export const GenAISettings: React.FunctionComponent<{
   isAIFeatureEnabled: boolean;
-}> = ({ isAIFeatureEnabled }) => {
+  showGenAIPassSampleDocumentsSetting: boolean;
+}> = ({ isAIFeatureEnabled, showGenAIPassSampleDocumentsSetting }) => {
   return (
     <div data-testid="gen-ai-settings">
       <div>
@@ -27,11 +28,9 @@ export const GenAISettings: React.FunctionComponent<{
           <div className={atlasSettingsContainerStyles}>
             <ConnectedAtlasLoginSettings></ConnectedAtlasLoginSettings>
           </div>
-          {/* TODO(COMPASS-7865): We're currently sending our sample field values to the server
-            and into the ai prompt as regular JSON. This means the AI isn't generating good
-            results with certain bson types. It'll take a bit of work server
-            side for us to do this. In the meantime we are hiding this setting. */}
-          {/* <SettingsList fields={['enableGenAISampleDocumentPassing']} /> */}
+          {showGenAIPassSampleDocumentsSetting && (
+            <SettingsList fields={['enableGenAISampleDocumentPassing']} />
+          )}
         </>
       )}
     </div>
@@ -40,6 +39,8 @@ export const GenAISettings: React.FunctionComponent<{
 
 const mapState = (state: RootState) => ({
   isAIFeatureEnabled: !!state.settings.settings.enableGenAIFeatures,
+  showGenAIPassSampleDocumentsSetting:
+    !!state.settings.settings.showGenAIPassSampleDocumentsSetting,
 });
 
 export default connect(mapState, null)(GenAISettings);