lint.
Этот коммит содержится в:
@@ -68,11 +68,11 @@ const EnterpriseEditionLeftPanel = ({
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
console.log(actionQueryParam);
|
console.log(actionQueryParam);
|
||||||
if (actionQueryParam === 'show_expansion_modal' && canExpand && isSelfHostedExpansionEnabled) {
|
if (actionQueryParam === 'show_expansion_modal' && canExpand && isSelfHostedExpansionEnabled) {
|
||||||
console.log("Open modal!");
|
console.log('Open modal!');
|
||||||
selfHostedExpansionModal.open();
|
selfHostedExpansionModal.open();
|
||||||
query.set('action', '');
|
query.set('action', '');
|
||||||
}
|
}
|
||||||
}, [])
|
}, []);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
async function fetchUnSanitizedLicense() {
|
async function fetchUnSanitizedLicense() {
|
||||||
|
|||||||
@@ -103,7 +103,7 @@ const OverageUsersBannerNotice = () => {
|
|||||||
const handleClick = () => {
|
const handleClick = () => {
|
||||||
trackEventFn(isExpandable ? 'Self Serve' : 'Contact Sales');
|
trackEventFn(isExpandable ? 'Self Serve' : 'Contact Sales');
|
||||||
if (isExpandable) {
|
if (isExpandable) {
|
||||||
selfHostedExpansionModal.open()
|
selfHostedExpansionModal.open();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -120,7 +120,7 @@ const OverageUsersBannerNotice = () => {
|
|||||||
>
|
>
|
||||||
{cta}
|
{cta}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
)
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -2,4 +2,4 @@
|
|||||||
// See LICENSE.txt for license information.
|
// See LICENSE.txt for license information.
|
||||||
|
|
||||||
export const STORAGE_KEY_PURCHASE_IN_PROGRESS = 'PURCHASE_IN_PROGRESS';
|
export const STORAGE_KEY_PURCHASE_IN_PROGRESS = 'PURCHASE_IN_PROGRESS';
|
||||||
export const STORAGE_KEY_EXPANSION_IN_PROGRESS = 'EXPANSION_IN_PROGRESS';
|
export const STORAGE_KEY_EXPANSION_IN_PROGRESS = 'EXPANSION_IN_PROGRESS';
|
||||||
|
|||||||
@@ -348,163 +348,163 @@ export default function SelfHostedExpansionModal() {
|
|||||||
>
|
>
|
||||||
<div className='SelfHostedExpansionModal'>
|
<div className='SelfHostedExpansionModal'>
|
||||||
{<div className={classNames('form-view', {'form-view--hide': !showForm})}> <div className='lhs'>
|
{<div className={classNames('form-view', {'form-view--hide': !showForm})}> <div className='lhs'>
|
||||||
<h2 className='title'>{title}</h2>
|
<h2 className='title'>{title}</h2>
|
||||||
<UpgradeSvg
|
<UpgradeSvg
|
||||||
width={267}
|
width={267}
|
||||||
height={227}
|
height={227}
|
||||||
/>
|
/>
|
||||||
<div className='footer-text'>{'Questions?'}</div>
|
<div className='footer-text'>{'Questions?'}</div>
|
||||||
<ContactSalesLink/>
|
<ContactSalesLink/>
|
||||||
</div>
|
</div>
|
||||||
<div className='center'>
|
<div className='center'>
|
||||||
<div
|
<div
|
||||||
className='form'
|
className='form'
|
||||||
data-testid='shpm-form'
|
data-testid='shpm-form'
|
||||||
>
|
>
|
||||||
<span className='section-title'>
|
<span className='section-title'>
|
||||||
{intl.formatMessage({
|
{intl.formatMessage({
|
||||||
id: 'payment_form.credit_card',
|
id: 'payment_form.credit_card',
|
||||||
defaultMessage: 'Credit Card',
|
defaultMessage: 'Credit Card',
|
||||||
})}
|
})}
|
||||||
</span>
|
</span>
|
||||||
<div className='form-row'>
|
<div className='form-row'>
|
||||||
<CardInput
|
<CardInput
|
||||||
forwardedRef={cardRef}
|
forwardedRef={cardRef}
|
||||||
required={true}
|
required={true}
|
||||||
onCardInputChange={(event: StripeCardElementChangeEvent) => {
|
onCardInputChange={(event: StripeCardElementChangeEvent) => {
|
||||||
setFormState({...formState, cardFilled: event.complete});
|
setFormState({...formState, cardFilled: event.complete});
|
||||||
}}
|
}}
|
||||||
theme={theme}
|
theme={theme}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className='form-row'>
|
<div className='form-row'>
|
||||||
<Input
|
<Input
|
||||||
name='organization'
|
name='organization'
|
||||||
type='text'
|
type='text'
|
||||||
value={formState.organization}
|
value={formState.organization}
|
||||||
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
|
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
setFormState({...formState, organization: e.target.value});
|
setFormState({...formState, organization: e.target.value});
|
||||||
}}
|
}}
|
||||||
placeholder={intl.formatMessage({
|
placeholder={intl.formatMessage({
|
||||||
id: 'self_hosted_signup.organization',
|
id: 'self_hosted_signup.organization',
|
||||||
defaultMessage: 'Organization Name',
|
defaultMessage: 'Organization Name',
|
||||||
})}
|
})}
|
||||||
required={true}
|
required={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className='form-row'>
|
<div className='form-row'>
|
||||||
<Input
|
<Input
|
||||||
name='name'
|
name='name'
|
||||||
type='text'
|
type='text'
|
||||||
value={formState.cardName}
|
value={formState.cardName}
|
||||||
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
|
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
setFormState({...formState, cardName: e.target.value});
|
setFormState({...formState, cardName: e.target.value});
|
||||||
}}
|
}}
|
||||||
placeholder={intl.formatMessage({
|
placeholder={intl.formatMessage({
|
||||||
id: 'payment_form.name_on_card',
|
id: 'payment_form.name_on_card',
|
||||||
defaultMessage: 'Name on Card',
|
defaultMessage: 'Name on Card',
|
||||||
})}
|
})}
|
||||||
required={true}
|
required={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<span className='section-title'>
|
<span className='section-title'>
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
id='payment_form.billing_address'
|
id='payment_form.billing_address'
|
||||||
defaultMessage='Billing address'
|
defaultMessage='Billing address'
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
<Address
|
<Address
|
||||||
testPrefix='selfHostedExpansion'
|
testPrefix='selfHostedExpansion'
|
||||||
type='billing'
|
type='billing'
|
||||||
country={formState.country}
|
country={formState.country}
|
||||||
changeCountry={(option) => {
|
changeCountry={(option) => {
|
||||||
setFormState({...formState, country: option.value});
|
setFormState({...formState, country: option.value});
|
||||||
}}
|
|
||||||
address={formState.address}
|
|
||||||
changeAddress={(e) => {
|
|
||||||
setFormState({...formState, address: e.target.value});
|
|
||||||
}}
|
|
||||||
address2={formState.address2}
|
|
||||||
changeAddress2={(e) => {
|
|
||||||
setFormState({...formState, address2: e.target.value});
|
|
||||||
}}
|
|
||||||
city={formState.city}
|
|
||||||
changeCity={(e) => {
|
|
||||||
setFormState({...formState, city: e.target.value});
|
|
||||||
}}
|
|
||||||
state={formState.state}
|
|
||||||
changeState={(state: string) => {
|
|
||||||
setFormState({...formState, state});
|
|
||||||
}}
|
|
||||||
postalCode={formState.postalCode}
|
|
||||||
changePostalCode={(e) => {
|
|
||||||
setFormState({...formState, postalCode: e.target.value});
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<ChooseDifferentShipping
|
|
||||||
shippingIsSame={formState.shippingSame}
|
|
||||||
setShippingIsSame={(val: boolean) => {
|
|
||||||
setFormState({...formState, shippingSame: val});
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
{!formState.shippingSame && (
|
|
||||||
<>
|
|
||||||
<div className='section-title'>
|
|
||||||
<FormattedMessage
|
|
||||||
id='payment_form.shipping_address'
|
|
||||||
defaultMessage='Shipping Address'
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<Address
|
|
||||||
testPrefix='selfHostedExpansion'
|
|
||||||
type='shipping'
|
|
||||||
country={formState.shippingCountry}
|
|
||||||
changeCountry={(option) => {
|
|
||||||
setFormState({...formState, shippingCountry: option.value});
|
|
||||||
}}
|
|
||||||
address={formState.shippingAddress}
|
|
||||||
changeAddress={(e) => {
|
|
||||||
setFormState({...formState, shippingAddress: e.target.value});
|
|
||||||
}}
|
|
||||||
address2={formState.shippingAddress2}
|
|
||||||
changeAddress2={(e) => {
|
|
||||||
setFormState({...formState, shippingAddress2: e.target.value});
|
|
||||||
}}
|
|
||||||
city={formState.shippingCity}
|
|
||||||
changeCity={(e) => {
|
|
||||||
setFormState({...formState, shippingCity: e.target.value});
|
|
||||||
}}
|
|
||||||
state={formState.shippingState}
|
|
||||||
changeState={(state: string) => {
|
|
||||||
setFormState({...formState, shippingState: state});
|
|
||||||
}}
|
|
||||||
postalCode={formState.shippingPostalCode}
|
|
||||||
changePostalCode={(e) => {
|
|
||||||
setFormState({...formState, shippingPostalCode: e.target.value});
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<Terms
|
|
||||||
agreed={formState.agreedTerms}
|
|
||||||
setAgreed={(data: boolean) => {
|
|
||||||
setFormState({...formState, agreedTerms: data});
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className='rhs'>
|
|
||||||
<SelfHostedExpansionCard
|
|
||||||
updateSeats={(seats: number) => {
|
|
||||||
setFormState({...formState, seats});
|
|
||||||
setAdditionalSeats(seats);
|
|
||||||
}}
|
}}
|
||||||
|
address={formState.address}
|
||||||
|
changeAddress={(e) => {
|
||||||
|
setFormState({...formState, address: e.target.value});
|
||||||
|
}}
|
||||||
|
address2={formState.address2}
|
||||||
|
changeAddress2={(e) => {
|
||||||
|
setFormState({...formState, address2: e.target.value});
|
||||||
|
}}
|
||||||
|
city={formState.city}
|
||||||
|
changeCity={(e) => {
|
||||||
|
setFormState({...formState, city: e.target.value});
|
||||||
|
}}
|
||||||
|
state={formState.state}
|
||||||
|
changeState={(state: string) => {
|
||||||
|
setFormState({...formState, state});
|
||||||
|
}}
|
||||||
|
postalCode={formState.postalCode}
|
||||||
|
changePostalCode={(e) => {
|
||||||
|
setFormState({...formState, postalCode: e.target.value});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<ChooseDifferentShipping
|
||||||
|
shippingIsSame={formState.shippingSame}
|
||||||
|
setShippingIsSame={(val: boolean) => {
|
||||||
|
setFormState({...formState, shippingSame: val});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
{!formState.shippingSame && (
|
||||||
|
<>
|
||||||
|
<div className='section-title'>
|
||||||
|
<FormattedMessage
|
||||||
|
id='payment_form.shipping_address'
|
||||||
|
defaultMessage='Shipping Address'
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<Address
|
||||||
|
testPrefix='selfHostedExpansion'
|
||||||
|
type='shipping'
|
||||||
|
country={formState.shippingCountry}
|
||||||
|
changeCountry={(option) => {
|
||||||
|
setFormState({...formState, shippingCountry: option.value});
|
||||||
|
}}
|
||||||
|
address={formState.shippingAddress}
|
||||||
|
changeAddress={(e) => {
|
||||||
|
setFormState({...formState, shippingAddress: e.target.value});
|
||||||
|
}}
|
||||||
|
address2={formState.shippingAddress2}
|
||||||
|
changeAddress2={(e) => {
|
||||||
|
setFormState({...formState, shippingAddress2: e.target.value});
|
||||||
|
}}
|
||||||
|
city={formState.shippingCity}
|
||||||
|
changeCity={(e) => {
|
||||||
|
setFormState({...formState, shippingCity: e.target.value});
|
||||||
|
}}
|
||||||
|
state={formState.shippingState}
|
||||||
|
changeState={(state: string) => {
|
||||||
|
setFormState({...formState, shippingState: state});
|
||||||
|
}}
|
||||||
|
postalCode={formState.shippingPostalCode}
|
||||||
|
changePostalCode={(e) => {
|
||||||
|
setFormState({...formState, shippingPostalCode: e.target.value});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
<Terms
|
||||||
|
agreed={formState.agreedTerms}
|
||||||
|
setAgreed={(data: boolean) => {
|
||||||
|
setFormState({...formState, agreedTerms: data});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='rhs'>
|
||||||
|
<SelfHostedExpansionCard
|
||||||
|
updateSeats={(seats: number) => {
|
||||||
|
setFormState({...formState, seats});
|
||||||
|
setAdditionalSeats(seats);
|
||||||
|
}}
|
||||||
canSubmit={canSubmitForm}
|
canSubmit={canSubmitForm}
|
||||||
submit={submit}
|
submit={submit}
|
||||||
licensedSeats={licensedSeats}
|
licensedSeats={licensedSeats}
|
||||||
initialSeats={additionalSeats}
|
initialSeats={additionalSeats}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>}
|
</div>}
|
||||||
{((formState.succeeded || progress === SelfHostedSignupProgress.CREATED_LICENSE)) && !formState.error && !formState.submitting && (
|
{((formState.succeeded || progress === SelfHostedSignupProgress.CREATED_LICENSE)) && !formState.error && !formState.submitting && (
|
||||||
<SuccessPage
|
<SuccessPage
|
||||||
@@ -519,7 +519,9 @@ export default function SelfHostedExpansionModal() {
|
|||||||
{formState.error && (
|
{formState.error && (
|
||||||
<ErrorPage
|
<ErrorPage
|
||||||
canRetry={canRetry}
|
canRetry={canRetry}
|
||||||
tryAgain={() => {setFormState({...formState, submitting: false, error: ''})}}
|
tryAgain={() => {
|
||||||
|
setFormState({...formState, submitting: false, error: ''});
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<div className='background-svg'>
|
<div className='background-svg'>
|
||||||
|
|||||||
@@ -93,7 +93,7 @@ export default function Submitting(props: Props) {
|
|||||||
setBarProgress(Math.min(maxProgressForCurrentSignupProgress, barProgress + maxFakeProgressIncrement));
|
setBarProgress(Math.min(maxProgressForCurrentSignupProgress, barProgress + maxFakeProgressIncrement));
|
||||||
}
|
}
|
||||||
}, fakeProgressInterval);
|
}, fakeProgressInterval);
|
||||||
|
|
||||||
return () => clearInterval(interval);
|
return () => clearInterval(interval);
|
||||||
}, [barProgress]);
|
}, [barProgress]);
|
||||||
|
|
||||||
|
|||||||
Ссылка в новой задаче
Block a user