Add artifact link

cms-data-fetcher/src/parse.ts

@@ -54,6 +54,8 @@ function getPOption(text: string) {
     pOpt = 'twitter'
   } else if (isBlog(text)) {
     pOpt = 'blog'
+  } else if (isArtifact(text)) {
+    pOpt = 'artifact'
   } else if (isURL(text)) {
     pOpt = 'url'
   } else if (text === '') {
@@ -106,6 +108,13 @@ function isBlog(text: string) {
   return text.indexOf('https://www.maretol.xyz/blog/') === 0 || text.indexOf('https://maretol.xyz/blog/') === 0
 }
 
+// artifactのリンクの場合
+function isArtifact(text: string) {
+  return (
+    text.indexOf('https://www.maretol.xyz/artifacts/') === 0 || text.indexOf('https://maretol.xyz/artifacts/') === 0
+  )
+}
+
 function isURL(text: string) {
   return text.indexOf('https://') === 0
 }

packages/api-types/src/cms_types.ts

@@ -50,6 +50,7 @@ type infoAPIResult = {
   publishedAt: string
   revisedAt: string
   page_pathname: string
+  title: string | undefined
   main_text: string
   parsed_content: ParsedContent[]
   table_of_contents: TableOfContents

pages/components/middle/article_content.tsx

@@ -14,6 +14,7 @@ import LoadingLinkcard from './loading_dom/loading_linkcard'
 import BlogCard from './article_dom/blogcard'
 import LoadingBlogCard from './loading_dom/loading_blogcard'
 import Table from './article_dom/table_of_contents'
+import ArtifactCard from './article_dom/artifactcard'
 
 export default async function ArticleContent({
   contents,
@@ -142,6 +143,14 @@ export default async function ArticleContent({
                 </Suspense>
               </div>
             )
+          } else if (pOption === 'artifact') {
+            return (
+              <div key={i} className="py-6">
+                <Suspense fallback={<LoadingBlogCard />}>
+                  <ArtifactCard link={text} />
+                </Suspense>
+              </div>
+            )
           } else if (pOption === 'empty') {
             // 空行の場合。改行をいれる
             return <Br key={i} />

pages/components/middle/article_dom/artifactcard.tsx

@@ -0,0 +1,28 @@
+import { Button } from '@/components/ui/button'
+import { getInfo } from '@/lib/api/workers'
+import { convertJST } from '@/lib/time'
+import { HammerIcon } from 'lucide-react'
+import Link from 'next/link'
+
+export default async function ArtifactCard({ link }: { link: string }) {
+  const linkURL = new URL(link)
+  const linkPath = linkURL.pathname
+  const info = await getInfo()
+  const artifact = info.filter((c) => c.page_pathname === linkPath || c.page_pathname === linkPath)[0]
+
+  return (
+    <div className="flex max-w-xl">
+      <Button variant={'outline'} className="no-underline bg-gray-300 h-full w-full" asChild>
+        <Link href={linkPath}>
+          <HammerIcon className="w-8 h-8 mr-2" />
+          <div className="w-full flex flex-row space-x-2">
+            <div className="w-full flex flex-col self-end">
+              <p className="text-md text-wrap line-clamp-2">{artifact.title || 'タイトル未定義'}</p>
+              <p className="text-gray-500 text-xs text-wrap line-clamp-2">{convertJST(artifact.publishedAt)}</p>
+            </div>
+          </div>
+        </Link>
+      </Button>
+    </div>
+  )
+}