'I am getting this error when I am using timestamp to store images to firebase using firestore

When I run my code in the editor there is no error but the whole page is blank. I am trying to create a gallery using react and firebase but I am getting >>error: undefined is not an object (evaluating 'app.firestore.FieldValue.serverTimestamp').

import { useState, useEffect } from 'react';
import { projectFirestore } from '../firebase/config';

const useFirestore = (collection) => {
  const [docs, setDocs] = useState([]);

  useEffect(() => {
    const unsub = projectFirestore
      .collection(collection)
      .orderBy('createdAt', 'desc')
      .onSnapshot((snap) => {
        let documents = [];
        snap.forEach((doc) => {
          documents.push({ ...doc.data(), id: doc.id });
        });
        setDocs(documents);
      });

    return () => unsub();
    // this is a cleanup function that react will run when
    // a component using the hook unmounts
  }, [collection]);

  return { docs };
};

export default useFirestore;

This is my firebase conf. I removed the ids.

import firebase from 'firebase/compat/app';
import 'firebase/compat/firestore';

const firebaseConfig = {
  apiKey: ,
  authDomain: ,
  projectId: ,
  storageBucket: ,
  messagingSenderId: ,
  appId:,
  measurementId: ,
};

let app;

if (firebase.apps.length === 0) {
  app = firebase.initializeApp(firebaseConfig);
} else {
  app = firebase.app();
}

// Initialize Firebase

const projectFirestore = app.firestore;
const projectStorage = app.storage;
const timestamp = app.firestore.FieldValue.serverTimestamp();

export { projectStorage, projectFirestore, timestamp };


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source