add functions, create and join room

src/App.js

@@ -0,0 +1,65 @@
+import React, { Component } from 'react';
+import firebase from 'firebase/app';
+import Chat from './Chat';
+import Create from './Create';
+import Loading from './Loading';
+
+export default class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      loading: false,
+      loggedIn: false,
+      page: 'create',
+    };
+    this.updateLoading = this.updateLoading.bind(this);
+    this.changePage = this.changePage.bind(this);
+  }
+  componentDidMount() {
+    firebase.auth().onAuthStateChanged(user => {
+      const roomId = window.localStorage.getItem('roomId');
+      if (user) {
+        this.setState({
+          loggedIn: true,
+        });
+        if (roomId)
+          this.setState({
+            page: 'chat',
+          });
+      } else {
+        if (roomId) {
+          window.localStorage.removeItem('roomId');
+          window.localStorage.removeItem('watchPartyUserName');
+          window.localStorage.removeItem('watchPartyUser');
+        }
+      }
+    });
+  }
+  changePage(page) {
+    this.setState({
+      page,
+    });
+  }
+  updateLoading(loading) {
+    this.setState({
+      loading,
+    });
+  }
+  render() {
+    const { loading, loggedIn, page } = this.state;
+    return (
+      <div className="party-content-wrapper">
+        {loading && <Loading />}
+        {page === 'chat' ? (
+          <Chat changePage={this.changePage} updateLoading={this.updateLoading} />
+        ) : page === 'create' ? (
+          <Create
+            changePage={this.changePage}
+            loggedIn={loggedIn}
+            updateLoading={this.updateLoading}
+          />
+        ) : null}
+      </div>
+    );
+  }
+}