#49

2025-07-13 02:46:13 +09:00
parent fdf242c060
commit 0c46cf28db
29 changed files with 509 additions and 456 deletions
@@ -14,7 +14,8 @@ import type { WikiPage } from '@/types'


 export default () => {
-  const { title } = useParams ()
+  const params = useParams ()
+  const title = params.title ?? ''

  const location = useLocation ()
  const navigate = useNavigate ()
@@ -27,45 +28,56 @@ export default () => {
  useEffect (() => {
    if (/^\d+$/.test (title))
      {
-        void (axios.get (`${ API_BASE_URL }/wiki/${ title }`)
-              .then (res => navigate (`/wiki/${ res.data.title }`, { replace: true })))
-        return
+	void (async () => {
+	  const res = await axios.get (`${ API_BASE_URL }/wiki/${ title }`)
+	  const data = res.data as WikiPage
+	  navigate (`/wiki/${ data.title }`, { replace: true })
+	}) ()
+	return
      }

-    void (axios.get (`${ API_BASE_URL }/wiki/title/${ encodeURIComponent (title) }`, version && { params: { version } })
-          .then (res => {
-            setWikiPage (toCamel (res.data, { deep: true }))
-            WikiIdBus.set (res.data.id)
-          })
-          .catch (() => setWikiPage (null)))
+    void (async () => {
+      try
+      {
+	const res = await axios.get (`${ API_BASE_URL }/wiki/title/${ encodeURIComponent (title) }`,
+				     { params: { ...(version ? { version } : { }) } })
+	const data = toCamel (res.data as any, { deep: true }) as WikiPage
+	setWikiPage (data)
+	WikiIdBus.set (data.id)
+      }
+      catch
+      {
+	setWikiPage (null)
+      }
+    }) ()

    return () => WikiIdBus.set (null)
  }, [title, location.search])

  return (
      <MainArea>
-        <Helmet>
-          <title>{`${ title } Wiki | ${ SITE_TITLE }`}</title>
-        </Helmet>
-        {(wikiPage && version) && (
-            <div className="text-sm flex gap-3 items-center justify-center border border-gray-700 rounded px-2 py-1 mb-4">
-              {wikiPage.pred ? (
-                  <Link to={`/wiki/${ title }?version=${ wikiPage.pred }`}>
-                    &lt; 古
-                  </Link>) : <>(最古)</>}
+	<Helmet>
+	  <title>{`${ title } Wiki | ${ SITE_TITLE }`}</title>
+	</Helmet>
+	{(wikiPage && version) && (
+	    <div className="text-sm flex gap-3 items-center justify-center border border-gray-700 rounded px-2 py-1 mb-4">
+	      {wikiPage.pred ? (
+		  <Link to={`/wiki/${ title }?version=${ wikiPage.pred }`}>
+		    &lt; 古
+		  </Link>) : <>(最古)</>}

-              <span>{wikiPage.updatedAt}</span>
+	      <span>{wikiPage.updatedAt}</span>

-              {wikiPage.succ ? (
-                  <Link to={`/wiki/${ title }?version=${ wikiPage.succ }`}>
-                    新 &gt;
-                  </Link>) : <>(最新)</>}
-            </div>)}
-        <PageTitle>{title}</PageTitle>
-        <div className="prose mx-auto p-4">
-          {wikiPage === undefined
-           ? 'Loading...'
-           : <WikiBody body={wikiPage?.body || `このページは存在しません。[新規作成してください](/wiki/new?title=${ title })。`} />}
-        </div>
+	      {wikiPage.succ ? (
+		  <Link to={`/wiki/${ title }?version=${ wikiPage.succ }`}>
+		    新 &gt;
+		  </Link>) : <>(最新)</>}
+	    </div>)}
+	<PageTitle>{title}</PageTitle>
+	<div className="prose mx-auto p-4">
+	  {wikiPage === undefined
+	   ? 'Loading...'
+	   : <WikiBody body={wikiPage?.body || `このページは存在しません。[新規作成してください](/wiki/new?title=${ title })。`} />}
+	</div>
      </MainArea>)
 }
@@ -2,7 +2,7 @@ import axios from 'axios'
 import toCamel from 'camelcase-keys'
 import { useEffect, useState } from 'react'
 import { Helmet } from 'react-helmet-async'
-import { Link, useLocation, useParams } from 'react-router-dom'
+import { useLocation, useParams } from 'react-router-dom'

 import PageTitle from '@/components/common/PageTitle'
 import MainArea from '@/components/layout/MainArea'
@@ -23,8 +23,10 @@ export default () => {
  const to = query.get ('to')

  useEffect (() => {
-    void (axios.get (`${ API_BASE_URL }/wiki/${ id }/diff`, { params: { from, to } })
-          .then (res => setDiff (toCamel (res.data, { deep: true }))))
+    void (async () => {
+      const res = await axios.get (`${ API_BASE_URL }/wiki/${ id }/diff`, { params: { from, to } })
+      setDiff (toCamel (res.data as any, { deep: true }) as WikiPageDiff)
+    }) ()
  }, [])

  return (
@@ -1,20 +1,17 @@
 import axios from 'axios'
 import MarkdownIt from 'markdown-it'
-import React, { useEffect, useState, useRef } from 'react'
+import { useEffect, useState } from 'react'
 import { Helmet } from 'react-helmet-async'
 import MdEditor from 'react-markdown-editor-lite'
-import { Link, useLocation, useParams, useNavigate } from 'react-router-dom'
+import { useParams, useNavigate } from 'react-router-dom'

-import NicoViewer from '@/components/NicoViewer'
 import MainArea from '@/components/layout/MainArea'
-import { Button } from '@/components/ui/button'
 import { toast } from '@/components/ui/use-toast'
 import { API_BASE_URL, SITE_TITLE } from '@/config'
-import { cn } from '@/lib/utils'

 import 'react-markdown-editor-lite/lib/index.css'

-import type { Tag } from '@/types'
+import type { WikiPage } from '@/types'

 const mdParser = new MarkdownIt

@@ -22,68 +19,71 @@ const mdParser = new MarkdownIt
 export default () => {
  const { id } = useParams ()

-  const location = useLocation ()
  const navigate = useNavigate ()

  const [title, setTitle] = useState ('')
  const [body, setBody] = useState ('')

-  const handleSubmit = () => {
+  const handleSubmit = async () => {
    const formData = new FormData ()
    formData.append ('title', title)
    formData.append ('body', body)

-    void (axios.put (`${ API_BASE_URL }/wiki/${ id }`, formData, { headers: {
-              'Content-Type':     'multipart/form-data',
-              'X-Transfer-Code':  localStorage.getItem ('user_code') || '' } })
-          .then (res => {
-            toast ({ title: '投稿成功!' })
-            navigate (`/wiki/${ title }`)
-          })
-          .catch (e => toast ({ title:        '投稿失敗',
-                                description:  '入力を確認してください。' })))
+    try
+    {
+      await axios.put (`${ API_BASE_URL }/wiki/${ id }`, formData, { headers: {
+	  'Content-Type':     'multipart/form-data',
+	  'X-Transfer-Code':  localStorage.getItem ('user_code') ?? '' } })
+      toast ({ title: '投稿成功!' })
+      navigate (`/wiki/${ title }`)
+    }
+    catch
+    {
+      toast ({ title: '投稿失敗', description: '入力を確認してください。' })
+    }
  }

  useEffect (() => {
-    void (axios.get (`${ API_BASE_URL }/wiki/${ id }`)
-          .then (res => {
-            setTitle (res.data.title)
-            setBody (res.data.body)
-          }))
+    void (async () => {
+      const res = await axios.get (`${ API_BASE_URL }/wiki/${ id }`)
+      const data = res.data as WikiPage
+      setTitle (data.title)
+      setBody (data.body)
+    }) ()
  }, [id])

  return (
      <MainArea>
-        <Helmet>
-          <title>{`Wiki ページを編輯 | ${ SITE_TITLE }`}</title>
-        </Helmet>
-        <div className="max-w-xl mx-auto p-4 space-y-4">
-          <h1 className="text-2xl font-bold mb-2">Wiki ページを編輯</h1>
+	<Helmet>
+	  <title>{`Wiki ページを編輯 | ${ SITE_TITLE }`}</title>
+	</Helmet>
+	<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>
+	  {/* タイトル */}
+	  {/* 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>
-        </div>
+	  {/* 送信 */}
+	  <button onClick={handleSubmit}
+		  className="px-4 py-2 bg-blue-600 text-white rounded disabled:bg-gray-400">
+	    追加
+	  </button>
+	</div>
      </MainArea>)
 }
@@ -2,7 +2,7 @@ import axios from 'axios'
 import toCamel from 'camelcase-keys'
 import { useEffect, useState } from 'react'
 import { Helmet } from 'react-helmet-async'
-import { Link, useLocation, useParams } from 'react-router-dom'
+import { Link, useLocation } from 'react-router-dom'

 import MainArea from '@/components/layout/MainArea'
 import { API_BASE_URL, SITE_TITLE } from '@/config'
@@ -18,8 +18,11 @@ export default () => {
  const id = query.get ('id')

  useEffect (() => {
-    void (axios.get (`${ API_BASE_URL }/wiki/changes`, id && { params: { id } })
-          .then (res => setChanges (toCamel (res.data, { deep: true }))))
+    void (async () => {
+      const res = await axios.get (`${ API_BASE_URL }/wiki/changes`,
+				   { params: { ...(id ? { id } : { }) } })
+      setChanges (toCamel (res.data as any, { deep: true }) as WikiPageChange[])
+    }) ()
  }, [location.search])

  return (
@@ -1,20 +1,17 @@
 import axios from 'axios'
 import MarkdownIt from 'markdown-it'
-import React, { useEffect, useState, useRef } from 'react'
+import { useState } from 'react'
 import { Helmet } from 'react-helmet-async'
 import MdEditor from 'react-markdown-editor-lite'
-import { Link, useLocation, useParams, useNavigate } from 'react-router-dom'
+import { useLocation, useNavigate } from 'react-router-dom'

-import NicoViewer from '@/components/NicoViewer'
 import MainArea from '@/components/layout/MainArea'
-import { Button } from '@/components/ui/button'
 import { toast } from '@/components/ui/use-toast'
 import { API_BASE_URL, SITE_TITLE } from '@/config'
-import { cn } from '@/lib/utils'

 import 'react-markdown-editor-lite/lib/index.css'

-import type { Tag } from '@/types'
+import type { WikiPage } from '@/types'

 const mdParser = new MarkdownIt

@@ -29,54 +26,58 @@ export default () => {
  const [title, setTitle] = useState (titleQuery)
  const [body, setBody] = useState ('')

-  const handleSubmit = () => {
-    const formData = new FormData ()
+  const handleSubmit = async () => {
+    const formData = new FormData
    formData.append ('title', title)
    formData.append ('body', body)

-    void (axios.post (`${ API_BASE_URL }/wiki`, formData, { headers: {
-              'Content-Type':     'multipart/form-data',
-              'X-Transfer-Code':  localStorage.getItem ('user_code') || '' } })
-          .then (res => {
-            toast ({ title: '投稿成功!' })
-            navigate (`/wiki/${ res.data.title }`)
-          })
-          .catch (e => toast ({ title:        '投稿失敗',
-                                description:  '入力を確認してください。' })))
+    try
+    {
+      const res = await axios.post (`${ API_BASE_URL }/wiki`, formData, { headers: {
+	  'Content-Type':     'multipart/form-data',
+	  'X-Transfer-Code':  localStorage.getItem ('user_code') || '' } })
+      const data = res.data as WikiPage
+      toast ({ title: '投稿成功!' })
+      navigate (`/wiki/${ data.title }`)
+    }
+    catch
+    {
+      toast ({ title: '投稿失敗', description: '入力を確認してください。' })
+    }
  }

  return (
      <MainArea>
-        <Helmet>
-          <title>{`新規 Wiki ページ | ${ SITE_TITLE }`}</title>
-        </Helmet>
-        <div className="max-w-xl mx-auto p-4 space-y-4">
-          <h1 className="text-2xl font-bold mb-2">新規 Wiki ページ</h1>
+	<Helmet>
+	  <title>{`新規 Wiki ページ | ${ SITE_TITLE }`}</title>
+	</Helmet>
+	<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>
+	  {/* タイトル */}
+	  {/* 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>
-        </div>
+	  {/* 送信 */}
+	  <button onClick={handleSubmit}
+		  className="px-4 py-2 bg-blue-600 text-white rounded disabled:bg-gray-400">
+	    追加
+	  </button>
+	</div>
      </MainArea>)
 }
@@ -8,22 +8,21 @@ import SectionTitle from '@/components/common/SectionTitle'
 import MainArea from '@/components/layout/MainArea'
 import { API_BASE_URL, SITE_TITLE } from '@/config'

-import type { Category, WikiPage } from '@/types'
+import type { WikiPage } from '@/types'


 export default () => {
  const [title, setTitle] = useState ('')
  const [text, setText] = useState ('')
-  const [category, setCategory] = useState<Category | null> (null)
  const [results, setResults] = useState<WikiPage[]> ([])

-  const search = () => {
-    void (axios.get (`${ API_BASE_URL }/wiki/search`, { params: { title } })
-	  .then (res => setResults (toCamel (res.data, { deep: true }))))
+  const search = async () => {
+    const res = await axios.get (`${ API_BASE_URL }/wiki/search`, { params: { title } })
+    setResults (toCamel (res.data as any, { deep: true }) as WikiPage[])
  }

-  const handleSearch = (e: React.FormEvent) => {
-    e.preventDefault ()
+  const handleSearch = (ev: React.FormEvent) => {
+    ev.preventDefault ()
    search ()
  }