Q:

How to change this.state status during authentication? Firebase + React-Router

I use react-router and Firebase for authentication. For this function onButtonClick from file SignIn must change state in App.js for true. How to do this? Maybe there are some other ways except my idea?
App.js :
import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
 ....
import firebase from './firebase/firebase.js';

class App extends Component {

state = {
      signedInStatus : false
};

render(){
  const PrivateRoute = ({ component: Component, ...rest }) => (
    <Route {...rest} render={(props) => (
        this.state.signedInStatus
        ? <Component {...props} />
        : <Redirect to='/signIn' />
    )} />
  )
  return(
    <div>
      <Header signedInStatus={this.state.signedInStatus} />
    <Router>
    <Switch>
        <Route exact path="/" component={SignIn}/>
        <Route path="/signIn" component={SignIn}/>
        <Route path="/register" component={Register} />
        <PrivateRoute path="/home" component={Home} />
    </Switch>
    </Router>
      </div>
    );
  }
}

export default App;

Second file ensure work with inputing information for getting to user cabinet.
SignIn.js :
    import...
    class SignIn extends Component {
    state = {
          email: '',
          password: '',
    };

    onButtonClick = (event) =>{
      event.preventDefault();
      firebase.auth().signInWithEmailAndPassword(this.state.email, this.state.password)
           .then((user) => {
             this.props.history.push('/home')
             console.log("ok")  /// here i want add something to change 
           })                   /// this.state.signedIn for true in App
           .catch((error) => {
            console.log(error);
            alert(error);
          });
    }

    onChangeInputEmail = (event) => {
      this.setState({email: event.target.value})
    };

    onChangeInputPassword = (event) => {
      this.setState({password: event.target.value})
    };

    render(){
      return (
            ...
      )
    };

    export default withRouter(SignIn);

A:

you need to define a method to update state for App.js then you can pass props to components as following
<Route
  path='/signIn'
  render={(props) => <SignIn {...props} changeSignedInStatus={this.changeSignedInStatus} />}
/>

