Firebase cannot create a document using setDoc

This is my Code to create a user in the firebase collection. But collection doesn't create. Is this because I have written in TS?

await setDoc(doc(db, "users", currentUser.uid), {});

Fullcode

import React, { useContext, useState } from "react";

import avatarPlaceholder from "../../assets/images/avatar.jpeg";

import { db } from "../../config/firebase";
import { doc, serverTimestamp, setDoc } from "firebase/firestore";
import {
    getDownloadURL,
    getStorage,
    ref,
    uploadBytesResumable,
} from "firebase/storage";

import { AuthContext } from "../../context/AuthContext";

export default function CreateUser() {
    const { currentUser } = useContext(AuthContext);

    const storage = getStorage();
    const [username, setUserName] = useState("");
    const [userCreating, setCreatingUser] = useState(false);

    const [avatar, setAvatar] = useState<any | null>();
    const [avatarPrev, setAvatarPrev] = useState<any | null>(null);

    const handleAvatarUpload = (event: any) => {
        setAvatar(event.target.files[0]);
        setAvatarPrev(URL.createObjectURL(event.target.files[0]));
    };

    const handleCreateUser = async (event: any) => {
        event.preventDefault();
        console.log(currentUser);
        try {
            const storageRef = ref(
                storage,
                `/avatar/${currentUser.uid}/${avatar.name}`
            );

            await uploadBytesResumable(storageRef, avatar)
                .then(() => {
                    getDownloadURL(storageRef).then(async (downloadurl) => {
                        try {
                            await setDoc(doc(db, "users", currentUser.uid), {});
                        } catch (createusererr) {
                            console.log(createusererr);
                        }
                    });
                })
                .catch((error) => {
                    console.log(error);
                });
        } catch (err) {
            console.log(err);
        }
    };

    return (
        <div className="createuser px-5 flex justify-center items-center h-screen mx-auto md:w-[425px]">
            <div className="createuser__wrapper w-full p-4 bg-formbgcolor rounded-md bg-form_bgcolor">
                <form onSubmit={handleCreateUser}>
                    <div className="text-center flex flex-col">
                        <h1 className="text-4xl font-bold text-white">
                            Create User
                        </h1>
                        <label htmlFor="createuserimage">
                            <img
                                src={
                                    avatarPrev ? avatarPrev : avatarPlaceholder
                                }
                                className="cursor-pointer w-[150px] h-[150px] mx-auto my-3 rounded-[50%]"
                                alt=""
                            />
                        </label>
                        <input
                            type="file"
                            id="createuserimage"
                            accept="image/*"
                            className="hidden"
                            onChange={handleAvatarUpload}
                        />
                        <input
                            type="text"
                            onChange={(event) =>
                                setUserName(event.target.value)
                            }
                            placeholder="Username"
                            className="border-none active:border-none rounded-md p-3 mt-3"
                        />
                        <button
                            className="bg-white mt-3 w-60 p-[10px] mx-auto rounded-[15px] font-size"
                            disabled={username ? false : true}
                        >
                            {userCreating ? "Creating" : "Create User"}
                        </button>
                    </div>
                </form>
            </div>
        </div>
    );
}