Added delay to app load to ensure firebase connection established.
This commit is contained in:
@@ -109,7 +109,6 @@ class AppContainer extends Component {
|
|||||||
});
|
});
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// See above for additional options, including other storage providers.
|
|
||||||
await persistCache({
|
await persistCache({
|
||||||
cache,
|
cache,
|
||||||
storage: window.sessionStorage,
|
storage: window.sessionStorage,
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import React, { useEffect, Suspense, lazy } from "react";
|
import React, { useEffect, Suspense, lazy, useState } from "react";
|
||||||
import { useApolloClient, useQuery } from "@apollo/react-hooks";
|
import { useApolloClient, useQuery } from "@apollo/react-hooks";
|
||||||
import { Switch, Route, Redirect } from "react-router-dom";
|
import { Switch, Route, Redirect } from "react-router-dom";
|
||||||
import firebase from "../firebase/firebase.utils";
|
import firebase from "../firebase/firebase.utils";
|
||||||
@@ -26,11 +26,12 @@ const Unauthorized = lazy(() =>
|
|||||||
|
|
||||||
export default () => {
|
export default () => {
|
||||||
const apolloClient = useApolloClient();
|
const apolloClient = useApolloClient();
|
||||||
|
const [loaded, setloaded] = useState(false);
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
//Run the auth code only on the first render.
|
//Run the auth code only on the first render.
|
||||||
const unsubscribeFromAuth = auth.onAuthStateChanged(async user => {
|
const unsubscribeFromAuth = auth.onAuthStateChanged(async user => {
|
||||||
console.log("Auth State Changed.")
|
console.log("Auth State Changed.");
|
||||||
|
setloaded(true);
|
||||||
if (user) {
|
if (user) {
|
||||||
let token;
|
let token;
|
||||||
token = await user.getIdToken();
|
token = await user.getIdToken();
|
||||||
@@ -87,16 +88,18 @@ export default () => {
|
|||||||
unsubscribeFromAuth();
|
unsubscribeFromAuth();
|
||||||
};
|
};
|
||||||
}, [apolloClient]);
|
}, [apolloClient]);
|
||||||
|
|
||||||
const HookCurrentUser = useQuery(GET_CURRENT_USER);
|
const HookCurrentUser = useQuery(GET_CURRENT_USER);
|
||||||
|
|
||||||
|
if (!loaded) return <LoadingSpinner />;
|
||||||
if (HookCurrentUser.loading) return <LoadingSpinner />;
|
if (HookCurrentUser.loading) return <LoadingSpinner />;
|
||||||
if (HookCurrentUser.error)
|
if (HookCurrentUser.error)
|
||||||
return <AlertComponent message={HookCurrentUser.error.message} />;
|
return <AlertComponent message={HookCurrentUser.error.message} />;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Switch>
|
<Switch>
|
||||||
<ErrorBoundary>
|
<ErrorBoundary>
|
||||||
<Suspense fallback={<div>TODO: Suspense Loading</div>}>
|
<Suspense fallback={<LoadingSpinner />}>
|
||||||
<Route exact path='/' component={LandingPage} />
|
<Route exact path='/' component={LandingPage} />
|
||||||
<Route exact path='/unauthorized' component={Unauthorized} />
|
<Route exact path='/unauthorized' component={Unauthorized} />
|
||||||
<Route
|
<Route
|
||||||
|
|||||||
Reference in New Issue
Block a user