941fb7d756
Login screen (with a language picker), header, account menu, sync status, About and Release Notes dialogs, and the version banner are now fully translated in Hungarian, English and German.
78 lines
2.8 KiB
TypeScript
78 lines
2.8 KiB
TypeScript
import { useTranslation } from "react-i18next";
|
|
import { Bug, Sparkles } from "lucide-react";
|
|
import { RELEASE_NOTES } from "../lib/releaseNotes";
|
|
import Modal from "./Modal";
|
|
|
|
function fmtDate(d: string): string {
|
|
const t = new Date(d);
|
|
return isNaN(t.getTime())
|
|
? d
|
|
: t.toLocaleDateString(undefined, { year: "numeric", month: "short", day: "numeric" });
|
|
}
|
|
|
|
// Public release notes (chores are intentionally omitted here). `highlight` rings the
|
|
// version the user just updated to when opened from the new-version banner.
|
|
export default function ReleaseNotes({
|
|
onClose,
|
|
highlight,
|
|
}: {
|
|
onClose: () => void;
|
|
highlight?: string;
|
|
}) {
|
|
const { t } = useTranslation();
|
|
return (
|
|
<Modal title={t("about.releaseNotes")} onClose={onClose} maxWidth="max-w-2xl">
|
|
<div className="flex flex-col gap-6">
|
|
{RELEASE_NOTES.map((r) => (
|
|
<section
|
|
key={r.version}
|
|
className={highlight === r.version ? "rounded-xl ring-1 ring-accent/40 p-3 -m-3" : ""}
|
|
>
|
|
<div className="flex items-baseline gap-2 flex-wrap">
|
|
<h3 className="text-base font-semibold">v{r.version}</h3>
|
|
<span className="text-xs text-muted">{fmtDate(r.date)}</span>
|
|
{r.sha && (
|
|
<span className="text-[11px] font-mono text-muted bg-surface px-1.5 py-0.5 rounded">
|
|
{r.sha}
|
|
</span>
|
|
)}
|
|
</div>
|
|
{r.summary && <p className="text-sm text-muted mt-1">{r.summary}</p>}
|
|
|
|
{r.features?.length ? (
|
|
<div className="mt-3">
|
|
<div className="flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-accent">
|
|
<Sparkles className="w-3.5 h-3.5" /> {t("about.new")}
|
|
</div>
|
|
<ul className="mt-1.5 space-y-1.5 text-sm">
|
|
{r.features.map((f, i) => (
|
|
<li key={i} className="flex gap-2">
|
|
<span className="text-accent">•</span>
|
|
<span>{f}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
) : null}
|
|
|
|
{r.fixes?.length ? (
|
|
<div className="mt-3">
|
|
<div className="flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted">
|
|
<Bug className="w-3.5 h-3.5" /> {t("about.fixes")}
|
|
</div>
|
|
<ul className="mt-1.5 space-y-1.5 text-sm">
|
|
{r.fixes.map((f, i) => (
|
|
<li key={i} className="flex gap-2">
|
|
<span className="text-muted">•</span>
|
|
<span>{f}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
) : null}
|
|
</section>
|
|
))}
|
|
</div>
|
|
</Modal>
|
|
);
|
|
}
|