feat: Group schema updates (#4258)

frontend/src/component/playground/Playground/PlaygroundForm/PlaygroundCodeFieldset/PlaygroundCodeFieldset.tsx

@@ -27,7 +27,6 @@ import { formatUnknownError } from 'utils/formatUnknownError';
 import useToast from 'hooks/useToast';
 import { PlaygroundEditor } from './PlaygroundEditor/PlaygroundEditor';
 import { parseDateValue, parseValidDate } from 'component/common/util';
-import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 import { isStringOrStringArray } from '../../playground.utils';
 interface IPlaygroundCodeFieldsetProps {
     context: string | undefined;
@@ -39,8 +38,6 @@ export const PlaygroundCodeFieldset: VFC<IPlaygroundCodeFieldsetProps> = ({
     setContext,
 }) => {
     const theme = useTheme();
-    const { uiConfig } = useUiConfig();
-    const isAdvancedPlayground = Boolean(uiConfig.flags.advancedPlayground);
 
     const { setToastData } = useToast();
     const { context: contextData } = useUnleashContext();
@@ -123,27 +120,23 @@ export const PlaygroundCodeFieldset: VFC<IPlaygroundCodeFieldsetProps> = ({
         setContextValue(newValue);
     };
 
-    const resolveAutocompleteValue = (): string | string[] | null => {
+    const resolveAutocompleteValue = (): string[] => {
         //This is needed for clearing the Autocomplete Chips when changing the context field
         //and the new field also has legal values
         if (!contextValue || contextValue === '') {
             return [];
         }
 
-        if (isAdvancedPlayground) {
+        // Split comma separated strings to array for fields with legal values
-            // Split comma separated strings to array for fields with legal values
+        const foundField = contextData.find(
-            const foundField = contextData.find(
+            contextData => contextData.name === contextField
-                contextData => contextData.name === contextField
+        );
-            );
+        const hasLegalValues = (foundField?.legalValues || []).length > 1;
-            const hasLegalValues = (foundField?.legalValues || []).length > 1;
+        if (contextValue.includes(',') && hasLegalValues) {
-            if (contextValue.includes(',') && hasLegalValues) {
+            return contextValue.split(',');
-                return contextValue.split(',');
-            }
-
-            return [contextValue as string];
         }
 
-        return contextValue;
+        return [contextValue as string];
     };
 
     const resolveInput = () => {
@@ -195,12 +188,12 @@ export const PlaygroundCodeFieldset: VFC<IPlaygroundCodeFieldsetProps> = ({
                     value={resolveAutocompleteValue()}
                     onChange={changeContextValue}
                     options={options}
-                    multiple={isAdvancedPlayground}
+                    multiple={true}
                     sx={{ width: 370, maxWidth: '100%' }}
                     renderInput={(params: any) => (
                         <TextField {...params} label="Value" />
                     )}
-                    disableCloseOnSelect={isAdvancedPlayground!}
+                    disableCloseOnSelect={false}
                 />
             );
         }
@@ -210,9 +203,7 @@ export const PlaygroundCodeFieldset: VFC<IPlaygroundCodeFieldsetProps> = ({
                 label="Value"
                 id="context-value"
                 sx={{ width: 370, maxWidth: '100%' }}
-                placeholder={
+                placeholder={'value1,value2,value3'}
-                    isAdvancedPlayground ? 'value1,value2,value3' : 'value1'
-                }
                 size="small"
                 value={contextValue}
                 onChange={event => setContextValue(event.target.value || '')}

frontend/src/component/playground/Playground/PlaygroundForm/PlaygroundConnectionFieldset/PlaygroundConnectionFieldset.tsx

@@ -7,7 +7,6 @@ import {
     useTheme,
 } from '@mui/material';
 import useProjects from 'hooks/api/getters/useProjects/useProjects';
-import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 import { renderOption } from '../renderOption';
 
 interface IPlaygroundConnectionFieldsetProps {
@@ -35,9 +34,6 @@ export const PlaygroundConnectionFieldset: VFC<
     availableEnvironments,
 }) => {
     const theme = useTheme();
-    const { uiConfig } = useUiConfig();
-
-    const isAdvancedPlayground = uiConfig.flags.advancedPlayground;
 
     const { projects: availableProjects = [] } = useProjects();
     const projectsOptions = [
@@ -102,9 +98,9 @@ export const PlaygroundConnectionFieldset: VFC<
     const isAllProjects =
         projects.length === 0 || (projects.length === 1 && projects[0] === '*');
 
-    const envValue = isAdvancedPlayground
+    const envValue = environmentOptions.filter(({ id }) =>
-        ? environmentOptions.filter(({ id }) => environments.includes(id))
+        environments.includes(id)
-        : environmentOptions.filter(({ id }) => environments.includes(id))[0];
+    );
 
     return (
         <Box sx={{ pb: 2 }}>
@@ -122,7 +118,7 @@ export const PlaygroundConnectionFieldset: VFC<
                     disablePortal
                     limitTags={3}
                     id="environment"
-                    multiple={isAdvancedPlayground}
+                    multiple={true}
                     options={environmentOptions}
                     sx={{ flex: 1 }}
                     renderInput={params => (
@@ -130,7 +126,7 @@ export const PlaygroundConnectionFieldset: VFC<
                     )}
                     renderOption={renderOption}
                     getOptionLabel={({ label }) => label}
-                    disableCloseOnSelect={isAdvancedPlayground!}
+                    disableCloseOnSelect={false}
                     size="small"
                     value={envValue}
                     onChange={onEnvironmentsChange}

src/lib/openapi/meta-schema-rules.test.ts

@@ -92,9 +92,6 @@ const metaRules: Rule[] = [
         knownExceptions: [
             'createInvitedUserSchema',
             'featureStrategySegmentSchema',
-            'groupSchema',
-            'groupsSchema',
-            'groupUserModelSchema',
             'maintenanceSchema',
             'toggleMaintenanceSchema',
             'patchSchema',
@@ -132,9 +129,6 @@ const metaRules: Rule[] = [
             'createInvitedUserSchema',
             'dateSchema',
             'featureStrategySegmentSchema',
-            'groupSchema',
-            'groupsSchema',
-            'groupUserModelSchema',
             'maintenanceSchema',
             'toggleMaintenanceSchema',
             'patchSchema',

src/lib/openapi/spec/group-schema.ts

@@ -7,49 +7,67 @@ export const groupSchema = {
     type: 'object',
     additionalProperties: true,
     required: ['name'],
+    description: 'A detailed information about a user group',
     properties: {
         id: {
-            type: 'number',
+            description: 'The group id',
+            type: 'integer',
+            example: 1,
         },
         name: {
+            description: 'The name of the group',
             type: 'string',
+            example: 'DX team',
         },
         description: {
+            description: 'A custom description of the group',
             type: 'string',
             nullable: true,
+            example: 'Current members of the DX squad',
         },
         mappingsSSO: {
+            description:
+                'A list of SSO groups that should map to this Unleash group',
             type: 'array',
             items: {
                 type: 'string',
             },
+            example: ['SSOGroup1', 'SSOGroup2'],
         },
         rootRole: {
             type: 'number',
             nullable: true,
             description:
-                'A role id that is used as the root role for all users in this group. This can be either the id of the Editor or Admin role.',
+                'A role id that is used as the root role for all users in this group. This can be either the id of the Viewer, Editor or Admin role.',
+            example: 1,
         },
         createdBy: {
+            description: 'A user who created this group',
             type: 'string',
             nullable: true,
+            example: 'admin',
         },
         createdAt: {
+            description: 'When was this group created',
             type: 'string',
             format: 'date-time',
             nullable: true,
+            example: '2023-06-30T11:41:00.123Z',
         },
         users: {
             type: 'array',
+            description: 'A list of users belonging to this group',
             items: {
                 $ref: '#/components/schemas/groupUserModelSchema',
             },
         },
         projects: {
+            description: 'A list of projects where this group is used',
             type: 'array',
             items: {
                 type: 'string',
             },
+            example: ['default', 'my-project'],
         },
     },
     components: {

src/lib/openapi/spec/group-user-model-schema.ts

@@ -6,14 +6,20 @@ export const groupUserModelSchema = {
     type: 'object',
     additionalProperties: false,
     required: ['user'],
+    description: 'Details for a single user belonging to a group',
     properties: {
         joinedAt: {
+            description: 'The date when the user joined the group',
             type: 'string',
             format: 'date-time',
+            example: '2023-06-30T11:41:00.123Z',
         },
         createdBy: {
+            description:
+                'The username of the user who added this user to this group',
             type: 'string',
             nullable: true,
+            example: 'admin',
         },
         user: {
             $ref: '#/components/schemas/userSchema',

src/lib/openapi/spec/groups-schema.ts

@@ -7,8 +7,11 @@ export const groupsSchema = {
     $id: '#/components/schemas/groupsSchema',
     type: 'object',
     additionalProperties: false,
+    description:
+        'A list of [user groups](https://docs.getunleash.io/reference/rbac#user-groups)',
     properties: {
         groups: {
+            description: 'A list of groups',
             type: 'array',
             items: {
                 $ref: '#/components/schemas/groupSchema',