fix(ui): сохранять вкладку и фильтры Ping в URL

This commit is contained in:
Denozordec committed 2026-09-23 09:24:18 +07:00
1 parent f7e0e20673
commit fd7a08d5dc
7 files changed
+157 -9

No files matched your search

+9 -7
View File
@@ -4,6 +4,7 @@ import probeStyles from "./probe-rows.module.css"
import { Suspense, useState, useMemo, useEffect, useRef, useCallback } from "react"
import Link from "next/link"
import { useUptimeUrlState } from "@/hooks/use-uptime-url-state"
import { serverOperationError } from "@/lib/server-operations"
import { can } from "@/lib/auth"
import { useSearchParams } from "next/navigation"
@@ -1078,13 +1079,10 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
const [overviewState, setOverviewState] = useState<"loading" | "ready" | "error">("loading")
const [allServers, setAllServers] = useState<Server[]>([])
const [tab, setTab] = useState<"probes" | "resources" | "speed">("probes")
const { tab, setTab, search, setSearch, statusFilter, setStatusFilter, serverFilter, setServerFilter, error: urlError, resetFilters, resetUrl } = useUptimeUrlState()
const [probes, setProbes] = useState<PingProbe[]>([])
const [resources, setResources] = useState<ServerResource[]>([])
const [isPaused, setIsPaused] = useState(false)
const [search, setSearch] = useState("")
const [statusFilter, setStatusFilter] = useState<"all" | "up" | "warn" | "down">("all")
const [serverFilter, setServerFilter] = useState<string[]>([])
const [collapsed, setCollapsed] = useState<Set<string>>(new Set())
const [sheetOpen, setSheetOpen] = useState(false)
const [opError, setOpError] = useState<string | null>(null)
@@ -1438,6 +1436,7 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
const selectedProbeServer = allServers.find(server => server.id === selectedProbe?.srcServerId)
const filtered = useMemo(() => probes.filter(p => {
if (urlError) return false
if (selectedProbeId !== null && p.id !== selectedProbeId) return false
if (serverFilter.length > 0 && !serverFilter.includes(p.srcServerId)) return false
if (statusFilter !== "all" && p.status !== statusFilter) return false
@@ -1450,7 +1449,7 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
)
}
return true
}), [probes, serverFilter, statusFilter, search, selectedProbeId])
}), [probes, serverFilter, statusFilter, search, selectedProbeId, urlError])
const grouped = useMemo(() => {
const byServer = new Map<string, Map<string, { name: string; target: string; probes: PingProbe[] }>>()
@@ -2023,6 +2022,8 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
{probeSaveError && !sheetOpen && !speedSheetOpen && !deleteTarget && <ContextAlert variant="destructive" role="alert"><ContextDescription>{probeSaveError}</ContextDescription></ContextAlert>}
{urlError && <ContextAlert variant="warning" role="alert"><ContextTitle>Параметры ссылки требуют внимания</ContextTitle><ContextDescription>{urlError}<Button type="button" variant="outline" size="sm" onClick={resetUrl}>Сбросить параметры мониторинга</Button></ContextDescription></ContextAlert>}
{/* ── Live indicator ── */}
{!isPaused && (
<div className="flex items-center gap-2 px-6 py-1.5 border-b shrink-0 text-[11px]"
@@ -2048,6 +2049,7 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
{(["probes", "resources", "speed"] as const).map(t => (
<button
key={t}
type="button" aria-pressed={tab === t}
onClick={() => setTab(t)}
className={cn(
"px-4 py-2.5 text-sm font-medium border-b-2 transition-colors -mb-px",
@@ -2408,7 +2410,7 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
const sProbes = probes.filter(p => p.srcServerId === s.id)
const hasIssues = sProbes.some(p => p.status !== "up")
return (
<button key={s.id} onClick={() => toggleServerFilter(s.id)}
<button key={s.id} type="button" aria-pressed={active} onClick={() => toggleServerFilter(s.id)}
className={cn(
"inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-[11px] font-medium transition-all",
active
@@ -2442,7 +2444,7 @@ function UptimePageContent({ selectedProbeId, allProbesHref }: { selectedProbeId
{(search || statusFilter !== "all" || serverFilter.length > 0) && (
<Button variant="ghost" size="sm" className="text-muted-foreground h-8 px-2"
onClick={() => { setSearch(""); setStatusFilter("all"); setServerFilter([]) }}>
onClick={resetFilters}>
<XIcon className="size-3.5" />Сбросить
</Button>
)}