#43 完了

frontend/src/pages/PostDetailPage.tsx

@@ -8,17 +8,21 @@ import { toast } from '@/components/ui/use-toast'
 import { cn } from '@/lib/utils'
 import MainArea from '@/components/layout/MainArea'
 import TagDetailSidebar from '@/components/TagDetailSidebar'
+import PostEditForm from '@/components/PostEditForm'
 
-import type { Post, Tag } from '@/types'
+import type { Post, Tag, User } from '@/types'
+
+type Props = { user: User }
 
 
-const PostDetailPage = () => {
+export default ({ user }: Props) => {
   const { id } = useParams ()
 
-  const [post, setPost] = useState<Post | null> (null)
-
   const location = useLocation ()
 
+  const [post, setPost] = useState<Post | null> (null)
+  const [editing, setEditing] = useState (true)
+
   const changeViewedFlg = () => {
     if (post?.viewed)
       {
@@ -56,6 +60,15 @@ const PostDetailPage = () => {
           .catch (err => console.error ('うんち!', err)))
   }, [id])
 
+  useEffect (() => {
+    setEditing (false)
+  }, [post])
+
+  useEffect (() => {
+    if (!(editing))
+      setEditing (true)
+  }, [editing])
+
   if (!(post))
     return (
         <>
@@ -93,11 +106,19 @@ const PostDetailPage = () => {
                                        post.viewed ? 'bg-blue-600 hover:bg-blue-700' : 'bg-gray-500 hover:bg-gray-600')}>
                   {post.viewed ? '閲覧済' : '未閲覧'}
                 </Button>
+                {(['admin', 'member'].includes (user.role) && editing) &&
+                    <div className="mt-4">
+                      <span className="text-blue-400 hover:underline cursor-pointer">
+                        編輯
+                      </span>
+                      <PostEditForm post={post}
+                                    onSave={newPost => {
+                                      setPost (newPost)
+                                      toast ({ description: '更新しました．' })
+                                    }} />
+                    </div>}
               </div>)
            : 'Loading...'}
         </MainArea>
       </>)
 }
-
-
-export default PostDetailPage

frontend/src/pages/PostNewPage.tsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState, useRef } from 'react'
 import { Link, useLocation, useParams, useNavigate } from 'react-router-dom'
 import axios from 'axios'
-import { API_BASE_URL, SITE_TITLE } from '../config'
-import NicoViewer from '../components/NicoViewer'
+import { API_BASE_URL, SITE_TITLE } from '@/config'
+import NicoViewer from '@/components/NicoViewer'
 import { Button } from '@/components/ui/button'
 import { toast } from '@/components/ui/use-toast'
 import { cn } from '@/lib/utils'
@@ -10,7 +10,6 @@ import MainArea from '@/components/layout/MainArea'
 
 import type { Post, Tag } from '@/types'
 
-
 type Props = { posts:     Post[]
                setPosts:  (posts: Post[]) => void }