Fix/splash (#534)

* fix: use correct env id

* fix: extract to constant

* fix: fetch user when logging in

frontend/src/component/App.tsx

@@ -36,12 +36,12 @@ const App = ({ location, user, fetchUiBootstrap }: IAppProps) => {
     }, [user.authDetails?.type]);
 
     useEffect(() => {
-        if (splash?.environments === undefined) return;
+        if (splash?.environment === undefined) return;
-        if (!splash?.environments && !isUnauthorized()) {
+        if (!splash?.environment && !isUnauthorized()) {
             setShowSplash(true);
         }
         /* eslint-disable-next-line */
-    }, [splash.environments]);
+    }, [splash.environment]);
 
     const renderMainLayoutRoutes = () => {
         return routes.filter(route => route.layout === 'main').map(renderRoute);

frontend/src/component/common/BreadcrumbNav/BreadcrumbNav.tsx

@@ -46,7 +46,7 @@ const BreadcrumbNav = () => {
                                                 styles.breadcrumbNavParagraph
                                             }
                                         >
-                                            {path.substring(0,30)}
+                                            {path.substring(0, 30)}
                                         </p>
                                     );
                                 }
@@ -67,7 +67,7 @@ const BreadcrumbNav = () => {
                                         className={styles.breadcrumbLink}
                                         to={link}
                                     >
-                                        {path.substring(0,30)}
+                                        {path.substring(0, 30)}
                                     </Link>
                                 );
                             })}

frontend/src/component/common/EnvironmentSplash/EnvironmentSplash.tsx

@@ -11,12 +11,14 @@ interface IEnvironmentSplashProps {
     onFinish: (status: boolean) => void;
 }
 
+const ENVIRONMENT_SPLASH_ID = 'environment';
+
 const EnvironmentSplash = ({ onFinish }: IEnvironmentSplashProps) => {
     const styles = useStyles();
     const { setSplashSeen } = useSplashApi();
 
     useEffect(() => {
-        setSplashSeen('environments');
+        setSplashSeen(ENVIRONMENT_SPLASH_ID);
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
 

frontend/src/component/user/DemoAuth/DemoAuth.jsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { Button, TextField } from '@material-ui/core';
+import useUser from '../../../hooks/api/getters/useUser/useUser';
 
 import styles from './DemoAuth.module.scss';
 
@@ -10,12 +11,17 @@ import { LOGIN_BUTTON, LOGIN_EMAIL_ID } from '../../../testIds';
 const DemoAuth = ({ demoLogin, history, authDetails }) => {
     const [email, setEmail] = useState('');
 
+    const { refetch } = useUser();
+
     const handleSubmit = evt => {
         evt.preventDefault();
         const user = { email };
         const path = evt.target.action;
 
-        demoLogin(path, user).then(() => history.push(`/`));
+        demoLogin(path, user).then(() => {
+            refetch();
+            history.push(`/`);
+        });
     };
 
     const handleChange = e => {

frontend/src/component/user/HostedAuth/HostedAuth.jsx

@@ -9,10 +9,12 @@ import useQueryParams from '../../../hooks/useQueryParams';
 import AuthOptions from '../common/AuthOptions/AuthOptions';
 import DividerText from '../../common/DividerText/DividerText';
 import ConditionallyRender from '../../common/ConditionallyRender';
+import useUser from '../../../hooks/api/getters/useUser/useUser';
 
 const HostedAuth = ({ authDetails, passwordLogin }) => {
     const commonStyles = useCommonStyles();
     const styles = useStyles();
+    const { refetch } = useUser();
     const history = useHistory();
     const params = useQueryParams();
     const [username, setUsername] = useState(params.get('email') || '');
@@ -47,6 +49,7 @@ const HostedAuth = ({ authDetails, passwordLogin }) => {
 
         try {
             await passwordLogin(path, user);
+            refetch();
             history.push(`/`);
         } catch (error) {
             if (error.statusCode === 404 || error.statusCode === 400) {

frontend/src/component/user/PasswordAuth/PasswordAuth.jsx

@@ -15,11 +15,13 @@ import {
     LOGIN_PASSWORD_ID,
     LOGIN_EMAIL_ID,
 } from '../../../testIds';
+import useUser from '../../../hooks/api/getters/useUser/useUser';
 
 const PasswordAuth = ({ authDetails, passwordLogin }) => {
     const commonStyles = useCommonStyles();
     const styles = useStyles();
     const history = useHistory();
+    const { refetch } = useUser();
     const params = useQueryParams();
     const [username, setUsername] = useState(params.get('email') || '');
     const [password, setPassword] = useState('');
@@ -53,7 +55,7 @@ const PasswordAuth = ({ authDetails, passwordLogin }) => {
 
         try {
             await passwordLogin(path, user);
-
+            refetch();
             history.push(`/`);
         } catch (error) {
             if (error.statusCode === 404 || error.statusCode === 400) {

frontend/src/component/user/SimpleAuth/SimpleAuth.jsx

@@ -3,16 +3,21 @@ import PropTypes from 'prop-types';
 import { Button, TextField } from '@material-ui/core';
 
 import styles from './SimpleAuth.module.scss';
+import useUser from '../../../hooks/api/getters/useUser/useUser';
 
 const SimpleAuth = ({ insecureLogin, history, authDetails }) => {
     const [email, setEmail] = useState('');
+    const { refetch } = useUser();
 
     const handleSubmit = evt => {
         evt.preventDefault();
         const user = { email };
         const path = evt.target.action;
 
-        insecureLogin(path, user).then(() => history.push(`/`));
+        insecureLogin(path, user).then(() => {
+            refetch();
+            history.push(`/`);
+        });
     };
 
     const handleChange = e => {

frontend/src/component/user/StandaloneBanner/StandaloneBanner.tsx

@@ -14,7 +14,6 @@ const StandaloneBanner: FC<IStandaloneBannerProps> = ({ title, children }) => {
     const theme = useTheme();
     const styles = useStyles();
     const smallScreen = useMediaQuery(theme.breakpoints.down('sm'));
-    console.log(smallScreen);
 
     return (
         <Gradient