rudyD
rudyD

Reputation: 15

TypeError: (intermediate value).toDate is not a function

I'm trying to display a timestamp value from my firestore collection but i'm getting this error "TypeError: (intermediate value).toDate is not a function" where i marked with the ">>" below. I made it a timestamp before submitting it into firestore but now to display it i need it as a Date value Do you have any solutions?

    componentDidMount() {
        db.collection("mycollection")
          .get()
          .then(querySnapshot => {
            const data = querySnapshot.docs.map(doc => doc.data());
            this.setState({ costumers: data });
          });
      }
    
    
      render(){
        const { costumers } = this.state;
        
    
      return (
        <Card
        
        >
          <PerfectScrollbar>
         
            <Box minWidth={1050}>
          
              <Table   >
                <TableHead>
                  <TableRow>
                    <TableCell padding="checkbox">
                    
                    </TableCell>
                  
                {costumers.map(costumer => (
                <TableBody>
                    <TableRow            
                    >
                      <TableCell padding="checkbox">
                        <Checkbox
                          value="true"
                        />
                      </TableCell>
                      <TableCell>
                        <Box
                          alignItems="center"
                          display="flex"
                        >
                          <Typography
                            color="textPrimary"
                            variant="body1"
                          >
                             {costumer.name}
                          </Typography>
                        </Box>
                      </TableCell>
                      <TableCell>
                      {costumer.surname}
                      </TableCell>
                      <TableCell>
                      {costumer.email}
                      </TableCell>
                      <TableCell>
                      {costumer.phone}
                      </TableCell>
                      <TableCell>
>>                    {new Date(costumer.date).toDate()}   
                      </TableCell>
                      <TableCell>
                     {costumer.time}        
                      </TableCell>
                      <TableCell>
                      {costumer.service}
                      </TableCell>              
                    </TableRow>             
                </TableBody>
                ))}
              </Table>

Upvotes: 0

Views: 4196

Answers (2)

michael satumba
michael satumba

Reputation: 39

First, you have to multiply the timestamp value by 1000 and then wrap the timestamp value in the new date function like this:

new Date(post.timestamp?.seconds * 1000)

Then you have to call the toDateString function on the date object:

new Date(post.timestamp?.seconds * 1000).toDateString()

Upvotes: 0

Hard Code Programmer
Hard Code Programmer

Reputation: 196

You can easily get the timestamp from Firebase Server itself by using the following code.

import firebase from 'firebase';

var TimeStamp = firebase.firestore.FieldValue.serverTimestamp();

The serverTimestamp() function will return the timestamp from the firebase server itself. Here, the value of TimeStampwill be in this format :

<Full name of the month> dd, yyyy hh:mm:ss <Time zone of your location>

If you want to display date, you can simply display it as a string. You can't display a date value inside a <TableCell>. You have to convert it to a string.

EDIT When you receive a timestamp value it will already be in date format. You have to use toDateString() to convert it to a string.

Upvotes: 2

Related Questions