Fixes to other forms and add preview to upload page of icon marketplace

src/app/account/login/page.tsx

@@ -11,6 +11,9 @@ function LoginForm ({ redirect }: { redirect: string | null }) {
   const [loading, setLoading] = useState<boolean>(true)
   const router = useRouter()
 
+  const [username, setUsername] = useState<string>('')
+  const [password, setPassword] = useState<string>('')
+
   useEffect(() => {
     document.title = 'Lncvrt Games - Account Login'
 
@@ -33,11 +36,6 @@ function LoginForm ({ redirect }: { redirect: string | null }) {
           onSubmit={async e => {
             e.preventDefault()
 
-            const form = e.currentTarget
-            const formData = new FormData(form)
-            const username = formData.get('username') as string
-            const password = formData.get('password') as string
-
             try {
               const result = await axios.post('/api/account/login', {
                 username,
@@ -77,6 +75,8 @@ function LoginForm ({ redirect }: { redirect: string | null }) {
             name='username'
             placeholder='Username'
             type='username'
+            value={username}
+            onChange={e => setUsername(e.target.value)}
             required
           />
           <input
@@ -84,6 +84,8 @@ function LoginForm ({ redirect }: { redirect: string | null }) {
             name='password'
             placeholder='Password'
             type='password'
+            value={password}
+            onChange={e => setPassword(e.target.value)}
             required
           />
           <button type='submit'>Login</button>

src/app/account/reset-password/page.tsx

@@ -11,6 +11,9 @@ function ResetPasswordForm ({ codeParam }: { codeParam: string }) {
   const [token, setToken] = useState<string | null>(null)
   const [result, setResult] = useState<number>(-1)
 
+  const [newPassword, setNewPassword] = useState<string>('')
+  const [retypeNewPassword, setRetypeNewPassword] = useState<string>('')
+
   useEffect(() => {
     document.title = 'Lncvrt Games - Reset Account Password'
   }, [])
@@ -40,12 +43,7 @@ function ResetPasswordForm ({ codeParam }: { codeParam: string }) {
           onSubmit={async e => {
             e.preventDefault()
 
-            const form = e.currentTarget
-            const formData = new FormData(form)
-            const password = formData.get('new-password') as string
-            const confirm = formData.get('retype-password') as string
-
-            if (password !== confirm) {
+            if (newPassword !== retypeNewPassword) {
               alert('Passwords must match')
               return
             }
@@ -54,7 +52,7 @@ function ResetPasswordForm ({ codeParam }: { codeParam: string }) {
               const result = await axios.post('/api/account/reset-password', {
                 token,
                 code: codeParam,
-                password
+                password: newPassword
               })
               if (result.data.success) {
                 setResult(2)
@@ -85,14 +83,18 @@ function ResetPasswordForm ({ codeParam }: { codeParam: string }) {
             placeholder='New password'
             type='password'
             autoComplete='new-password'
+            value={newPassword}
+            onChange={e => setNewPassword(e.target.value)}
             required
           />
           <input
-            id='retype-password'
-            name='retype-password'
+            id='retype-new-password'
+            name='retype-new-password'
             placeholder='Re-type password'
             type='password'
             autoComplete='new-password'
+            value={retypeNewPassword}
+            onChange={e => setRetypeNewPassword(e.target.value)}
             required
           />
           <button type='submit'>Update password</button>