Fix positioning
Sean Brydon
parent
2ffefcc97e
commit
bd4ef38371
|
|
@ -66,11 +66,7 @@ function UsernameField({
|
|||
setLoading(true);
|
||||
fetchUsername(debouncedUsername)
|
||||
.then(({ data }) => {
|
||||
if (data.premium) {
|
||||
setPremium(true);
|
||||
} else {
|
||||
setPremium(false);
|
||||
}
|
||||
setPremium(data.premium);
|
||||
if (!data.available) {
|
||||
setTaken(true);
|
||||
}
|
||||
|
|
@ -128,10 +124,10 @@ export default function Signup({ prepopulateFormValues, token, orgSlug }: Signup
|
|||
const {
|
||||
register,
|
||||
|
||||
formState: { isSubmitting, errors, isLoading },
|
||||
formState: { isSubmitting, errors },
|
||||
} = formMethods;
|
||||
|
||||
const handleErrors = async (resp: Response) => {
|
||||
const handleErrorsAndStripe = async (resp: Response) => {
|
||||
if (!resp.ok) {
|
||||
const err = await resp.json();
|
||||
if (err.checkoutSessionId) {
|
||||
|
|
@ -161,7 +157,7 @@ export default function Signup({ prepopulateFormValues, token, orgSlug }: Signup
|
|||
},
|
||||
method: "POST",
|
||||
})
|
||||
.then(handleErrors)
|
||||
.then(handleErrorsAndStripe)
|
||||
.then(async () => {
|
||||
telemetry.event(telemetryEventTypes.signup, collectPageParameters());
|
||||
const verifyOrGettingStarted = flags["email-verification"] ? "auth/verify-email" : "getting-started";
|
||||
|
|
@ -180,9 +176,8 @@ export default function Signup({ prepopulateFormValues, token, orgSlug }: Signup
|
|||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
className="bg-muted grid min-h-screen grid-cols-1 grid-rows-1 lg:grid-cols-2 "
|
||||
className="bg-muted flex min-h-screen w-full flex-col items-center justify-center"
|
||||
style={
|
||||
{
|
||||
"--cal-brand": "#111827",
|
||||
|
|
@ -191,8 +186,9 @@ export default function Signup({ prepopulateFormValues, token, orgSlug }: Signup
|
|||
"--cal-brand-subtle": "#9CA3AF",
|
||||
} as CSSProperties
|
||||
}>
|
||||
<div className="grid max-h-[1080px] w-full grid-cols-1 grid-rows-1 lg:grid-cols-2">
|
||||
<HeadSeo title={t("sign_up")} description={t("sign_up")} />
|
||||
<div className="flex w-full flex-col px-4 pt-16 md:px-16 lg:px-28">
|
||||
<div className="flex w-full flex-col px-4 pt-6 md:px-16 lg:px-28">
|
||||
{/* Header */}
|
||||
{errors.apiError && <Alert severity="error" message={errors.apiError?.message} />}
|
||||
<div className="flex flex-col gap-3 ">
|
||||
|
|
@ -201,7 +197,11 @@ export default function Signup({ prepopulateFormValues, token, orgSlug }: Signup
|
|||
</h1>
|
||||
{IS_CALCOM ? (
|
||||
<p className="text-subtle text-base font-medium leading-none">{t("cal_signup_description")}</p>
|
||||
) : null}
|
||||
) : (
|
||||
<p className="text-subtle text-base font-medium leading-none">
|
||||
Meet all your scheduling needs{" "}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
{/* Form Container */}
|
||||
<div className="mt-10">
|
||||
|
|
@ -350,76 +350,8 @@ export default function Signup({ prepopulateFormValues, token, orgSlug }: Signup
|
|||
<img src="/mock-event-type-list.svg" alt="#" />
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="sm:mx-auto sm:w-full sm:max-w-md">
|
||||
<h2 className="font-cal text-emphasis text-center text-3xl font-extrabold">
|
||||
{t("create_your_account")}
|
||||
</h2>
|
||||
</div>
|
||||
<div className="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
|
||||
<div className="bg-default mx-2 p-6 shadow sm:rounded-lg lg:p-8">
|
||||
<FormProvider {...methods}>
|
||||
<form
|
||||
onSubmit={(event) => {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
if (methods.formState?.errors?.apiError) {
|
||||
methods.clearErrors("apiError");
|
||||
}
|
||||
methods.handleSubmit(signUp)(event);
|
||||
}}
|
||||
className="bg-default space-y-6">
|
||||
{errors.apiError && <Alert severity="error" message={errors.apiError?.message} />}
|
||||
<div className="space-y-4">
|
||||
<TextField
|
||||
addOnLeading={
|
||||
orgSlug
|
||||
? getOrgFullDomain(orgSlug, { protocol: true })
|
||||
: `${process.env.NEXT_PUBLIC_WEBSITE_URL}/`
|
||||
}
|
||||
{...register("username")}
|
||||
disabled={!!orgSlug}
|
||||
required
|
||||
/>
|
||||
<EmailField
|
||||
{...register("email")}
|
||||
disabled={prepopulateFormValues?.email}
|
||||
className="disabled:bg-emphasis disabled:hover:cursor-not-allowed"
|
||||
/>
|
||||
<PasswordField
|
||||
labelProps={{
|
||||
className: "block text-sm font-medium text-default",
|
||||
}}
|
||||
{...register("password")}
|
||||
hintErrors={["caplow", "min", "num"]}
|
||||
className="border-default mt-1 block w-full rounded-md border px-3 py-2 shadow-sm focus:border-black focus:outline-none focus:ring-black sm:text-sm"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex space-x-2 rtl:space-x-reverse">
|
||||
<Button type="submit" loading={isSubmitting} className="w-full justify-center">
|
||||
{t("create_account")}
|
||||
</Button>
|
||||
{!token && (
|
||||
<Button
|
||||
color="secondary"
|
||||
className="w-full justify-center"
|
||||
onClick={() =>
|
||||
signIn("Cal.com", {
|
||||
callbackUrl: searchParams?.get("callbackUrl")
|
||||
? `${WEBAPP_URL}/${searchParams.get("callbackUrl")}`
|
||||
: `${WEBAPP_URL}/getting-started`,
|
||||
})
|
||||
}>
|
||||
{t("login_instead")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</form>
|
||||
</FormProvider>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -33,7 +33,6 @@ export const SENDER_NAME = process.env.NEXT_PUBLIC_SENDGRID_SENDER_NAME || "Cal.
|
|||
export const CAL_URL = new URL(WEBAPP_URL).hostname.endsWith(".vercel.app") ? WEBAPP_URL : WEBSITE_URL;
|
||||
|
||||
export const IS_CALCOM =
|
||||
// true ||
|
||||
WEBAPP_URL &&
|
||||
(new URL(WEBAPP_URL).hostname.endsWith("cal.com") ||
|
||||
new URL(WEBAPP_URL).hostname.endsWith("cal.dev") ||
|
||||
|
|
|
|||
Loading…
Reference in New Issue