-Fixed double loading of QR code

- successful acc creation redirects to success screen instead of home screen
- close all toasts upon login

src/screens/CreateScreen.js

@@ -63,7 +63,7 @@ function Create() {
             .then(response => {
                 if (response.data.success) {
                     dispatch(authLogin());
-                    history.push('/home');
+                    history.push('/success');
                 } else {
                     toast({
                         title: 'An error occurred',

src/screens/HomeScreen.js

@@ -1,6 +1,6 @@
 import { Flex, Image, Spinner, Text } from '@chakra-ui/react';
 import axios from 'axios';
-import { React, useState } from 'react';
+import { React, useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { Redirect } from 'react-router-dom';
 import { authLogout } from '../features/auth/authSlice';
@@ -9,8 +9,7 @@ function QRCode() {
   const [url, setURL] = useState(null);
   const dispatch = useDispatch();
 
-  if (!url) {
-    setURL("none");
+  useEffect(() => {
     axios
       .get(`${process.env.REACT_APP_API_URL}/code`, { withCredentials: true })
       .then(response => {
@@ -23,10 +22,12 @@ function QRCode() {
           dispatch(authLogout());
         }
       });
-  } else if(url === "none"){
-    return <Spinner/>
-  }else {
+  }, [])
+
+  if (url) {
     return <Image src={url} />;
+  } else {
+    return <Spinner />;
   }
 
 }
@@ -43,8 +44,8 @@ function Home() {
       justifyContent="center"
     >
       <Flex direction="column" background="white" p={12} rounded={6} id="QRFlex">
-          <QRCode />
-          <Text align="center" fontSize="lg">This is your QR code. Show this to others to allow them to confirm a contact, or allow them to create an account!</Text>
+        <QRCode />
+        <Text align="center" fontSize="lg">This is your QR code. Show this to others to allow them to confirm a contact, or allow them to create an account!</Text>
       </Flex>
     </Flex>
   );

src/screens/LoginScreen.js

@@ -21,7 +21,7 @@ function Login() {
 
   const isAuthenticated = useSelector(state => state.auth.isAuthenticated);
   if (isAuthenticated) return <Redirect to="/home" />;
-
+  
   const handleSubmit = e => {
     if (!email | !password) {
       toast({
@@ -74,7 +74,8 @@ function Login() {
           duration: 9000,
           isClosable: true,
         });
-      });
+      })
+      .finally(() => { toast.closeAll(); });
 
     e.preventDefault();
   };

src/screens/SuccessScreen.js

@@ -13,7 +13,7 @@ function Success(){
         >
           <Flex direction="column" background="white" p={12} rounded={6}>
             <Heading>Success!</Heading>
-            <Text fontSize="lg">We have succesfully saved your contact! Stay safe out there!</Text>
+            <Text fontSize="lg">We have succesfully saved your contact! Stay safe out there, and let others scan your QR code too!</Text>
             <Button onClick={()=>{history.push("/home")}}>Return home</Button>
           </Flex>
         </Flex>