mirror of
https://github.com/kingomarnajjar/flex-template-web.git
synced 2026-07-26 06:47:17 +10:00
Remove deprecated subcomponents
This commit is contained in:
Vesa Luusua
parent
a202a8eab4
commit
8223878f08
5 changed files with 1 additions and 300 deletions
|
|
@ -1,10 +1,6 @@
|
|||
import * as custom from './marketplace-custom-config.js';
|
||||
import defaultLocationSearches from './default-location-searches';
|
||||
import {
|
||||
stripePublishableKey,
|
||||
useDeprecatedLegalEntityWithStripe,
|
||||
stripeSupportedCountries,
|
||||
} from './stripe-config';
|
||||
import { stripePublishableKey, stripeSupportedCountries } from './stripe-config';
|
||||
|
||||
const env = process.env.REACT_APP_ENV;
|
||||
const dev = process.env.REACT_APP_ENV === 'development';
|
||||
|
|
@ -212,7 +208,6 @@ const config = {
|
|||
stripe: {
|
||||
publishableKey: stripePublishableKey,
|
||||
supportedCountries: stripeSupportedCountries,
|
||||
useDeprecatedLegalEntityWithStripe,
|
||||
},
|
||||
canonicalRootURL,
|
||||
address: {
|
||||
|
|
|
|||
|
|
@ -1,235 +0,0 @@
|
|||
import React from 'react';
|
||||
import { bool, string } from 'prop-types';
|
||||
import { compose } from 'redux';
|
||||
import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
|
||||
import { FieldArray } from 'react-final-form-arrays';
|
||||
import {
|
||||
ExternalLink,
|
||||
FieldTextInput,
|
||||
IconAdd,
|
||||
IconClose,
|
||||
InlineTextButton,
|
||||
} from '../../components';
|
||||
import * as validators from '../../util/validators';
|
||||
|
||||
import PayoutDetailsAddress from './PayoutDetailsAddress';
|
||||
import PayoutDetailsBankDetails from './PayoutDetailsBankDetails';
|
||||
import PayoutDetailsPersonalDetails from './PayoutDetailsPersonalDetails';
|
||||
import { stripeCountryConfigs } from './PayoutDetailsForm';
|
||||
import css from './PayoutDetailsForm.css';
|
||||
|
||||
// In EU, there can be a maximum of 4 additional owners
|
||||
const MAX_NUMBER_OF_ADDITIONAL_OWNERS = 4;
|
||||
|
||||
const PayoutDetailsFormCompanyComponent = ({ fieldRenderProps }) => {
|
||||
const {
|
||||
id,
|
||||
disabled,
|
||||
form,
|
||||
intl,
|
||||
values,
|
||||
form: {
|
||||
mutators: { push },
|
||||
},
|
||||
} = fieldRenderProps;
|
||||
const { country } = values;
|
||||
|
||||
const companyNameLabel = intl.formatMessage({ id: 'PayoutDetailsForm.companyNameLabel' });
|
||||
const companyNamePlaceholder = intl.formatMessage({
|
||||
id: 'PayoutDetailsForm.companyNamePlaceholder',
|
||||
});
|
||||
const companyNameRequired = validators.required(
|
||||
intl.formatMessage({
|
||||
id: 'PayoutDetailsForm.companyNameRequired',
|
||||
})
|
||||
);
|
||||
|
||||
const companyTaxIdLabel = intl.formatMessage({
|
||||
id: `PayoutDetailsForm.companyTaxIdLabel.${country}`,
|
||||
});
|
||||
const companyTaxIdPlaceholder = intl.formatMessage(
|
||||
{
|
||||
id: 'PayoutDetailsForm.companyTaxIdPlaceholder',
|
||||
},
|
||||
{
|
||||
idName: companyTaxIdLabel,
|
||||
}
|
||||
);
|
||||
const companyTaxIdRequired = validators.required(
|
||||
intl.formatMessage(
|
||||
{
|
||||
id: 'PayoutDetailsForm.companyTaxIdRequired',
|
||||
},
|
||||
{
|
||||
idName: companyTaxIdLabel,
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
const showPersonalAddressField =
|
||||
country &&
|
||||
stripeCountryConfigs(country).companyConfig &&
|
||||
stripeCountryConfigs(country).companyConfig.personalAddress;
|
||||
|
||||
const showAdditionalOwnersField =
|
||||
country &&
|
||||
stripeCountryConfigs(country).companyConfig &&
|
||||
stripeCountryConfigs(country).companyConfig.additionalOwners;
|
||||
|
||||
const hasAdditionalOwners = values.company && values.company.additionalOwners;
|
||||
const hasMaxNumberOfAdditionalOwners =
|
||||
hasAdditionalOwners &&
|
||||
values.company.additionalOwners.length >= MAX_NUMBER_OF_ADDITIONAL_OWNERS;
|
||||
|
||||
const additionalOwnersInfoLink = (
|
||||
<ExternalLink
|
||||
href="https://support.stripe.com/questions/owners-and-directors"
|
||||
className={css.termsLink}
|
||||
>
|
||||
<FormattedMessage id="PayoutDetailsForm.additionalOwnersInfoLink" />
|
||||
</ExternalLink>
|
||||
);
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
{country ? (
|
||||
<React.Fragment>
|
||||
<div className={css.sectionContainer}>
|
||||
<h3 className={css.subTitle}>
|
||||
<FormattedMessage id="PayoutDetailsForm.companyDetailsTitle" />
|
||||
</h3>
|
||||
<FieldTextInput
|
||||
id="company.companyName"
|
||||
name="company.companyName"
|
||||
disabled={disabled}
|
||||
type="text"
|
||||
autoComplete="company-name"
|
||||
label={companyNameLabel}
|
||||
placeholder={companyNamePlaceholder}
|
||||
validate={companyNameRequired}
|
||||
/>
|
||||
|
||||
<FieldTextInput
|
||||
id="company.companyTaxId"
|
||||
name="company.companyTaxId"
|
||||
className={css.taxId}
|
||||
disabled={disabled}
|
||||
type="text"
|
||||
autoComplete="company-tax-id"
|
||||
label={companyTaxIdLabel}
|
||||
placeholder={companyTaxIdPlaceholder}
|
||||
validate={companyTaxIdRequired}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<PayoutDetailsAddress
|
||||
country={country}
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
form={form}
|
||||
fieldId="company.address"
|
||||
/>
|
||||
|
||||
<PayoutDetailsBankDetails country={country} disabled={disabled} fieldId="company" />
|
||||
|
||||
<PayoutDetailsPersonalDetails
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
values={values}
|
||||
country={country}
|
||||
fieldId="company"
|
||||
/>
|
||||
|
||||
{showPersonalAddressField ? (
|
||||
<PayoutDetailsAddress
|
||||
className={css.personalAddressContainer}
|
||||
country={country}
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
form={form}
|
||||
fieldId="company.personalAddress"
|
||||
/>
|
||||
) : null}
|
||||
|
||||
{showAdditionalOwnersField ? (
|
||||
<div className={css.additionalOwnerWrapper}>
|
||||
<FieldArray id={id} name={'company.additionalOwners'}>
|
||||
{({ fields }) =>
|
||||
fields.map((name, index) => (
|
||||
<div className={css.additionalOwnerWrapper} key={name}>
|
||||
<div
|
||||
className={css.fieldArrayRemove}
|
||||
onClick={() => fields.remove(index)}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<span className={css.additionalOwnerLabel}>
|
||||
<IconClose rootClassName={css.closeIcon} size="small" />
|
||||
<FormattedMessage id="PayoutDetailsForm.additionalOwnerRemove" />
|
||||
</span>
|
||||
</div>
|
||||
<PayoutDetailsPersonalDetails
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
values={values}
|
||||
country={country}
|
||||
fieldId={`company.additionalOwners.${index}`}
|
||||
/>
|
||||
{showPersonalAddressField ? (
|
||||
<PayoutDetailsAddress
|
||||
className={css.personalAddressContainer}
|
||||
country={country}
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
form={form}
|
||||
fieldId={`company.additionalOwners.${index}`}
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
))
|
||||
}
|
||||
</FieldArray>
|
||||
|
||||
{!hasAdditionalOwners || !hasMaxNumberOfAdditionalOwners ? (
|
||||
<React.Fragment>
|
||||
<InlineTextButton
|
||||
type="button"
|
||||
rootClassName={css.fieldArrayAdd}
|
||||
onClick={() => push('company.additionalOwners', undefined)}
|
||||
>
|
||||
<span className={css.additionalOwnerLabel}>
|
||||
<IconAdd rootClassName={css.addIcon} />
|
||||
<FormattedMessage id="PayoutDetailsForm.additionalOwnerLabel" />
|
||||
</span>
|
||||
</InlineTextButton>
|
||||
<p className={css.additionalOwnerInfo}>
|
||||
<FormattedMessage
|
||||
id="PayoutDetailsForm.additionalOwnerInfoText"
|
||||
values={{ additionalOwnersInfoLink }}
|
||||
/>
|
||||
</p>
|
||||
</React.Fragment>
|
||||
) : null}
|
||||
</div>
|
||||
) : null}
|
||||
</React.Fragment>
|
||||
) : null}
|
||||
</React.Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
PayoutDetailsFormCompanyComponent.defaultProps = {
|
||||
id: null,
|
||||
disabled: false,
|
||||
};
|
||||
|
||||
PayoutDetailsFormCompanyComponent.propTypes = {
|
||||
id: string,
|
||||
disabled: bool,
|
||||
|
||||
// from injectIntl
|
||||
intl: intlShape.isRequired,
|
||||
};
|
||||
|
||||
const PayoutDetailsFormCompany = compose(injectIntl)(PayoutDetailsFormCompanyComponent);
|
||||
|
||||
export default PayoutDetailsFormCompany;
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react';
|
||||
import { bool } from 'prop-types';
|
||||
import { compose } from 'redux';
|
||||
import { injectIntl, intlShape } from 'react-intl';
|
||||
|
||||
import PayoutDetailsAddress from './PayoutDetailsAddress';
|
||||
import PayoutDetailsBankDetails from './PayoutDetailsBankDetails';
|
||||
import PayoutDetailsPersonalDetails from './PayoutDetailsPersonalDetails';
|
||||
|
||||
const PayoutDetailsFormIndividualComponent = ({ fieldRenderProps }) => {
|
||||
const { disabled, form, intl, values } = fieldRenderProps;
|
||||
const { country } = values;
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<PayoutDetailsPersonalDetails
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
values={values}
|
||||
country={country}
|
||||
fieldId="individual"
|
||||
/>
|
||||
<PayoutDetailsAddress
|
||||
country={country}
|
||||
intl={intl}
|
||||
disabled={disabled}
|
||||
form={form}
|
||||
fieldId="individual.address"
|
||||
/>
|
||||
<PayoutDetailsBankDetails country={country} disabled={disabled} fieldId="individual" />
|
||||
</React.Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
PayoutDetailsFormIndividualComponent.defaultProps = {
|
||||
disabled: false,
|
||||
};
|
||||
|
||||
PayoutDetailsFormIndividualComponent.propTypes = {
|
||||
disabled: bool,
|
||||
|
||||
// from injectIntl
|
||||
intl: intlShape.isRequired,
|
||||
};
|
||||
|
||||
const PayoutDetailsFormIndividual = compose(injectIntl)(PayoutDetailsFormIndividualComponent);
|
||||
|
||||
export default PayoutDetailsFormIndividual;
|
||||
|
|
@ -7,13 +7,6 @@
|
|||
// To make Stripe connection work, you also need to set Stripe's private key in the Flex Console.
|
||||
export const stripePublishableKey = process.env.REACT_APP_STRIPE_PUBLISHABLE_KEY;
|
||||
|
||||
// You can check your Stripe API version from Stripe Dashboard -> Developers.
|
||||
// If you are using the API version that is earlier than '2019-02-19' change this value to 'true'
|
||||
// See Stripe API changelog: https://stripe.com/docs/upgrades#api-changelog
|
||||
// NOTE: we are not supporting company accounts with new Stripe API yet!
|
||||
// The option for company accounts will be hidden if this value is set to 'false'
|
||||
export const useDeprecatedLegalEntityWithStripe = false;
|
||||
|
||||
// Stripe only supports payments in certain countries, see full list
|
||||
// at https://stripe.com/global
|
||||
//
|
||||
|
|
|
|||
|
|
@ -456,10 +456,6 @@
|
|||
"PasswordResetPage.resetFailed": "Reset failed. Please try again.",
|
||||
"PasswordResetPage.title": "Reset password",
|
||||
"PayoutDetailsForm.accountTypeTitle": "Account type",
|
||||
"PayoutDetailsForm.additionalOwnersInfoLink": "Stripe support.",
|
||||
"PayoutDetailsForm.additionalOwnerInfoText": "For Hong Kong, Singapore, and Single Euro Payments Area member countries, Stripe requires information of every person that owns at least 25% of the company. For more information, see {additionalOwnersInfoLink}",
|
||||
"PayoutDetailsForm.additionalOwnerLabel": "Add additional owner",
|
||||
"PayoutDetailsForm.additionalOwnerRemove": "Remove additional owner",
|
||||
"PayoutDetailsForm.addressTitle": "Address",
|
||||
"PayoutDetailsForm.bankDetails": "Bank details",
|
||||
"PayoutDetailsForm.birthdayDatePlaceholder": "dd",
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue