Fix axios error handling

src/App.tsx

@@ -15,13 +15,12 @@ function App(): React.ReactElement {
     <QueryClientProvider client={queryClient}>
       <ClientContextProvider>
         <UserStateProvider>
-          <RememberMe>
           <ThemeProvider theme={darkTheme}>
             <Router>
+              <RememberMe />
               <Routes />
             </Router>
           </ThemeProvider>
-          </RememberMe>
         </UserStateProvider>
       </ClientContextProvider>
     </QueryClientProvider>

src/client/auth.ts

-import Axios, { AxiosRequestConfig } from 'axios';
+import Axios, { AxiosError, AxiosRequestConfig } from 'axios';
 import type { ProfileWithStatus } from '../context';
 import { IProfile } from '../types/Profile';
 
@@ -22,9 +22,16 @@ export function auth(config: AxiosRequestConfig): AuthClient {
   });
 
   const me: MeQuery = async (): Promise<ProfileWithStatus> => {
+    try {
       const profileResp = await axios.get<IProfile>('/users/me');
-    const isLoggedIn = profileResp.status === 404 || profileResp.status === 200;
+      const isLoggedIn =
+        profileResp.status === 404 || profileResp.status === 200 || profileResp.status === 403;
       return { profile: profileResp.data, isLoggedIn };
+    } catch (e) {
+      const err = e as AxiosError;
+      const isLoggedIn = (err.response?.status === 404 || err.response?.status === 403) ?? false;
+      return { profile: undefined, isLoggedIn };
+    }
   };
 
   const register: RegisterQuery = async (data: ProfileData): Promise<any> => {

src/components/Header.tsx

@@ -161,7 +161,7 @@ const Header: React.FC<HeaderProps> = ({ customToolbar, menuItems = MENU_ITEMS }
             </Tabs>
           </Grid>
 
-          {!isNil(profile) ? (
+          {!isNil(profile) && profile.profile ? (
             <>
               <IconButton size="medium">
                 <Badge color="error">

src/components/ProfileForm.tsx

@@ -3,16 +3,18 @@ import { Avatar, Box, Button, Container, Typography } from '@material-ui/core';
 import { Field, Form, Formik } from 'formik';
 import { isNil } from 'lodash';
 import React from 'react';
+import { useHistory } from 'react-router';
 import useRegister from '../hooks/useRegister';
 import StyledTextField from './StyledTextField';
 
 type FormValues = {
-  roomNumber: number | undefined;
+  roomNumber: string | undefined;
   studentCardNumber: string;
 };
 
 const ProfileForm: React.FC = () => {
   const { mutate: register } = useRegister();
+  const history = useHistory();
   return (
     <Container
       style={{
@@ -22,10 +24,12 @@ const ProfileForm: React.FC = () => {
       }}
     >
       <Formik
-        initialValues={{ roomNumber: undefined, studentCardNumber: '' } as FormValues}
-        onSubmit={({ roomNumber, studentCardNumber }): void => {
+        initialValues={{ roomNumber: '', studentCardNumber: '' } as FormValues}
+        onSubmit={async ({ roomNumber, studentCardNumber }): Promise<void> => {
           if (!isNil(roomNumber) && !isNil(studentCardNumber)) {
-            register({ roomNumber, studentCardNumber });
+            await register({ roomNumber: Number(roomNumber), studentCardNumber });
+            // nem a legszebb de egyelőre jó lesz
+            history.push('/');
           }
         }}
       >
@@ -52,7 +56,8 @@ const ProfileForm: React.FC = () => {
             <Box my={1}>
               <Field
                 as={StyledTextField}
-                name="roomNumber"
+                id="studentCardNumber"
+                name="studentCardNumber"
                 label="Diákigazolvány szám"
                 variant="outlined"
                 color="primary"
@@ -62,8 +67,10 @@ const ProfileForm: React.FC = () => {
             </Box>
             <Box my={1}>
               <Field
-                component={StyledTextField}
-                name="studentCardNumber"
+                as={StyledTextField}
+                id="roomNumber"
+                name="roomNumber"
+                type="number"
                 label="Szobaszám"
                 variant="outlined"
                 color="secondary"