/* eslint-disable max-statements */
import type { GetStaticProps } from 'next';
import Head from 'next/head';
import NextImage from 'next/image';
import { useRouter } from 'next/router';
import Script from 'next/script';
import React, { type ReactNode } from 'react';
import { useIntl } from 'react-intl';
import {
getLayout,
Heading,
ImageWidget,
Link,
SocialMediaWidget,
Page,
PageHeader,
PageSidebar,
TocWidget,
PageBody,
} from '../components';
import { mdxComponents } from '../components/mdx';
import CVContent, { data, meta } from '../content/pages/cv.mdx';
import type { NextPageWithLayout } from '../types';
import { CONFIG } from '../utils/config';
import { PERSONAL_LINKS, ROUTES } from '../utils/constants';
import {
getSchemaJson,
getSinglePageSchema,
getWebPageSchema,
} from '../utils/helpers';
import { loadTranslation } from '../utils/helpers/server';
import { useBreadcrumb, useHeadingsTree } from '../utils/hooks';
const DownloadLink = (chunks: ReactNode) => (
{chunks}
);
/**
* CV page.
*/
const CVPage: NextPageWithLayout = () => {
const intl = useIntl();
const { ref, tree } = useHeadingsTree({ fromLevel: 2 });
const { dates, intro, seo, title } = meta;
const { items: breadcrumbItems, schema: breadcrumbSchema } = useBreadcrumb({
title,
url: ROUTES.CV,
});
const messages = {
image: {
caption: intl.formatMessage(
{
defaultMessage: 'Download the CV in PDF',
id: 'fN04AJ',
description: 'CVPage: download CV in PDF text',
},
{
link: DownloadLink,
}
),
title: intl.formatMessage({
defaultMessage: 'Others formats',
description: 'CVPage: cv preview widget title',
id: 'B9OCyV',
}),
},
socialMedia: {
github: intl.formatMessage({
defaultMessage: 'Github profile',
description: 'CVPage: Github profile link',
id: 'Jm0a6H',
}),
gitlab: intl.formatMessage({
defaultMessage: 'Gitlab profile',
description: 'CVPage: Gitlab profile link',
id: '++U2Hm',
}),
linkedin: intl.formatMessage({
defaultMessage: 'LinkedIn profile',
description: 'CVPage: LinkedIn profile link',
id: 'Sm2wCk',
}),
title: intl.formatMessage({
defaultMessage: 'Open-source projects',
description: 'CVPage: social media widget title',
id: '+Dre5J',
}),
},
toc: {
title: intl.formatMessage({
defaultMessage: 'Table of Contents',
description: 'PageLayout: table of contents title',
id: 'eys2uX',
}),
},
};
const { asPath } = useRouter();
const webpageSchema = getWebPageSchema({
description: seo.description,
locale: CONFIG.locales.defaultLocale,
slug: asPath,
title: seo.title,
updateDate: dates.update,
});
const cvSchema = getSinglePageSchema({
cover: data.image.src,
dates,
description: intro,
id: 'cv',
kind: 'about',
locale: CONFIG.locales.defaultLocale,
slug: asPath,
title,
});
const schemaJsonLd = getSchemaJson([webpageSchema, cvSchema]);
const page = {
title: `${seo.title} - ${CONFIG.name}`,
url: `${CONFIG.url}${asPath}`,
};
return (
{page.title}
{/*eslint-disable-next-line react/jsx-no-literals -- Name allowed */}
{/*eslint-disable-next-line react/jsx-no-literals -- Content allowed */}
{messages.toc.title}}
tree={tree}
/>
{messages.image.title}
}
img={}
/>
{messages.socialMedia.title}
}
media={[
{
icon: 'Github',
id: 'github',
label: messages.socialMedia.github,
url: PERSONAL_LINKS.GITHUB,
},
{
icon: 'Gitlab',
id: 'gitlab',
label: messages.socialMedia.gitlab,
url: PERSONAL_LINKS.GITLAB,
},
]}
/>
);
};
CVPage.getLayout = (page) => getLayout(page);
export const getStaticProps: GetStaticProps = async ({ locale }) => {
const translation = await loadTranslation(locale);
return {
props: {
translation,
},
};
};
export default CVPage;