0

I'm trying to figure out how to add data to cloud firestore from my react app.

I have it all working for the data entered in a form, but am missing something because when I try to add a createdAt timestamp, I get an error.

My current attempt is:

import React from "react";
import { Link } from 'react-router-dom'
import { useStateMachine } from "little-state-machine";
import updateAction from "./updateAction";
import { fsDB, firebase, settings } from "../../../firebase";



const Result = props => {
  const { state } = {
    useStateMachine(updateAction),
    createdAt: firebase.firestore.FieldValue.serverTimestamp()
  };

  fsDB
      .collection("project")
      .add(state)


  return (
    <div>


        <pre>{JSON.stringify(state, null, 2)}</pre>


  </div>    

  );
};

export default Result;

If i remove the createdAt and just upload state, it all works fine.

I'm getting stuck on how to add the timestamp.

Can anyone see where I'm going wrong?

I have found this post which sets out a snap shot to merge a date field with a record. I'm struggling to understand if there is something about snapshot which needs the record to be created before a date can be added? It doesn't seem logical that I have to create a record before I can merge a date field into it.

Mel
  • 2,481
  • 26
  • 113
  • 273
  • 1
    And the error is what exactly? – Doug Stevenson Nov 17 '19 at 23:32
  • FirebaseError: Function DocumentReference.set() called with invalid data. Unsupported field value: undefined – Mel Nov 17 '19 at 23:35
  • What exactly is `useStateMachine`? I suggest editing the question to remove all unknowns and show just the plain object that isn't working the way you expect. We should be able to reproduce the problem with just the code in the question. The error message is telling you one of your document properties is undefined, which is invalid. – Doug Stevenson Nov 17 '19 at 23:40
  • If I just refresh the page over the error message, the form submits to the cloud firestore, but the createdAt field is not created. The state machine is because the form is multipart - each prior part gets held in a state machine until the form submits, which happens at the step I set out above. I'm in all sorts of hell trying to figure out how to use hooks with firestore. Things I could do with componentDidMount now don't work to read from firestore and I now cant add a date on the end of the form inputs. Are there any tutorials from firestore on how to use hooks to send data to the database? – Mel Nov 17 '19 at 23:46
  • Without seeing all the code, I don't know how it would be possible to debug this. – Doug Stevenson Nov 17 '19 at 23:52
  • Okay - thanks for your attention. I'll update this post if I figure out how to use cloud firestore – Mel Nov 17 '19 at 23:53

0 Answers0