install firestore

src/components/NavBar.tsx

@@ -3,20 +3,22 @@ import React, {FC} from 'react';
 import {Link} from 'react-router-dom';
 import * as ROUTES from '../constants/routes';
 //Redux
-// import {connect} from 'react-redux';
+import {connect} from 'react-redux';
+import {selectProfile} from '../store/firebase';
 // import {selectAuthState} from '../store/auth';
 // Style
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
 import {faCode, faSignOutAlt, faUser} from '@fortawesome/free-solid-svg-icons';
 
 interface IProps {
-  isAuthenticated?: boolean;
-  loading?: boolean;
+  isEmpty: boolean;
+  isLoaded: boolean;
 }
+
 /**
  * Main Navbar serves navigation routes.
  */
-const NavBar: FC<IProps> = ({isAuthenticated = true, loading = false}) => {
+const NavBar: FC<IProps> = ({isEmpty, isLoaded}) => {
   const publicLinks = (
     <ul data-testid="publicLinks">
       <li>
@@ -65,7 +67,7 @@ const NavBar: FC<IProps> = ({isAuthenticated = true, loading = false}) => {
   );
 
   /** Display appropriated links after loading given authenticated prop */
-  const RenderLinks = !loading && isAuthenticated ? privateLinks : publicLinks;
+  const RenderLinks = !isLoaded && !isEmpty ? privateLinks : publicLinks;
 
   return (
     <nav className="navbar bg-dark">
@@ -80,5 +82,5 @@ const NavBar: FC<IProps> = ({isAuthenticated = true, loading = false}) => {
 };
 
 /** connect HOC subscribes to the store */
-export default NavBar;
-//connect(selectAuthState)(NavBar);
+export default connect(selectProfile)(NavBar);
+//NavBar;

src/store/firebase/index.ts

@@ -2,3 +2,5 @@ import {RootState} from '..';
 
 /** export firebase authentication */
 export const selectAuthState = (state: RootState) => state.firebase.auth;
+/** export current user profile */
+export const selectProfile = (state: RootState) => state.firebase.profile;

src/store/index.ts

@@ -1,12 +1,9 @@
 // Redux
 import {configureStore} from '@reduxjs/toolkit';
-import authReducer from './auth/';
+// import authReducer from './auth/';
 // Firebase
-import {
-  firebaseReducer,
-  FirebaseReducer,
-  firestoreReducer,
-} from 'react-redux-firebase';
+import {firebaseReducer, FirebaseReducer} from 'react-redux-firebase';
+import {firestoreReducer} from 'redux-firestore';
 // Typing
 import User from '../models/User';
 import {Schema} from './firebase/config';