cannot delete document from firebase firestore

I cannot delete documents with the delete() function in firestore. the function doesn’t give an error in the console but doesn’t delete the document. I have no idea what to do please help.

import React from "react";
import { useState, useEffect } from "react";
import { firestore, auth } from "../firebaseConfig";

const containerStyles = {
  display: "flex",
  flexDirection: "column",
  alignItems: "center",
  margin: "10px",
  marginTop: "30px",
};

const requests = () => {
  const [receivedRequests, setReceivedRequests] = useState([]);
  useEffect(() => {
    fetchReceivedRequests();
  }, []);
 const acceptRequest = async (uid, event) => {
    event.preventDefault();
    try {
      firestore
        .collection("users")
        .doc(uid)
        .get()
        .then((doc) => {
          const currentUserRef = firestore
            .collection("users")
            .doc(auth.currentUser.uid);
      

          const sendersRef = firestore.collection("users").doc(uid);
     

          currentUserRef.collection("chats").doc(uid).set({
            email: doc.data().email,
            name: doc.data().name,
            uid: uid,
            phoro: doc.data().photo,
          });
      

          sendersRef.collection("chats").doc(auth.currentUser.uid).set({
            email: auth.currentUser.email,
            name: auth.currentUser.displayName,
            photo: auth.currentUser.photoURL,
            uid: auth.currentUser.uid,
          });
        
          currentUserRef.collection("receivedRequests").doc(uid).delete();
         

          sendersRef
            .collection("sentRequests")
            .doc(auth.currentUser.uid)
            .delete();
        
        });
    } catch (err) {
      console.error(err.message);
    }
  };

  const declineRequest = async (uid, event) => {
    event.preventDefault();
    
    try {
      const currentUserRef = firestore
        .collection("users")
        .doc(auth.currentUser.uid)
        .collection("recievedRequests")
        .doc(uid);
      const docRef = firestore.collection("users").doc(uid);

      await currentUserRef.delete();
      
      await docRef
        .collection("sentRequests")
        .doc(auth.currentUser.uid)
        .delete();
     
    } catch (e) {
      console.error(e.message);
    }
  };

return(
<>
{receivedRequests.length === 0 ? (
          <h2>No Requests</h2>
        ) : (
          receivedRequests.map((request) => (
            <div
              key={request.uid}
              style={{
                display: "flex",
                borderTop: "2px solid grey",
                borderBottom: "2px solid grey",
                alignItems: "center",
                justifyContent: "space-between",
                padding: "9px",
                width: "100%",
                margin: 0,
              }}
            >
              <div
                style={{
                  display: "flex",
                  alignItems: "center",
                }}
              >
                <img
                  src={request.photo}
                  style={{
                    width: "75px",
                    height: "75px",
                    borderRadius: " 50%",
                    marginRight: "10px",
                  }}
                />
                <h2>{request.name}</h2>
              </div>
              <div>
                <button
                  style={{
                    margin: "10px",
                    background: "rgb(07 181 254)",
                    color: "white",
                    padding: "11px",
                    width: "102px",
                    border: "none",
                    borderRadius: "12px",
                    fontWeight: "bold",
                  }}
                  onClick={(e) => acceptRequest(request.uid, e)}
                >
                  Accept
                </button>
                <button
                  style={{
                    margin: "10px",
                    background: "#a5a5a5",
                    color: "white",
                    padding: "11px",
                    width: "102px",
                    border: "none",
                    borderRadius: "12px",
                    fontWeight: "bold",
                  }}
                  onClick={(e) => declineRequest(request.uid, e)}
                >
                  Decline
                </button>
              </div>
            </div>
          ))
        )}
</>
)


}

I even tried some code that I wrote earlier that worked in the other project but It just doesn’t work in this one. What do I do?

Thanks