From 7600e3f93d6193074e2bc00d832bd3d554388bad Mon Sep 17 00:00:00 2001
From: LittleSheep <littlesheep.code@hotmail.com>
Date: Mon, 27 Jan 2025 18:14:57 +0800
Subject: [PATCH] :bug: Fix confirm account flow cannot get code from qs

---
 src/pages/flow/accounts/confirm.tsx        | 8 ++++++--
 src/pages/flow/accounts/deletion.tsx       | 6 +++++-
 src/pages/flow/accounts/password-reset.tsx | 6 +++++-
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/pages/flow/accounts/confirm.tsx b/src/pages/flow/accounts/confirm.tsx
index 780fc9a..732e3cd 100644
--- a/src/pages/flow/accounts/confirm.tsx
+++ b/src/pages/flow/accounts/confirm.tsx
@@ -1,3 +1,5 @@
+'use client'
+
 import { sni } from 'solar-js-sdk'
 import { Container, Box, Typography, CircularProgress, Alert, Collapse } from '@mui/material'
 import { useRouter } from 'next/router'
@@ -6,16 +8,18 @@ import { useEffect, useState } from 'react'
 import ErrorIcon from '@mui/icons-material/Error'
 
 import 'animate.css'
+import { useSearchParams } from 'next/navigation'
 
 export default function AccountConfirm() {
   const router = useRouter()
+  const searchParams = useSearchParams()
 
   const [error, setError] = useState<string | null>(null)
 
   async function confirm() {
     try {
       await sni.post('/cgi/id/users/me/confirm', {
-        code: router.query['code'] as string,
+        code: searchParams.get('code'),
       })
       router.push('/')
     } catch (err: any) {
@@ -25,7 +29,7 @@ export default function AccountConfirm() {
 
   useEffect(() => {
     confirm()
-  }, [])
+  }, [searchParams])
 
   return (
     <Container
diff --git a/src/pages/flow/accounts/deletion.tsx b/src/pages/flow/accounts/deletion.tsx
index 6089809..fcc26e5 100644
--- a/src/pages/flow/accounts/deletion.tsx
+++ b/src/pages/flow/accounts/deletion.tsx
@@ -1,12 +1,16 @@
+'use client'
+
 import { sni } from 'solar-js-sdk'
 import { Container, Box, Typography, Alert, Collapse, Button } from '@mui/material'
 import { useRouter } from 'next/router'
 import { useState } from 'react'
 
 import ErrorIcon from '@mui/icons-material/Error'
+import { useSearchParams } from 'next/navigation'
 
 export default function AccountDeletion() {
   const router = useRouter()
+  const searchParams = useSearchParams()
 
   const [error, setError] = useState<string | null>(null)
   const [busy, setBusy] = useState(false)
@@ -15,7 +19,7 @@ export default function AccountDeletion() {
     try {
       setBusy(true)
       await sni.patch('/cgi/id/users/me/deletion', {
-        code: router.query['code'] as string,
+        code: searchParams.get('code'),
       })
       router.push('/')
     } catch (err: any) {
diff --git a/src/pages/flow/accounts/password-reset.tsx b/src/pages/flow/accounts/password-reset.tsx
index 822c21e..28e5529 100644
--- a/src/pages/flow/accounts/password-reset.tsx
+++ b/src/pages/flow/accounts/password-reset.tsx
@@ -1,3 +1,5 @@
+'use client'
+
 import { sni } from 'solar-js-sdk'
 import { Container, Box, Typography, Alert, Collapse, Button, TextField } from '@mui/material'
 import { useRouter } from 'next/router'
@@ -5,6 +7,7 @@ import { useState } from 'react'
 import { useForm } from 'react-hook-form'
 
 import ErrorIcon from '@mui/icons-material/Error'
+import { useSearchParams } from 'next/navigation'
 
 export type SnResetPasswordForm = {
   password: string
@@ -12,6 +15,7 @@ export type SnResetPasswordForm = {
 
 export default function AccountPasswordReset() {
   const router = useRouter()
+  const searchParams = useSearchParams()
 
   const { handleSubmit, register } = useForm<SnResetPasswordForm>()
 
@@ -22,7 +26,7 @@ export default function AccountPasswordReset() {
     try {
       setBusy(true)
       await sni.patch('/cgi/id/users/me/password-reset', {
-        code: router.query['code'] as string,
+        code: searchParams.get('code'),
         new_password: data.password,
       })
       router.push('/')