52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { useDispatch } from 'react-redux';
|
|
|
|
import { METADATA } from '../constants';
|
|
import { PageType, setPageType, setPostTitle } from '../state/navigation';
|
|
import { IPost } from '../types/cms';
|
|
|
|
import { Article } from '../components/article/Article';
|
|
import CustomHead from './CustomHead';
|
|
|
|
interface Props {
|
|
post: IPost;
|
|
}
|
|
|
|
// Parallax on bg as mouse moves
|
|
export default function BlogPost(props: Props) {
|
|
const { post } = props;
|
|
const dispatch = useDispatch();
|
|
|
|
useEffect(() => {
|
|
if (post) {
|
|
dispatch(setPageType(PageType.POST));
|
|
dispatch(setPostTitle(post.title));
|
|
}
|
|
}, []);
|
|
|
|
return (
|
|
<>
|
|
<CustomHead
|
|
title={post?.title}
|
|
metadata={{
|
|
TYPE: METADATA.BLOG_PAGE.TYPE,
|
|
DESCRIPTION: post?.description,
|
|
OG_IMAGE: {
|
|
URL: post?.featureImage.imageUrl ?? METADATA.OG_IMAGE.URL,
|
|
WIDTH: Number(post?.featureImage?.width) ?? METADATA.OG_IMAGE.WIDTH,
|
|
HEIGHT:
|
|
Number(post?.featureImage?.height) ?? METADATA.OG_IMAGE.HEIGHT,
|
|
ALT: post?.featureImage?.title ?? METADATA.OG_IMAGE.ALT,
|
|
},
|
|
TAGS: post.tags,
|
|
ARTICLE_SECTION: post.tags[0],
|
|
PUBLISHED_TIME: post.publishedDateISO,
|
|
}}
|
|
/>
|
|
<div className="bg-alt">
|
|
<Article {...post} />
|
|
</div>
|
|
</>
|
|
);
|
|
}
|