Working on Avatar upload image. Now working.

src/components/wrappers/Dashboard/LoggedInButton/LoggedInButton.tsx

@@ -11,6 +11,8 @@ export const LoggedInButton = async () => {
     //     return <SignInButton/>
     // }
 
+
+
     return (
         <LoggedInDropdown>
             <SidebarMenuButton>

src/components/wrappers/Dashboard/Profile/Avatar/AvatarWithUpload.tsx

@@ -6,6 +6,9 @@ import {toast} from "sonner";
 import {uploadImageAction} from "@/features/upload/upload.action";
 import {useMutation} from "@tanstack/react-query";
 import {prisma} from "@/prisma";
+import {updateImageUserAction} from "@/components/wrappers/Dashboard/Profile/Avatar/avatar.action";
+import {useRouter} from "next/navigation";
+import {useSession} from "next-auth/react";
 
 export type AvatarWithUploadProps = {
     user: User
@@ -14,6 +17,8 @@ export type AvatarWithUploadProps = {
 
 export const AvatarWithUpload = (props: AvatarWithUploadProps) => {
     const user = props.user
+    const router = useRouter();
+    const { data: session, update } = useSession();
 
 
     const submitImage = useMutation({
@@ -29,17 +34,26 @@ export const AvatarWithUpload = (props: AvatarWithUploadProps) => {
                 return;
             }
 
-            console.log(props.user.id)
-            await prisma.user.update({
-                where: {
-                    id: props.user.id,
-                },
-                data: {
-                    image: data.url
-                }
-            })
+            const updateUser = await updateImageUserAction(data.url)
+            const dataUser = updateUser?.data?.data
 
+            if (updateUser?.serverError || !dataUser) {
+                console.log(updateUser?.serverError);
+                toast.error(updateUser?.serverError);
+                return;
+            }
+
+            const newSession = {
+                ...session,
+                user: {
+                    ...session?.user,
+                    image: data.url
+                },
+            };
+
+            await update(newSession);
             toast.success("Successfully uploaded user image!");
+            router.refresh()
 
 
 

src/components/wrappers/Dashboard/Profile/Avatar/avatar.action.ts

@@ -0,0 +1,24 @@
+"use server"
+import {userAction} from "@/safe-actions";
+import {z} from "zod";
+import {prisma} from "@/prisma";
+
+
+export const updateImageUserAction = userAction
+    .schema(z.string())
+    .action(async ({parsedInput, ctx}) => {
+
+        const user = await prisma.user.update({
+            where: {
+                id: ctx.user.id,
+            },
+            data: {
+                image: parsedInput,
+            }
+        })
+
+
+        return {
+            data: user,
+        }
+    });

src/features/upload/upload.action.ts

@@ -32,7 +32,7 @@ export const uploadImageAction = userAction
             if (env.NODE_ENV === "production") {
                 // url = `https://${env.S3_ENDPOINT}/${bucketName}/${fileName}`
             } else {
-                url = `http://localhost:8887/${localDir}${fileName}`
+                url = `http://localhost:8887/uploads/${fileName}`
             }
             return {
                 data: {result: result, url: url},