chore: remove playgroundImprovements flag (#5384)

Closes #: [1-1647](https://linear.app/unleash/issue/1-1647/clean-playgroundimprovements-flag-for-release) [1-1665](https://linear.app/unleash/issue/1-1665/flaky-test-playgroundconnectionfieldsettesttsx) --------- Signed-off-by: andreas-unleash <andreas@getunleash.ai>
Unleash · Nov 23, 2023 · 1dafc85 · 1dafc85
1 parent 3e12c2b
commit 1dafc85
Show file tree

Hide file tree

Showing 12 changed files with 117 additions and 131 deletions.
diff --git a/...yground/PlaygroundForm/PlaygroundConnectionFieldset/PlaygroundConnectionFieldset.test.tsx b/...yground/PlaygroundForm/PlaygroundConnectionFieldset/PlaygroundConnectionFieldset.test.tsx
@@ -7,26 +7,43 @@ import { useState } from 'react';
 const server = testServerSetup();
 
 beforeEach(() => {
-    testServerRoute(server, '/API/admin/ui-config', {
+    testServerRoute(server, '/api/admin/ui-config', {
         versionInfo: {
             current: { oss: 'version', enterprise: 'version' },
         },
-        flags: {
-            playgroundImprovements: true,
-        },
     });
     testServerRoute(
         server,
-        '/API/admin/projects',
+        '/api/admin/projects',
+
         {
+            version: 1,
             projects: [
                 {
-                    id: 'default',
                     name: 'Default',
+                    id: 'default',
+                    description: 'Default project',
+                    health: 100,
+                    favorite: false,
+                    featureCount: 0,
+                    memberCount: 0,
+                    updatedAt: '2023-11-21T15:50:57.035Z',
+                    createdAt: '2023-11-10T09:52:14.898Z',
+                    mode: 'open',
+                    defaultStickiness: 'default',
                 },
                 {
-                    id: 'MyProject',
                     name: 'MyProject',
+                    id: 'MyProject',
+                    description: '',
+                    health: 100,
+                    favorite: false,
+                    featureCount: 1,
+                    memberCount: 1,
+                    updatedAt: '2023-11-21T15:50:57.037Z',
+                    createdAt: '2023-11-10T09:52:52.169Z',
+                    mode: 'open',
+                    defaultStickiness: 'sessionId',
                 },
             ],
         },
@@ -35,7 +52,7 @@ beforeEach(() => {
     );
     testServerRoute(
         server,
-        '/API/admin/API-tokens',
+        '/api/admin/api-tokens',
         {
             tokens: [
                 {
@@ -69,45 +86,57 @@ const Component = () => {
     );
 };
 
-test('should parse project and environment from token input', async () => {
-    render(<Component />);
-
-    const tokenInput = await screen.findByLabelText('API token');
-    fireEvent.change(tokenInput, {
-        target: {
-            value: 'default:development.964a287e1b728cb5f4f3e0120df92cb5',
-        },
-    });
+const timeoutInMilliseconds = 10000;
+
+test(
+    'should parse project and environment from token input',
+    async () => {
+        const { container } = render(<Component />);
+        const projectAutocomplete = await screen.findByTestId(
+            'PLAYGROUND_PROJECT_SELECT',
+        );
+        const button = await within(projectAutocomplete).findByRole('button');
+        fireEvent.click(button);
+        await within(container).findByText('Default');
+
+        const tokenInput = await screen.findByLabelText('API token');
+        fireEvent.change(tokenInput, {
+            target: {
+                value: 'default:development.964a287e1b728cb5f4f3e0120df92cb5',
+            },
+        });
+
+        const projectInput = within(projectAutocomplete).getByRole('combobox');
+
+        const environmentAutocomplete = await screen.findByTestId(
+            'PLAYGROUND_ENVIRONMENT_SELECT',
+        );
+        const environmentInput = within(environmentAutocomplete).getByRole(
+            'combobox',
+        );
+
+        expect(projectInput).toBeDisabled();
+        expect(environmentInput).toBeDisabled();
+        await within(projectAutocomplete).findByText('Default');
+        await within(environmentAutocomplete).findByText('development');
+    },
+    timeoutInMilliseconds,
+);
 
+test('should load projects from token definition if project is []', async () => {
+    const { container } = render(<Component />);
     const projectAutocomplete = await screen.findByTestId(
         'PLAYGROUND_PROJECT_SELECT',
     );
-    const projectInput = within(projectAutocomplete).getByRole('combobox');
-
-    const environmentAutocomplete = await screen.findByTestId(
-        'PLAYGROUND_ENVIRONMENT_SELECT',
-    );
-    const environmentInput = within(environmentAutocomplete).getByRole(
-        'combobox',
-    );
-
-    expect(projectInput).toBeDisabled();
-    expect(environmentInput).toBeDisabled();
-    await within(projectAutocomplete).findByText('Default');
-    await within(environmentAutocomplete).findByText('development');
-});
-
-test('should load projects from token definition if project is []', async () => {
-    render(<Component />);
+    const button = await within(projectAutocomplete).findByRole('button');
+    fireEvent.click(button);
+    await within(container).findByText('Default');
 
     const tokenInput = await screen.findByLabelText('API token');
     fireEvent.change(tokenInput, {
         target: { value: '[]:development.964a287e1b728cb5f4f3e0120df92cb5' },
     });
 
-    const projectAutocomplete = await screen.findByTestId(
-        'PLAYGROUND_PROJECT_SELECT',
-    );
     const projectInput = within(projectAutocomplete).getByRole('combobox');
 
     const environmentAutocomplete = await screen.findByTestId(
@@ -125,16 +154,19 @@ test('should load projects from token definition if project is []', async () =>
 });
 
 test('should show an error when admin token', async () => {
-    render(<Component />);
+    const { container } = render(<Component />);
+    const projectAutocomplete = await screen.findByTestId(
+        'PLAYGROUND_PROJECT_SELECT',
+    );
+    const button = await within(projectAutocomplete).findByRole('button');
+    fireEvent.click(button);
+    await within(container).findByText('Default');
 
     const tokenInput = await screen.findByLabelText('API token');
     fireEvent.change(tokenInput, {
         target: { value: '*:*.964a287e1b728cb5f4f3e0120df92cb5' },
     });
 
-    const projectAutocomplete = await screen.findByTestId(
-        'PLAYGROUND_PROJECT_SELECT',
-    );
     const projectInput = within(projectAutocomplete).getByRole('combobox');
 
     const environmentAutocomplete = await screen.findByTestId(
@@ -150,7 +182,13 @@ test('should show an error when admin token', async () => {
 });
 
 test('should have a working clear button when token is filled', async () => {
-    render(<Component />);
+    const { container } = render(<Component />);
+    const projectAutocomplete = await screen.findByTestId(
+        'PLAYGROUND_PROJECT_SELECT',
+    );
+    const button = await within(projectAutocomplete).findByRole('button');
+    fireEvent.click(button);
+    await within(container).findByText('Default');
 
     const tokenInput = await screen.findByLabelText('API token');
     fireEvent.change(tokenInput, {
@@ -160,8 +198,8 @@ test('should have a working clear button when token is filled', async () => {
     });
 
     const clear = await screen.findByTestId('TOKEN_INPUT_CLEAR_BTN');
-    const button = within(clear).getByRole('button');
-    fireEvent.click(button);
+    const clearButton = within(clear).getByRole('button');
+    fireEvent.click(clearButton);
 
     expect(tokenInput).toHaveValue('');
 });
diff --git a/...d/Playground/PlaygroundForm/PlaygroundConnectionFieldset/PlaygroundConnectionFieldset.tsx b/...d/Playground/PlaygroundForm/PlaygroundConnectionFieldset/PlaygroundConnectionFieldset.tsx
@@ -58,11 +58,11 @@ export const PlaygroundConnectionFieldset: VFC<
     availableEnvironments,
 }) => {
     const theme = useTheme();
-    const playgroundImprovements = useUiFlag('playgroundImprovements');
     const { tokens } = useApiTokens();
     const [tokenError, setTokenError] = useState<string | undefined>();
 
-    const { projects: availableProjects = [] } = useProjects();
+    const { projects: availableProjects } = useProjects();
+
     const projectsOptions = [
         allOption,
         ...availableProjects.map(({ name: label, id }) => ({
@@ -155,7 +155,6 @@ export const PlaygroundConnectionFieldset: VFC<
         const [tokenProject, tokenEnvironment] =
             extractProjectEnvironmentFromToken(tempToken);
         setEnvironments([tokenEnvironment]);
-
         switch (tokenProject) {
             case '[]':
                 handleTokenWithSomeProjects(tempToken);
@@ -301,24 +300,19 @@ export const PlaygroundConnectionFieldset: VFC<
                     />
                 </Tooltip>
             </Box>
-            <ConditionallyRender
-                condition={Boolean(playgroundImprovements)}
-                show={
-                    <Input
-                        sx={{ mt: 2, width: '50%', pr: 1 }}
-                        label='API token'
-                        value={token || ''}
-                        onChange={onSetToken}
-                        type={'text'}
-                        error={Boolean(tokenError)}
-                        errorText={tokenError}
-                        placeholder={'Enter your API token'}
-                        data-testid={'PLAYGROUND_TOKEN_INPUT'}
-                        InputProps={{
-                            endAdornment: token ? renderClearButton() : null,
-                        }}
-                    />
-                }
+            <Input
+                sx={{ mt: 2, width: '50%', pr: 1 }}
+                label='API token'
+                value={token || ''}
+                onChange={onSetToken}
+                type={'text'}
+                error={Boolean(tokenError)}
+                errorText={tokenError}
+                placeholder={'Enter your API token'}
+                data-testid={'PLAYGROUND_TOKEN_INPUT'}
+                InputProps={{
+                    endAdornment: token ? renderClearButton() : null,
+                }}
             />
         </Box>
     );

diff --git a/.../FeatureResultInfoPopoverCell/FeatureStrategyList/PlaygroundResultFeatureStrategyList.tsx b/.../FeatureResultInfoPopoverCell/FeatureStrategyList/PlaygroundResultFeatureStrategyList.tsx
@@ -16,16 +16,14 @@ export const PlaygroundResultFeatureStrategyList = ({
     feature,
     input,
 }: PlaygroundResultFeatureStrategyListProps) => {
-    const playgroundImprovements = useUiFlag('playgroundImprovements');
     const enabledStrategies = feature.strategies?.data?.filter(
         (strategy) => !strategy.disabled,
     );
     const disabledStrategies = feature.strategies?.data?.filter(
         (strategy) => strategy.disabled,
     );
 
-    const showDisabledStrategies =
-        playgroundImprovements && disabledStrategies?.length > 0;
+    const showDisabledStrategies = disabledStrategies?.length > 0;
 
     return (
         <>

diff --git a/...eResultInfoPopoverCell/FeatureStrategyList/StrategyList/playgroundResultStrategyLists.tsx b/...eResultInfoPopoverCell/FeatureStrategyList/StrategyList/playgroundResultStrategyLists.tsx
@@ -110,16 +110,14 @@ export const WrappedPlaygroundResultStrategyList = ({
     feature,
     input,
 }: IWrappedPlaygroundResultStrategyListProps) => {
-    const playgroundImprovements = useUiFlag('playgroundImprovements');
     const enabledStrategies = feature.strategies?.data?.filter(
         (strategy) => !strategy.disabled,
     );
     const disabledStrategies = feature.strategies?.data?.filter(
         (strategy) => strategy.disabled,
     );
 
-    const showDisabledStrategies =
-        playgroundImprovements && disabledStrategies?.length > 0;
+    const showDisabledStrategies = disabledStrategies?.length > 0;
 
     return (
         <StyledAlertWrapper sx={{ pb: 1, mt: 2 }}>

diff --git a/frontend/src/interfaces/uiConfig.ts b/frontend/src/interfaces/uiConfig.ts
@@ -65,7 +65,6 @@ export type UiFlags = {
     privateProjects?: boolean;
     dependentFeatures?: boolean;
     banners?: boolean;
-    playgroundImprovements?: boolean;
     scheduledConfigurationChanges?: boolean;
     featureSearchAPI?: boolean;
     featureSearchFrontend?: boolean;

diff --git a/frontend/src/utils/testRenderer.tsx b/frontend/src/utils/testRenderer.tsx
@@ -23,7 +23,9 @@ export const render = (
 
     const Wrapper: FC = ({ children }) => (
         <UIProviderContainer>
-            <SWRConfig value={{ provider: () => new Map() }}>
+            <SWRConfig
+                value={{ provider: () => new Map(), dedupingInterval: 0 }}
+            >
                 <AccessProviderMock permissions={permissions}>
                     <ThemeProvider>
                         <AnnouncerProvider>

diff --git a/src/lib/__snapshots__/create-config.test.ts.snap b/src/lib/__snapshots__/create-config.test.ts.snap
@@ -98,7 +98,6 @@ exports[`should create default config 1`] = `
       },
       "migrationLock": true,
       "personalAccessTokensKillSwitch": false,
-      "playgroundImprovements": false,
       "privateProjects": false,
       "proPlanAutoCharge": false,
       "responseTimeWithAppNameKillSwitch": false,