error msg is back

client/src/actions.ts

@@ -20,11 +20,19 @@ const api = axios.create({
   withCredentials: true
 });
 
-// Add a response interceptor
+// axios.interceptors.request.use(function onReq(config) {
+//     return config;
+// }, function onError(error) {
+//     // console.error(error);
+//     Promise.resolve(['Network Error', null]);
+// });
+
 api.interceptors.response.use(function onSuccess(response) {
     return [null, response.data];
 }, function onError(error) {
-    return [error.response.data.error, null];
+    // console.error(error);
+    if (error.response) return [error.response.data.error, null];
+    if (error.request) return ['Network Error', null];
 });
 
 const actions = {

client/src/app.tsx

@@ -20,6 +20,7 @@ function App() {
     useEffect(() => {
         async function getLogin() {
             const [error, user] = await actions.getLogin();
+            console.log(error, user);
             if (error) return route('/login');
             setUser(user);
             route('/search');

client/src/routes/login.tsx

@@ -7,17 +7,17 @@ const Login = ({ success }) => {
     const [email, setEmail] = useState('')
     const [password, setPassword] = useState('');
     const [confirmPassword, setConfirmPassword] = useState('');
+    const [error, setError] = useState('');
 
     async function postLogin() {
         const [error, user] = await actions.postLogin(email, password);
-        console.log(error, user);
-        if (error) return console.warn(error);
+        if (error) return setError(error);
         success(user);
     }
 
     async function postRegister() {
         const [error, user] = await actions.postRegister(email, password);
-        if (error) return console.warn(error);
+        if (error) return setError(error);
         success(user);
     }
 
@@ -27,8 +27,13 @@ const Login = ({ success }) => {
         if (mode === 'register') return postRegister();
     }
 
+    const errorEl = error
+        ? <div class='alt-text'>{error}</div>
+        : null;
+
     if (mode === 'register') return (
         <div class="login">
+            {errorEl}
             <form action="">
                 <div class="item">
                     <label for="email">email</label>
@@ -53,6 +58,7 @@ const Login = ({ success }) => {
 
     return (
         <div class="login">
+            {errorEl}
             <form action="">
                 <div class="item">
                     <label for="email">email</label>
@@ -66,7 +72,6 @@ const Login = ({ success }) => {
                     <input type="submit" value="login" onClick={handleSubmit} />
                 </div>
             </form>
-
             <button onClick={() => setMode('register')} >Click to register</button>
         </div>
     );