Add enum

Signed-off-by: soupette <cyril@strapi.io>

examples/getstarted/api/temp/content-types/temp/schema.json

@@ -9,7 +9,7 @@
     "description": ""
   },
   "options": {
-    "draftAndPublish": true
+    "draftAndPublish": false
   },
   "pluginOptions": {},
   "attributes": {
@@ -85,6 +85,25 @@
     },
     "number_float": {
       "type": "float"
+    },
+    "enum_req_def": {
+      "type": "enumeration",
+      "enum": [
+        "un",
+        "deux",
+        "trois"
+      ],
+      "required": true,
+      "default": "un"
+    },
+    "enum_req": {
+      "type": "enumeration",
+      "enum": [
+        "un",
+        "deux",
+        "trois"
+      ],
+      "required": true
     }
   }
 }

packages/core/admin/admin/src/content-manager/components/Inputs/GenericInput.js

@@ -7,6 +7,7 @@
 import React, { useState } from 'react';
 import { useIntl } from 'react-intl';
 import { NumberInput } from '@strapi/parts/NumberInput';
+import { Select, Option } from '@strapi/parts/Select';
 import { Textarea } from '@strapi/parts/Textarea';
 import { TextInput } from '@strapi/parts/TextInput';
 import { ToggleInput } from '@strapi/parts/ToggleInput';
@@ -24,6 +25,7 @@ const GenericInput = ({
   error,
   name,
   onChange,
+  options,
   placeholder,
   step,
   type,
@@ -176,6 +178,32 @@ const GenericInput = ({
         />
       );
     }
+    case 'select': {
+      return (
+        <Select
+          disabled={disabled}
+          error={errorMessage}
+          label={label}
+          labelAction={labelAction}
+          id={name}
+          hint={hint}
+          name={name}
+          onChange={value => {
+            onChange({ target: { name, value: value === '' ? null : value, type: 'select' } });
+          }}
+          placeholder={formattedPlaceholder}
+          value={value || ''}
+        >
+          {options.map(({ metadatas: { intlLabel, disabled, hidden }, key, value }) => {
+            return (
+              <Option key={key} value={value} disabled={disabled} hidden={hidden}>
+                {formatMessage(intlLabel)}
+              </Option>
+            );
+          })}
+        </Select>
+      );
+    }
     case 'textarea': {
       return (
         <Textarea
@@ -209,6 +237,7 @@ GenericInput.defaultProps = {
   error: '',
   labelAction: undefined,
   placeholder: null,
+  options: [],
   step: 1,
   value: '',
 };
@@ -231,6 +260,20 @@ GenericInput.propTypes = {
   labelAction: PropTypes.element,
   name: PropTypes.string.isRequired,
   onChange: PropTypes.func.isRequired,
+  options: PropTypes.arrayOf(
+    PropTypes.shape({
+      metadatas: PropTypes.shape({
+        intlLabel: PropTypes.shape({
+          id: PropTypes.string.isRequired,
+          defaultMessage: PropTypes.string.isRequired,
+        }).isRequired,
+        disabled: PropTypes.bool,
+        hidden: PropTypes.bool,
+      }).isRequired,
+      key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+      value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+    }).isRequired
+  ),
   placeholder: PropTypes.shape({
     id: PropTypes.string.isRequired,
     defaultMessage: PropTypes.string.isRequired,

packages/core/admin/admin/src/content-manager/components/Inputs/index.js

@@ -218,8 +218,10 @@ function Inputs({
         // wysiwyg: WysiwygWithErrors,
         // uid: InputUID,
         // ...fields,
+        json: () => <div>TODO json</div>,
         media: () => <div>TODO media</div>,
         uid: () => <div>TODO uid</div>,
+        wysiwyg: () => <div>TODO wysiwyg</div>,
       }}
       multiple={fieldSchema.multiple || false}
       attribute={fieldSchema}
@@ -230,7 +232,7 @@ function Inputs({
       placeholder={placeholder ? { id: placeholder, defaultMessage: placeholder } : null}
       step={step}
       type={inputType}
-      validations={validations}
+      // validations={validations}
       value={inputValue}
       withDefaultValue={false}
     />

packages/core/admin/admin/src/content-manager/components/Inputs/utils/generateOptions.js

@@ -1,19 +1,32 @@
-import React from 'react';
-import { FormattedMessage } from 'react-intl';
-
-const generateOptions = (options, isRequired = false) => [
-  <FormattedMessage id="components.InputSelect.option.placeholder" key="__enum_option_null">
-    {msg => (
-      <option disabled={isRequired} hidden={isRequired} value="">
-        {msg}
-      </option>
-    )}
-  </FormattedMessage>,
-  ...options.map(v => (
-    <option key={v} value={v}>
-      {v}
-    </option>
-  )),
-];
+const generateOptions = (options, isRequired = false) => {
+  return [
+    {
+      metadatas: {
+        intlLabel: {
+          id: 'components.InputSelect.option.placeholder',
+          defaultMessage: 'Choose here',
+        },
+        disabled: isRequired,
+        hidden: isRequired,
+      },
+      key: '__enum_option_null',
+      value: '',
+    },
+    ...options.map(option => {
+      return {
+        metadatas: {
+          intlLabel: {
+            id: option,
+            defaultMessage: option,
+          },
+          hidden: false,
+          disabled: false,
+        },
+        key: option,
+        value: option,
+      };
+    }),
+  ];
+};
 
 export default generateOptions;

packages/plugins/i18n/admin/src/components/CMEditViewInjectedComponents/CMEditViewLocalePicker/index.js

@@ -110,6 +110,7 @@ const CMEditViewLocalePicker = ({
             <Option
               value={value.value}
               disabled
+              hidden
               startIcon={hasDraftAndPublishEnabled ? <Bullet status={currentLocaleStatus} /> : null}
             >
               {value.label}