The logic of this component looks good to me.

• Assuming isReceivedSession is true, a <ReactFragment/> renders; if not, a <Spinner/> should render
• Within the fragment, if isLoadingApp || isLoadingAuth is truthy, a <Spinner/> component should render; if the statement is not truthy, a line and the router are returned and render.

But even when isLoadingApp logs true in the console, the spinner never shows up. I just see a fragment (nothing) or the expected line and router navigation path.

When isLoadingApp evaluates to true, a spinner component should be visible.

I feel like I'm missing something deeper here...where is the flaw in the logic?

const App = ({ classes }: IProps) => {
  const dispatch = useDispatch();
  const [isReceivedSession, setIsReceivedSession] = useState(false);

  const isLoadingAuth: boolean = useSelector(authIsLoadingSelector);
  const isLoadingApp: boolean = useSelector(appIsLoadingSelector);

  useEffect(() => {
    (async () => {
      try {
        const sessionData = await CognitoClient.currentSession();
        const currentSessionToken = sessionData.getAccessToken().getJwtToken();
        if (currentSessionToken) {
          dispatch(authActions.setAuthStatus(AUTH_STATUS.LOGGED_IN));
        }
      } finally {
        setIsReceivedSession(true);
      }
    })();
  }, []);

  //all logging values properly
  console.log("isReceivedSession", isReceivedSession);
  console.log("isLoadingApp ", isLoadingApp);
  console.log("isLoadingAuth ", isLoadingAuth)

  return isReceivedSession ? (
    //spinner never renders even when isLoadingApp is true
    <Fragment>
      {isLoadingApp ||

        (isLoadingAuth && <Spinner size={48} className={classes.spinner} />)}
      <HeaderLine />
      <Router>
        <Switch>
          <Route exact path={APP_AUTH_PATH()} component={SignInScreen} />
          <PrivateRoute
            path={APP_DASHBOARD_PATH()}
            component={DashboardScreen}
            authenticationPath={APP_AUTH_PATH()}
          />
          <Route
            exact
            path={APP_LANDING_PATH()}
            render={() => <Redirect to={APP_DASHBOARD_PATH()} />}
          />
        </Switch>
      </Router>
    </Fragment>
  ) : (
    <Spinner size={48} className={classes.spinner} />
  );
};

export default withStyles(styles)(App);