From c8d09821c729e70c15d2117db3c25e802bdaf854 Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 4 Dec 2019 18:57:06 +0100 Subject: [PATCH] Add trad for single value --- .../src/components/ComponentSelect/MenuList.js | 15 ++++++++++++++- .../admin/src/components/ComponentSelect/Value.js | 13 +++++++++++-- .../admin/src/components/CreatableSelect/index.js | 1 + .../admin/src/components/DynamicZoneList/index.js | 6 ++---- .../admin/src/components/WrapperSelect/index.js | 10 ++++++++++ .../admin/src/translations/en.json | 4 +++- 6 files changed, 41 insertions(+), 8 deletions(-) diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/MenuList.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/MenuList.js index 476ed386f9..cc90f82fed 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/MenuList.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/MenuList.js @@ -13,6 +13,7 @@ const MenuList = ({ name, onClickOption, refState, + value, }, ...rest }) => { @@ -50,6 +51,8 @@ const MenuList = ({ return null; } + const isSelected = value.value === component.uid; + return (
  • -

    +

    {upperFirst(component.schema.name)}

    • @@ -86,6 +95,9 @@ MenuList.defaultProps = { }, }, }, + value: { + value: '', + }, }, }; @@ -95,6 +107,7 @@ MenuList.propTypes = { name: PropTypes.string.isRequired, onClickOption: PropTypes.func.isRequired, refState: PropTypes.object, + value: PropTypes.object, }).isRequired, }; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/Value.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/Value.js index 747136903e..cda89838b6 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/Value.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/Value.js @@ -1,8 +1,10 @@ import React from 'react'; import PropTypes from 'prop-types'; import { components } from 'react-select'; -import { get } from 'lodash'; +import { get, size } from 'lodash'; +import { FormattedMessage } from 'react-intl'; import useDataManager from '../../hooks/useDataManager'; +import getTrad from '../../utils/getTrad'; import UpperFirst from '../UpperFirst'; const Value = ({ children, ...props }) => { @@ -29,6 +31,11 @@ const Value = ({ children, ...props }) => { const displayedCategory = isCreatingComponent ? componentCategory : category; const displayedName = isCreatingComponent ? componentName : name; const style = { color: '#333740' }; + const valueLength = size(value); + const message = + valueLength > '0' + ? getTrad('components.componentSelect.value-components') + : getTrad('components.componentSelect.value-components'); return ( @@ -42,7 +49,9 @@ const Value = ({ children, ...props }) => { )} {isMultiple && ( - {value.length} components selected + + {msg => {msg}} + )} ); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/CreatableSelect/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/CreatableSelect/index.js index 20a79674f1..0946746f2d 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/CreatableSelect/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/CreatableSelect/index.js @@ -30,6 +30,7 @@ const CreatableSelect = ({ onChange, name, styles, value }) => {
  • -
    - -
    +
    {/* */}+

    diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperSelect/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperSelect/index.js index aa532d4cdc..15333eb795 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperSelect/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperSelect/index.js @@ -28,6 +28,16 @@ const WrapperSelect = ({ error, label, name, type, ...rest }) => { borderTopColor: '#E3E9F3 !important', }; }, + option: (base, state) => { + console.log({ base, state }); + return { + ...base, + // backgroundColor: state.isSelected ? '#DEEBFF' : base.backgroundColor, + backgroundColor: '#fff', + color: state.isSelected ? '#007eff' : '#333740', + fontWeight: state.isSelected ? '600' : '400', + }; + }, }; const Component = diff --git a/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json b/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json index 308149f57d..c54bff25d6 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json +++ b/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json @@ -272,5 +272,7 @@ "modalForm.sub-header.addComponentToDynamicZone": "Add new component to the dynamic zone", "popUpWarning.bodyMessage.cancel-modifications": "Are you sure you want to cancel your modifications?", "popUpWarning.bodyMessage.cancel-modifications.with-components": "Are you sure you want to cancel your modifications? Some components have been created or modified...", - "prompt.unsaved": "Are you sure you want to leave? All your modifications will be lost." + "prompt.unsaved": "Are you sure you want to leave? All your modifications will be lost.", + "components.componentSelect.value-components": "{number} components selected", + "components.componentSelect.value-component": "{number} component selected" }