import React from 'react';
import {
  Breadcrumbs,
  BreadcrumbsList,
  BreadcrumbsListItem,
} from '@digigov/ui/navigation/Breadcrumbs';
import { LinkProvider } from '@digigov/ui/navigation/Link';

const CustomLink: React.FC<any> = (props) => {
  return <div>custom link: {props.children}</div>;
};

export const WithProvider = (_: any) => (
  <LinkProvider component={CustomLink}>
    <Breadcrumbs role="navigation">
      <BreadcrumbsList>
        <BreadcrumbsListItem href="#home">Αρχική</BreadcrumbsListItem>
        <BreadcrumbsListItem href="#health">
          Υγεία και πρόνοια
        </BreadcrumbsListItem>
        <BreadcrumbsListItem href="#records">
          Φάκελος υγείας
        </BreadcrumbsListItem>
        <BreadcrumbsListItem ariaCurrent="page">
          Άυλη συνταγογράφηση
        </BreadcrumbsListItem>
      </BreadcrumbsList>
    </Breadcrumbs>
  </LinkProvider>
);

export default WithProvider;