import React from 'react';

import {
  Accordion,
  AccordionSection,
  AccordionSectionContent,
  AccordionSectionSummary,
  AccordionSectionSummaryHeading,
} from '@digigov/ui/content/Accordion';

import { List } from '@digigov/ui/content/List/List';
import { ListItem } from '@digigov/ui/content/List/ListItem';
import { Link } from '@digigov/ui/navigation/Link';
import { Paragraph } from '@digigov/ui/typography/Paragraph';

export const UsingArrowIcons = (_: any) => (
  <Accordion>
    <AccordionSection open>
      <AccordionSectionSummary>
        <AccordionSectionSummaryHeading
          aria-controls="content1"
          variant="arrows"
        >
          Διαφορές με το δημόσιο
        </AccordionSectionSummaryHeading>
      </AccordionSectionSummary>
      <AccordionSectionContent id="content1">
        <Paragraph>
          Παρακάτω μπορείτε να δείτε την διαθέσιμη και ενεργή υπηρεσία που αφορά
          το επιλεγμένο γεγονός ζωής.
        </Paragraph>
        <List>
          <ListItem>
            <Link>
              Αίτηση εξώδικης αναγνώρισης απαιτήσεων / συμβιβαστικής επίλυσης
              διαφορών με το Δημόσιο
            </Link>
          </ListItem>
        </List>
      </AccordionSectionContent>
    </AccordionSection>
    <AccordionSection>
      <AccordionSectionSummary>
        <AccordionSectionSummaryHeading
          aria-controls="content2"
          variant="arrows"
        >
          Δικαστήρια
        </AccordionSectionSummaryHeading>
      </AccordionSectionSummary>
      <AccordionSectionContent id="content2">
        <Paragraph>
          Στη λίστα παρακάτω μπορείτε να δείτε τις υπηρεσίες που αφορούν το
          επιλεγμένο γεγονός ζωής, κατηγοριοποιημένες σε ομάδες υπηρεσιών.
        </Paragraph>
        <List>
          <ListItem>
            <Link>Ενιαίο πιστοποιητικό δικαστικής φερεγγυότητας</Link>
          </ListItem>
          <ListItem>
            <Link>Ηλεκτρονικές δικαστικές αποφάσεις</Link>
          </ListItem>
          <ListItem>
            <Link>Πιστοποιητικά δικαστηρίων</Link>
          </ListItem>
        </List>
      </AccordionSectionContent>
    </AccordionSection>
    <AccordionSection>
      <AccordionSectionSummary>
        <AccordionSectionSummaryHeading
          aria-controls="content3"
          variant="arrows"
        >
          Δικόγραφα
        </AccordionSectionSummaryHeading>
      </AccordionSectionSummary>
      <AccordionSectionContent id="content3">
        <Paragraph>
          Στη λίστα παρακάτω μπορείτε να δείτε τις υπηρεσίες που αφορούν το
          επιλεγμένο γεγονός ζωής.
        </Paragraph>
        <List>
          <ListItem>
            <Link>Αντίγραφο πρακτικών υπόθεσης</Link>
          </ListItem>
          <ListItem>
            <Link>
              Ηλεκτρονική κατάθεση δικογράφων (Πολιτικά / Ποινικά Δικαστήρια)
            </Link>
          </ListItem>
        </List>
      </AccordionSectionContent>
    </AccordionSection>
  </Accordion>
);

export default UsingArrowIcons;