Update redirect behavior in auth success state
The commit introduces changes to the behavior of the "Update Password" page on a successful password update. Instead of redirecting the user back to the home page upon a successful update, the updated code now redirects the user to a specified URL passed in as a prop. The authentication configuration has also been updated to include a list of acceptable redirect URLs.
This commit is contained in:
@@ -42,7 +42,7 @@ file_size_limit = "50MiB"
|
|||||||
# in emails.
|
# in emails.
|
||||||
site_url = "http://localhost:3000"
|
site_url = "http://localhost:3000"
|
||||||
# A list of *exact* URLs that auth providers are permitted to redirect to post authentication.
|
# A list of *exact* URLs that auth providers are permitted to redirect to post authentication.
|
||||||
additional_redirect_urls = ["https://localhost:3000"]
|
additional_redirect_urls = ["http://localhost:3000", "http://localhost:3000/auth/callback", "http://localhost:3000/update-password"]
|
||||||
# How long tokens are valid for, in seconds. Defaults to 3600 (1 hour), maximum 604,800 seconds (one
|
# How long tokens are valid for, in seconds. Defaults to 3600 (1 hour), maximum 604,800 seconds (one
|
||||||
# week).
|
# week).
|
||||||
jwt_expiry = 3600
|
jwt_expiry = 3600
|
||||||
|
|||||||
@@ -4,10 +4,11 @@ import Link from 'next/link';
|
|||||||
|
|
||||||
import { zodResolver } from '@hookform/resolvers/zod';
|
import { zodResolver } from '@hookform/resolvers/zod';
|
||||||
import {
|
import {
|
||||||
ArrowLeftIcon,
|
|
||||||
CheckIcon,
|
CheckIcon,
|
||||||
ExclamationTriangleIcon,
|
ExclamationTriangleIcon,
|
||||||
} from '@radix-ui/react-icons';
|
} from '@radix-ui/react-icons';
|
||||||
|
|
||||||
|
import { ArrowRightIcon } from 'lucide-react';
|
||||||
import { useForm } from 'react-hook-form';
|
import { useForm } from 'react-hook-form';
|
||||||
import type { z } from 'zod';
|
import type { z } from 'zod';
|
||||||
|
|
||||||
@@ -44,7 +45,7 @@ export function UpdatePasswordForm(params: { redirectTo: string }) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (updateUser.data && !updateUser.isPending) {
|
if (updateUser.data && !updateUser.isPending) {
|
||||||
return <SuccessState />;
|
return <SuccessState redirectTo={params.redirectTo} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -114,7 +115,7 @@ export function UpdatePasswordForm(params: { redirectTo: string }) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function SuccessState() {
|
function SuccessState(props: { redirectTo: string }) {
|
||||||
return (
|
return (
|
||||||
<div className={'flex flex-col space-y-4'}>
|
<div className={'flex flex-col space-y-4'}>
|
||||||
<Alert variant={'success'}>
|
<Alert variant={'success'}>
|
||||||
@@ -129,13 +130,13 @@ function SuccessState() {
|
|||||||
</AlertDescription>
|
</AlertDescription>
|
||||||
</Alert>
|
</Alert>
|
||||||
|
|
||||||
<Link href={'/'}>
|
<Link href={props.redirectTo}>
|
||||||
<Button variant={'outline'} className={'w-full'}>
|
<Button variant={'outline'} className={'w-full'}>
|
||||||
<ArrowLeftIcon className={'mr-2 h-4'} />
|
|
||||||
|
|
||||||
<span>
|
<span>
|
||||||
<Trans i18nKey={'common:backToHomePage'} />
|
<Trans i18nKey={'common:backToHomePage'} />
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
|
<ArrowRightIcon className={'ml-2 h-4'} />
|
||||||
</Button>
|
</Button>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -45,11 +45,12 @@ class AuthCallbackService {
|
|||||||
|
|
||||||
const token_hash = searchParams.get('token_hash');
|
const token_hash = searchParams.get('token_hash');
|
||||||
const type = searchParams.get('type') as EmailOtpType | null;
|
const type = searchParams.get('type') as EmailOtpType | null;
|
||||||
const next = searchParams.get('next') ?? params.redirectPath;
|
|
||||||
const callbackParam = searchParams.get('callback');
|
const callbackParam = searchParams.get('callback');
|
||||||
|
|
||||||
|
const next = callbackParam ? new URL(callbackParam).pathname : params.redirectPath;
|
||||||
|
|
||||||
const callbackUrl = callbackParam ? new URL(callbackParam) : null;
|
const callbackUrl = callbackParam ? new URL(callbackParam) : null;
|
||||||
const inviteToken = callbackUrl?.searchParams.get('invite_token');
|
const inviteToken = callbackUrl?.searchParams.get('invite_token');
|
||||||
|
|
||||||
const errorPath = params.errorPath ?? '/auth/callback/error';
|
const errorPath = params.errorPath ?? '/auth/callback/error';
|
||||||
|
|
||||||
// remove the query params from the url
|
// remove the query params from the url
|
||||||
|
|||||||
Reference in New Issue
Block a user