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.

apps/web/supabase/config.toml

@@ -42,7 +42,7 @@ file_size_limit = "50MiB"
 # in emails.
 site_url = "http://localhost:3000"
 # 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
 # week).
 jwt_expiry = 3600
@@ -69,4 +69,4 @@ secret = ""
 redirect_uri = ""
 # Overrides the default auth provider URL. Used to support self-hosted gitlab, single-tenant Azure,
 # or any other third-party OIDC providers.
-url = ""
+url = ""

packages/features/auth/src/components/update-password-form.tsx

@@ -4,10 +4,11 @@ import Link from 'next/link';
 
 import { zodResolver } from '@hookform/resolvers/zod';
 import {
-  ArrowLeftIcon,
   CheckIcon,
   ExclamationTriangleIcon,
 } from '@radix-ui/react-icons';
+
+import { ArrowRightIcon } from 'lucide-react';
 import { useForm } from 'react-hook-form';
 import type { z } from 'zod';
 
@@ -44,7 +45,7 @@ export function UpdatePasswordForm(params: { redirectTo: string }) {
   }
 
   if (updateUser.data && !updateUser.isPending) {
-    return <SuccessState />;
+    return <SuccessState redirectTo={params.redirectTo} />;
   }
 
   return (
@@ -114,7 +115,7 @@ export function UpdatePasswordForm(params: { redirectTo: string }) {
   );
 }
 
-function SuccessState() {
+function SuccessState(props: { redirectTo: string }) {
   return (
     <div className={'flex flex-col space-y-4'}>
       <Alert variant={'success'}>
@@ -129,13 +130,13 @@ function SuccessState() {
         </AlertDescription>
       </Alert>
 
-      <Link href={'/'}>
+      <Link href={props.redirectTo}>
         <Button variant={'outline'} className={'w-full'}>
-          <ArrowLeftIcon className={'mr-2 h-4'} />
-
           <span>
             <Trans i18nKey={'common:backToHomePage'} />
           </span>
+
+          <ArrowRightIcon className={'ml-2 h-4'} />
         </Button>
       </Link>
     </div>

packages/supabase/src/auth-callback.service.ts

@@ -45,11 +45,12 @@ class AuthCallbackService {
 
     const token_hash = searchParams.get('token_hash');
     const type = searchParams.get('type') as EmailOtpType | null;
-    const next = searchParams.get('next') ?? params.redirectPath;
     const callbackParam = searchParams.get('callback');
+    
+    const next = callbackParam ? new URL(callbackParam).pathname : params.redirectPath;
+
     const callbackUrl = callbackParam ? new URL(callbackParam) : null;
     const inviteToken = callbackUrl?.searchParams.get('invite_token');
-
     const errorPath = params.errorPath ?? '/auth/callback/error';
 
     // remove the query params from the url