ファイル
btrc-hub/frontend/src/pages/wiki/WikiNewPage.tsx
T
2026-03-26 00:01:29 +09:00

66 行
1.8 KiB
TypeScript

import { useQueryClient } from '@tanstack/react-query'
import { Helmet } from 'react-helmet-async'
import { useLocation, useNavigate } from 'react-router-dom'
import WikiEditForm from '@/components/WikiEditForm'
import MainArea from '@/components/layout/MainArea'
import { toast } from '@/components/ui/use-toast'
import { SITE_TITLE } from '@/config'
import { apiPost } from '@/lib/api'
import { wikiKeys } from '@/lib/queryKeys'
import Forbidden from '@/pages/Forbidden'
import 'react-markdown-editor-lite/lib/index.css'
import type { User, WikiPage } from '@/types'
type Props = { user: User | null }
export default ({ user }: Props) => {
if (!(['admin', 'member'].some (r => user?.role === r)))
return <Forbidden/>
const location = useLocation ()
const navigate = useNavigate ()
const qc = useQueryClient ()
const query = new URLSearchParams (location.search)
const titleQuery = query.get ('title') ?? ''
const handleSubmit = async (title: string, body: string) => {
const formData = new FormData
formData.append ('title', title)
formData.append ('body', body)
try
{
const data = await apiPost<WikiPage> ('/wiki', formData,
{ headers: { 'Content-Type': 'multipart/form-data' } })
qc.invalidateQueries ({ queryKey: wikiKeys.root })
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>
<WikiEditForm
title={titleQuery}
body=""
onSubmit={handleSubmit}/>
</div>
</MainArea>)
}