feat: Persist agents page filter in URL query params, default to questions
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { createFileRoute, useNavigate } from "@tanstack/react-router";
|
import { createFileRoute, useNavigate, useSearch } from "@tanstack/react-router";
|
||||||
import { AlertCircle, RefreshCw } from "lucide-react";
|
import { AlertCircle, RefreshCw } from "lucide-react";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Card } from "@/components/ui/card";
|
import { Card } from "@/components/ui/card";
|
||||||
@@ -15,15 +15,21 @@ import { modeLabel } from "@/lib/labels";
|
|||||||
import { StatusDot } from "@/components/StatusDot";
|
import { StatusDot } from "@/components/StatusDot";
|
||||||
import { useLiveUpdates } from "@/hooks";
|
import { useLiveUpdates } from "@/hooks";
|
||||||
|
|
||||||
|
type StatusFilter = "all" | "running" | "questions" | "exited" | "dismissed";
|
||||||
|
const STATUS_FILTERS = ["all", "running", "questions", "exited", "dismissed"] as const;
|
||||||
|
|
||||||
export const Route = createFileRoute("/agents")({
|
export const Route = createFileRoute("/agents")({
|
||||||
component: AgentsPage,
|
component: AgentsPage,
|
||||||
|
validateSearch: (search: Record<string, unknown>) => ({
|
||||||
|
filter: STATUS_FILTERS.includes(search.filter as StatusFilter)
|
||||||
|
? (search.filter as StatusFilter)
|
||||||
|
: "questions",
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
type StatusFilter = "all" | "running" | "questions" | "exited" | "dismissed";
|
|
||||||
|
|
||||||
function AgentsPage() {
|
function AgentsPage() {
|
||||||
const [selectedAgentId, setSelectedAgentId] = useState<string | null>(null);
|
const [selectedAgentId, setSelectedAgentId] = useState<string | null>(null);
|
||||||
const [filter, setFilter] = useState<StatusFilter>("all");
|
const { filter } = useSearch({ from: "/agents" });
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
// Live updates
|
// Live updates
|
||||||
@@ -196,7 +202,7 @@ function AgentsPage() {
|
|||||||
variant={filter === opt.value ? "default" : "outline"}
|
variant={filter === opt.value ? "default" : "outline"}
|
||||||
size="sm"
|
size="sm"
|
||||||
className="h-7 px-2 text-xs"
|
className="h-7 px-2 text-xs"
|
||||||
onClick={() => setFilter(opt.value)}
|
onClick={() => navigate({ to: "/agents", search: { filter: opt.value } })}
|
||||||
>
|
>
|
||||||
{opt.label}
|
{opt.label}
|
||||||
<Badge
|
<Badge
|
||||||
|
|||||||
Reference in New Issue
Block a user