fix: user alias form improvements

src/components/sections/profile/SetUserAliasForm.tsx

@@ -16,6 +16,7 @@ import {
 import {Button} from '@/components/ui/Button'
 import {useSetUserAlias} from '@/lib/queries/user/setUserAlias'
 import {FormError} from '@/lib/types/error'
+import {toast} from '@/components/ui/Toast'
 
 const formSchema = z.object({
   alias: z.string().min(3),
@@ -41,6 +42,7 @@ const SetUserAliasForm = ({initialAlias}: SetUserAliasFormProps) => {
     getValues,
     control,
     formState: {isDirty},
+    reset,
   } = form
 
   const onSubmit = () => {
@@ -51,6 +53,10 @@ const SetUserAliasForm = ({initialAlias}: SetUserAliasFormProps) => {
           form.setError('alias', {type: 'custom', message: error.message})
         }
       },
+      onSuccess: () => {
+        reset(getValues(), {keepValues: true})
+        toast({title: 'Alias set.'})
+      },
     })
   }
 

src/lib/queries/user/getUser.ts

@@ -9,7 +9,9 @@ import {withApiErrorHandler} from '@/lib/utils/common/error'
 
 const getQueryOptions = (userId: string | undefined) => ({
   queryKey: queryKeys.users.detail(userId).queryKey,
-  queryFn: withApiErrorHandler(getUser),
+  // getUser has to be explicitly called without arguments, otherwise React Query
+  // would inject context, which is not serializable for server actions
+  queryFn: withApiErrorHandler(() => getUser()),
 })
 
 export const useGetUser = () => {

src/server/actions/user/setUserAlias.ts

@@ -21,7 +21,7 @@ const setUserAliasAction = async (alias: string | null) => {
   )
 
   if (doesAliasExists) {
-    throw new FormError('Alias already exists')
+    throw new FormError('Alias already exists.')
   }
 
   return db.update(users).set({alias}).where(eq(users.id, id)).returning()