import React, { useEffect, useState } from 'react';
import { LoaderContainer, CircularProgress } from '@digigov/ui/app/Loader';
import { Paragraph } from '@digigov/ui/typography/Paragraph';
export const AccessibilityLoader = (_: any) => {
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    // Unmount after 8 seconds to trigger "Η φόρτωση ολοκληρώθηκε!" text
    const timer = setTimeout(() => {
      setLoading(false);
    }, 8000);
    return () => clearTimeout(timer);
  }, []);

  return (
    <LoaderContainer>
      {loading && (
        <CircularProgress
          loadingText="Γίνεται φόρτωση"
          loadingFinishedText="Η φόρτωση ολοκληρώθηκε"
        />
      )}
      {!loading && <Paragraph> Η φόρτωση ολοκληρώθηκε!</Paragraph>}
    </LoaderContainer>
  );
};
export default AccessibilityLoader;
