AuthUser.tsx

import React, { FC, useEffect } from 'react';
import axios from 'axios';
import Container from '@material-ui/core/Container';
import { SignInForm } from './SignInForm/SignInForm';

export const AuthUser: FC = () => {
  useEffect(() => {
    axios
      .get('api/web/csrf')
      .then((response) => {
        // Check this https://stackoverflow.com/questions/39254562/csrf-with-django-reactredux-using-axios
        axios.defaults.headers.common['X-CSRFTOKEN'] = response.data.token;
      })
      .catch((error) => error);
  }, []);
  return (
    <Container maxWidth="sm">
      <SignInForm />
    </Container>
  );
};