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

pre-final-form naming pattern: form prop was conflicting with form api

Browse source
This commit is contained in:
Vesa Luusua 2019-08-27 14:12:54 +03:00
parent 494ad56147
commit 9eb4e7a125
11 changed files with 26 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/FieldBoolean/FieldBoolean.example.js
View file

@ -9,7 +9,7 @@ const formName = 'Styleguide.FieldBoolean.Form';
const FormComponent = props => (
<FinalForm
{...props}
form={formName}
formId={formName}
render={fieldRenderProps => {
const { form, handleSubmit, onChange, invalid, pristine, submitting } = props;
const required = validators.requiredBoolean('This field is required');

2
src/components/FieldCheckbox/FieldCheckbox.example.js
View file

@ -8,7 +8,7 @@ const formName = 'Styleguide.FieldCheckbox.Form';
const FormComponent = props => (
<FinalForm
{...props}
form={formName}
formId={formName}
render={fieldRenderProps => {
const { form, handleSubmit, onChange, invalid, pristine, submitting } = fieldRenderProps;

5
src/components/FieldPhoneNumberInput/FieldPhoneNumberInput.example.js
View file

@ -4,12 +4,9 @@ import * as validators from '../../util/validators';
import { Button } from '../../components';
import FieldPhoneNumberInput from './FieldPhoneNumberInput';
const formName = 'Styleguide.FieldPhoneNumberInput.Form';
const FormComponent = props => (
<FinalForm
{...props}
form={formName}
render={fieldRenderProps => {
const { formId, handleSubmit, onChange, invalid, pristine, submitting } = fieldRenderProps;
const required = validators.required('This field is required');
@ -41,7 +38,7 @@ const FormComponent = props => (
export const PhoneNumber = {
component: FormComponent,
props: {
formId: 'PhoneNumberExample',
formId: 'Styleguide.FieldPhoneNumberInput.Form',
onChange: formState => {
if (formState.dirty) {
console.log('form values changed to:', formState.values);

2
src/components/FieldRadioButton/FieldRadioButton.example.js
View file

@ -2,12 +2,10 @@ import React from 'react';
import { Form as FinalForm, FormSpy } from 'react-final-form';
import { Button } from '..';
import FieldRadioButton from './FieldRadioButton';
const formName = 'Styleguide.FieldRadioButton.Form';
const FormComponent = props => (
<FinalForm
{...props}
form={formName}
render={fieldRenderProps => {
const {
handleSubmit,

6
src/components/FieldReviewRating/FieldReviewRating.example.js
View file

@ -10,9 +10,9 @@ const formName = 'Styleguide.FieldReviewRating.Form';
const FormComponent = props => (
<FinalForm
{...props}
form={formName}
formId={formName}
render={fieldRenderProps => {
const { form, handleSubmit, onChange, invalid, pristine, submitting } = fieldRenderProps;
const { formId, handleSubmit, onChange, invalid, pristine, submitting } = fieldRenderProps;
const required = validators.required('This field is required');
const submitDisabled = invalid || pristine || submitting;
@ -25,7 +25,7 @@ const FormComponent = props => (
>
<FormSpy onChange={onChange} />
<FieldReviewRating
id={`${form}.rate1`}
id={`${formId}.rate1`}
name="rating"
label="Rate your experience"
validate={required}

1
src/components/Topbar/Topbar.js
View file

@ -244,7 +244,6 @@ class TopbarComponent extends Component {
>
<div className={css.searchContainer}>
<TopbarSearchForm
form="TopbarSearchForm"
onSubmit={this.handleSubmit}
initialValues={initialSearchFormValues}
isMobile

1
src/components/TopbarDesktop/TopbarDesktop.js
View file

@ -47,7 +47,6 @@ const TopbarDesktop = props => {
<TopbarSearchForm
className={css.searchLink}
desktopInputRoot={css.topbarSearchWithLeftPadding}
form="TopbarSearchFormDesktop"
onSubmit={onSearchSubmit}
initialValues={initialSearchFormValues}
/>

2
src/components/TransactionPanel/TransactionPanel.js
View file

@ -395,7 +395,7 @@ export class TransactionPanelComponent extends Component {
/>
{showSendMessageForm ? (
<SendMessageForm
form={this.sendMessageFormName}
formId={this.sendMessageFormName}
rootClassName={css.sendMessageForm}
messagePlaceholder={sendMessagePlaceholder}
inProgress={sendMessageInProgress}

28
src/components/TransactionPanel/__snapshots__/TransactionPanel.test.js.snap
View file

@ -509,7 +509,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -1266,7 +1266,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -2023,7 +2023,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -2780,7 +2780,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -3547,7 +3547,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -4309,7 +4309,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -5064,7 +5064,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -5821,7 +5821,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -6578,7 +6578,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -7335,7 +7335,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -8092,7 +8092,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -8849,7 +8849,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -9606,7 +9606,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}
@ -10361,7 +10361,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
totalMessagePages={1}
/>
<SendMessageForm
form="TransactionPanel.SendMessageForm"
formId="TransactionPanel.SendMessageForm"
inProgress={false}
messagePlaceholder="TransactionPanel.sendMessagePlaceholder"
onBlur={[Function]}

6
src/forms/BookingDatesForm/BookingDatesForm.js
View file

@ -79,7 +79,7 @@ export class BookingDatesFormComponent extends Component {
const {
endDatePlaceholder,
startDatePlaceholder,
form,
formId,
handleSubmit,
intl,
isOwnListing,
@ -161,10 +161,10 @@ export class BookingDatesFormComponent extends Component {
className={css.bookingDates}
name="bookingDates"
unitType={unitType}
startDateId={`${form}.bookingStartDate`}
startDateId={`${formId}.bookingStartDate`}
startDateLabel={bookingStartLabel}
startDatePlaceholderText={startDatePlaceholderText}
endDateId={`${form}.bookingEndDate`}
endDateId={`${formId}.bookingEndDate`}
endDateLabel={bookingEndLabel}
endDatePlaceholderText={endDatePlaceholderText}
focusedInput={this.state.focusedInput}

3
src/forms/SendMessageForm/SendMessageForm.js
View file

@ -66,6 +66,7 @@ class SendMessageFormComponent extends Component {
sendMessageError,
invalid,
form,
formId,
} = formRenderProps;
const classes = classNames(rootClassName || css.root, className);
@ -76,7 +77,7 @@ class SendMessageFormComponent extends Component {
<FieldTextInput
inputRootClass={css.textarea}
type="textarea"
id="message"
id={formId ? `${formId}.message` : 'message'}
name="message"
placeholder={messagePlaceholder}
onFocus={this.handleFocus}