import { config } from '@config/website';
import { t } from '@lingui/macro';
import Head from 'next/head';
import Link from 'next/link';
import { useRouter } from 'next/router';
import { BreadcrumbList, WithContext } from 'schema-dts';
import styles from './Breadcrumb.module.scss';
const Breadcrumb = ({ pageTitle }: { pageTitle: string }) => {
const router = useRouter();
const isHome = router.pathname === '/';
const isArticle = router.pathname.includes('/article/');
const isProject = router.pathname.includes('/projet/');
const isSubject = router.pathname.includes('/sujet/');
const isThematic = router.pathname.includes('/thematique/');
const getItems = () => {
return (
<>
{t`Home`}
{(isArticle || isThematic || isSubject) && (
<>
{t`Blog`}
)}
{isProject && (
<>
{t`Projects`}
)}
{pageTitle}
);
};
const getElementsSchema = () => {
const items = [];
const homepage: BreadcrumbList['itemListElement'] = {
'@type': 'ListItem',
position: 1,
name: t`Home`,
item: config.url,
};
items.push(homepage);
if (isArticle || isThematic || isSubject) {
const blog: BreadcrumbList['itemListElement'] = {
'@type': 'ListItem',
position: 2,
name: t`Blog`,
item: `${config.url}/blog`,
};
items.push(blog);
}
if (isProject) {
const blog: BreadcrumbList['itemListElement'] = {
'@type': 'ListItem',
position: 2,
name: t`Projects`,
item: `${config.url}/projets`,
};
items.push(blog);
}
const currentPage: BreadcrumbList['itemListElement'] = {
'@type': 'ListItem',
position: items.length + 1,
name: pageTitle,
item: `${config.url}${router.asPath}`,
};
items.push(currentPage);
return items;
};
const schemaJsonLd: WithContext = {
'@context': 'https://schema.org',
'@type': 'BreadcrumbList',
'@id': `${config.url}/#breadcrumb`,
itemListElement: getElementsSchema(),
};
return (
<>
{!isHome && (
)}
);
};
export default Breadcrumb;