import React, { useEffect } from 'react';
import { inject, observer } from 'mobx-react';
import { useRouter } from 'next/router';
import { useSnackbar } from 'notistack';
import Authentication from 'store/authentication';

type AuthenticationStatusProps = {
  authentication?: Authentication;
};

const AuthenticationStatus = inject('authentication')(
  observer(({ authentication }: AuthenticationStatusProps) => {
    const router = useRouter();
    const isFarsimiFlow = router?.pathname?.includes('farsimi');
    const { enqueueSnackbar } = useSnackbar();
    useEffect(() => {
      const handle = setInterval(() => {
        if (!authentication?.isTokenValid && !isFarsimiFlow) {
          enqueueSnackbar('Auðkenning er runnin út', {
            variant: 'warning',
            persist: true,
            action: () => <button onClick={() => authentication?.refresh()}>Endurauðkenna</button>,
            preventDuplicate: true,
          });
          clearInterval(handle);
        }
      }, 30000);
      return () => {
        clearInterval(handle);
      };
    }, []);
    return <></>;
  }),
);

export default AuthenticationStatus;