chore: add code formatting and linting (#952)
This commit is contained in:
@ -24,15 +24,15 @@ const SortableListItem = SortableElement(ListItem);
|
||||
|
||||
const StyledListItemTopBar = styled(ListItemTopBar)`
|
||||
background-color: ${colors.textFieldBorder};
|
||||
`
|
||||
`;
|
||||
|
||||
const NestedObjectLabel = styled.div`
|
||||
display: ${props => props.collapsed ? 'block' : 'none'};
|
||||
display: ${props => (props.collapsed ? 'block' : 'none')};
|
||||
border-top: 0;
|
||||
background-color: ${colors.textFieldBorder};
|
||||
padding: 13px;
|
||||
border-radius: 0 0 ${lengths.borderRadius} ${lengths.borderRadius};
|
||||
`
|
||||
`;
|
||||
|
||||
const styles = {
|
||||
collapsedObjectControl: css`
|
||||
@ -101,7 +101,7 @@ export default class ListControl extends React.Component {
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Always update so that each nested widget has the option to update. This is
|
||||
@ -113,7 +113,7 @@ export default class ListControl extends React.Component {
|
||||
return true;
|
||||
}
|
||||
|
||||
handleChange = (e) => {
|
||||
handleChange = e => {
|
||||
const { onChange } = this.props;
|
||||
const oldValue = this.state.value;
|
||||
const newValue = e.target.value;
|
||||
@ -129,21 +129,24 @@ export default class ListControl extends React.Component {
|
||||
|
||||
handleFocus = () => {
|
||||
this.props.setActiveStyle();
|
||||
}
|
||||
};
|
||||
|
||||
handleBlur = (e) => {
|
||||
const listValue = e.target.value.split(',').map(el => el.trim()).filter(el => el);
|
||||
handleBlur = e => {
|
||||
const listValue = e.target.value
|
||||
.split(',')
|
||||
.map(el => el.trim())
|
||||
.filter(el => el);
|
||||
this.setState({ value: valueToString(listValue) });
|
||||
this.props.setInactiveStyle();
|
||||
}
|
||||
};
|
||||
|
||||
handleAdd = (e) => {
|
||||
handleAdd = e => {
|
||||
e.preventDefault();
|
||||
const { value, onChange } = this.props;
|
||||
const parsedValue = (this.getValueType() === valueTypes.SINGLE) ? null : Map();
|
||||
const parsedValue = this.getValueType() === valueTypes.SINGLE ? null : Map();
|
||||
this.setState({ itemsCollapsed: this.state.itemsCollapsed.push(false) });
|
||||
onChange((value || List()).push(parsedValue));
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* In case the `onChangeObject` function is frozen by a child widget implementation,
|
||||
@ -157,9 +160,13 @@ export default class ListControl extends React.Component {
|
||||
const { value, metadata, onChange, field } = this.props;
|
||||
const collectionName = field.get('name');
|
||||
const newObjectValue = this.getObjectValue(index).set(fieldName, newValue);
|
||||
const parsedValue = (this.getValueType() === valueTypes.SINGLE) ? newObjectValue.first() : newObjectValue;
|
||||
const parsedValue =
|
||||
this.getValueType() === valueTypes.SINGLE ? newObjectValue.first() : newObjectValue;
|
||||
const parsedMetadata = {
|
||||
[collectionName]: Object.assign(metadata ? metadata.toJS() : {}, newMetadata ? newMetadata[collectionName] : {}),
|
||||
[collectionName]: Object.assign(
|
||||
metadata ? metadata.toJS() : {},
|
||||
newMetadata ? newMetadata[collectionName] : {},
|
||||
),
|
||||
};
|
||||
onChange(value.set(index, parsedValue), parsedMetadata);
|
||||
};
|
||||
@ -170,7 +177,9 @@ export default class ListControl extends React.Component {
|
||||
const { itemsCollapsed } = this.state;
|
||||
const { value, metadata, onChange, field } = this.props;
|
||||
const collectionName = field.get('name');
|
||||
const parsedMetadata = metadata && { [collectionName]: metadata.removeIn(value.get(index).valueSeq()) };
|
||||
const parsedMetadata = metadata && {
|
||||
[collectionName]: metadata.removeIn(value.get(index).valueSeq()),
|
||||
};
|
||||
|
||||
this.setState({ itemsCollapsed: itemsCollapsed.delete(index) });
|
||||
|
||||
@ -184,7 +193,7 @@ export default class ListControl extends React.Component {
|
||||
this.setState({ itemsCollapsed: itemsCollapsed.set(index, !collapsed) });
|
||||
};
|
||||
|
||||
handleCollapseAllToggle = (e) => {
|
||||
handleCollapseAllToggle = e => {
|
||||
e.preventDefault();
|
||||
const { value } = this.props;
|
||||
const { itemsCollapsed } = this.state;
|
||||
@ -197,8 +206,10 @@ export default class ListControl extends React.Component {
|
||||
const multiFields = field.get('fields');
|
||||
const singleField = field.get('field');
|
||||
const labelField = (multiFields && multiFields.first()) || singleField;
|
||||
const value = multiFields ? item.get(multiFields.first().get('name')) : singleField.get('label');
|
||||
return (value || `No ${ labelField.get('name') }`).toString();
|
||||
const value = multiFields
|
||||
? item.get(multiFields.first().get('name'))
|
||||
: singleField.get('label');
|
||||
return (value || `No ${labelField.get('name')}`).toString();
|
||||
}
|
||||
|
||||
onSortEnd = ({ oldIndex, newIndex }) => {
|
||||
@ -217,12 +228,7 @@ export default class ListControl extends React.Component {
|
||||
};
|
||||
|
||||
renderItem = (item, index) => {
|
||||
const {
|
||||
field,
|
||||
classNameWrapper,
|
||||
editorControl,
|
||||
resolveWidget,
|
||||
} = this.props;
|
||||
const { field, classNameWrapper, editorControl, resolveWidget } = this.props;
|
||||
const { itemsCollapsed } = this.state;
|
||||
const collapsed = itemsCollapsed.get(index);
|
||||
|
||||
@ -230,7 +236,7 @@ export default class ListControl extends React.Component {
|
||||
<SortableListItem
|
||||
className={cx(styles.listControlItem, { [styles.listControlItemCollapsed]: collapsed })}
|
||||
index={index}
|
||||
key={`item-${ index }`}
|
||||
key={`item-${index}`}
|
||||
>
|
||||
<StyledListItemTopBar
|
||||
collapsed={collapsed}
|
||||
@ -240,10 +246,7 @@ export default class ListControl extends React.Component {
|
||||
/>
|
||||
<NestedObjectLabel collapsed={collapsed}>{this.objectLabel(item)}</NestedObjectLabel>
|
||||
<ObjectControl
|
||||
classNameWrapper={cx(
|
||||
classNameWrapper,
|
||||
{ [styles.collapsedObjectControl]: collapsed },
|
||||
)}
|
||||
classNameWrapper={cx(classNameWrapper, { [styles.collapsedObjectControl]: collapsed })}
|
||||
value={item}
|
||||
field={field}
|
||||
onChangeObject={this.handleChangeFor(index)}
|
||||
@ -292,14 +295,16 @@ export default class ListControl extends React.Component {
|
||||
return this.renderListControl();
|
||||
}
|
||||
|
||||
return (<input
|
||||
type="text"
|
||||
id={forID}
|
||||
value={value}
|
||||
onChange={this.handleChange}
|
||||
onFocus={this.handleFocus}
|
||||
onBlur={this.handleBlur}
|
||||
className={classNameWrapper}
|
||||
/>);
|
||||
return (
|
||||
<input
|
||||
type="text"
|
||||
id={forID}
|
||||
value={value}
|
||||
onChange={this.handleChange}
|
||||
onFocus={this.handleFocus}
|
||||
onBlur={this.handleBlur}
|
||||
className={classNameWrapper}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user