Этот коммит содержится в:
Conor Macpherson
2023-04-04 09:23:42 -04:00
родитель 0ce1b6c12c
Коммит 2f010f9f6a
5 изменённых файлов: 128 добавлений и 126 удалений

Просмотреть файл

@@ -68,11 +68,11 @@ const EnterpriseEditionLeftPanel = ({
useEffect(() => {
console.log(actionQueryParam);
if (actionQueryParam === 'show_expansion_modal' && canExpand && isSelfHostedExpansionEnabled) {
console.log("Open modal!");
console.log('Open modal!');
selfHostedExpansionModal.open();
query.set('action', '');
}
}, [])
}, []);
useEffect(() => {
async function fetchUnSanitizedLicense() {

Просмотреть файл

@@ -103,7 +103,7 @@ const OverageUsersBannerNotice = () => {
const handleClick = () => {
trackEventFn(isExpandable ? 'Self Serve' : 'Contact Sales');
if (isExpandable) {
selfHostedExpansionModal.open()
selfHostedExpansionModal.open();
}
};
@@ -120,7 +120,7 @@ const OverageUsersBannerNotice = () => {
>
{cta}
</NavLink>
)
);
}
return (

Просмотреть файл

@@ -2,4 +2,4 @@
// See LICENSE.txt for license information.
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={classNames('form-view', {'form-view--hide': !showForm})}> <div className='lhs'>
<h2 className='title'>{title}</h2>
<UpgradeSvg
width={267}
height={227}
/>
<div className='footer-text'>{'Questions?'}</div>
<ContactSalesLink/>
</div>
<h2 className='title'>{title}</h2>
<UpgradeSvg
width={267}
height={227}
/>
<div className='footer-text'>{'Questions?'}</div>
<ContactSalesLink/>
</div>
<div className='center'>
<div
<div
className='form'
data-testid='shpm-form'
>
<span className='section-title'>
{intl.formatMessage({
id: 'payment_form.credit_card',
defaultMessage: 'Credit Card',
})}
</span>
{intl.formatMessage({
id: 'payment_form.credit_card',
defaultMessage: 'Credit Card',
})}
</span>
<div className='form-row'>
<CardInput
<CardInput
forwardedRef={cardRef}
required={true}
onCardInputChange={(event: StripeCardElementChangeEvent) => {
setFormState({...formState, cardFilled: event.complete});
}}
setFormState({...formState, cardFilled: event.complete});
}}
theme={theme}
/>
</div>
</div>
<div className='form-row'>
<Input
<Input
name='organization'
type='text'
value={formState.organization}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
setFormState({...formState, organization: e.target.value});
}}
setFormState({...formState, organization: e.target.value});
}}
placeholder={intl.formatMessage({
id: 'self_hosted_signup.organization',
defaultMessage: 'Organization Name',
})}
id: 'self_hosted_signup.organization',
defaultMessage: 'Organization Name',
})}
required={true}
/>
</div>
</div>
<div className='form-row'>
<Input
<Input
name='name'
type='text'
value={formState.cardName}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
setFormState({...formState, cardName: e.target.value});
}}
setFormState({...formState, cardName: e.target.value});
}}
placeholder={intl.formatMessage({
id: 'payment_form.name_on_card',
defaultMessage: 'Name on Card',
})}
id: 'payment_form.name_on_card',
defaultMessage: 'Name on Card',
})}
required={true}
/>
</div>
</div>
<span className='section-title'>
<FormattedMessage
<FormattedMessage
id='payment_form.billing_address'
defaultMessage='Billing address'
/>
</span>
</span>
<Address
testPrefix='selfHostedExpansion'
type='billing'
country={formState.country}
changeCountry={(option) => {
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);
testPrefix='selfHostedExpansion'
type='billing'
country={formState.country}
changeCountry={(option) => {
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);
}}
canSubmit={canSubmitForm}
submit={submit}
licensedSeats={licensedSeats}
initialSeats={additionalSeats}
/>
</div>
</div>
</div>}
{((formState.succeeded || progress === SelfHostedSignupProgress.CREATED_LICENSE)) && !formState.error && !formState.submitting && (
<SuccessPage
@@ -519,7 +519,9 @@ export default function SelfHostedExpansionModal() {
{formState.error && (
<ErrorPage
canRetry={canRetry}
tryAgain={() => {setFormState({...formState, submitting: false, error: ''})}}
tryAgain={() => {
setFormState({...formState, submitting: false, error: ''});
}}
/>
)}
<div className='background-svg'>

Просмотреть файл

@@ -93,7 +93,7 @@ export default function Submitting(props: Props) {
setBarProgress(Math.min(maxProgressForCurrentSignupProgress, barProgress + maxFakeProgressIncrement));
}
}, fakeProgressInterval);
return () => clearInterval(interval);
}, [barProgress]);