#8 とりあへずは完了

frontend/src/pages/PostDetailPage.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
 import { Link, useLocation, useParams } from 'react-router-dom'
 import axios from 'axios'
 import { API_BASE_URL, SITE_TITLE } from '../config'
+import NicoViewer from '../components/NicoViewer'
 
 type Post = { id:         number
               url:        string
@@ -28,19 +29,17 @@ const PostDetailPage = () => {
 
   document.title = `${ post.url } | ${ SITE_TITLE }`
 
+  const url = new URL (post.url)
+
   return (
       <div className="p-4">
-        <h1 className="text-2xl font-bold mb-2">{post.url}</h1>
-        <img src={post.thumbnail} alt={post.url} className="mb-4 max-w-lg" />
-        <p className="mb-2">{post.description}</p>
-        <div className="text-sm text-gray-600">
-          タグ:
-          {post.tags.map(tag => (
-            <span key={tag.name} className="ml-2 px-2 py-1 bg-gray-200 rounded">
-              #{tag.name}
-            </span>
-          ))}
-        </div>
+        {url.hostname.split ('.').slice (-2).join ('.') === 'nicovideo.jp' ? (
+            <NicoViewer id={url.pathname.match (/(?<=\/watch\/)[a-zA-Z0-9]+?(?=\/|$)/)[0]}
+                        width="640"
+                        height="360" />
+            ) : (
+            <img src={post.thumbnail} alt={post.url} className="mb-4 w-full" />
+            )}
       </div>
       )
 }