1import {makeStyles} from '@material-ui/core/styles';
 2import useProfile from '../../hooks/useProfile';
 3import useSettings from '../../hooks/useSettings';
 4
 5const Logo = () => {
 6  const classes = useStyles();
 7  const {user} = useProfile();
 8  const settings = useSettings();
 9  const appLink = user ? '/dashboard' : settings?.['about_link'] || '';
10  return (
11    <div className={classes.layout}>
12      <a href={appLink} className={classes.link}>
13        <img
14          src={'/assets/Caroster_beta.png'}
15          alt="Caroster"
16          className={classes.logo}
17        />
18      </a>
19    </div>
20  );
21};
22
23const useStyles = makeStyles(theme => ({
24  layout: {
25    display: 'flex',
26    justifyContent: 'center',
27    alignItems: 'center',
28    paddingTop: theme.spacing(4),
29    paddingBottom: theme.spacing(4),
30  },
31  link: {
32    width: '100%',
33  },
34  logo: {
35    display: 'block',
36    width: '55%',
37    height: 'auto',
38    margin: '0 auto',
39  },
40}));
41export default Logo;