import React from 'react';
import {
  Footer,
  FooterContainer,
  FooterInfo,
  FooterInfoSection,
  FooterContent,
  FooterContentLogos,
  FooterImage,
} from '@digigov/ui/app/Footer';
import Copyright from '@digigov/ui/govgr/Footer/Copyright';
import HellenicRepublicLogo from '@digigov/ui/govgr/Footer/HellenicRepublicLogo';
import govgrBlueLogo from '@digigov/ui/govgr/images/govgr-logo-blue-base64';
import mineduBlackLogo from '@digigov/ui/govgr/images/minedu-logo-black-base64';
import Link from '@digigov/ui/navigation/Link';
import VisuallyHidden from '@digigov/ui/utils/VisuallyHidden';

export const FooterWithLogo = (_: any) => {
  return (
    <Footer>
      <FooterContainer>
        <FooterInfo>
          <FooterInfoSection aria-label="footer info section">
            <FooterContent>
              <FooterContentLogos>
                <FooterImage src={govgrBlueLogo}></FooterImage>
                <FooterImage src={mineduBlackLogo}></FooterImage>
              </FooterContentLogos>
              <Copyright>
                {`Υλοποίηση από το `}
                <Link href="https://grnet.gr/" target="_blank">
                  ΕΔΥΤΕ
                  <VisuallyHidden>
                    {` (ανοίγει σε καινούρια καρτέλα)`}
                  </VisuallyHidden>
                </Link>
                {` για το `}
                <Link href="https://mindigital.gr/" target="_blank">
                  Υπουργείο Παιδείας και Θρησκευμάτων
                  <VisuallyHidden>
                    {` (ανοίγει σε καινούρια καρτέλα)`}
                  </VisuallyHidden>
                </Link>
              </Copyright>
            </FooterContent>
          </FooterInfoSection>
          <FooterInfoSection>
            <HellenicRepublicLogo />
          </FooterInfoSection>
        </FooterInfo>
      </FooterContainer>
    </Footer>
  );
};

export default FooterWithLogo;