maverick/flex-template-web
1
0
Fork 0
mirror of https://github.com/kingomarnajjar/flex-template-web.git synced 2026-07-26 06:47:17 +10:00
Code Issues Projects Releases Packages Wiki Activity Actions

Remove unused code

Browse source
This commit is contained in:
Hannu Lyytikainen 2018-05-31 17:05:30 +03:00
parent 0fe23cc60b
commit 2cf223fbe8
17 changed files with 0 additions and 830 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
src/components/FieldGroupCheckbox/FieldCheckbox.css
View file

@ -1,68 +0,0 @@
@import '../../marketplace.css';
.root {
position: relative;
}
.input {
position: absolute;
opacity: 0;
height: 0;
width: 0;
/* Highlight the borders if the checkbox is hovered, focused or checked */
&:hover + label .box,
&:focus + label .box,
&:checked + label .box {
stroke: var(--marketplaceColor);
}
/* Display the "check" when checked */
&:checked + label .checked {
display: inline;
stroke: var(--marketplaceColor);
stroke-width: 1px;
}
/* Hightlight the text on checked, hover and focus */
&:focus + label .text,
&:hover + label .text,
&:checked + label .text {
color: var(--matterColorDark);
}
}
.label {
display: flex;
align-items: center;
padding: 0;
}
.checkboxWrapper {
/* This should follow line-height */
height: 32px;
margin-top: -1px;
margin-right: 12px;
align-self: baseline;
display: inline-flex;
align-items: center;
cursor: pointer;
}
.checked {
display: none;
fill: var(--marketplaceColor);
}
.box {
stroke: var(--matterColorAnti);
}
.text {
@apply --marketplaceListingAttributeFontStyles;
color: var(--matterColor);
margin-top: -1px;
margin-bottom: 1px;
cursor: pointer;
}

91
src/components/FieldGroupCheckbox/FieldCheckbox.js
View file

@ -1,91 +0,0 @@
import React from 'react';
import { any, node, string, object, shape } from 'prop-types';
import classNames from 'classnames';
import { Field } from 'react-final-form';
import { ValidationError } from '../../components';
import css from './FieldCheckbox.css';
const IconCheckbox = props => {
return (
<svg className={props.className} width="14" height="14" xmlns="http://www.w3.org/2000/svg">
<g fill="none" fillRule="evenodd">
<g transform="translate(2 2)">
<path
className={css.checked}
d="M9.9992985 1.5048549l-.0194517 6.9993137C9.977549 9.3309651 9.3066522 10 8.4798526 10H1.5001008c-.8284271 0-1.5-.6715729-1.5-1.5l-.000121-7c0-.8284271.6715728-1.5 1.5-1.5h.000121l6.9993246.0006862c.8284272.000067 1.4999458.671694 1.499879 1.5001211a1.5002208 1.5002208 0 0 1-.0000059.0040476z"
/>
<path
className={css.box}
strokeWidth="2"
d="M10.9992947 1.507634l-.0194518 6.9993137C10.9760133 9.8849417 9.8578519 11 8.4798526 11H1.5001008c-1.3807119 0-2.5-1.1192881-2.5-2.4999827L-1.0000202 1.5c0-1.3807119 1.119288-2.5 2.500098-2.5l6.9994284.0006862c1.3807118.0001115 2.4999096 1.11949 2.4997981 2.5002019-.0000018.003373-.0000018.003373-.0000096.0067458z"
/>
</g>
<path
d="M5.636621 10.7824771L3.3573694 8.6447948c-.4764924-.4739011-.4764924-1.2418639 0-1.7181952.4777142-.473901 1.251098-.473901 1.7288122 0l1.260291 1.1254782 2.8256927-4.5462307c.3934117-.5431636 1.1545778-.6695372 1.7055985-.278265.5473554.3912721.6731983 1.150729.2797866 1.6951077l-3.6650524 5.709111c-.2199195.306213-.5803433.5067097-.9920816.5067097-.3225487 0-.6328797-.1263736-.8637952-.3560334z"
fill="#FFF"
/>
</g>
</svg>
);
};
IconCheckbox.defaultProps = { className: null };
IconCheckbox.propTypes = { className: string };
const FieldCheckboxComponent = props => {
const { rootClassName, className, svgClassName, id, label, input, meta, ...rest } = props;
const classes = classNames(rootClassName || css.root, className);
const { value, ...inputProps } = input;
const checked = value === true;
const checkboxProps = {
id,
className: css.input,
type: 'checkbox',
checked,
...inputProps,
...rest,
};
return (
<span className={classes}>
<input {...checkboxProps} />
<label htmlFor={id} className={css.label}>
<span className={css.checkboxWrapper}>
<IconCheckbox className={svgClassName} />
</span>
<span className={css.text}>{label}</span>
</label>
<ValidationError fieldMeta={meta} />
</span>
);
};
FieldCheckboxComponent.defaultProps = {
className: null,
rootClassName: null,
svgClassName: null,
label: null,
};
FieldCheckboxComponent.propTypes = {
className: string,
rootClassName: string,
svgClassName: string,
id: string.isRequired,
label: node,
// FieldRenderProps
input: shape({ value: any }).isRequired,
meta: object.isRequired,
};
const FieldCheckbox = props => {
return <Field component={FieldCheckboxComponent} {...props} />;
};
export default FieldCheckbox;

28
src/components/FieldGroupCheckbox/FieldGroupCheckbox.css
View file

@ -1,28 +0,0 @@
@import '../../marketplace.css';
.root {
margin: 0;
padding: 0;
border: none;
}
.list {
margin: 0;
}
.twoColumns {
@media (--viewportMedium) {
columns: 2;
}
}
.item {
padding: 2px 0;
/* Fix broken multi-column layout in Chrome */
page-break-inside: avoid;
@media (--viewportMedium) {
padding: 4px 0;
}
}

108
src/components/FieldGroupCheckbox/FieldGroupCheckbox.example.js
View file

@ -1,108 +0,0 @@
import React from 'react';
import { reduxForm, propTypes as formPropTypes } from 'redux-form';
import { Button } from '../../components';
import FieldGroupCheckbox from './FieldGroupCheckbox';
import { requiredFieldArrayCheckbox } from '../../util/validators';
const formName = 'Styleguide.FieldGroupCheckboxForm';
const formNameRequired = 'Styleguide.FieldGroupCheckboxFormRequired';
const label = <h3>Amenities</h3>;
const commonProps = {
label: label,
options: [
{
key: 'towels',
label: 'Towels',
},
{
key: 'bathroom',
label: 'Bathroom',
},
{
key: 'swimming_pool',
label: 'Swimming pool',
},
{
key: 'own_drinks',
label: 'Own drinks allowed',
},
{
key: 'jacuzzi',
label: 'Jacuzzi',
},
{
key: 'audiovisual_entertainment',
label: 'Audiovisual entertainment',
},
{
key: 'barbeque',
label: 'Barbeque',
},
{
key: 'own_food_allowed',
label: 'Own food allowed',
},
],
twoColumns: true,
};
const optionalProps = {
name: 'amenities-optional',
id: `${formName}.amenities-optional`,
...commonProps,
};
const requiredProps = {
name: 'amenities-required',
id: `${formNameRequired}.amenities-required`,
...commonProps,
validate: requiredFieldArrayCheckbox('this is required'),
};
const FormComponent = props => {
const { handleSubmit, invalid, submitting, componentProps } = props;
const submitDisabled = invalid || submitting;
return (
<form onSubmit={handleSubmit}>
<FieldGroupCheckbox {...componentProps} />
<Button style={{ marginTop: 24 }} type="submit" disabled={submitDisabled}>
Submit
</Button>
</form>
);
};
FormComponent.propTypes = formPropTypes;
const Form = formName => {
return reduxForm({
form: formName,
})(FormComponent);
};
export const Optional = {
component: Form(formName),
props: {
onSubmit: values => {
console.log('Submit values: ', values);
},
componentProps: optionalProps,
},
group: 'inputs',
};
export const Required = {
component: Form(formNameRequired),
props: {
onSubmit: values => {
console.log('Submit values: ', values);
},
componentProps: requiredProps,
},
group: 'inputs',
};

92
src/components/FieldGroupCheckbox/FieldGroupCheckbox.js
View file

@ -1,92 +0,0 @@
/*
* Renders a group of checkboxes that can be used to select
* multiple values from a set of options.
*
* The corresponding component when rendering the selected
* values is PropertyGroup.
*
*/
import React, { Component } from 'react';
import { arrayOf, bool, node, shape, string } from 'prop-types';
import classNames from 'classnames';
import { FieldArray } from 'redux-form';
import { ValidationError } from '../../components';
import FieldCheckbox from './FieldCheckbox';
import css from './FieldGroupCheckbox.css';
class FieldCheckboxRenderer extends Component {
constructor(props) {
super(props);
this.state = { touched: false };
}
componentWillReceiveProps(nextProps) {
// FieldArray doesn't have touched prop, so we'll keep track of it
if (!this.state.touched) {
this.setState({ touched: nextProps.meta.dirty });
}
}
render() {
const { className, rootClassName, label, twoColumns, id, options, meta, name } = this.props;
const touched = this.state.touched;
const classes = classNames(rootClassName || css.root, className);
const listClasses = twoColumns ? classNames(css.list, css.twoColumns) : css.list;
return (
<fieldset className={classes}>
{label ? <legend>{label}</legend> : null}
<ul className={listClasses}>
{options.map(option => {
const fieldId = `${id}.${option.key}`;
return (
<li key={fieldId} className={css.item}>
<FieldCheckbox id={fieldId} name={`${name}.${option.key}`} label={option.label} />
</li>
);
})}
</ul>
<ValidationError fieldMeta={{ ...meta, touched }} />
</fieldset>
);
}
}
FieldCheckboxRenderer.defaultProps = {
rootClassName: null,
className: null,
label: null,
twoColumns: false,
};
FieldCheckboxRenderer.propTypes = {
rootClassName: string,
className: string,
id: string.isRequired,
label: node,
options: arrayOf(
shape({
key: string.isRequired,
label: node.isRequired,
})
).isRequired,
twoColumns: bool,
};
// Redux Form: the name of FieldArray must be unique
// https://github.com/erikras/redux-form/issues/2740
const FieldGroupCheckbox = props => (
<FieldArray component={FieldCheckboxRenderer} name={`${props.name}.FieldArray`} props={props} />
);
// Name and component are required fields for FieldArray.
// Component-prop we define in this file, name needs to be passed in
FieldGroupCheckbox.propTypes = {
name: string.isRequired,
};
export default FieldGroupCheckbox;

18
src/components/SelectField/SelectField.css
View file

@ -1,18 +0,0 @@
@import '../../marketplace.css';
.root {
}
.select {
color: var(--matterColorAnti);
border-bottom-color: var(--attentionColor);
}
.selectSuccess {
color: var(--matterColor);
border-bottom-color: var(--successColor);
}
.selectError {
border-bottom-color: var(--failColor);
}

47
src/components/SelectField/SelectField.example.js
View file

@ -1,47 +0,0 @@
/* eslint-disable no-console */
import React from 'react';
import { reduxForm, propTypes as formPropTypes } from 'redux-form';
import * as validators from '../../util/validators';
import { Button } from '../../components';
import SelectField from './SelectField';
const formName = 'Styleguide.SelectField.Form';
const FormComponent = props => {
const { form, handleSubmit, invalid, pristine, submitting } = props;
const required = validators.required('This field is required');
const submitDisabled = invalid || pristine || submitting;
return (
<form onSubmit={handleSubmit}>
<SelectField
id={`${form}.select1`}
name="select1"
label="Choose an option:"
validate={required}
>
<option value="">Pick something...</option>
<option value="first">First option</option>
<option value="second">Second option</option>
</SelectField>
<Button style={{ marginTop: 24 }} type="submit" disabled={submitDisabled}>
Submit
</Button>
</form>
);
};
FormComponent.propTypes = formPropTypes;
const Form = reduxForm({
form: formName,
})(FormComponent);
export const Select = {
component: Form,
props: {
onSubmit: values => {
console.log('submit values:', values);
},
},
group: 'inputs',
};

72
src/components/SelectField/SelectField.js
View file

@ -1,72 +0,0 @@
/**
* DEPRECATED: this component is part of Redux Form - we are migrating to react-final-form.
*/
import React from 'react';
import PropTypes from 'prop-types';
import { Field } from 'redux-form';
import classNames from 'classnames';
import { ValidationError } from '../../components';
import css from './SelectField.css';
const SelectFieldComponent = props => {
const { rootClassName, className, id, label, input, meta, children, ...rest } = props;
if (label && !id) {
throw new Error('id required when a label is given');
}
const { valid, invalid, touched, error } = meta;
// Error message and input error styles are only shown if the
// field has been touched and the validation has failed.
const hasError = touched && invalid && error;
const selectClasses = classNames(css.select, {
[css.selectSuccess]: valid,
[css.selectError]: hasError,
});
const selectProps = { className: selectClasses, id, ...input, ...rest };
const classes = classNames(rootClassName || css.root, className);
return (
<div className={classes}>
{label ? <label htmlFor={id}>{label}</label> : null}
<select {...selectProps}>{children}</select>
<ValidationError fieldMeta={meta} />
</div>
);
};
SelectFieldComponent.defaultProps = {
rootClassName: null,
className: null,
id: null,
label: null,
children: null,
};
const { string, object, node } = PropTypes;
SelectFieldComponent.propTypes = {
rootClassName: string,
className: string,
// Label is optional, but if it is given, an id is also required so
// the label can reference the input in the `for` attribute
id: string,
label: string,
// Generated by redux-form's Field component
input: object.isRequired,
meta: object.isRequired,
children: node,
};
const SelectField = props => {
return <Field component={SelectFieldComponent} {...props} />;
};
export default SelectField;

19
src/components/TextInputField/TextInputField.css
View file

@ -1,19 +0,0 @@
@import '../../marketplace.css';
.root {
}
.input {
border-bottom-color: var(--attentionColor);
}
.inputSuccess {
border-bottom-color: var(--successColor);
}
.inputError {
border-bottom-color: var(--failColor);
}
.textarea {
}

7
src/components/TextInputField/TextInputField.example.css
View file

@ -1,7 +0,0 @@
.field {
margin-top: 24px;
}
.submit {
margin-top: 24px;
}

81
src/components/TextInputField/TextInputField.example.js
View file

@ -1,81 +0,0 @@
/* eslint-disable no-console */
import React from 'react';
import { reduxForm, propTypes as formPropTypes } from 'redux-form';
import * as validators from '../../util/validators';
import { Button } from '../../components';
import TextInputField from './TextInputField';
import css from './TextInputField.example.css';
const formName = 'Styleguide.TextInputField.Form';
const FormComponent = props => {
const { handleSubmit, invalid, pristine, submitting } = props;
const required = validators.required('This field is required');
const submitDisabled = invalid || pristine || submitting;
return (
<form onSubmit={handleSubmit}>
<TextInputField
className={css.field}
type="text"
id={`${formName}.input1`}
name="input1"
label="Input that requires a value:"
validate={required}
/>
<TextInputField
className={css.field}
type="text"
id={`${formName}.input2`}
name="input2"
label="Input that does not require a value:"
/>
<TextInputField
className={css.field}
type="text"
name="input3"
placeholder="Input without label..."
/>
<TextInputField
className={css.field}
type="textarea"
id={`${formName}.textarea1`}
name="textarea1"
label="Textarea that requires a value:"
validate={required}
/>
<TextInputField
className={css.field}
type="textarea"
id={`${formName}.textarea2`}
name="textarea2"
label="Textarea that does not require a value:"
/>
<TextInputField
className={css.field}
type="textarea"
name="textarea3"
placeholder="Textarea without label..."
/>
<Button className={css.submit} type="submit" disabled={submitDisabled}>
Submit
</Button>
</form>
);
};
FormComponent.propTypes = formPropTypes;
const Form = reduxForm({
form: formName,
})(FormComponent);
export const Inputs = {
component: Form,
props: {
onSubmit: values => {
console.log('submit values:', values);
},
},
group: 'inputs',
};

117
src/components/TextInputField/TextInputField.js
View file

@ -1,117 +0,0 @@
/**
* DEPRECATED: this component is part of Redux Form - we are migrating to react-final-form.
*/
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Field } from 'redux-form';
import classNames from 'classnames';
import { ValidationError, ExpandingTextarea } from '../../components';
import css from './TextInputField.css';
const CONTENT_MAX_LENGTH = 5000;
class TextInputFieldComponent extends Component {
componentWillUnmount() {
if (this.props.clearOnUnmount) {
this.props.input.onChange('');
}
}
render() {
/* eslint-disable no-unused-vars */
const {
rootClassName,
className,
inputRootClass,
clearOnUnmount,
customErrorText,
id,
label,
type,
input,
meta,
...rest
} = this.props;
/* eslint-enable no-unused-vars */
if (label && !id) {
throw new Error('id required when a label is given');
}
const { valid, invalid, touched, error } = meta;
const isTextarea = type === 'textarea';
const errorText = customErrorText || error;
// Error message and input error styles are only shown if the
// field has been touched and the validation has failed.
const hasError = touched && invalid && errorText;
const fieldMeta = { touched, error: errorText };
const inputClasses =
inputRootClass ||
classNames(css.input, {
[css.inputSuccess]: valid,
[css.inputError]: hasError,
[css.textarea]: isTextarea,
});
const inputProps = isTextarea
? { className: inputClasses, id, rows: 1, maxLength: CONTENT_MAX_LENGTH, ...input, ...rest }
: { className: inputClasses, id, type, ...input, ...rest };
const classes = classNames(rootClassName || css.root, className);
return (
<div className={classes}>
{label ? <label htmlFor={id}>{label}</label> : null}
{isTextarea ? <ExpandingTextarea {...inputProps} /> : <input {...inputProps} />}
<ValidationError fieldMeta={fieldMeta} />
</div>
);
}
}
TextInputFieldComponent.defaultProps = {
rootClassName: null,
className: null,
inputRootClass: null,
clearOnUnmount: false,
customErrorText: null,
id: null,
label: null,
};
const { string, bool, shape, func, object } = PropTypes;
TextInputFieldComponent.propTypes = {
rootClassName: string,
className: string,
inputRootClass: string,
clearOnUnmount: bool,
// Error message that can be manually passed to input field,
// overrides default validation message
customErrorText: string,
// Label is optional, but if it is given, an id is also required so
// the label can reference the input in the `for` attribute
id: string,
label: string,
// Either 'textarea' or something that is passed to the input element
type: string.isRequired,
// Generated by redux-form's Field component
input: shape({
onChange: func.isRequired,
}).isRequired,
meta: object.isRequired,
};
const TextInputField = props => {
return <Field component={TextInputFieldComponent} {...props} />;
};
export default TextInputField;

3
src/components/index.js
View file

@ -36,7 +36,6 @@ export { default as FieldCheckboxGroup } from './FieldCheckboxGroup/FieldCheckbo
export { default as FieldCurrencyInput } from './FieldCurrencyInput/FieldCurrencyInput';
export { default as FieldDateInput } from './FieldDateInput/FieldDateInput';
export { default as FieldDateRangeInput } from './FieldDateRangeInput/FieldDateRangeInput';
export { default as FieldGroupCheckbox } from './FieldGroupCheckbox/FieldGroupCheckbox';
export { default as FieldPhoneNumberInput } from './FieldPhoneNumberInput/FieldPhoneNumberInput';
export { default as FieldReviewRating } from './FieldReviewRating/FieldReviewRating';
export { default as FieldSelect } from './FieldSelect/FieldSelect';
@ -115,7 +114,6 @@ export { default as SectionHero } from './SectionHero/SectionHero';
export { default as SectionHowItWorks } from './SectionHowItWorks/SectionHowItWorks';
export { default as SectionLocations } from './SectionLocations/SectionLocations';
export { default as SectionThumbnailLinks } from './SectionThumbnailLinks/SectionThumbnailLinks';
export { default as SelectField } from './SelectField/SelectField';
export { default as SelectMultipleFilter } from './SelectMultipleFilter/SelectMultipleFilter';
export {
default as SelectMultipleFilterPlain,
@ -131,7 +129,6 @@ export { default as TabNav } from './TabNav/TabNav';
export { LinkTabNavHorizontal, ButtonTabNavHorizontal } from './TabNavHorizontal/TabNavHorizontal';
export { default as Tabs } from './Tabs/Tabs';
export { default as TermsOfService } from './TermsOfService/TermsOfService';
export { default as TextInputField } from './TextInputField/TextInputField';
export { default as Topbar } from './Topbar/Topbar';
export { default as TopbarDesktop } from './TopbarDesktop/TopbarDesktop';
export { default as TopbarMobileMenu } from './TopbarMobileMenu/TopbarMobileMenu';

2
src/ducks/index.js
View file

@ -4,7 +4,6 @@
* https://github.com/erikras/ducks-modular-redux
*/
import { reducer as form } from 'redux-form';
import Auth from './Auth.duck';
import EmailVerification from './EmailVerification.duck';
import FlashNotification from './FlashNotification.duck';
@ -21,7 +20,6 @@ export {
LocationFilter,
Routing,
UI,
form,
marketplaceData,
user,
};

6
src/examples.js
View file

@ -12,7 +12,6 @@ import * as FieldCheckboxGroup from './components/FieldCheckboxGroup/FieldCheckb
import * as FieldCurrencyInput from './components/FieldCurrencyInput/FieldCurrencyInput.example';
import * as FieldDateInput from './components/FieldDateInput/FieldDateInput.example';
import * as FieldDateRangeInput from './components/FieldDateRangeInput/FieldDateRangeInput.example';
import * as FieldGroupCheckbox from './components/FieldGroupCheckbox/FieldGroupCheckbox.example';
import * as FieldPhoneNumberInput from './components/FieldPhoneNumberInput/FieldPhoneNumberInput.example';
import * as FieldReviewRating from './components/FieldReviewRating/FieldReviewRating.example';
import * as FieldSelect from './components/FieldSelect/FieldSelect.example';
@ -49,14 +48,12 @@ import * as ResponsiveImage from './components/ResponsiveImage/ResponsiveImage.e
import * as ReviewRating from './components/ReviewRating/ReviewRating.example';
import * as Reviews from './components/Reviews/Reviews.example';
import * as SectionThumbnailLinks from './components/SectionThumbnailLinks/SectionThumbnailLinks.example';
import * as SelectField from './components/SelectField/SelectField.example';
import * as SelectMultipleFilter from './components/SelectMultipleFilter/SelectMultipleFilter.example';
import * as SelectMultipleFilterPlain from './components/SelectMultipleFilterPlain/SelectMultipleFilterPlain.example';
import * as StripeBankAccountTokenInputField from './components/StripeBankAccountTokenInputField/StripeBankAccountTokenInputField.example';
import * as TabNav from './components/TabNav/TabNav.example';
import * as TabNavHorizontal from './components/TabNavHorizontal/TabNavHorizontal.example';
import * as Tabs from './components/Tabs/Tabs.example';
import * as TextInputField from './components/TextInputField/TextInputField.example';
import * as TopbarDesktop from './components/TopbarDesktop/TopbarDesktop.example';
import * as UserCard from './components/UserCard/UserCard.example';
@ -107,7 +104,6 @@ export {
FieldCurrencyInput,
FieldDateInput,
FieldDateRangeInput,
FieldGroupCheckbox,
FieldPhoneNumberInput,
FieldReviewRating,
FieldSelect,
@ -149,7 +145,6 @@ export {
ReviewRating,
Reviews,
SectionThumbnailLinks,
SelectField,
SelectMultipleFilter,
SelectMultipleFilterPlain,
SendMessageForm,
@ -159,7 +154,6 @@ export {
TabNav,
TabNavHorizontal,
Tabs,
TextInputField,
TopbarDesktop,
Typography,
UserCard,

37
src/util/data.js
View file

@ -1,6 +1,5 @@
import isArray from 'lodash/isArray';
import reduce from 'lodash/reduce';
import toPairs from 'lodash/toPairs';
/**
* Combine the given relationships objects
@ -283,39 +282,3 @@ export const overrideArrays = (objValue, srcValue, key, object, source, stack) =
return srcValue;
}
};
/**
* Converts an array of strings into an object where the array items
* are keys and values in all fields are true. This kind of object
* can be passed as initialValues parameter to a ReduxForm that contains
* checkbox inputs.
*
* @param {Array} array An array of strings
*
* @return {Object} An object containing the array items as keys and all
* the values set to true
*
* A complementary function to formValuesToArray.
*
*/
export const arrayToFormValues = array => {
return array.reduce((map, key) => {
map[key] = true;
return map;
}, {});
};
/**
* Converts a values object received form a Redux Form containing
* checkboxes into an array that contains only the values.
*
* @param {Object} formValues A values object received from a Redux Form
*
* @return {Array} An array containing the keys of the formValues parameter
*
* A complementary function to arrayToFormValues.
*/
export const formValuesToArray = formValues => {
const entries = toPairs(formValues);
return entries.filter(entry => entry[1] === true).map(entry => entry[0]);
};

34
src/util/data.test.js
View file

@ -328,38 +328,4 @@ describe('data utils', () => {
]);
});
});
describe('arrayToFormValues()', () => {
it('converts an empty array', () => {
expect(arrayToFormValues([])).toEqual({});
});
it('converts multiple values', () => {
const array = ['one', 'two', 'three'];
const formValues = { one: true, two: true, three: true };
expect(arrayToFormValues(array)).toEqual(formValues);
});
});
describe('formValuesToArray()', () => {
it('converts an empty object', () => {
expect(formValuesToArray({})).toEqual([]);
});
it('converts multiple values', () => {
const formValues = { one: true, two: true, three: true };
const array = ['one', 'two', 'three'];
expect(formValuesToArray(formValues)).toEqual(array);
});
it('it skips non-true values form input object', () => {
const formValues = {
one: true,
two: null,
three: 'true',
four: false,
five: '',
six: true,
};
const array = ['one', 'six'];
expect(formValuesToArray(formValues)).toEqual(array);
});
});
});