fix: auth redirect query encoding (#332)

## Summary

Fix auth redirect message handling so query parameters are encoded once
via `URLSearchParams` instead of manually encoding/decoding values
across server and client code.

This updates the email callback redirect to use the shared
`encodedRedirect()` helper for `message` redirects, preventing crafted
`message` values from injecting sibling query parameters.

## Changes

- Extend `encodedRedirect()` to support `message` redirects.
- Let `URLSearchParams` handle redirect query encoding directly.
- Replace raw email-callback `redirect(...?message=${message}...)` calls
with `encodedRedirect('message', ...)`.
- Remove unnecessary `decodeURIComponent(...)` calls from auth/account
message rendering.
- Add regression coverage for query parameter injection in
`/api/auth/email-callback`.

Closes #255

Author: drankou

src/app/(auth)/auth/cli/page.tsx

@@ -177,7 +177,7 @@ export default async function CLIAuthPage({
       <div className="text-fg-tertiary mt-12 leading-8">
         <Suspense fallback={<div>Loading...</div>}>
           {error ? (
-            <ErrorAlert message={decodeURIComponent(error)} />
+            <ErrorAlert message={error} />
           ) : (
             <div>Authorizing CLI...</div>
           )}

src/app/(auth)/sign-in/page.tsx

@@ -31,8 +31,8 @@ export default function Login() {
   const [message, setMessage] = useState<AuthMessage | undefined>(() => {
     const error = searchParams.get('error')
     const success = searchParams.get('success')
-    if (error) return { error: decodeURIComponent(error) }
-    if (success) return { success: decodeURIComponent(success) }
+    if (error) return { error }
+    if (success) return { success }
     return undefined
   })
 

src/app/(auth)/sign-up/page.tsx

@@ -36,8 +36,8 @@ export default function SignUp() {
   const [message, setMessage] = useState<AuthMessage | undefined>(() => {
     const error = searchParams.get('error')
     const success = searchParams.get('success')
-    if (error) return { error: decodeURIComponent(error) }
-    if (success) return { success: decodeURIComponent(success) }
+    if (error) return { error }
+    if (success) return { success }
 
     return undefined
   })

src/app/api/auth/email-callback/route.tsx

@@ -1,4 +1,3 @@
-import { redirect } from 'next/navigation'
 import { PROTECTED_URLS } from '@/configs/urls'
 import { createClient } from '@/core/shared/clients/supabase/server'
 import { encodedRedirect } from '@/lib/utils/auth'
@@ -11,32 +10,30 @@ export async function GET(request: Request) {
 
   const next = PROTECTED_URLS.ACCOUNT_SETTINGS
 
-  if (!code && message) {
+  if (message) {
     // E-Mail updates can be validated on both e-mails. This case is for the first validation link press.
     // `message` should inform the user that he has to validate on the other e-mail address as well for successful update.
-    redirect(`${next}?message=${message}&type=update_email`)
-  }
-
-  if (!code && !message) {
-    encodedRedirect('error', next, 'Invalid email verification link', {
+    return encodedRedirect('message', next, message, {
       type: 'update_email',
     })
   }
 
-  if (message) {
-    redirect(`${next}?message=${message}&type=update_email`)
+  if (!code) {
+    return encodedRedirect('error', next, 'Invalid email verification link', {
+      type: 'update_email',
+    })
   }
 
   const supabase = await createClient()
   const { error } = await supabase.auth.exchangeCodeForSession(code!)
 
   if (error) {
-    encodedRedirect('error', next, 'Failed to update E-Mail', {
+    return encodedRedirect('error', next, 'Failed to update E-Mail', {
       type: 'update_email',
     })
   }
 
-  encodedRedirect('success', next, 'E-Mail changed successfully', {
+  return encodedRedirect('success', next, 'E-Mail changed successfully', {
     new_email: newEmail || '',
     type: 'update_email',
   })

src/app/api/auth/verify-otp/route.ts

@@ -44,7 +44,7 @@ function buildRedirectUrl(
  */
 function buildErrorRedirectUrl(origin: string, message: string): string {
   const url = new URL(origin + AUTH_URLS.SIGN_IN)
-  url.searchParams.set('error', encodeURIComponent(message))
+  url.searchParams.set('error', message)
   return url.toString()
 }
 

src/core/server/actions/user-actions.ts

@@ -49,6 +49,18 @@ export const updateUserAction = authActionClient
 
     const origin = (await headers()).get('origin')
 
+    let emailRedirectTo: string | undefined
+
+    if (parsedInput.email) {
+      if (!origin) {
+        throw new Error('Missing origin header for email update redirect')
+      }
+
+      const redirectUrl = new URL('/api/auth/email-callback', origin)
+      redirectUrl.searchParams.set('new_email', parsedInput.email)
+      emailRedirectTo = redirectUrl.toString()
+    }
+
     const { data: updateData, error } = await supabase.auth.updateUser(
       {
         email: parsedInput.email,
@@ -57,9 +69,7 @@ export const updateUserAction = authActionClient
           name: parsedInput.name,
         },
       },
-      {
-        emailRedirectTo: `${origin}/api/auth/email-callback?new_email=${parsedInput.email}`,
-      }
+      emailRedirectTo ? { emailRedirectTo } : undefined
     )
 
     if (!error) {

src/features/auth/form-message.tsx

@@ -30,25 +30,19 @@ export function AuthFormMessage({
       {'success' in message && (
         <Alert variant="success">
           <SuccessIcon className="h-4 w-4" />
-          <AlertDescription>
-            {decodeURIComponent(message.success!)}
-          </AlertDescription>
+          <AlertDescription>{message.success}</AlertDescription>
         </Alert>
       )}
       {'error' in message && (
         <Alert variant="error">
           <AlertIcon className="h-4 w-4" />
-          <AlertDescription>
-            {decodeURIComponent(message.error!)}
-          </AlertDescription>
+          <AlertDescription>{message.error}</AlertDescription>
         </Alert>
       )}
       {'message' in message && (
         <Alert variant="info">
           <InfoIcon className="h-4 w-4" />
-          <AlertDescription>
-            {decodeURIComponent(message.message!)}
-          </AlertDescription>
+          <AlertDescription>{message.message}</AlertDescription>
         </Alert>
       )}
     </motion.div>

src/features/dashboard/account/email-settings.tsx

@@ -95,25 +95,21 @@ export function EmailSettings({ className }: EmailSettingsProps) {
       return
 
     if (searchParams.get('type') === 'update_email') {
-      if (searchParams.has('success')) {
-        toast(
-          defaultSuccessToast(decodeURIComponent(searchParams.get('success')!))
-        )
+      const success = searchParams.get('success')
+      if (success !== null) {
+        toast(defaultSuccessToast(success))
         return
       }
 
-      if (searchParams.has('message')) {
-        toast(
-          defaultSuccessToast(decodeURIComponent(searchParams.get('message')!))
-        )
+      const message = searchParams.get('message')
+      if (message !== null) {
+        toast(defaultSuccessToast(message))
         return
       }
 
       toast(
         defaultErrorToast(
-          decodeURIComponent(
-            searchParams.get('error') ?? 'Failed to update e-mail.'
-          )
+          searchParams.get('error') ?? 'Failed to update e-mail.'
         )
       )
     }

src/lib/utils/auth.ts

@@ -3,25 +3,23 @@ import { redirect } from 'next/navigation'
 
 /**
  * Redirects to a specified path with an encoded message as a query parameter.
- * @param {('error' | 'success')} type - The type of message, either 'error' or 'success'.
+ * @param {('error' | 'success' | 'message')} type - The type of message.
  * @param {string} path - The path to redirect to.
- * @param {string} message - The message to be encoded and added as a query parameter.
+ * @param {string} message - The message to be added as a query parameter.
  * @param {Record<string, string>} queryParams - Additional query parameters to be added to the redirect URL.
  * @returns {never} This function doesn't return as it triggers a redirect.
  */
 export function encodedRedirect(
-  type: 'error' | 'success',
+  type: 'error' | 'success' | 'message',
   path: string,
   message: string,
   queryParams?: Record<string, string>
 ) {
-  const queryString = new URLSearchParams()
-  queryString.set(type, encodeURIComponent(message))
-  if (queryParams) {
-    Object.entries(queryParams).forEach(([key, value]) => {
-      queryString.set(key, value)
-    })
-  }
+  const queryString = new URLSearchParams({
+    [type]: message,
+    ...(queryParams ?? {}),
+  })
+
   return redirect(`${path}?${queryString.toString()}`)
 }
 

tests/integration/auth-callback-route.test.ts

@@ -19,11 +19,15 @@ vi.mock('@/core/shared/clients/supabase/server', () => ({
 }))
 
 vi.mock('@/lib/utils/auth', () => ({
-  encodedRedirect: vi.fn((type, url, message) => ({
-    type,
-    destination: `${url}?${type}=${encodeURIComponent(message)}`,
-    message,
-  })),
+  encodedRedirect: vi.fn((type, url, message) => {
+    const params = new URLSearchParams({ [type]: message })
+
+    return {
+      type,
+      destination: `${url}?${params.toString()}`,
+      message,
+    }
+  }),
 }))
 
 import { GET } from '@/app/api/auth/callback/route'
@@ -63,7 +67,9 @@ describe('Auth Callback Route', () => {
       GET(new Request('https://dashboard.e2b.dev/api/auth/callback?code=test'))
     ).rejects.toEqual({
       type: 'error',
-      destination: `${AUTH_URLS.SIGN_IN}?error=${encodeURIComponent('Missing session after auth callback')}`,
+      destination: `${AUTH_URLS.SIGN_IN}?${new URLSearchParams({
+        error: 'Missing session after auth callback',
+      }).toString()}`,
       message: 'Missing session after auth callback',
     })
   })