diff options
| -rw-r--r-- | src/components/Header/Header.tsx | 9 | ||||
| -rw-r--r-- | src/index.tsx | 6 |
2 files changed, 8 insertions, 7 deletions
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index d0d9081..49f427f 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -9,11 +9,11 @@ import { makeStyles } from '@material-ui/core/styles'; import AccountCircle from '@material-ui/icons/AccountCircle'; import NotificationsIcon from '@material-ui/icons/Notifications'; import HomeIcon from '@material-ui/icons/Home'; +import { useAuth } from '../../hooks/useAuth'; import SearchBar from './SearchBar'; interface PropTypes { - userImage: string | undefined; navigate: (prefix: string) => void; } @@ -33,8 +33,9 @@ const useStyles = makeStyles({ } }); -const Header: React.FC<PropTypes> = ({ navigate, userImage }) => { +const Header: React.FC<PropTypes> = ({ navigate }) => { const classes = useStyles(); + const { user } = useAuth(); const handleHome = (): void => { navigate('feed'); @@ -62,8 +63,8 @@ const Header: React.FC<PropTypes> = ({ navigate, userImage }) => { </IconButton> <IconButton onClick={handleProfile}> { - userImage?.match(/\.(jpeg|jpg|gif|png)$/) - ? <Avatar className={classes.avatar} src={userImage} /> + user?.avatarUrl?.match(/\.(jpeg|jpg|gif|png)$/) + ? <Avatar className={classes.avatar} src={user?.avatarUrl} /> : <AccountCircle /> } </IconButton> diff --git a/src/index.tsx b/src/index.tsx index f9114c3..a82a28b 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -40,7 +40,7 @@ const useStyles = makeStyles({ const App: React.FC = () => { const [page, setPage] = useState<Page>({ prefix: 'feed', id: '' }); const classes = useStyles(); - const user = { _id: '', avatarUrl: '' }; + const { user } = useAuth(); const navigate = (prefix: string, id?: string): void => { if (prefix === 'profile' && !id && !user) { @@ -59,7 +59,7 @@ const App: React.FC = () => { return ( <ThemeProvider theme={theme}> <CssBaseline /> - <Header navigate={navigate} userImage={user?.avatarUrl} /> + <Header navigate={navigate} /> <div className={classes.root}> { page.prefix === 'profile' && ( <ProfilePage @@ -76,5 +76,5 @@ const App: React.FC = () => { ); }; -ReactDOM.render(<App />, document.getElementById('root')); +ReactDOM.render(<AuthProvider> <App /> </AuthProvider>, document.getElementById('root')); |