Browse Source

-Fixed double loading of QR code

- successful acc creation redirects to success screen instead of home screen
- close all toasts upon login
feature/qrscanner
Nareshkumar Rao 3 years ago
parent
commit
23f4fef3b2
  1. 2
      src/screens/CreateScreen.js
  2. 17
      src/screens/HomeScreen.js
  3. 3
      src/screens/LoginScreen.js
  4. 2
      src/screens/SuccessScreen.js

2
src/screens/CreateScreen.js

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

17
src/screens/HomeScreen.js

@ -1,6 +1,6 @@
import { Flex, Image, Spinner, Text } from '@chakra-ui/react'; import { Flex, Image, Spinner, Text } from '@chakra-ui/react';
import axios from 'axios'; import axios from 'axios';
import { React, useState } from 'react';
import { React, useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { Redirect } from 'react-router-dom'; import { Redirect } from 'react-router-dom';
import { authLogout } from '../features/auth/authSlice'; import { authLogout } from '../features/auth/authSlice';
@ -9,8 +9,7 @@ function QRCode() {
const [url, setURL] = useState(null); const [url, setURL] = useState(null);
const dispatch = useDispatch(); const dispatch = useDispatch();
if (!url) {
setURL("none");
useEffect(() => {
axios axios
.get(`${process.env.REACT_APP_API_URL}/code`, { withCredentials: true }) .get(`${process.env.REACT_APP_API_URL}/code`, { withCredentials: true })
.then(response => { .then(response => {
@ -23,10 +22,12 @@ function QRCode() {
dispatch(authLogout()); dispatch(authLogout());
} }
}); });
} else if(url === "none"){
return <Spinner/>
}else {
}, [])
if (url) {
return <Image src={url} />; return <Image src={url} />;
} else {
return <Spinner />;
} }
} }
@ -43,8 +44,8 @@ function Home() {
justifyContent="center" justifyContent="center"
> >
<Flex direction="column" background="white" p={12} rounded={6} id="QRFlex"> <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>
</Flex> </Flex>
); );

3
src/screens/LoginScreen.js

@ -74,7 +74,8 @@ function Login() {
duration: 9000, duration: 9000,
isClosable: true, isClosable: true,
}); });
});
})
.finally(() => { toast.closeAll(); });
e.preventDefault(); e.preventDefault();
}; };

2
src/screens/SuccessScreen.js

@ -13,7 +13,7 @@ function Success(){
> >
<Flex direction="column" background="white" p={12} rounded={6}> <Flex direction="column" background="white" p={12} rounded={6}>
<Heading>Success!</Heading> <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> <Button onClick={()=>{history.push("/home")}}>Return home</Button>
</Flex> </Flex>
</Flex> </Flex>

Loading…
Cancel
Save