Rename props

src/components/AuthUser/SignInForm/InputField.tsx

@@ -3,19 +3,25 @@ import { TextField } from '@material-ui/core';
 import { Control, Controller, FieldValues } from 'react-hook-form';
 
 type Props = {
-  id: string;
+  /**
+   * Name of the elemement. ex. email, password
+   */
+  name: string;
   label: string;
   error: boolean;
   errorMessage: string;
+  /**
+   * react-hook-form control
+   */
   control: Control<FieldValues> | undefined;
   rules: Partial<unknown>;
 };
 
 export const InputField: FC<Props> = (props: Props) => {
-  const { id, label, error, errorMessage, control, rules } = props;
+  const { name, label, error, errorMessage, control, rules } = props;
   return (
     <Controller
-      name={id}
+      name={name}
       control={control}
       rules={rules}
       render={({ onChange, value }) => (
@@ -24,12 +30,12 @@ export const InputField: FC<Props> = (props: Props) => {
           margin="normal"
           required
           fullWidth
-          id={id}
+          id={name}
           label={label}
-          name={id}
+          name={name}
           onChange={onChange}
           value={value}
-          autoComplete={id}
+          autoComplete={name}
           autoFocus
           error={error}
           helperText={error && errorMessage}

src/components/AuthUser/SignInForm/SignInForm.tsx

@@ -62,7 +62,7 @@ export const SignInForm: FC = () => {
         data-testid="Form"
       >
         <InputField
-          id="email"
+          name="email"
           control={control}
           rules={{
             validate: (value: string) =>
@@ -78,7 +78,7 @@ export const SignInForm: FC = () => {
         />
 
         <InputField
-          id="password"
+          name="password"
           control={control}
           rules={{
             minLength: 8,