親投稿機能 (#46) (#339)

Merge remote-tracking branch 'origin/main' into feature/046

#46

#46

#46

#46

#46

#46

Co-authored-by: miteruzo <miteruzo@naver.com>
Reviewed-on: #339

frontend/src/pages/posts/PostDetailPage.tsx

@@ -21,7 +21,7 @@ import ServiceUnavailable from '@/pages/ServiceUnavailable'
 
 import type { FC } from 'react'
 
-import type { NiconicoViewerHandle, User } from '@/types'
+import type { NiconicoViewerHandle, Post, User } from '@/types'
 
 type Props = { user: User | null }
 
@@ -108,6 +108,34 @@ export default (({ user }: Props) => {
 	  {post
 	   ? (
 	      <>
+		{(post.childPosts ?? []).length > 0 && (
+		    <div className="mb-4 bg-green-200 dark:bg-green-800 text-sm p-2 rounded-md">
+		      <p>この投稿には {post.childPosts!.length} 件の子投稿があります．</p>
+		      <PostList posts={[{ ...post, childPosts: [{ } as Post] },
+					...post.childPosts!.map (p => ({
+					    ...p, parentPosts: [{ } as Post] }))]}/>
+		    </div>
+		)}
+		{(post.parentPosts ?? []).map (pp => {
+		  const siblings = post.siblingPosts?.[String (pp.id) as `${ number }`]
+		  if (!(siblings))
+		    return
+
+		  return (
+		      <div
+			  key={pp.id}
+			  className="mb-4 bg-yellow-200 dark:bg-yellow-800 text-sm p-2 rounded-md">
+			<p>
+			  この投稿には 1 件の親投稿{
+			      siblings.length > 1
+			      && `と ${ siblings.length - 1 } 件の姉妹投稿`}があります．
+			</p>
+			<PostList posts={[{ ...pp, childPosts: [{ } as Post] },
+					  ...siblings.map (p => ({
+					      ...p, parentPosts: [{ } as Post] }))]}/>
+		      </div>)
+		})}
+
 		{(post.thumbnail || post.thumbnailBase) && (
 		    <motion.div
 			layoutId={`page-${ id }`}
@@ -146,7 +174,6 @@ export default (({ user }: Props) => {
 					       (prev: any) => newPost ?? prev)
 			      qc.invalidateQueries ({ queryKey: postsKeys.root })
 			      qc.invalidateQueries ({ queryKey: tagsKeys.root })
-			      toast ({ description: '更新しました．' })
 			    }}/>
 		      </Tab>)}
 		</TabGroup>

frontend/src/pages/posts/PostHistoryPage.tsx

@@ -95,6 +95,8 @@ export default (() => {
 		    <col className="w-96"/>
 		    {/* タグ */}
 		    <col className="w-[48rem]"/>
+		    {/* TODO: 親投稿 */}
+		    {/* <col className="w-[48rem]"/> */}
 		    {/* オリジナルの投稿日時 */}
 		    <col className="w-96"/>
 		    {/* 更新日時 */}
@@ -110,6 +112,8 @@ export default (() => {
 		      <th className="p-2 text-left">タイトル</th>
 		      <th className="p-2 text-left">URL</th>
 		      <th className="p-2 text-left">タグ</th>
+		      {/* TODO: 親投稿の履歴 */}
+		      {/* <th className="p-2 text-left">親投稿</th> */}
 		      <th className="p-2 text-left">オリジナルの投稿日時</th>
 		      <th className="p-2 text-left">更新日時</th>
 		      <th className="p-2"/>
@@ -180,6 +184,29 @@ export default (() => {
 					    {tag.name}
 					  </span>))))}
 			    </td>
+			    {/* TODO: 親投稿の履歴 */}
+			    {/* <td className="p-2">
+			      {change.parentPosts.map ((pp, i) => (
+				  pp.type === 'added'
+				  ? (
+				      <ins
+					  key={i}
+					  className="mr-2 text-green-600 dark:text-green-400">
+					{pp.title}
+				      </ins>)
+				  : (
+				      pp.type === 'removed'
+				      ? (
+					  <del
+					      key={i}
+					      className="mr-2 text-red-600 dark:text-red-400">
+					    {pp.title}
+					  </del>)
+				      : (
+					  <span key={i} className="mr-2">
+					    {pp.title}
+					  </span>))))}
+			    </td> */}
 			    <td className="p-2">
 			      {change.versionNo === 1
 			       ? originalCreatedAtString (change.originalCreatedFrom.current,
@@ -225,6 +252,11 @@ export default (() => {
 						  .map (t => t.name)
 						  .filter (t => t.slice (0, 5) !== 'nico:')
 						  .join (' '),
+					    parent_post_ids:
+						(change.parentPosts ?? [])
+						.filter (p => p.type !== 'removed')
+						.map (p => p.id)
+						.join (' '),
 					    original_created_from:
 						change.originalCreatedFrom.current,
 					    original_created_before:

frontend/src/pages/posts/PostNewPage.tsx

@@ -29,6 +29,7 @@ export default (({ user }: Props) => {
 
   const [originalCreatedBefore, setOriginalCreatedBefore] = useState<string | null> (null)
   const [originalCreatedFrom, setOriginalCreatedFrom] = useState<string | null> (null)
+  const [parentPostIds, setParentPostIds] = useState ('')
   const [tags, setTags] = useState ('')
   const [thumbnailAutoFlg, setThumbnailAutoFlg] = useState (true)
   const [thumbnailFile, setThumbnailFile] = useState<File | null> (null)
@@ -46,6 +47,7 @@ export default (({ user }: Props) => {
     formData.append ('title', title)
     formData.append ('url', url)
     formData.append ('tags', tags)
+    formData.append ('parent_post_ids', parentPostIds)
     if (thumbnailFile)
       formData.append ('thumbnail', thumbnailFile)
     if (originalCreatedFrom)
@@ -177,6 +179,16 @@ export default (({ user }: Props) => {
 		     className="mt-2 max-h-48 rounded border"/>)}
 	  </div>
 
+	  {/* 親投稿 */}
+	  <div>
+	    <Label>親投稿</Label>
+	    <input
+		type="text"
+		value={parentPostIds}
+		onChange={e => setParentPostIds (e.target.value)}
+		className="w-full border p-2 rounded"/>
+	  </div>
+
 	  {/* タグ */}
 	  <PostFormTagsArea tags={tags} setTags={setTags}/>