Fix missing confirmation email page
Signed-off-by: Bryan Frimin <bryan@getprobo.com>
This commit is contained in:
120
apps/console/src/pages/auth/ConfirmInvitationPage.tsx
Normal file
120
apps/console/src/pages/auth/ConfirmInvitationPage.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
import { Link, useNavigate } from "react-router";
|
||||
import { Button, Field, useToast } from "@probo/ui";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { z } from "zod";
|
||||
import { useFormWithSchema } from "/hooks/useFormWithSchema";
|
||||
import { usePageTitle } from "@probo/hooks";
|
||||
import { buildEndpoint } from "/providers/RelayProviders";
|
||||
import { useEffect } from "react";
|
||||
|
||||
const schema = z.object({
|
||||
token: z.string(),
|
||||
password: z.string().min(8),
|
||||
});
|
||||
|
||||
export default function ConfirmInvitationPage() {
|
||||
const { __ } = useTranslate();
|
||||
const navigate = useNavigate();
|
||||
const { toast } = useToast();
|
||||
const { register, handleSubmit, formState, setValue } = useFormWithSchema(
|
||||
schema,
|
||||
{
|
||||
defaultValues: {
|
||||
token: "",
|
||||
password: "",
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
const onSubmit = handleSubmit(async (data) => {
|
||||
const response = await fetch(
|
||||
buildEndpoint("/api/console/v1/auth/invitation"),
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
credentials: "include",
|
||||
body: JSON.stringify(data),
|
||||
}
|
||||
);
|
||||
|
||||
// Registration failed
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
toast({
|
||||
title: __("Confirmation failed"),
|
||||
description: errorData.message || __("Confirmation failed"),
|
||||
variant: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
toast({
|
||||
title: __("Success"),
|
||||
description: __("Invitation confirmed successfully"),
|
||||
variant: "success",
|
||||
});
|
||||
navigate("/", { replace: true });
|
||||
});
|
||||
|
||||
usePageTitle(__("Confirm invitation"));
|
||||
|
||||
useEffect(() => {
|
||||
const searchParams = new URLSearchParams(location.search);
|
||||
const urlToken = searchParams.get("token");
|
||||
|
||||
if (urlToken) {
|
||||
setValue("token", urlToken);
|
||||
}
|
||||
}, [location.search, setValue]);
|
||||
|
||||
return (
|
||||
<div className="space-y-6 w-full max-w-md mx-auto">
|
||||
<div className="space-y-2 text-center">
|
||||
<h1 className="text-3xl font-bold">{__("Sign up")}</h1>
|
||||
<p className="text-txt-tertiary">
|
||||
{__("Enter your information to create an account")}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<form onSubmit={onSubmit} className="space-y-4">
|
||||
<Field
|
||||
label={__("Token")}
|
||||
type="text"
|
||||
placeholder={__("Enter your token")}
|
||||
{...register("token")}
|
||||
required
|
||||
error={formState.errors.token?.message}
|
||||
/>
|
||||
|
||||
<Field
|
||||
label={__("Password")}
|
||||
type="password"
|
||||
placeholder="••••••••"
|
||||
{...register("password")}
|
||||
required
|
||||
error={formState.errors.password?.message}
|
||||
/>
|
||||
|
||||
<Button type="submit" className="w-full" disabled={formState.isLoading}>
|
||||
{formState.isLoading
|
||||
? __("Confirming invitation...")
|
||||
: __("Confirm invitation")}
|
||||
</Button>
|
||||
</form>
|
||||
|
||||
<div className="text-center">
|
||||
<p className="text-sm text-txt-tertiary">
|
||||
{__("Already have an account?")}{" "}
|
||||
<Link
|
||||
to="/login"
|
||||
className="underline text-txt-primary hover:text-txt-secondary"
|
||||
>
|
||||
{__("Log in here")}
|
||||
</Link>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -66,6 +66,10 @@ const routes = [
|
||||
path: "confirm-email",
|
||||
Component: lazy(() => import("./pages/auth/ConfirmEmailPage")),
|
||||
},
|
||||
{
|
||||
path: "confirm-invitation",
|
||||
Component: lazy(() => import("./pages/auth/ConfirmInvitationPage")),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -713,7 +713,7 @@ func (s Service) InviteUser(
|
||||
confirmationInvitationUrl := url.URL{
|
||||
Scheme: "https",
|
||||
Host: s.hostname,
|
||||
Path: "/confirm-invitation",
|
||||
Path: "/auth/confirm-invitation",
|
||||
RawQuery: url.Values{
|
||||
"token": []string{confirmationToken},
|
||||
}.Encode(),
|
||||
|
||||
Reference in New Issue
Block a user