feat: Wiki 自動リンクをテキスト領域のみに制限（#93） (#218)

Merge branch 'main' into #93

#93

Merge remote-tracking branch 'origin/main' into #93

#93

#93

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

frontend/src/pages/wiki/WikiEditPage.tsx

@@ -12,6 +12,8 @@ import Forbidden from '@/pages/Forbidden'
 
 import 'react-markdown-editor-lite/lib/index.css'
 
+import type { FC } from 'react'
+
 import type { User, WikiPage } from '@/types'
 
 const mdParser = new MarkdownIt
@@ -19,7 +21,7 @@ const mdParser = new MarkdownIt
 type Props = { user: User | null }
 
 
-export default ({ user }: Props) => {
+export default (({ user }: Props) => {
   if (!(['admin', 'member'].some (r => user?.role === r)))
     return <Forbidden/>
 
@@ -27,8 +29,9 @@ export default ({ user }: Props) => {
 
   const navigate = useNavigate ()
 
-  const [title, setTitle] = useState ('')
   const [body, setBody] = useState ('')
+  const [loading, setLoading] = useState (true)
+  const [title, setTitle] = useState ('')
 
   const handleSubmit = async () => {
     const formData = new FormData ()
@@ -51,10 +54,12 @@ export default ({ user }: Props) => {
 
   useEffect (() => {
     void (async () => {
+      setLoading (true)
       const res = await axios.get (`${ API_BASE_URL }/wiki/${ id }`)
       const data = res.data as WikiPage
       setTitle (data.title)
       setBody (data.body)
+      setLoading (false)
     }) ()
   }, [id])
 
@@ -66,30 +71,33 @@ export default ({ user }: Props) => {
 	<div className="max-w-xl mx-auto p-4 space-y-4">
 	  <h1 className="text-2xl font-bold mb-2">Wiki ページを編輯</h1>
 
-	  {/* タイトル */}
-	  {/* TODO: タグ補完 */}
-	  <div>
-	    <label className="block font-semibold mb-1">タイトル</label>
-	    <input type="text"
-		   value={title}
-		   onChange={e => setTitle (e.target.value)}
-		   className="w-full border p-2 rounded"/>
-	  </div>
+	  {loading ? 'Loading...' : (
+	      <>
+		{/* タイトル */}
+		{/* TODO: タグ補完 */}
+		<div>
+		  <label className="block font-semibold mb-1">タイトル</label>
+		  <input type="text"
+			 value={title}
+			 onChange={e => setTitle (e.target.value)}
+			 className="w-full border p-2 rounded"/>
+		</div>
 
-	  {/* 本文 */}
-	  <div>
-	    <label className="block font-semibold mb-1">本文</label>
-	    <MdEditor value={body}
-		      style={{ height: '500px' }}
-		      renderHTML={text => mdParser.render (text)}
-		      onChange={({ text }) => setBody (text)}/>
-	  </div>
+		{/* 本文 */}
+		<div>
+		  <label className="block font-semibold mb-1">本文</label>
+		  <MdEditor value={body}
+			    style={{ height: '500px' }}
+			    renderHTML={text => mdParser.render (text)}
+			    onChange={({ text }) => setBody (text)}/>
+		</div>
 
-	  {/* 送信 */}
-	  <button onClick={handleSubmit}
-		  className="px-4 py-2 bg-blue-600 text-white rounded disabled:bg-gray-400">
-	    追加
-	  </button>
+		{/* 送信 */}
+		<button onClick={handleSubmit}
+			className="px-4 py-2 bg-blue-600 text-white rounded disabled:bg-gray-400">
+		  編輯
+		</button>
+	      </>)}
 	</div>
       </MainArea>)
-}
+}) satisfies FC<Props>