11/* eslint-disable @next/next/no-img-element */
22"use client";
33import { useState, useCallback } from "react";
4- import { useToast } from "@/components/ui/use-toast ";
4+ import { toast } from "sonner ";
55import { Button } from "@/components/ui/button";
66import { useFirestoreUser } from "@/lib/firebase.hooks";
77import {
@@ -31,7 +31,6 @@ export default function UploadProfileImage() {
3131 const [uploading, setUploading] = useState(false);
3232 const [removing, setRemoving] = useState(false);
3333 const [progress, setProgress] = useState(0);
34- const { toast } = useToast();
3534
3635 const reset = () => {
3736 setUploading(false);
@@ -43,18 +42,15 @@ export default function UploadProfileImage() {
4342 setUploading(true);
4443
4544 if (!currentUser?.uid) {
46- toast({ variant: "destructive", description: " Please login first" } );
45+ toast(" Please login first");
4746 reset();
4847 return;
4948 }
5049
5150 const file = acceptedFiles.at(0);
5251
5352 if (!file) {
54- toast({
55- variant: "destructive",
56- description: "File not found or invalid",
57- });
53+ toast("File not found or invalid");
5854 reset();
5955 return;
6056 }
@@ -74,10 +70,7 @@ export default function UploadProfileImage() {
7470 },
7571 (error: any) => {
7672 console.error(error);
77- toast({
78- variant: "destructive",
79- description: "Failed to upload image",
80- });
73+ toast("Failed to upload image");
8174 reset();
8275 },
8376 async () => {
@@ -86,30 +79,22 @@ export default function UploadProfileImage() {
8679 );
8780 try {
8881 await setDoc(
89- doc(getFirestore(), " users/" + currentUser.uid),
82+ doc(getFirestore(), ` users/${ currentUser.uid}` ),
9083 {
9184 settings: { profile: { picture: url } },
9285 },
9386 { merge: true },
9487 );
95- toast({
96- description: "Saved.",
97- });
88+ toast("Saved.");
9889 } catch (error) {
99- toast({
100- variant: "destructive",
101- description: JSON.stringify(error),
102- });
90+ toast(JSON.stringify(error));
10391 }
10492 reset();
10593 },
10694 );
10795 } catch (error) {
10896 console.error(error);
109- toast({
110- variant: "destructive",
111- description: "Failed to upload image",
112- });
97+ toast("Failed to upload image");
11398 }
11499 // eslint-disable-next-line react-hooks/exhaustive-deps
115100 }, []);
@@ -125,14 +110,11 @@ export default function UploadProfileImage() {
125110
126111 const removeProfileImage = async () => {
127112 if (!currentUser?.uid) {
128- toast({
129- variant: "destructive",
130- description: "Must be logged in to remove image",
131- });
113+ toast("Must be logged in to remove image");
132114 return;
133115 }
134116 await setDoc(
135- doc(getFirestore(), " users/" + currentUser.uid),
117+ doc(getFirestore(), ` users/${ currentUser.uid}` ),
136118 {
137119 settings: { profile: { picture: null } },
138120 },
0 commit comments