126 lines
3.8 KiB
TypeScript
126 lines
3.8 KiB
TypeScript
"use client";
|
|
import { useI18n } from "@/components/I18nProvider";
|
|
|
|
import { useEffect, useRef, useState } from "react";
|
|
import { api } from "@/lib/client-api";
|
|
import { refreshCapture, type MapCapture } from "@/shared/map-refresh";
|
|
import type { ProcessingJob } from "@/shared/processing-progress";
|
|
|
|
export function MapRefresh({
|
|
id,
|
|
disabled,
|
|
onQueued,
|
|
refreshKey,
|
|
job,
|
|
}: {
|
|
id: string;
|
|
disabled: boolean;
|
|
onQueued: () => void;
|
|
refreshKey: number;
|
|
job: ProcessingJob | null;
|
|
}) {
|
|
const { t, formatDate } = useI18n();
|
|
const [sources, setSources] = useState<MapCapture[]>([]);
|
|
const [source, setSource] = useState("");
|
|
const choice = useRef<{ mapId: string; sourceId: string } | null>(null);
|
|
const [busy, setBusy] = useState(false);
|
|
const [error, setError] = useState("");
|
|
useEffect(() => {
|
|
let active = true;
|
|
api<{ sources: typeof sources }>(`datasets/${id}/refresh-map`)
|
|
.then((r) => {
|
|
if (active) {
|
|
setSources(r.sources);
|
|
setSource(
|
|
refreshCapture(
|
|
r.sources,
|
|
choice.current?.mapId === id
|
|
? choice.current.sourceId
|
|
: undefined,
|
|
),
|
|
);
|
|
setError("");
|
|
}
|
|
})
|
|
.catch((e) => {
|
|
if (active) setError(e.message);
|
|
});
|
|
return () => {
|
|
active = false;
|
|
};
|
|
}, [id, refreshKey, job?.id, job?.state]);
|
|
async function refresh() {
|
|
setBusy(true);
|
|
setError("");
|
|
try {
|
|
await api(`datasets/${id}/refresh-map`, { sourceId: source });
|
|
onQueued();
|
|
} catch (e) {
|
|
setError((e as Error).message);
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
}
|
|
return (
|
|
<section className="editor-panel">
|
|
<span className="eyebrow">{t("THE MAP PLAYERS GUESS ON")}</span>
|
|
<h2>{t("Refresh guessing map")}</h2>
|
|
<p className="muted">
|
|
{t(
|
|
"Rebuild the overhead map from a processed capture. To show new buildings, export the same area again and upload it first. Select that capture here; its boundaries must match this map exactly.",
|
|
)}
|
|
</p>
|
|
<label className="field">
|
|
{t("Terrain capture")}
|
|
<select
|
|
value={source}
|
|
onChange={(e) => {
|
|
choice.current = { mapId: id, sourceId: e.target.value };
|
|
setSource(e.target.value);
|
|
}}
|
|
disabled={disabled || busy}
|
|
>
|
|
{sources.map((s) => (
|
|
<option key={s.id} value={s.id}>
|
|
{s.id === id ? t("Original capture") : s.name} ·{" "}
|
|
{formatDate(s.created_at)} · {s.id.slice(0, 8)}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</label>
|
|
<p className="muted">
|
|
{t(
|
|
"The newest eligible capture is selected automatically. Choose the original capture only if you want its older terrain.",
|
|
)}
|
|
</p>
|
|
<button
|
|
className="button"
|
|
disabled={disabled || busy || !sources.some((s) => s.id === source)}
|
|
onClick={refresh}
|
|
>
|
|
{busy ? t("Queueing…") : t("Refresh guessing map")}
|
|
</button>
|
|
<p className="muted">
|
|
{t(
|
|
"Panoramas stay unchanged. Refreshing uses no panorama slots, even at 24/24. Submit the finished map update for review to make it playable.",
|
|
)}
|
|
</p>
|
|
{job?.kind === "map" && job.state === "complete" && (
|
|
<p role="status" className="success-message">
|
|
{t("Last successful refresh used: {capture}.", {
|
|
capture:
|
|
job.source_dataset_id === id
|
|
? t("Original capture")
|
|
: `${sources.find((s) => s.id === job.source_dataset_id)?.name ?? t("Terrain capture")} · ${job.source_dataset_id?.slice(0, 8) ?? ""}`,
|
|
})}
|
|
</p>
|
|
)}
|
|
{error && (
|
|
<p role="alert" className="error-message">
|
|
{t(error)}
|
|
</p>
|
|
)}
|
|
</section>
|
|
);
|
|
}
|