fix(widget-list): add missing translations in widget list top bar (#5471) (#5679)

This commit is contained in:
Josian Godard 2021-08-04 13:56:38 +02:00 committed by GitHub
parent d15a0220ad
commit db560cc082
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 26 additions and 14 deletions

View File

@ -197,6 +197,10 @@ const en = {
datetime: {
now: 'Now',
},
list: {
add: 'Add %{item}',
addType: 'Add %{item} item',
},
},
},
mediaLibrary: {

View File

@ -65,6 +65,7 @@ class ObjectWidgetTopBar extends React.Component {
collapsed: PropTypes.bool,
heading: PropTypes.node,
label: PropTypes.string,
t: PropTypes.func.isRequired,
};
renderAddUI() {
@ -82,7 +83,9 @@ class ObjectWidgetTopBar extends React.Component {
return (
<Dropdown
renderButton={() => (
<StyledDropdownButton>Add {this.props.label} item</StyledDropdownButton>
<StyledDropdownButton>
{this.props.t('editor.editorWidgets.list.addType', { item: this.props.label })}
</StyledDropdownButton>
)}
>
{types.map((type, idx) => (
@ -99,7 +102,8 @@ class ObjectWidgetTopBar extends React.Component {
renderAddButton() {
return (
<AddButton onClick={this.props.onAdd}>
Add {this.props.label} <Icon type="add" size="xsmall" />
{this.props.t('editor.editorWidgets.list.add', { item: this.props.label })}
<Icon type="add" size="xsmall" />
</AddButton>
);
}

View File

@ -128,6 +128,7 @@ export default class ListControl extends React.Component {
clearFieldErrors: PropTypes.func.isRequired,
fieldsErrors: ImmutablePropTypes.map.isRequired,
entry: ImmutablePropTypes.map.isRequired,
t: PropTypes.func.isRequired,
};
static defaultProps = {
@ -604,7 +605,7 @@ export default class ListControl extends React.Component {
}
renderListControl() {
const { value, forID, field, classNameWrapper } = this.props;
const { value, forID, field, classNameWrapper, t } = this.props;
const { itemsCollapsed, listCollapsed } = this.state;
const items = value || List();
const label = field.get('label', field.get('name'));
@ -635,6 +636,7 @@ export default class ListControl extends React.Component {
label={labelSingular.toLowerCase()}
onCollapseToggle={this.handleCollapseAllToggle}
collapsed={selfCollapsed}
t={t}
/>
{(!selfCollapsed || !minimizeCollapsedItems) && (
<SortableList

View File

@ -587,7 +587,7 @@ describe('ListControl', () => {
expect(queryByTestId('object-control-0')).toBeNull();
fireEvent.click(getByText('Add list'));
fireEvent.click(getByText('editor.editorWidgets.list.add'));
expect(props.onChange).toHaveBeenCalledTimes(1);
expect(props.onChange).toHaveBeenCalledWith(fromJS([{}]));

View File

@ -177,7 +177,7 @@ exports[`ListControl should add to list when add button is clicked 1`] = `
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -406,7 +406,7 @@ exports[`ListControl should remove from list when remove button is clicked 1`] =
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -665,7 +665,7 @@ exports[`ListControl should remove from list when remove button is clicked 2`] =
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -905,7 +905,7 @@ exports[`ListControl should render list with fields with collapse = "false" and
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -1163,7 +1163,7 @@ exports[`ListControl should render list with fields with collapse = "false" and
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -1422,7 +1422,7 @@ exports[`ListControl should render list with fields with default collapse ("true
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -1663,7 +1663,7 @@ exports[`ListControl should render list with fields with default collapse ("true
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -1862,7 +1862,7 @@ exports[`ListControl should render list with nested object 1`] = `
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>
@ -2120,7 +2120,7 @@ exports[`ListControl should render list with nested object with collapse = false
<button
class="emotion-10 emotion-11"
>
Add list
editor.editorWidgets.list.add
<span
class="emotion-0 emotion-8 emotion-2"
>

View File

@ -38,6 +38,7 @@ export default class ObjectControl extends React.Component {
clearFieldErrors: PropTypes.func.isRequired,
fieldsErrors: ImmutablePropTypes.map.isRequired,
hasError: PropTypes.bool,
t: PropTypes.func.isRequired,
};
static defaultProps = {
@ -135,7 +136,7 @@ export default class ObjectControl extends React.Component {
};
render() {
const { field, forID, classNameWrapper, forList, hasError } = this.props;
const { field, forID, classNameWrapper, forList, hasError, t } = this.props;
const collapsed = forList ? this.props.collapsed : this.state.collapsed;
const multiFields = field.get('fields');
const singleField = field.get('field');
@ -168,6 +169,7 @@ export default class ObjectControl extends React.Component {
collapsed={collapsed}
onCollapseToggle={this.handleCollapseToggle}
heading={collapsed && this.objectLabel()}
t={t}
/>
)}
<div