import React, { useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { AbsoluteCenter, Box, Spinner } from '@chakra-ui/react';

import LayoutArm from '../../components/LayoutArm';
import authLogin from '../../keycloak';
import { URLs } from '../../__data__/urls';

const Page = () => {
  const [user, setUser] = useState(null);

  const navigate = useNavigate();

  useEffect(() => {
    authLogin({ redirect: () => navigate(URLs.landing.url) }).then((user) =>
      setUser(user),
    );
  }, []);

  if (!user)
    return (
      <Box position='relative' height='100vh'>
        <AbsoluteCenter>
          <Spinner />
        </AbsoluteCenter>
      </Box>
    );

  return <LayoutArm />;
};

export default Page;