Files
btrc-hub/frontend/src/pages/wiki/WikiHistoryPage.tsx
T
2025-06-28 15:46:38 +09:00

78 lines
2.6 KiB
TypeScript

import axios from 'axios'
import toCamel from 'camelcase-keys'
import { useEffect, useState } from 'react'
import { Helmet } from 'react-helmet'
import { Link, useLocation, useParams } from 'react-router-dom'
import MainArea from '@/components/layout/MainArea'
import { API_BASE_URL, SITE_TITLE } from '@/config'
import type { WikiPageChange } from '@/types'
export default () => {
const [changes, setChanges] = useState<WikiPageChange[]> ([])
const location = useLocation ()
const query = new URLSearchParams (location.search)
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 }))))
}, [location.search])
return (
<MainArea>
<Helmet>
<title>{`Wiki 変更履歴 | ${ SITE_TITLE }`}</title>
</Helmet>
<table className="table-auto w-full border-collapse">
<thead>
<tr>
<th></th>
<th className="p-2 text-left"></th>
<th className="p-2 text-left"></th>
<th className="p-2 text-left"></th>
</tr>
</thead>
<tbody>
{changes.map (change => (
<tr key={change.sha}>
<td>
{change.changeType === 'update' && (
<Link to={`/wiki/${ change.wikiPage.id }/diff?from=${ change.pred }&to=${ change.sha }`}>
</Link>)}
</td>
<td className="p-2">
<Link to={`/wiki/${ encodeURIComponent (change.wikiPage.title) }?version=${ change.sha }`}>
{change.wikiPage.title}
</Link>
</td>
<td className="p-2">
{(() => {
switch (change.changeType)
{
case 'create':
return '新規'
case 'update':
return '更新'
case 'delete':
return '削除'
}
}) ()}
</td>
<td className="p-2">
<Link to={`/users/${ change.user.id }`}>
{change.user.name}
</Link>
<br />
{change.timestamp}
</td>
</tr>))}
</tbody>
</table>
</MainArea>)
}