Move out api call and type.

src/components/Auth/SignUpForm/SignUpForm.tsx

 import React, { FC } from 'react';
 import { SubmitHandler, useForm } from 'react-hook-form';
-import {
-  Button,
-  responsiveFontSizes,
-  Grid,
-  Typography,
-  Link,
-  Hidden,
-} from '@material-ui/core';
+import { Button, Grid, Typography, Link, Hidden } from '@material-ui/core';
 import { NonAuthRoutes } from 'api/routes';
 import axios from 'axios';
 import { InputField } from 'components/Auth/InputField/InputField';
+import { registerSenior } from 'api/registerSenior';
+import { RegisterSeniorType } from 'types/RegisterSeniorType';
 import { signUpFormStyle } from './SignUpForm.style';
 
 export const SignUpForm: FC = () => {
-  type FormData = {
-    username: string;
-    password: string;
-    firstName: string;
-    lastName: string;
-    email: string;
-    phoneNumber: number;
-    address: number;
-    name: string;
-    memberCardNumber: number;
-    notes: string;
-  };
-
-  const { control, errors, handleSubmit } = useForm<FormData>();
+  const { control, errors, handleSubmit } = useForm<RegisterSeniorType>();
 
-  const onSubmit: SubmitHandler<FormData> = (values: FormData) => {
-    axios.post(
-      '/api/web/seniors/',
-      {
-        user: {
-          username: values.username,
-          password: values.password,
-          firstName: values.firstName,
-          lastName: values.lastName,
-          email: values.email,
-        },
-        phone_number: values.phoneNumber,
-        home_address: {
-          address: values.address,
-        },
-        member_card_issuer: {
-          name: values.memberCardNumber,
-        },
-        member_card_number: values.memberCardNumber,
-        notes: values.notes,
-      },
-      {
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      },
-    );
+  const onSubmit: SubmitHandler<RegisterSeniorType> = (
+    values: RegisterSeniorType,
+  ) => {
+    registerSenior(values);
   };
 
   const classes = signUpFormStyle();
@@ -77,7 +36,7 @@ export const SignUpForm: FC = () => {
         <Grid item container>
           <Grid item xs={12} md={5}>
             <InputField
-              name="firstName"
+              name="user.firstName"
               type="text"
               control={control}
               rules={{
@@ -88,7 +47,7 @@ export const SignUpForm: FC = () => {
                 },
               }}
               label="First name"
-              error={!!errors.firstName}
+              error={!!errors.user?.firstName}
               errorMessage="Insert valid first name"
             />
           </Grid>
@@ -99,7 +58,7 @@ export const SignUpForm: FC = () => {
 
           <Grid item xs={12} md={5}>
             <InputField
-              name="lastName"
+              name="user.lastName"
               type="text"
               control={control}
               rules={{
@@ -110,13 +69,13 @@ export const SignUpForm: FC = () => {
                 },
               }}
               label="Last name"
-              error={!!errors.lastName}
+              error={!!errors.user?.lastName}
               errorMessage="Insert valid last name"
             />
           </Grid>
 
           <InputField
-            name="address"
+            name="homeAddress.address"
             type="text"
             control={control}
             rules={{
@@ -126,7 +85,7 @@ export const SignUpForm: FC = () => {
               },
             }}
             label="Address"
-            error={!!errors.address}
+            error={!!errors.homeAddress?.address}
             errorMessage="Insert valid address"
           />
 
@@ -188,7 +147,7 @@ export const SignUpForm: FC = () => {
           </Grid>
 
           <InputField
-            name="username"
+            name="user.username"
             type="text"
             control={control}
             rules={{
@@ -199,12 +158,12 @@ export const SignUpForm: FC = () => {
               },
             }}
             label="Username"
-            error={!!errors.username}
+            error={!!errors.user?.username}
             errorMessage="Insert valid username"
           />
 
           <InputField
-            name="email"
+            name="user.email"
             type="email"
             control={control}
             rules={{
@@ -216,12 +175,12 @@ export const SignUpForm: FC = () => {
               },
             }}
             label="Email"
-            error={!!errors.email}
+            error={!!errors.user?.email}
             errorMessage="Insert email"
           />
 
           <InputField
-            name="password"
+            name="user.password"
             type="password"
             control={control}
             rules={{
@@ -233,7 +192,7 @@ export const SignUpForm: FC = () => {
               },
             }}
             label="Password"
-            error={!!errors.password}
+            error={!!errors.user?.password}
             errorMessage="Insert valid password"
           />