diff --git a/src/components/SEO/SEO.tsx b/src/components/SEO/SEO.tsx index 7918434..c42d25b 100644 --- a/src/components/SEO/SEO.tsx +++ b/src/components/SEO/SEO.tsx @@ -13,6 +13,7 @@ type Metadata = { tags?: string[] pagePath?: string date?: string | null + contentType?: LPE.PostType } const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL ?? 'https://press.logos.co' @@ -29,13 +30,14 @@ export default function SEO({ tags = ['Logos Press Engine', 'Logos Press', 'Logos'], pagePath = '', date, + contentType, }: Metadata) { const ogSearchParams = new URLSearchParams() title && ogSearchParams.set('title', title) image?.url && ogSearchParams.set('image', image?.url || '') image?.alt && ogSearchParams.set('alt', image?.alt || '') - type && ogSearchParams.set('type', type || 'article') + contentType && ogSearchParams.set('contentType', contentType) date && ogSearchParams.set('date', date || '') const ogUrl = `${imageUrl}?${ogSearchParams.toString()}` diff --git a/src/components/ShareButton/ShareButton.tsx b/src/components/ShareButton/ShareButton.tsx index 65ed437..a16bfce 100644 --- a/src/components/ShareButton/ShareButton.tsx +++ b/src/components/ShareButton/ShareButton.tsx @@ -9,10 +9,9 @@ import { useClickAway } from 'react-use' type Props = { url: string - title?: string } -export default function ShareButton({ url, title }: Props) { +export default function ShareButton({ url }: Props) { const [showOptions, setShowOptions] = useState(false) const [copied, setCopied] = useState(false) const ref = useRef(null) diff --git a/src/pages/api/og.tsx b/src/pages/api/og.tsx index 642e7cc..605721e 100644 --- a/src/pages/api/og.tsx +++ b/src/pages/api/og.tsx @@ -1,3 +1,4 @@ +import { LPE } from '@/types/lpe.types' import { ImageResponse } from '@vercel/og' import { handleMethodNotAllowedResponse } from 'next/dist/server/future/route-modules/helpers/response-handlers' import { NextRequest } from 'next/server' @@ -14,7 +15,7 @@ export default async function handler(request: NextRequest) { const title = searchParams.get('title') const image = searchParams.get('image') || '' const alt = searchParams.get('alt') || '' - const type = searchParams.get('type') || 'article' + const contentType = searchParams.get('contentType') const date = searchParams.get('date') const imgSrc = image @@ -25,8 +26,20 @@ export default async function handler(request: NextRequest) { date && new Date(date).toLocaleString('default', { month: 'short' }) const year = date && new Date(date).getUTCFullYear() + const titleMaxLength = 66 + return new ImageResponse( - type === 'article' ? ( + contentType === LPE.PostTypes.Podcast ? ( + {alt} + ) : (
- {title} + {title && title.length < titleMaxLength + ? title + : title?.substring(0, titleMaxLength) + '...'}
- {type && ( + {contentType && (
-

{type}

+

{contentType}

{date &&

} {date &&

{`${day} ${month} ${year}`}

}
@@ -115,17 +130,6 @@ export default async function handler(request: NextRequest) { )} - ) : ( - {alt} ), { width: 1200, diff --git a/src/pages/article/[slug].tsx b/src/pages/article/[slug].tsx index 1829f4c..52769b5 100644 --- a/src/pages/article/[slug].tsx +++ b/src/pages/article/[slug].tsx @@ -31,6 +31,7 @@ const ArticlePage = ({ data, errors, why }: ArticleProps) => { ...data.data.tags, ...data.data.authors.map((author) => author.name), ]} + contentType={LPE.PostTypes.Article} /> diff --git a/src/pages/podcasts/[showSlug]/[epSlug].tsx b/src/pages/podcasts/[showSlug]/[epSlug].tsx index e72b52b..3bcdcc4 100644 --- a/src/pages/podcasts/[showSlug]/[epSlug].tsx +++ b/src/pages/podcasts/[showSlug]/[epSlug].tsx @@ -32,7 +32,7 @@ const EpisodePage = ({ episode, relatedEpisodes, errors }: EpisodeProps) => { ...episode.tags, ...episode.authors.map((author) => author.name), ]} - type="episode" + contentType={LPE.PostTypes.Podcast} />