loki5512344
2d96f28091
- /download: the jar as an in-game item (pixel heart in an inventory slot, vanilla-style tooltip with version, size and SHA-256, copy button), spec list, three install steps, release timeline
- releases read through a cached nginx proxy (/api/releases): Forgejo's API has no CORS headers
- README, footer and landing links point to git.wihuk.pro/boba/LoVisual (the GitHub repo they used does not exist)
- release workflow publishes through the Forgejo API and ships lovisual.jar.sha256
- fix i18n interpolation placeholders ({{x}}) in the download strings
51 lines
2 KiB
TypeScript
51 lines
2 KiB
TypeScript
import { useQuery } from '@tanstack/react-query'
|
|
import { useTranslation } from '@shared/i18n/react'
|
|
import { Markdown } from '@shared/ui/Markdown'
|
|
import { fetchReleases } from './api'
|
|
import './download.css'
|
|
|
|
/**
|
|
* Changelog timeline, newest first. Markdown bodies go through our own renderer,
|
|
* which builds React elements and never raw HTML, so a `<script>` or `onerror=` in
|
|
* a release body stays inert text.
|
|
*/
|
|
export function ReleaseNotes() {
|
|
const { t, i18n } = useTranslation('download')
|
|
const { data, isError } = useQuery({
|
|
queryKey: ['releases'],
|
|
queryFn: fetchReleases,
|
|
staleTime: 10 * 60 * 1000,
|
|
})
|
|
|
|
if (isError || !data || data.length === 0) {
|
|
return (
|
|
<p className="rounded-panel border border-white/10 bg-black/30 p-6 text-frost">{t('notes.empty')}</p>
|
|
)
|
|
}
|
|
|
|
const date = new Intl.DateTimeFormat(i18n.language, { dateStyle: 'long' })
|
|
|
|
return (
|
|
<ol className="lv-rail flex flex-col gap-10">
|
|
{data.map((r, i) => {
|
|
const downloads = r.assets.reduce((sum, a) => sum + a.download_count, 0)
|
|
return (
|
|
<li key={r.tag_name} className="relative flex flex-col gap-2">
|
|
<span className="lv-dot" data-latest={i === 0} aria-hidden="true" />
|
|
<div className="flex flex-wrap items-baseline gap-x-3 gap-y-1">
|
|
<h3 className="font-display text-xl font-bold text-snow">{r.name || r.tag_name}</h3>
|
|
{i === 0 ? <span className="rounded-full bg-ice/15 px-2 py-0.5 text-xs font-bold text-ice">{t('notes.latest')}</span> : null}
|
|
<time className="font-code text-xs text-frost" dateTime={r.published_at}>
|
|
{date.format(new Date(r.published_at))}
|
|
</time>
|
|
{downloads > 0 ? <span className="font-code text-xs text-frost">{t('notes.downloads', { count: downloads })}</span> : null}
|
|
</div>
|
|
<div className="lv-markdown text-[0.95rem] leading-relaxed text-snow/85">
|
|
<Markdown>{r.body}</Markdown>
|
|
</div>
|
|
</li>
|
|
)
|
|
})}
|
|
</ol>
|
|
)
|
|
}
|