article page input data refactoring

pages/article/[slug].tsx

@@ -4,12 +4,13 @@ import { App } from 'src/components/App'
 import { Article } from 'src/components/Article'
 import { Html } from 'src/components/Html'
 import { Meta } from 'src/components/Meta'
-import { meta } from 'src/lib/meta'
+import { meta, MetaBuilder } from 'src/lib/meta'
 import { createApiUrl, requestGet, IResponseItems } from 'src/next-lib'
 import { NextPage } from 'next'
 import { IArticle } from 'src/types'
 
 type Props = {
+    title: string
     meta: any
     data: IArticle
 }
@@ -25,11 +26,11 @@ const Page: NextPage<Props> = props => {
             showAuthor={true}
         >
             <Head>
-                <title>{props.data.title}</title>
+                <title>{props.title}</title>
                 <Meta meta={props.meta} />
             </Head>
             <Article
-                title={props.data.title}
+                title={props.title}
                 date={props.data.date}
                 tags={props.data.tags}
                 shareable={true}
@@ -43,24 +44,22 @@ const Page: NextPage<Props> = props => {
 }
 
 export const unstable_getStaticProps = async (ctx: any) => {
-    const pageUrl = '/'
     const id = ctx.params.slug
-    const data = await requestGet(createApiUrl(`/api/articles/${id}`), null)
+    const data = await requestGet<IArticle>(createApiUrl(`/api/articles/${id}`), null)
     if (!data) {
         return null
     }
 
-    const image = get(data, 'preview.artifacts.fb', {})
+    const meta = (new MetaBuilder())
+        .setImage(data.preview)
+        .setTitle(data.title)
+        .build()
 
     return {
         props: {
+            title: data.title,
             data,
-            meta: meta({
-                title: data.title,
-                image: image.src,
-                imageWidth: image.width,
-                imageHeight: image.height,
-            }),
+            meta,
         }
     }
 }