Signed-off-by: soupette <cyril@strapi.io>
This commit is contained in:
soupette 2021-09-21 12:10:15 +02:00
parent 6d512c0934
commit ee0fb7b4e8
5 changed files with 97 additions and 19 deletions

View File

@ -9,7 +9,7 @@
"description": "" "description": ""
}, },
"options": { "options": {
"draftAndPublish": true "draftAndPublish": false
}, },
"pluginOptions": {}, "pluginOptions": {},
"attributes": { "attributes": {
@ -85,6 +85,25 @@
}, },
"number_float": { "number_float": {
"type": "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
} }
} }
} }

View File

@ -7,6 +7,7 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
import { NumberInput } from '@strapi/parts/NumberInput'; import { NumberInput } from '@strapi/parts/NumberInput';
import { Select, Option } from '@strapi/parts/Select';
import { Textarea } from '@strapi/parts/Textarea'; import { Textarea } from '@strapi/parts/Textarea';
import { TextInput } from '@strapi/parts/TextInput'; import { TextInput } from '@strapi/parts/TextInput';
import { ToggleInput } from '@strapi/parts/ToggleInput'; import { ToggleInput } from '@strapi/parts/ToggleInput';
@ -24,6 +25,7 @@ const GenericInput = ({
error, error,
name, name,
onChange, onChange,
options,
placeholder, placeholder,
step, step,
type, 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': { case 'textarea': {
return ( return (
<Textarea <Textarea
@ -209,6 +237,7 @@ GenericInput.defaultProps = {
error: '', error: '',
labelAction: undefined, labelAction: undefined,
placeholder: null, placeholder: null,
options: [],
step: 1, step: 1,
value: '', value: '',
}; };
@ -231,6 +260,20 @@ GenericInput.propTypes = {
labelAction: PropTypes.element, labelAction: PropTypes.element,
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
onChange: PropTypes.func.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({ placeholder: PropTypes.shape({
id: PropTypes.string.isRequired, id: PropTypes.string.isRequired,
defaultMessage: PropTypes.string.isRequired, defaultMessage: PropTypes.string.isRequired,

View File

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

View File

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

View File

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