diff --git a/src/App.css b/src/App.css
new file mode 100644
index 0000000..94d599d
--- /dev/null
+++ b/src/App.css
@@ -0,0 +1,9 @@
+#QRFlex{
+ width: 30%;
+}
+
+@media only screen and (max-width: 600px) {
+ #QRFlex {
+ width: 90% ;
+ }
+}
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index 15e0140..d408765 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,6 +4,8 @@ import { Redirect, Route, Switch } from 'react-router-dom';
import Home from './screens/HomeScreen';
import Login from './screens/LoginScreen';
import Create from './screens/CreateScreen';
+import Success from './screens/SuccessScreen';
+import './App.css';
function App() {
return (
@@ -18,6 +20,9 @@ function App() {
+
+
+
diff --git a/src/screens/CreateScreen.js b/src/screens/CreateScreen.js
index a27553c..8edbcd5 100644
--- a/src/screens/CreateScreen.js
+++ b/src/screens/CreateScreen.js
@@ -1,4 +1,4 @@
-import { FormControl, Box, Flex, Image, FormLabel, Input, Select, Heading, Button, useToast } from '@chakra-ui/react';
+import { Button, Flex, FormControl, FormLabel, Heading, Input, Select, useToast } from '@chakra-ui/react';
import axios from 'axios';
import { useState } from 'react';
import { useDispatch } from 'react-redux';
diff --git a/src/screens/HomeScreen.js b/src/screens/HomeScreen.js
index 86c432f..a3c750a 100644
--- a/src/screens/HomeScreen.js
+++ b/src/screens/HomeScreen.js
@@ -1,4 +1,4 @@
-import { Box, Flex, Image } from '@chakra-ui/react';
+import { Box, Center, Flex, Image, Spinner, Text } from '@chakra-ui/react';
import axios from 'axios';
import { React, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
@@ -10,6 +10,7 @@ function QRCode() {
const dispatch = useDispatch();
if (!url) {
+ setURL("none");
axios
.get(`${process.env.REACT_APP_API_URL}/code`, { withCredentials: true })
.then(response => {
@@ -22,13 +23,12 @@ function QRCode() {
dispatch(authLogout());
}
});
- }
-
- if (url) {
+ } else if(url === "none"){
+ return
+ }else {
return ;
- } else {
- return ;
}
+
}
function Home() {
@@ -42,8 +42,9 @@ function Home() {
alignItems="center"
justifyContent="center"
>
-
-
+
+
+ This is your QR code. Show this to others to allow them to confirm a contact, or allow them to create an account!
);
diff --git a/src/screens/LoginScreen.js b/src/screens/LoginScreen.js
index 35dcafa..df4e0fa 100644
--- a/src/screens/LoginScreen.js
+++ b/src/screens/LoginScreen.js
@@ -36,6 +36,13 @@ function Login() {
return;
}
+ toast({
+ title: 'Loading',
+ status: 'info',
+ duration: 9000,
+ isClosable: true,
+ });
+
axios
.post(
`${process.env.REACT_APP_API_URL}/login`,
@@ -109,14 +116,6 @@ function Login() {
Login!
-
-
);
diff --git a/src/screens/SuccessScreen.js b/src/screens/SuccessScreen.js
new file mode 100644
index 0000000..e4960c5
--- /dev/null
+++ b/src/screens/SuccessScreen.js
@@ -0,0 +1,23 @@
+import { Button, Flex, Heading, Text } from "@chakra-ui/react";
+import { useHistory } from "react-router-dom";
+
+function Success(){
+ const history = useHistory();
+
+ return (
+
+
+ Success!
+ We have succesfully saved your contact! Stay safe out there!
+
+
+
+ );
+}
+
+export default Success;
\ No newline at end of file