Filter meteo warnings by local county
This commit is contained in:
@@ -10,6 +10,7 @@ import { useI18n } from "@/lib/i18n";
|
||||
import { formatProvinceName, getProvinceForSelection } from "@/lib/provinces";
|
||||
import { useWeatherStore } from "@/lib/store";
|
||||
import { formatDateTime } from "@/lib/weather-utils";
|
||||
import { warningMatchesLocalSelection } from "@/lib/warning-regions";
|
||||
import type { WeatherWarning } from "@/types/imgw";
|
||||
|
||||
const MAX_VISIBLE_WARNINGS = 2;
|
||||
@@ -52,6 +53,7 @@ export function DashboardWarnings() {
|
||||
}, []);
|
||||
|
||||
const province = getProvinceForSelection(selectedLocation?.province, selectedStationId ?? DEFAULT_STATION_ID);
|
||||
const regionLabel = selectedLocation?.countyTeryt ? selectedLocation.district ?? selectedLocation.name : province ? formatProvinceName(province, language) : null;
|
||||
const relevantWarnings = useMemo(() => {
|
||||
if (!warnings || !province || now === null) return [];
|
||||
|
||||
@@ -59,13 +61,13 @@ export function DashboardWarnings() {
|
||||
.filter((warning) => {
|
||||
const validTo = getTimestamp(warning.validTo);
|
||||
return warning.kind === "meteo"
|
||||
&& warning.provinces.includes(province)
|
||||
&& warningMatchesLocalSelection(warning, province, selectedLocation)
|
||||
&& (validTo === null || validTo > now);
|
||||
})
|
||||
.sort((a, b) => compareDashboardWarnings(a, b, now));
|
||||
}, [now, province, warnings]);
|
||||
}, [now, province, selectedLocation, warnings]);
|
||||
|
||||
if (!province || !relevantWarnings.length || now === null) return null;
|
||||
if (!province || !regionLabel || !relevantWarnings.length || now === null) return null;
|
||||
|
||||
const visibleWarnings = relevantWarnings.slice(0, MAX_VISIBLE_WARNINGS);
|
||||
const hiddenWarningsCount = relevantWarnings.length - visibleWarnings.length;
|
||||
@@ -85,7 +87,7 @@ export function DashboardWarnings() {
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-[0.68rem] font-semibold uppercase tracking-[0.2em] text-warning">
|
||||
IMGW · {formatProvinceName(province, language)}
|
||||
IMGW · {regionLabel}
|
||||
</p>
|
||||
<h2 className="mt-1 text-base font-semibold text-foreground">
|
||||
{t("warnings.dashboard.title")}
|
||||
|
||||
@@ -10,6 +10,7 @@ import { DEFAULT_STATION_ID } from "@/lib/constants";
|
||||
import { useI18n } from "@/lib/i18n";
|
||||
import { formatProvinceName, getProvinceForSelection } from "@/lib/provinces";
|
||||
import { useWeatherStore } from "@/lib/store";
|
||||
import { warningMatchesLocalSelection } from "@/lib/warning-regions";
|
||||
import type { WeatherWarning } from "@/types/imgw";
|
||||
|
||||
function WarningGrid({ warnings, indexOffset = 0 }: { warnings: WeatherWarning[]; indexOffset?: number }) {
|
||||
@@ -33,20 +34,21 @@ export function WarningsPanel() {
|
||||
if (!province) return <WarningGrid warnings={warnings} />;
|
||||
|
||||
const provinceLabel = formatProvinceName(province, language);
|
||||
const localWarnings = warnings.filter((warning) => warning.provinces.includes(province));
|
||||
const otherWarnings = warnings.filter((warning) => !warning.provinces.includes(province));
|
||||
const localLabel = selectedLocation?.countyTeryt ? selectedLocation.district ?? selectedLocation.name : provinceLabel;
|
||||
const localWarnings = warnings.filter((warning) => warningMatchesLocalSelection(warning, province, selectedLocation));
|
||||
const otherWarnings = warnings.filter((warning) => !warningMatchesLocalSelection(warning, province, selectedLocation));
|
||||
|
||||
return (
|
||||
<div className="space-y-9">
|
||||
<section className="space-y-4">
|
||||
<div>
|
||||
<p className="section-kicker flex items-center gap-2"><MapPinned className="size-4" />{t("warnings.myProvince")}</p>
|
||||
<h2 className="mt-2 text-2xl font-semibold capitalize tracking-tight">{provinceLabel}</h2>
|
||||
<p className="mt-1 max-w-2xl text-sm leading-6 text-muted">{t("warnings.myProvinceDescription", { province: provinceLabel })}</p>
|
||||
<h2 className="mt-2 text-2xl font-semibold capitalize tracking-tight">{localLabel}</h2>
|
||||
<p className="mt-1 max-w-2xl text-sm leading-6 text-muted">{t("warnings.myProvinceDescription", { province: localLabel })}</p>
|
||||
</div>
|
||||
{localWarnings.length
|
||||
? <WarningGrid warnings={localWarnings} />
|
||||
: <EmptyState title={t("warnings.myProvinceEmptyTitle")} description={t("warnings.myProvinceEmptyDescription", { province: provinceLabel })} />}
|
||||
: <EmptyState title={t("warnings.myProvinceEmptyTitle")} description={t("warnings.myProvinceEmptyDescription", { province: localLabel })} />}
|
||||
</section>
|
||||
|
||||
{otherWarnings.length > 0 && (
|
||||
|
||||
Reference in New Issue
Block a user