diff --git a/app/api/traces/route.ts b/app/api/traces/route.ts index 64034c71..ffb0c214 100644 --- a/app/api/traces/route.ts +++ b/app/api/traces/route.ts @@ -10,7 +10,8 @@ export async function POST(req: NextRequest) { try { const session = await getServerSession(authOptions); const apiKey = req.headers.get("x-api-key"); - const { page, pageSize, projectId, filters } = await req.json(); + const { page, pageSize, projectId, filters, filterOperation } = + await req.json(); if (!session || !session.user) { if (apiKey) { const project = await prisma.project.findFirst({ @@ -42,7 +43,8 @@ export async function POST(req: NextRequest) { projectId, page, pageSize, - filters + filters, + filterOperation ); return NextResponse.json( diff --git a/components/project/traces/trace-filter.tsx b/components/project/traces/trace-filter.tsx index 27391688..22dc240d 100644 --- a/components/project/traces/trace-filter.tsx +++ b/components/project/traces/trace-filter.tsx @@ -22,6 +22,7 @@ import { PopoverContent, PopoverTrigger, } from "@/components/ui/popover"; +import ClearIcon from "@mui/icons-material/Clear"; import { Check, ChevronsUpDown } from "lucide-react"; import { useEffect, useState } from "react"; @@ -184,6 +185,21 @@ export default function FilterDialog({ + {(selectedFilters.length > 0 || + advancedFilters.length > 0 || + selectedUserId !== "") && ( + + )} diff --git a/components/project/traces/traces.tsx b/components/project/traces/traces.tsx index 9c56c06f..4a41af56 100644 --- a/components/project/traces/traces.tsx +++ b/components/project/traces/traces.tsx @@ -29,7 +29,8 @@ export default function Traces({ email }: { email: string }) { const [enableFetch, setEnableFetch] = useState(false); const [utcTime, setUtcTime] = useState(true); const [isFilterDialogOpen, setIsFilterDialogOpen] = useState(false); - const [userId, setUserId] = useState(""); + const [clearFilters, setClearFilters] = useState(false); + const [clearFiltersKey, setClearFiltersKey] = useState(0); useEffect(() => { setShowLoader(true); @@ -58,6 +59,7 @@ export default function Traces({ email }: { email: string }) { pageSize: PAGE_SIZE, projectId: project_id, filters: filters, + filterOperation: "AND", }; const response = await fetch(apiEndpoint, { diff --git a/components/shared/user-combobox.tsx b/components/shared/user-combobox.tsx index 19b11a90..6cd74a86 100644 --- a/components/shared/user-combobox.tsx +++ b/components/shared/user-combobox.tsx @@ -16,7 +16,7 @@ import { import { Check, ChevronsUpDown } from "lucide-react"; import { useParams } from "next/navigation"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import { useQuery } from "react-query"; import { toast } from "sonner"; @@ -34,6 +34,8 @@ export function UserCombobox({ const [searchQuery, setSearchQuery] = useState(""); const [userIds, setUserIds] = useState([]); const [showLoader, setShowLoader] = useState(false); + const [internalSelectedUser, setInternalSelectedUser] = + useState(selectedUser); const handleSelectUser = (currentValue: string) => { const newUserId = currentValue === selectedUserId ? "" : currentValue; @@ -43,6 +45,11 @@ export function UserCombobox({ setOpen(false); }; + useEffect(() => { + setSelectedUserIdState(selectedUser || ""); + setInternalSelectedUser(selectedUser || ""); + }, [selectedUser]); + const fetchUserIds = useQuery({ queryKey: ["fetch-user-ids-query", project_id], queryFn: async () => {