ik/rf4-spotter
1
0
Fork 0
Code Issues Pull Requests Actions 18 Packages Projects Releases Wiki Activity

feat: show reviewed media on tackle details

Browse Source
This commit is contained in:
ik
2026-09-21 19:57:11 +07:00
parent 524dad42ec
commit bf0f16642a
4 changed files with 28 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/pages/tackle/items/[id].astro
+13 -7
View File
@@ -1,21 +1,25 @@
---
import AtlasBreadcrumbs from "../../../components/AtlasBreadcrumbs.astro";
import DataPassport from "../../../components/DataPassport.astro";
import EntityMedia from "../../../components/EntityMedia.astro";
import Layout from "../../../layouts/Layout.astro";
import PageHero from "../../../components/PageHero.astro";
import StatePanel from "../../../components/StatePanel.astro";
import TackleGlyph from "../../../components/TackleGlyph.astro";
import { ApiError, api, type TackleItem } from "../../../lib/api";
import { ApiError, api, type MediaAsset, type TackleItem } from "../../../lib/api";
import { findMediaByLabel, mediaRoleLabel } from "../../../lib/media";
import { safeHttpUrl } from "../../../lib/urls";
const { id } = Astro.params;
let item: TackleItem | undefined;
let item: TackleItem | undefined, media: MediaAsset[] = [];
let unavailable = false;
try {
item = await api<TackleItem>(`/api/v1/tackle/items/${encodeURIComponent(id ?? "")}`);
} catch (error) {
unavailable = !(error instanceof ApiError) || error.status >= 500;
}
const [itemResult, mediaResult] = await Promise.allSettled([
api<TackleItem>(`/api/v1/tackle/items/${encodeURIComponent(id ?? "")}`),
api<MediaAsset[]>("/api/v1/media/catalog?entity_type=tackle"),
]);
if (itemResult.status === "fulfilled") item = itemResult.value;
else { const error = itemResult.reason; unavailable = !(error instanceof ApiError) || error.status >= 500; }
if (mediaResult.status === "fulfilled") media = mediaResult.value;
if (!item && !unavailable) Astro.response.status = 404;
if (unavailable) {
Astro.response.status = 503;
@@ -27,6 +31,7 @@ const categoryLabels: Record<string, string> = { bait: "Наживка", lure: "
const missingLabels: Record<string, string> = { subcategory: "подкатегория", brand: "бренд", family: "семейство", unlock_level: "уровень открытия", source_url: "ссылка на источник", source_checked_at: "дата проверки" };
const missing = item?.missing_fields.map((field) => missingLabels[field] ?? field) ?? [];
const sourceHref = safeHttpUrl(item?.source_url);
const mediaCandidates = item ? (["tackle_card", "tackle_detail"] as const).map(role => findMediaByLabel(media, item!.name, [role])).filter((asset): asset is MediaAsset => Boolean(asset)) : [];
---
<Layout title={item ? `${item.name} — снасти RF4` : "Снасть не найдена — RF4 Spotter"} description={item ? `Подтверждённая карточка ${item.name} в каталоге снастей RF4 с источником и отметками полноты.` : "Такой карточки нет в каталоге снастей RF4."} noindex={!item || unavailable} errorPage={!item || unavailable}>
<AtlasBreadcrumbs items={[{ label: "Снасти", href: "/tackle" }, { label: item?.name ?? "Не найдено" }]} />
@@ -37,5 +42,6 @@ const sourceHref = safeHttpUrl(item?.source_url);
<div><dl><div><dt>Подкатегория</dt><dd>{item.subcategory ?? "Не указана"}</dd></div><div><dt>Уровень открытия</dt><dd>{item.unlock_level ?? "Не указан"}</dd></div><div><dt>Источник</dt><dd>{item.source_system ?? "Не указан"}</dd></div></dl>{missing.length > 0 && <p class="tackle-detail__missing"><strong>Не хватает:</strong> {missing.join(", ")}.</p>}{sourceHref && <a data-action="secondary" href={sourceHref} rel="noreferrer">Открыть первоисточник</a>}</div>
</section>
<DataPassport sources={item.source_system ? [item.source_system] : []} sourceUrl={item.source_url} observedAt={item.source_checked_at} completeness={missing.length ? null : 100} status={missing.length ? "incomplete" : item.source_checked_at ? "verified" : "unverified"} />
{mediaCandidates.length > 0 && <section class="catalog-media-grid content-grid" aria-label={`Изображения снасти: ${item.name}`}>{mediaCandidates.map(asset => <article><span class="overline">{mediaRoleLabel(asset.media_role ?? "")}</span><EntityMedia asset={asset} sourceLink /></article>)}</section>}
</>}
</Layout>
apps/web/src/pages/tackle/rigs/[id].astro
+13 -7
View File
@@ -1,21 +1,25 @@
---
import AtlasBreadcrumbs from "../../../components/AtlasBreadcrumbs.astro";
import DataPassport from "../../../components/DataPassport.astro";
import EntityMedia from "../../../components/EntityMedia.astro";
import Layout from "../../../layouts/Layout.astro";
import PageHero from "../../../components/PageHero.astro";
import StatePanel from "../../../components/StatePanel.astro";
import TackleGlyph from "../../../components/TackleGlyph.astro";
import { ApiError, api, type Rig } from "../../../lib/api";
import { ApiError, api, type MediaAsset, type Rig } from "../../../lib/api";
import { findMediaByLabel, mediaRoleLabel } from "../../../lib/media";
import { safeHttpUrl } from "../../../lib/urls";
const { id } = Astro.params;
let rig: Rig | undefined;
let rig: Rig | undefined, media: MediaAsset[] = [];
let unavailable = false;
try {
rig = await api<Rig>(`/api/v1/tackle/rigs/${encodeURIComponent(id ?? "")}`);
} catch (error) {
unavailable = !(error instanceof ApiError) || error.status >= 500;
}
const [rigResult, mediaResult] = await Promise.allSettled([
api<Rig>(`/api/v1/tackle/rigs/${encodeURIComponent(id ?? "")}`),
api<MediaAsset[]>("/api/v1/media/catalog?entity_type=tackle"),
]);
if (rigResult.status === "fulfilled") rig = rigResult.value;
else { const error = rigResult.reason; unavailable = !(error instanceof ApiError) || error.status >= 500; }
if (mediaResult.status === "fulfilled") media = mediaResult.value;
if (!rig && !unavailable) Astro.response.status = 404;
if (unavailable) {
Astro.response.status = 503;
@@ -27,6 +31,7 @@ const roleLabels: Record<string, string> = { lure: "Приманка", bait: "Н
const missingLabels: Record<string, string> = { source_url: "ссылка на источник", source_checked_at: "дата проверки" };
const missing = rig?.missing_fields.map((field) => missingLabels[field] ?? field) ?? [];
const sourceHref = safeHttpUrl(rig?.source_url);
const mediaCandidates = rig ? [findMediaByLabel(media, rig.name, ["rig_diagram"])].filter((asset): asset is MediaAsset => Boolean(asset)) : [];
---
<Layout title={rig ? `${rig.name} — сборки RF4` : "Сборка не найдена — RF4 Spotter"} description={rig ? `Подтверждённая карточка сборки ${rig.name} в каталоге RF4 с составом и источником.` : "Такой карточки сборки нет в каталоге RF4."} noindex={!rig || unavailable} errorPage={!rig || unavailable}>
<AtlasBreadcrumbs items={[{ label: "Снасти", href: "/tackle" }, { label: "Сборки" }, { label: rig?.name ?? "Не найдено" }]} />
@@ -37,6 +42,7 @@ const sourceHref = safeHttpUrl(rig?.source_url);
<div><span class="overline">Компоненты</span><ol class="rig-components">{rig.components.length ? rig.components.map(component => <li><span>{roleLabels[component.role] ?? component.role}</span>{component.tackle_item_id ? <a href={`/tackle/items/${component.tackle_item_id}`}>{component.raw_value ?? "Карточка снасти"}</a> : <span>{component.raw_value ?? "Значение не указано"}</span>}</li>) : <li>Состав не указан.</li>}</ol>{missing.length > 0 && <p class="tackle-detail__missing"><strong>Не хватает:</strong> {missing.join(", ")}.</p>}{sourceHref && <a data-action="secondary" href={sourceHref} rel="noreferrer">Открыть первоисточник</a>}</div>
</section>
<DataPassport sources={rig.source_system ? [rig.source_system] : []} sourceUrl={rig.source_url} observedAt={rig.source_checked_at} completeness={missing.length ? null : 100} status={missing.length ? "incomplete" : rig.source_checked_at ? "verified" : "unverified"} />
{mediaCandidates.length > 0 && <section class="catalog-media-grid content-grid" aria-label={`Изображения сборки: ${rig.name}`}>{mediaCandidates.map(asset => <article><span class="overline">{mediaRoleLabel(asset.media_role ?? "")}</span><EntityMedia asset={asset} sourceLink /></article>)}</section>}
</>}
</Layout>