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 () => {