feat: 上位タグ（#64） (#173)

#64 おそらく完成

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

#64 バックエンドぼちぼち

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

frontend/src/components/PostEditForm.tsx

@@ -1,6 +1,6 @@
 import axios from 'axios'
 import toCamel from 'camelcase-keys'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 
 import PostFormTagsArea from '@/components/PostFormTagsArea'
 import PostOriginalCreatedTimeField from '@/components/PostOriginalCreatedTimeField'
@@ -10,7 +10,23 @@ import { API_BASE_URL } from '@/config'
 
 import type { FC } from 'react'
 
-import type { Post } from '@/types'
+import type { Post, Tag } from '@/types'
+
+
+const tagsToStr = (tags: Tag[]): string => {
+  const result: Tag[] = []
+
+  const walk = (tag: Tag) => {
+    const { children, ...rest } = tag
+    result.push (rest)
+    children?.forEach (walk)
+  }
+
+  tags.filter (t => t.category !== 'nico').forEach (walk)
+
+  return [...(new Set (result.map (t => t.name)))].join (' ')
+}
+
 
 type Props = { post:    Post
 	       onSave:  (newPost: Post) => void }
@@ -22,10 +38,7 @@ export default (({ post, onSave }: Props) => {
   const [originalCreatedFrom, setOriginalCreatedFrom] =
       useState<string | null> (post.originalCreatedFrom)
   const [title, setTitle] = useState (post.title)
-  const [tags, setTags] = useState<string> (post.tags
-					    .filter (t => t.category !== 'nico')
-					    .map (t => t.name)
-					    .join (' '))
+  const [tags, setTags] = useState<string> ('')
 
   const handleSubmit = async () => {
     const res = await axios.put (
@@ -43,6 +56,10 @@ export default (({ post, onSave }: Props) => {
 	      originalCreatedBefore:  data.originalCreatedBefore } as Post)
   }
 
+  useEffect (() => {
+    setTags(tagsToStr (post.tags))
+  }, [post])
+
   return (
       <div className="max-w-xl pt-2 space-y-4">
 	{/* タイトル */}