diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-01-27 11:43:33 +0100 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-01-27 11:43:33 +0100 |
| commit | e9c68e4b3ddcfe638bc611f421d55f372e0100e9 (patch) | |
| tree | add5778b0eea6879cb49bbd4bbf9164479ece8e8 /src/pages | |
| parent | 44a72320927ee3752ae600829c0c618b68e0f19d (diff) | |
fix(project): make sure the project cover is displayed
Next.js does not support the dynamic import of images. Sometimes the
images was displayed and other times the loading did not finish. So
even if I would like to keep the content in a same place, I choose to
put the projects covers inside the public directory. Then I use a
hasCover boolean to determine if the project cover need to be printed.
Diffstat (limited to 'src/pages')
| -rw-r--r-- | src/pages/projet/[slug].tsx | 8 |
1 files changed, 4 insertions, 4 deletions
diff --git a/src/pages/projet/[slug].tsx b/src/pages/projet/[slug].tsx index 7ae50d6..b6a9cf2 100644 --- a/src/pages/projet/[slug].tsx +++ b/src/pages/projet/[slug].tsx @@ -31,7 +31,7 @@ const Project: NextPageWithLayout<ProjectProps> = ({ }) => { const router = useRouter(); const projectUrl = `${config.url}${router.asPath}`; - const { cover, id, intro, meta, title, seo } = project; + const { id, intro, meta, title, seo } = project; const dates = { publication: meta.publishedOn, update: meta.updatedOn, @@ -76,8 +76,8 @@ const Project: NextPageWithLayout<ProjectProps> = ({ dateModified: updateDate.toISOString(), datePublished: publicationDate.toISOString(), editor: { '@id': `${config.url}/#branding` }, - thumbnailUrl: cover, - image: cover, + thumbnailUrl: meta.hasCover ? `/projects/${id}.jpg` : '', + image: meta.hasCover ? `/projects/${id}.jpg` : '', inLanguage: config.locales.defaultLocale, license: 'https://creativecommons.org/licenses/by-sa/4.0/deed.fr', mainEntityOfPage: { '@id': `${projectUrl}` }, @@ -111,7 +111,7 @@ const Project: NextPageWithLayout<ProjectProps> = ({ <ToC /> </Sidebar> <div className={styles.body}> - <ProjectSummary title={title} cover={cover} meta={meta} /> + <ProjectSummary id={id} title={title} meta={meta} /> <ProjectContent components={components} /> </div> <Sidebar position="right"> |