diff --git a/src/components/AuthUser/SignInForm/SignInForm.tsx b/src/components/AuthUser/SignInForm/SignInForm.tsx
index 833d4cd74322eac277d3a9295a0136c464173e80..0e63a94b93b648f823be50ea0af4616e3a5c7a4a 100644
--- a/src/components/AuthUser/SignInForm/SignInForm.tsx
+++ b/src/components/AuthUser/SignInForm/SignInForm.tsx
@@ -1,28 +1,11 @@
 import React, { FC } from 'react';
 import axios from 'axios';
 import { SubmitHandler, useForm } from 'react-hook-form';
-import { createStyles, makeStyles, Theme } from '@material-ui/core/styles';
 import { Button } from '@material-ui/core';
 import { InputField } from 'components/AuthUser/SignInForm/InputField/InputField';
 import { useHistory } from 'react-router-dom';
 import { AuthRoutes } from 'components/api/routes';
-
-const useStyles = makeStyles((theme: Theme) =>
-  createStyles({
-    root: {
-      '& > *': {
-        margin: theme.spacing(0),
-      },
-    },
-    form: {
-      width: '100%', // Fix IE 11 issue.
-      marginTop: theme.spacing(1),
-    },
-    submit: {
-      margin: theme.spacing(3, 0, 2),
-    },
-  }),
-);
+import { useStyles } from './useStyles';
 
 export const SignInForm: FC = () => {
   const history = useHistory();
diff --git a/src/components/AuthUser/SignInForm/useStyles.ts b/src/components/AuthUser/SignInForm/useStyles.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4a510bf92bf7cffee0efce3aebfd00998f44a3be
--- /dev/null
+++ b/src/components/AuthUser/SignInForm/useStyles.ts
@@ -0,0 +1,18 @@
+import { createStyles, makeStyles, Theme } from '@material-ui/core/styles';
+
+export const useStyles = makeStyles((theme: Theme) =>
+  createStyles({
+    root: {
+      '& > *': {
+        margin: theme.spacing(0),
+      },
+    },
+    form: {
+      width: '100%', // Fix IE 11 issue.
+      marginTop: theme.spacing(1),
+    },
+    submit: {
+      margin: theme.spacing(3, 0, 2),
+    },
+  }),
+);