45 lines
1.4 KiB
TypeScript
45 lines
1.4 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 PageTitle from '@/components/common/PageTitle'
|
|
import MainArea from '@/components/layout/MainArea'
|
|
import { API_BASE_URL, SITE_TITLE } from '@/config'
|
|
|
|
import type { WikiPageDiff } from '@/types'
|
|
|
|
|
|
export default () => {
|
|
const { id } = useParams ()
|
|
|
|
const location = useLocation ()
|
|
|
|
const [diff, setDiff] = useState<WikiPageDiff | null> (null)
|
|
|
|
const query = new URLSearchParams (location.search)
|
|
const from = query.get ('from')
|
|
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 }))))
|
|
}, [])
|
|
|
|
return (
|
|
<MainArea>
|
|
<Helmet>
|
|
<title>{`Wiki 差分: ${ diff?.title } | ${ SITE_TITLE }`}</title>
|
|
</Helmet>
|
|
<PageTitle>{diff?.title}</PageTitle>
|
|
<div className="prose mx-auto p-4">
|
|
{diff ? (
|
|
diff.diff.map (d => (
|
|
<span className={d.type === 'added' ? 'bg-green-800' : d.type === 'removed' ? 'bg-red-800' : ''}>
|
|
{d.content == '\n' ? <br /> : d.content}
|
|
</span>))) : 'Loading...'}
|
|
</div>
|
|
</MainArea>)
|
|
}
|