как установить значение для firebase в текстовом виде с помощью реакции js

Question

Я новичок в firebase и реагирую js Я получаю данные из firebase, и я хочу установить эти данные в два текстовых поля ввода, а затем снова я хочу отправить те же данные в коллекции сторонних документов в firebase с одним больше поля ввода с некоторыми данными в базе данных. ниже мой код, я использую вложенную таблицу в firebase. {project.topic} - это мои данные для выборки, а {project.assignment} - это также данные для выборки.

Заранее спасибо

import React, { Component } from 'react'
import { connect } from 'react-redux'
import { createTestcase } from '../../store/actions/projectActions'
import { Redirect } from 'react-router-dom'
import { firestoreConnect } from 'react-redux-firebase'
import { compose } from 'redux'
import {db } from '../../config/fbConfig'


class ProjectDetailsTest extends Component {

  state = {
    topic:{},
    testcase:'',
    assignmentname:{}
  }

  handleChange = (e) => {
    this.setState({
      [e.target.id]: e.target.value 
    })
  }
  handleSubmit = (e) => {
    e.preventDefault();
    //console.log(this.state);
    this.props.createTestcase(this.state);
    this.setState ({
      testcase:''
    })
    this.componentDidMount();
  }
  componentDidMount(){
    const { project } = this.props;
    db.collection('projects').doc(project.topic).collection('assignment').doc(project.assignment).collection('testcase').get()
    .then(snapshot=>{
      const assign = []
      snapshot.forEach(snapshot=>{
        const data=snapshot.data();
        assign.push(data)
      })
      this.setState({assign : assign})

      console.log(snapshot)
    }).catch(error=>console.log(error));

  }


  render() {
    const { auth,project } = this.props;
    if (!auth.uid) return <Redirect to='/signin' /> 
    if(project){
      return (
        <div className="container">
          <div className="card z-depth-0">
            <div className="card-content">
              <span className="card-title" id='topic' >Topic:- {project.topic}</span>
              <span className="card-title" id='topic' >Assignment:- {project.assignment}</span>
            </div>
          <div>
          <div>
          {
            this.state.assign && this.state.assign.map(assign=>{
              return(
                <div className="card-content">
                    <span className="card-title ">TestCase:- {assign.testcase}</span>

                </div>

              )
            })
          }
        </div>
        </div>
        </div>

        <form className="white" onSubmit={this.handleSubmit}>
          <h5 className="grey-text text-darken-3">Create New Assignment</h5>
          <div className="input-field">
            <input type="text" name='topic' id='topic'  value = {project.topic}/>

          </div>
          <div className="input-field">
            <input type="text" id='assignmentname' value = {project.assignment} />

          </div>
          <div className="input-field">
            <input type="text" id='testcase' onChange={this.handleChange} />
            <label htmlFor="testcase">TestCase</label>
          </div>
          <div className="input-field">
            <button className="btn pink lighten-1">Create</button>
          </div>
        </form>
        </div>
      )
    }else{
      return (
        <div className="container center">
          <p>Loading project...</p>
        </div>
      )
    }
  }
}

const mapStateToProps = (state,ownProps) => {
  //console.log(state);
  const topic = ownProps.match.params.topic;
  const assignment = ownProps.match.params.assignment;
  const projects = state.firestore.data.projects;
  const project = projects ? projects[topic].assignment[assignment]: null;
  return {
    project: project,
    assignment,
    auth: state.firebase.auth
  }
}

const mapDispatchToProps = dispatch => {
  return {
    createTestcase: (projecttest) => dispatch(createTestcase(projecttest))
  }
}

export default compose(
  connect(mapStateToProps,mapDispatchToProps),
  firestoreConnect((props) => [
    { collection: 'projects', doc: props.project.topic, subcollections: [
            { collection: 'assignment',storeAs:'assignment' }
    ]}
 ])
)(ProjectDetailsTest)