@motiadev/plugin-observability 0.14.0-beta.165-958021 → 0.14.0-beta.165-246284

package/dist/index.js

@@ -27,18 +27,22 @@ const useObservabilityStore = create()((set) => ({
 //#endregion
 //#region src/components/search-bar.tsx
 const SearchBar = memo(() => {
-	const $ = c(23);
+	const $ = c(24);
+	if ($[0] !== "0d378097fa8da23c1a1ca72ef31fe4b19f0c9bbeda9092deafe087d58425242d") {
+		for (let $i = 0; $i < 24; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "0d378097fa8da23c1a1ca72ef31fe4b19f0c9bbeda9092deafe087d58425242d";
+	}
 	const search = useObservabilityStore(_temp$6);
 	const setSearch = useObservabilityStore(_temp2$3);
 	const clearTraces = useObservabilityStore(_temp3$1);
 	let t0;
-	if ($[0] !== setSearch) {
+	if ($[1] !== setSearch) {
 		t0 = (e) => setSearch(e.target.value);
-		$[0] = setSearch;
-		$[1] = t0;
-	} else t0 = $[1];
+		$[1] = setSearch;
+		$[2] = t0;
+	} else t0 = $[2];
 	let t1;
-	if ($[2] !== search || $[3] !== t0) {
+	if ($[3] !== search || $[4] !== t0) {
 		t1 = /* @__PURE__ */ jsx(Input, {
 			variant: "shade",
 			value: search,
@@ -46,45 +50,45 @@ const SearchBar = memo(() => {
 			className: "px-9! font-medium",
 			placeholder: "Search by Trace ID or Step Name"
 		});
-		$[2] = search;
-		$[3] = t0;
-		$[4] = t1;
-	} else t1 = $[4];
+		$[3] = search;
+		$[4] = t0;
+		$[5] = t1;
+	} else t1 = $[5];
 	let t2;
-	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
 		t2 = /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50" });
-		$[5] = t2;
-	} else t2 = $[5];
+		$[6] = t2;
+	} else t2 = $[6];
 	const t3 = search !== "";
 	const t4 = search === "";
 	let t5;
-	if ($[6] !== t3 || $[7] !== t4) {
+	if ($[7] !== t3 || $[8] !== t4) {
 		t5 = cn("cursor-pointer absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50 hover:text-muted-foreground", {
 			visible: t3,
 			invisible: t4
 		});
-		$[6] = t3;
-		$[7] = t4;
-		$[8] = t5;
-	} else t5 = $[8];
+		$[7] = t3;
+		$[8] = t4;
+		$[9] = t5;
+	} else t5 = $[9];
 	let t6;
-	if ($[9] !== setSearch) {
+	if ($[10] !== setSearch) {
 		t6 = () => setSearch("");
-		$[9] = setSearch;
-		$[10] = t6;
-	} else t6 = $[10];
+		$[10] = setSearch;
+		$[11] = t6;
+	} else t6 = $[11];
 	let t7;
-	if ($[11] !== t5 || $[12] !== t6) {
+	if ($[12] !== t5 || $[13] !== t6) {
 		t7 = /* @__PURE__ */ jsx(X, {
 			className: t5,
 			onClick: t6
 		});
-		$[11] = t5;
-		$[12] = t6;
-		$[13] = t7;
-	} else t7 = $[13];
+		$[12] = t5;
+		$[13] = t6;
+		$[14] = t7;
+	} else t7 = $[14];
 	let t8;
-	if ($[14] !== t1 || $[15] !== t7) {
+	if ($[15] !== t1 || $[16] !== t7) {
 		t8 = /* @__PURE__ */ jsxs("div", {
 			className: "flex-1 relative",
 			children: [
@@ -93,37 +97,37 @@ const SearchBar = memo(() => {
 				t7
 			]
 		});
-		$[14] = t1;
-		$[15] = t7;
-		$[16] = t8;
-	} else t8 = $[16];
+		$[15] = t1;
+		$[16] = t7;
+		$[17] = t8;
+	} else t8 = $[17];
 	let t9;
-	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
 		t9 = /* @__PURE__ */ jsx(Trash, {});
-		$[17] = t9;
-	} else t9 = $[17];
+		$[18] = t9;
+	} else t9 = $[18];
 	let t10;
-	if ($[18] !== clearTraces) {
+	if ($[19] !== clearTraces) {
 		t10 = /* @__PURE__ */ jsxs(Button, {
 			variant: "default",
 			onClick: clearTraces,
 			className: "h-[34px]",
 			children: [t9, " Clear"]
 		});
-		$[18] = clearTraces;
-		$[19] = t10;
-	} else t10 = $[19];
+		$[19] = clearTraces;
+		$[20] = t10;
+	} else t10 = $[20];
 	let t11;
-	if ($[20] !== t10 || $[21] !== t8) {
+	if ($[21] !== t10 || $[22] !== t8) {
 		t11 = /* @__PURE__ */ jsxs("div", {
 			className: "flex p-2 border-b gap-2",
 			"data-testid": "logs-search-container",
 			children: [t8, t10]
 		});
-		$[20] = t10;
-		$[21] = t8;
-		$[22] = t11;
-	} else t11 = $[22];
+		$[21] = t10;
+		$[22] = t8;
+		$[23] = t11;
+	} else t11 = $[23];
 	return t11;
 });
 SearchBar.displayName = "SearchBar";
@@ -140,16 +144,20 @@ function _temp3$1(state_1) {
 //#endregion
 //#region src/components/trace-empty-state.tsx
 const TraceEmptyState = memo(() => {
-	const $ = c(1);
+	const $ = c(2);
+	if ($[0] !== "2108089e2c746ed0862d68dda608395c37fa47e1141188e212f129d7d9fe3d12") {
+		for (let $i = 0; $i < 2; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "2108089e2c746ed0862d68dda608395c37fa47e1141188e212f129d7d9fe3d12";
+	}
 	if (useObservabilityStore(_temp$5)) return null;
 	let t0;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = /* @__PURE__ */ jsx("div", {
 			className: "flex items-center justify-center h-full text-muted-foreground text-center",
 			children: "Select a trace or trace group to view the timeline"
 		});
-		$[0] = t0;
-	} else t0 = $[0];
+		$[1] = t0;
+	} else t0 = $[1];
 	return t0;
 });
 TraceEmptyState.displayName = "TraceEmptyState";
@@ -160,19 +168,23 @@ function _temp$5(state) {
 //#endregion
 //#region src/hooks/use-get-endtime.ts
 const useGetEndTime = (group) => {
-	const $ = c(5);
+	const $ = c(6);
+	if ($[0] !== "f07b1721656d8064013e11ff58f0cb63e38b74f1034170d677e517b5cd2fc048") {
+		for (let $i = 0; $i < 6; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "f07b1721656d8064013e11ff58f0cb63e38b74f1034170d677e517b5cd2fc048";
+	}
 	const groupEndTime = group?.endTime;
 	let t0;
-	if ($[0] !== groupEndTime) {
+	if ($[1] !== groupEndTime) {
 		t0 = () => groupEndTime || Date.now();
-		$[0] = groupEndTime;
-		$[1] = t0;
-	} else t0 = $[1];
+		$[1] = groupEndTime;
+		$[2] = t0;
+	} else t0 = $[2];
 	const [endTime, setEndTime] = useState(t0);
 	const intervalRef = useRef(null);
 	let t1;
 	let t2;
-	if ($[2] !== groupEndTime) {
+	if ($[3] !== groupEndTime) {
 		t1 = () => {
 			if (intervalRef.current) {
 				clearInterval(intervalRef.current);
@@ -188,12 +200,12 @@ const useGetEndTime = (group) => {
 			};
 		};
 		t2 = [groupEndTime];
-		$[2] = groupEndTime;
-		$[3] = t1;
-		$[4] = t2;
+		$[3] = groupEndTime;
+		$[4] = t1;
+		$[5] = t2;
 	} else {
-		t1 = $[3];
-		t2 = $[4];
+		t1 = $[4];
+		t2 = $[5];
 	}
 	useEffect(t1, t2);
 	return endTime;
@@ -217,41 +229,45 @@ const GRADIENT_CLASSES = {
 	failed: "bg-[repeating-linear-gradient(140deg,#EA2069,#EA2069_8px,#D41E60_8px,#D41E60_16px)]"
 };
 const TraceItem = memo((t0) => {
-	const $ = c(17);
+	const $ = c(18);
+	if ($[0] !== "3296a69d1668d9416c4211c6d1cf083f73fcfe03edbf7e74160503957cdfe795") {
+		for (let $i = 0; $i < 18; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "3296a69d1668d9416c4211c6d1cf083f73fcfe03edbf7e74160503957cdfe795";
+	}
 	const { traceId, traceName, traceStatus, traceStartTime, traceEndTime, groupStartTime, groupEndTime, onExpand } = t0;
 	let t1;
-	if ($[0] !== onExpand || $[1] !== traceId) {
+	if ($[1] !== onExpand || $[2] !== traceId) {
 		t1 = () => {
 			onExpand(traceId);
 		};
-		$[0] = onExpand;
-		$[1] = traceId;
-		$[2] = t1;
-	} else t1 = $[2];
+		$[1] = onExpand;
+		$[2] = traceId;
+		$[3] = t1;
+	} else t1 = $[3];
 	const handleClick = t1;
 	const t2 = GRADIENT_CLASSES[traceStatus];
 	let t3;
-	if ($[3] !== t2) {
+	if ($[4] !== t2) {
 		t3 = cn("h-[24px] rounded-[4px] hover:opacity-80 transition-all duration-200", t2);
-		$[3] = t2;
-		$[4] = t3;
-	} else t3 = $[4];
+		$[4] = t2;
+		$[5] = t3;
+	} else t3 = $[5];
 	const barClassName = t3;
 	const t4 = `${(traceStartTime - groupStartTime) / (groupEndTime - groupStartTime) * 100}%`;
 	const t5 = traceEndTime ? `${(traceEndTime - traceStartTime) / (groupEndTime - groupStartTime) * 100}%` : `${(Date.now() - traceStartTime) / (groupEndTime - groupStartTime) * 100}%`;
 	let t6;
-	if ($[5] !== t4 || $[6] !== t5) {
+	if ($[6] !== t4 || $[7] !== t5) {
 		t6 = {
 			marginLeft: t4,
 			width: t5
 		};
-		$[5] = t4;
-		$[6] = t5;
-		$[7] = t6;
-	} else t6 = $[7];
+		$[6] = t4;
+		$[7] = t5;
+		$[8] = t6;
+	} else t6 = $[8];
 	const barStyle = t6;
 	let t7;
-	if ($[8] !== traceName) {
+	if ($[9] !== traceName) {
 		t7 = /* @__PURE__ */ jsx("div", {
 			className: "flex items-center min-w-[200px] max-w-[200px] h-[32px] max-h-[32px] py-4 px-2 text-sm font-semibold text-foreground sticky left-0 bg-card z-9",
 			children: /* @__PURE__ */ jsx("span", {
@@ -259,11 +275,11 @@ const TraceItem = memo((t0) => {
 				children: traceName
 			})
 		});
-		$[8] = traceName;
-		$[9] = t7;
-	} else t7 = $[9];
+		$[9] = traceName;
+		$[10] = t7;
+	} else t7 = $[10];
 	let t8;
-	if ($[10] !== barClassName || $[11] !== barStyle) {
+	if ($[11] !== barClassName || $[12] !== barStyle) {
 		t8 = /* @__PURE__ */ jsx("div", {
 			className: "flex w-full flex-row items-center hover:bg-muted/50 rounded-md",
 			children: /* @__PURE__ */ jsx("div", {
@@ -274,23 +290,23 @@ const TraceItem = memo((t0) => {
 				})
 			})
 		});
-		$[10] = barClassName;
-		$[11] = barStyle;
-		$[12] = t8;
-	} else t8 = $[12];
+		$[11] = barClassName;
+		$[12] = barStyle;
+		$[13] = t8;
+	} else t8 = $[13];
 	let t9;
-	if ($[13] !== handleClick || $[14] !== t7 || $[15] !== t8) {
+	if ($[14] !== handleClick || $[15] !== t7 || $[16] !== t8) {
 		t9 = /* @__PURE__ */ jsxs("div", {
 			className: "flex hover:bg-muted-foreground/10 relative cursor-pointer",
 			onClick: handleClick,
 			"data-testid": "trace-timeline-item",
 			children: [t7, t8]
 		});
-		$[13] = handleClick;
-		$[14] = t7;
-		$[15] = t8;
-		$[16] = t9;
-	} else t9 = $[16];
+		$[14] = handleClick;
+		$[15] = t7;
+		$[16] = t8;
+		$[17] = t9;
+	} else t9 = $[17];
 	return t9;
 });
 TraceItem.displayName = "TraceItem";
@@ -298,47 +314,55 @@ TraceItem.displayName = "TraceItem";
 //#endregion
 //#region src/components/events/event-icon.tsx
 const EventIcon = (t0) => {
-	const $ = c(4);
+	const $ = c(5);
+	if ($[0] !== "a1e6111b39d1930b766ba2ebca3959949a34edb0ba32f492db6cf8ba92b7256a") {
+		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "a1e6111b39d1930b766ba2ebca3959949a34edb0ba32f492db6cf8ba92b7256a";
+	}
 	const { event } = t0;
 	if (event.type === "log") {
-		let t1;
-		if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-			t1 = /* @__PURE__ */ jsx(ScrollText, { className: "w-4 h-4 text-muted-foreground" });
-			$[0] = t1;
-		} else t1 = $[0];
-		return t1;
-	} else if (event.type === "emit") {
 		let t1;
 		if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-			t1 = /* @__PURE__ */ jsx(MessageCircle, { className: "w-4 h-4 text-muted-foreground" });
+			t1 = /* @__PURE__ */ jsx(ScrollText, { className: "w-4 h-4 text-muted-foreground" });
 			$[1] = t1;
 		} else t1 = $[1];
 		return t1;
-	} else if (event.type === "state") {
+	} else if (event.type === "emit") {
 		let t1;
 		if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-			t1 = /* @__PURE__ */ jsx(Package, { className: "w-4 h-4 text-muted-foreground" });
+			t1 = /* @__PURE__ */ jsx(MessageCircle, { className: "w-4 h-4 text-muted-foreground" });
 			$[2] = t1;
 		} else t1 = $[2];
 		return t1;
-	} else if (event.type === "stream") {
+	} else if (event.type === "state") {
 		let t1;
 		if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-			t1 = /* @__PURE__ */ jsx(Radio, { className: "w-4 h-4 text-muted-foreground" });
+			t1 = /* @__PURE__ */ jsx(Package, { className: "w-4 h-4 text-muted-foreground" });
 			$[3] = t1;
 		} else t1 = $[3];
 		return t1;
+	} else if (event.type === "stream") {
+		let t1;
+		if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+			t1 = /* @__PURE__ */ jsx(Radio, { className: "w-4 h-4 text-muted-foreground" });
+			$[4] = t1;
+		} else t1 = $[4];
+		return t1;
 	}
 };
 
 //#endregion
 //#region src/components/ui/copy-button.tsx
 const CopyButton = (t0) => {
-	const $ = c(11);
+	const $ = c(12);
+	if ($[0] !== "369763ad5970a7e166e1ca288cc760280bc27f103992fd9a47b59d832664d39c") {
+		for (let $i = 0; $i < 12; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "369763ad5970a7e166e1ca288cc760280bc27f103992fd9a47b59d832664d39c";
+	}
 	const { textToCopy, className, title } = t0;
 	const [copied, setCopied] = useState(false);
 	let t1;
-	if ($[0] !== textToCopy) {
+	if ($[1] !== textToCopy) {
 		t1 = async () => {
 			try {
 				await navigator.clipboard.writeText(textToCopy);
@@ -349,25 +373,25 @@ const CopyButton = (t0) => {
 				console.error("Failed to copy:", error);
 			}
 		};
-		$[0] = textToCopy;
-		$[1] = t1;
-	} else t1 = $[1];
+		$[1] = textToCopy;
+		$[2] = t1;
+	} else t1 = $[2];
 	const handleCopy = t1;
 	let t2;
-	if ($[2] !== className) {
+	if ($[3] !== className) {
 		t2 = cn("cursor-pointer p-3 rounded-full", className);
-		$[2] = className;
-		$[3] = t2;
-	} else t2 = $[3];
+		$[3] = className;
+		$[4] = t2;
+	} else t2 = $[4];
 	const t3 = title ?? (copied ? "Copied!" : "Copy");
 	let t4;
-	if ($[4] !== copied) {
+	if ($[5] !== copied) {
 		t4 = copied ? /* @__PURE__ */ jsx(Check, { className: "w-4 h-4 text-green-500" }) : /* @__PURE__ */ jsx(Copy, { className: "w-4 h-4 text-gray-400" });
-		$[4] = copied;
-		$[5] = t4;
-	} else t4 = $[5];
+		$[5] = copied;
+		$[6] = t4;
+	} else t4 = $[6];
 	let t5;
-	if ($[6] !== handleCopy || $[7] !== t2 || $[8] !== t3 || $[9] !== t4) {
+	if ($[7] !== handleCopy || $[8] !== t2 || $[9] !== t3 || $[10] !== t4) {
 		t5 = /* @__PURE__ */ jsx(Button, {
 			variant: "icon",
 			size: "icon",
@@ -376,84 +400,96 @@ const CopyButton = (t0) => {
 			title: t3,
 			children: t4
 		});
-		$[6] = handleCopy;
-		$[7] = t2;
-		$[8] = t3;
-		$[9] = t4;
-		$[10] = t5;
-	} else t5 = $[10];
+		$[7] = handleCopy;
+		$[8] = t2;
+		$[9] = t3;
+		$[10] = t4;
+		$[11] = t5;
+	} else t5 = $[11];
 	return t5;
 };
 
 //#endregion
 //#region src/components/ui/popover.tsx
 const Popover = (t0) => {
-	const $ = c(4);
+	const $ = c(5);
+	if ($[0] !== "f0c325c78a10b590d1cfefafc6cbfda4c4948cc8b9838222f88cb7d84a6d7a8b") {
+		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "f0c325c78a10b590d1cfefafc6cbfda4c4948cc8b9838222f88cb7d84a6d7a8b";
+	}
 	let props;
-	if ($[0] !== t0) {
+	if ($[1] !== t0) {
 		({...props} = t0);
-		$[0] = t0;
-		$[1] = props;
-	} else props = $[1];
+		$[1] = t0;
+		$[2] = props;
+	} else props = $[2];
 	let t1;
-	if ($[2] !== props) {
+	if ($[3] !== props) {
 		t1 = /* @__PURE__ */ jsx(PopoverPrimitive.Root, {
 			"data-slot": "popover",
 			...props
 		});
-		$[2] = props;
-		$[3] = t1;
-	} else t1 = $[3];
+		$[3] = props;
+		$[4] = t1;
+	} else t1 = $[4];
 	return t1;
 };
 const PopoverTrigger = (t0) => {
-	const $ = c(4);
+	const $ = c(5);
+	if ($[0] !== "f0c325c78a10b590d1cfefafc6cbfda4c4948cc8b9838222f88cb7d84a6d7a8b") {
+		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "f0c325c78a10b590d1cfefafc6cbfda4c4948cc8b9838222f88cb7d84a6d7a8b";
+	}
 	let props;
-	if ($[0] !== t0) {
+	if ($[1] !== t0) {
 		({...props} = t0);
-		$[0] = t0;
-		$[1] = props;
-	} else props = $[1];
+		$[1] = t0;
+		$[2] = props;
+	} else props = $[2];
 	let t1;
-	if ($[2] !== props) {
+	if ($[3] !== props) {
 		t1 = /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, {
 			"data-slot": "popover-trigger",
 			...props
 		});
-		$[2] = props;
-		$[3] = t1;
-	} else t1 = $[3];
+		$[3] = props;
+		$[4] = t1;
+	} else t1 = $[4];
 	return t1;
 };
 const PopoverContent = (t0) => {
-	const $ = c(12);
+	const $ = c(13);
+	if ($[0] !== "f0c325c78a10b590d1cfefafc6cbfda4c4948cc8b9838222f88cb7d84a6d7a8b") {
+		for (let $i = 0; $i < 13; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "f0c325c78a10b590d1cfefafc6cbfda4c4948cc8b9838222f88cb7d84a6d7a8b";
+	}
 	let className;
 	let props;
 	let t1;
 	let t2;
-	if ($[0] !== t0) {
+	if ($[1] !== t0) {
 		({className, align: t1, sideOffset: t2, ...props} = t0);
-		$[0] = t0;
-		$[1] = className;
-		$[2] = props;
-		$[3] = t1;
-		$[4] = t2;
+		$[1] = t0;
+		$[2] = className;
+		$[3] = props;
+		$[4] = t1;
+		$[5] = t2;
 	} else {
-		className = $[1];
-		props = $[2];
-		t1 = $[3];
-		t2 = $[4];
+		className = $[2];
+		props = $[3];
+		t1 = $[4];
+		t2 = $[5];
 	}
 	const align = t1 === void 0 ? "center" : t1;
 	const sideOffset = t2 === void 0 ? 4 : t2;
 	let t3;
-	if ($[5] !== className) {
+	if ($[6] !== className) {
 		t3 = cn("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden", className);
-		$[5] = className;
-		$[6] = t3;
-	} else t3 = $[6];
+		$[6] = className;
+		$[7] = t3;
+	} else t3 = $[7];
 	let t4;
-	if ($[7] !== align || $[8] !== props || $[9] !== sideOffset || $[10] !== t3) {
+	if ($[8] !== align || $[9] !== props || $[10] !== sideOffset || $[11] !== t3) {
 		t4 = /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(PopoverPrimitive.Content, {
 			"data-slot": "popover-content",
 			align,
@@ -461,12 +497,12 @@ const PopoverContent = (t0) => {
 			className: t3,
 			...props
 		}) });
-		$[7] = align;
-		$[8] = props;
-		$[9] = sideOffset;
-		$[10] = t3;
-		$[11] = t4;
-	} else t4 = $[11];
+		$[8] = align;
+		$[9] = props;
+		$[10] = sideOffset;
+		$[11] = t3;
+		$[12] = t4;
+	} else t4 = $[12];
 	return t4;
 };
 
@@ -481,27 +517,31 @@ const formatArgumentValue = (arg) => {
 //#endregion
 //#region src/components/events/code/argument.tsx
 const Argument = memo((t0) => {
-	const $ = c(18);
+	const $ = c(19);
+	if ($[0] !== "c9966227012cab85e29278e1c8a710fd408ed34dfcad88a24d905811c73e1f19") {
+		for (let $i = 0; $i < 19; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "c9966227012cab85e29278e1c8a710fd408ed34dfcad88a24d905811c73e1f19";
+	}
 	const { arg, popover: t1 } = t0;
 	const popover = t1 === void 0 ? true : t1;
 	const isObject = typeof arg === "object" && arg !== null;
 	let t2;
-	if ($[0] !== arg) {
+	if ($[1] !== arg) {
 		t2 = formatArgumentValue(arg);
-		$[0] = arg;
-		$[1] = t2;
-	} else t2 = $[1];
+		$[1] = arg;
+		$[2] = t2;
+	} else t2 = $[2];
 	const value = t2;
 	let t3;
-	if ($[2] !== arg) {
+	if ($[3] !== arg) {
 		t3 = JSON.stringify(arg, null, 2);
-		$[2] = arg;
-		$[3] = t3;
-	} else t3 = $[3];
+		$[3] = arg;
+		$[4] = t3;
+	} else t3 = $[4];
 	const textToCopy = t3;
 	if (!popover) {
 		let t4$1;
-		if ($[4] !== arg || $[5] !== isObject || $[6] !== value) {
+		if ($[5] !== arg || $[6] !== isObject || $[7] !== value) {
 			t4$1 = /* @__PURE__ */ jsx(Fragment$1, { children: isObject ? /* @__PURE__ */ jsx(ReactJson, {
 				src: arg,
 				theme: "default",
@@ -511,15 +551,15 @@ const Argument = memo((t0) => {
 				className: "font-mono text-blue-500",
 				children: value
 			}) });
-			$[4] = arg;
-			$[5] = isObject;
-			$[6] = value;
-			$[7] = t4$1;
-		} else t4$1 = $[7];
+			$[5] = arg;
+			$[6] = isObject;
+			$[7] = value;
+			$[8] = t4$1;
+		} else t4$1 = $[8];
 		return t4$1;
 	}
 	let t4;
-	if ($[8] !== value) {
+	if ($[9] !== value) {
 		t4 = /* @__PURE__ */ jsx(PopoverTrigger, {
 			asChild: true,
 			children: /* @__PURE__ */ jsx("span", {
@@ -527,11 +567,11 @@ const Argument = memo((t0) => {
 				children: value
 			})
 		});
-		$[8] = value;
-		$[9] = t4;
-	} else t4 = $[9];
+		$[9] = value;
+		$[10] = t4;
+	} else t4 = $[10];
 	let t5;
-	if ($[10] !== arg || $[11] !== isObject || $[12] !== textToCopy || $[13] !== value) {
+	if ($[11] !== arg || $[12] !== isObject || $[13] !== textToCopy || $[14] !== value) {
 		t5 = /* @__PURE__ */ jsx(PopoverContent, {
 			className: "backdrop-blur-md w-auto max-w-2xl relative max-h-[50vh] overflow-y-auto",
 			hideWhenDetached: true,
@@ -553,19 +593,19 @@ const Argument = memo((t0) => {
 				})]
 			})
 		});
-		$[10] = arg;
-		$[11] = isObject;
-		$[12] = textToCopy;
-		$[13] = value;
-		$[14] = t5;
-	} else t5 = $[14];
+		$[11] = arg;
+		$[12] = isObject;
+		$[13] = textToCopy;
+		$[14] = value;
+		$[15] = t5;
+	} else t5 = $[15];
 	let t6;
-	if ($[15] !== t4 || $[16] !== t5) {
+	if ($[16] !== t4 || $[17] !== t5) {
 		t6 = /* @__PURE__ */ jsxs(Popover, { children: [t4, t5] });
-		$[15] = t4;
-		$[16] = t5;
-		$[17] = t6;
-	} else t6 = $[17];
+		$[16] = t4;
+		$[17] = t5;
+		$[18] = t6;
+	} else t6 = $[18];
 	return t6;
 });
 Argument.displayName = "Argument";
@@ -573,38 +613,42 @@ Argument.displayName = "Argument";
 //#endregion
 //#region src/components/events/code/closing-parenthesis.tsx
 const ClosingParenthesis = memo((t0) => {
-	const $ = c(7);
+	const $ = c(8);
+	if ($[0] !== "4ab03367b18a84c2b46e40ed2eb5f7059f595a509137274a6e998e2052c417ca") {
+		for (let $i = 0; $i < 8; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "4ab03367b18a84c2b46e40ed2eb5f7059f595a509137274a6e998e2052c417ca";
+	}
 	const { callsQuantity, noQuantity: t1 } = t0;
 	const noQuantity = t1 === void 0 ? false : t1;
 	const hasCalls = callsQuantity && callsQuantity > 1;
 	let t2;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t2 = /* @__PURE__ */ jsx("span", {
 			className: "font-mono text-emerald-500",
 			children: ")"
 		});
-		$[0] = t2;
-	} else t2 = $[0];
+		$[1] = t2;
+	} else t2 = $[1];
 	let t3;
-	if ($[1] !== callsQuantity || $[2] !== hasCalls || $[3] !== noQuantity) {
+	if ($[2] !== callsQuantity || $[3] !== hasCalls || $[4] !== noQuantity) {
 		t3 = !noQuantity && hasCalls && /* @__PURE__ */ jsxs("span", {
 			className: "font-mono text-muted-foreground",
 			children: [" x", callsQuantity]
 		});
-		$[1] = callsQuantity;
-		$[2] = hasCalls;
-		$[3] = noQuantity;
-		$[4] = t3;
-	} else t3 = $[4];
+		$[2] = callsQuantity;
+		$[3] = hasCalls;
+		$[4] = noQuantity;
+		$[5] = t3;
+	} else t3 = $[5];
 	let t4;
-	if ($[5] !== t3) {
+	if ($[6] !== t3) {
 		t4 = /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center",
 			children: [t2, t3]
 		});
-		$[5] = t3;
-		$[6] = t4;
-	} else t4 = $[6];
+		$[6] = t3;
+		$[7] = t4;
+	} else t4 = $[7];
 	return t4;
 });
 ClosingParenthesis.displayName = "ClosingParenthesis";
@@ -612,70 +656,74 @@ ClosingParenthesis.displayName = "ClosingParenthesis";
 //#endregion
 //#region src/components/events/code/function-call-content.tsx
 const FunctionCallContent = forwardRef((t0, ref) => {
-	const $ = c(22);
+	const $ = c(23);
+	if ($[0] !== "f9cee2defe3a707d028f8a516d115937e9c066312490fa54845af3b1f275f18b") {
+		for (let $i = 0; $i < 23; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "f9cee2defe3a707d028f8a516d115937e9c066312490fa54845af3b1f275f18b";
+	}
 	let className;
 	let functionName;
 	let objectName;
 	let props;
 	let topLevelClassName;
-	if ($[0] !== t0) {
+	if ($[1] !== t0) {
 		({topLevelClassName, objectName, functionName, className, ...props} = t0);
-		$[0] = t0;
-		$[1] = className;
-		$[2] = functionName;
-		$[3] = objectName;
-		$[4] = props;
-		$[5] = topLevelClassName;
+		$[1] = t0;
+		$[2] = className;
+		$[3] = functionName;
+		$[4] = objectName;
+		$[5] = props;
+		$[6] = topLevelClassName;
 	} else {
-		className = $[1];
-		functionName = $[2];
-		objectName = $[3];
-		props = $[4];
-		topLevelClassName = $[5];
+		className = $[2];
+		functionName = $[3];
+		objectName = $[4];
+		props = $[5];
+		topLevelClassName = $[6];
 	}
 	let t1;
-	if ($[6] !== className) {
+	if ($[7] !== className) {
 		t1 = cn("flex items-center", className);
-		$[6] = className;
-		$[7] = t1;
-	} else t1 = $[7];
+		$[7] = className;
+		$[8] = t1;
+	} else t1 = $[8];
 	let t2;
-	if ($[8] !== topLevelClassName) {
+	if ($[9] !== topLevelClassName) {
 		t2 = topLevelClassName && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
 			className: "font-mono text-pink-500",
 			children: topLevelClassName
 		}), /* @__PURE__ */ jsx("span", { children: "." })] });
-		$[8] = topLevelClassName;
-		$[9] = t2;
-	} else t2 = $[9];
+		$[9] = topLevelClassName;
+		$[10] = t2;
+	} else t2 = $[10];
 	let t3;
-	if ($[10] !== objectName) {
+	if ($[11] !== objectName) {
 		t3 = objectName && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
 			className: "font-mono text-pink-500",
 			children: objectName
 		}), /* @__PURE__ */ jsx("span", { children: "." })] });
-		$[10] = objectName;
-		$[11] = t3;
-	} else t3 = $[11];
+		$[11] = objectName;
+		$[12] = t3;
+	} else t3 = $[12];
 	let t4;
-	if ($[12] !== functionName) {
+	if ($[13] !== functionName) {
 		t4 = /* @__PURE__ */ jsx("span", {
 			className: "font-mono text-pink-500",
 			children: functionName
 		});
-		$[12] = functionName;
-		$[13] = t4;
-	} else t4 = $[13];
+		$[13] = functionName;
+		$[14] = t4;
+	} else t4 = $[14];
 	let t5;
-	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
 		t5 = /* @__PURE__ */ jsx("span", {
 			className: "font-mono text-emerald-500",
 			children: "("
 		});
-		$[14] = t5;
-	} else t5 = $[14];
+		$[15] = t5;
+	} else t5 = $[15];
 	let t6;
-	if ($[15] !== props || $[16] !== ref || $[17] !== t1 || $[18] !== t2 || $[19] !== t3 || $[20] !== t4) {
+	if ($[16] !== props || $[17] !== ref || $[18] !== t1 || $[19] !== t2 || $[20] !== t3 || $[21] !== t4) {
 		t6 = /* @__PURE__ */ jsxs("div", {
 			ref,
 			className: t1,
@@ -687,14 +735,14 @@ const FunctionCallContent = forwardRef((t0, ref) => {
 				t5
 			]
 		});
-		$[15] = props;
-		$[16] = ref;
-		$[17] = t1;
-		$[18] = t2;
-		$[19] = t3;
-		$[20] = t4;
-		$[21] = t6;
-	} else t6 = $[21];
+		$[16] = props;
+		$[17] = ref;
+		$[18] = t1;
+		$[19] = t2;
+		$[20] = t3;
+		$[21] = t4;
+		$[22] = t6;
+	} else t6 = $[22];
 	return t6;
 });
 FunctionCallContent.displayName = "FunctionCallContent";
@@ -703,41 +751,45 @@ FunctionCallContent.displayName = "FunctionCallContent";
 //#region src/components/events/code/function-call.tsx
 const GRID_LAYOUT_STYLE = { gridTemplateColumns: "max-content 1fr max-content" };
 const FunctionCall = memo((t0) => {
-	const $ = c(48);
+	const $ = c(49);
+	if ($[0] !== "a4649595a9d35de28471f3275d991c694dbeccd05d971cc25fd0884247e778d1") {
+		for (let $i = 0; $i < 49; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "a4649595a9d35de28471f3275d991c694dbeccd05d971cc25fd0884247e778d1";
+	}
 	const { topLevelClassName, objectName, functionName, args, callsQuantity } = t0;
 	let t1;
-	if ($[0] !== args) {
+	if ($[1] !== args) {
 		t1 = args.filter(_temp$4);
-		$[0] = args;
-		$[1] = t1;
-	} else t1 = $[1];
+		$[1] = args;
+		$[2] = t1;
+	} else t1 = $[2];
 	const filteredArgs = t1;
 	const t2 = `repeat(${filteredArgs.length * 2}, minmax(0, auto))`;
 	let t3;
-	if ($[2] !== t2) {
+	if ($[3] !== t2) {
 		t3 = { gridTemplateColumns: t2 };
-		$[2] = t2;
-		$[3] = t3;
-	} else t3 = $[3];
+		$[3] = t2;
+		$[4] = t3;
+	} else t3 = $[4];
 	const argsGridStyle = t3;
 	let t4;
-	if ($[4] !== objectName || $[5] !== topLevelClassName) {
+	if ($[5] !== objectName || $[6] !== topLevelClassName) {
 		t4 = [topLevelClassName, objectName].filter(Boolean);
-		$[4] = objectName;
-		$[5] = topLevelClassName;
-		$[6] = t4;
-	} else t4 = $[6];
+		$[5] = objectName;
+		$[6] = topLevelClassName;
+		$[7] = t4;
+	} else t4 = $[7];
 	const prefix = t4.join(".");
 	const fullPrefix = prefix ? `${prefix}.` : "";
 	let t5;
-	if ($[7] !== filteredArgs) {
+	if ($[8] !== filteredArgs) {
 		t5 = filteredArgs.map(_temp2$2).join(", ");
-		$[7] = filteredArgs;
-		$[8] = t5;
-	} else t5 = $[8];
+		$[8] = filteredArgs;
+		$[9] = t5;
+	} else t5 = $[9];
 	const functionCallText = `${fullPrefix}${functionName}(${t5})`;
 	let t6;
-	if ($[9] !== functionName || $[10] !== objectName || $[11] !== topLevelClassName) {
+	if ($[10] !== functionName || $[11] !== objectName || $[12] !== topLevelClassName) {
 		t6 = /* @__PURE__ */ jsx(PopoverTrigger, {
 			asChild: true,
 			children: /* @__PURE__ */ jsx(FunctionCallContent, {
@@ -747,43 +799,43 @@ const FunctionCall = memo((t0) => {
 				objectName
 			})
 		});
-		$[9] = functionName;
-		$[10] = objectName;
-		$[11] = topLevelClassName;
-		$[12] = t6;
-	} else t6 = $[12];
+		$[10] = functionName;
+		$[11] = objectName;
+		$[12] = topLevelClassName;
+		$[13] = t6;
+	} else t6 = $[13];
 	let t7;
-	if ($[13] !== functionName || $[14] !== objectName || $[15] !== topLevelClassName) {
+	if ($[14] !== functionName || $[15] !== objectName || $[16] !== topLevelClassName) {
 		t7 = /* @__PURE__ */ jsx(FunctionCallContent, {
 			functionName,
 			topLevelClassName,
 			objectName
 		});
-		$[13] = functionName;
-		$[14] = objectName;
-		$[15] = topLevelClassName;
-		$[16] = t7;
-	} else t7 = $[16];
+		$[14] = functionName;
+		$[15] = objectName;
+		$[16] = topLevelClassName;
+		$[17] = t7;
+	} else t7 = $[17];
 	let t8;
-	if ($[17] !== functionCallText) {
+	if ($[18] !== functionCallText) {
 		t8 = /* @__PURE__ */ jsx(CopyButton, { textToCopy: functionCallText });
-		$[17] = functionCallText;
-		$[18] = t8;
-	} else t8 = $[18];
+		$[18] = functionCallText;
+		$[19] = t8;
+	} else t8 = $[19];
 	let t9;
-	if ($[19] !== t7 || $[20] !== t8) {
+	if ($[20] !== t7 || $[21] !== t8) {
 		t9 = /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center justify-between gap-2",
 			children: [t7, t8]
 		});
-		$[19] = t7;
-		$[20] = t8;
-		$[21] = t9;
-	} else t9 = $[21];
+		$[20] = t7;
+		$[21] = t8;
+		$[22] = t9;
+	} else t9 = $[22];
 	let t10;
-	if ($[22] !== filteredArgs) {
+	if ($[23] !== filteredArgs) {
 		let t11$1;
-		if ($[24] !== filteredArgs.length) {
+		if ($[25] !== filteredArgs.length) {
 			t11$1 = (arg_1, index) => /* @__PURE__ */ jsxs("div", {
 				className: "grid grid-cols-[auto_1fr] items-center pl-4",
 				children: [/* @__PURE__ */ jsx(Argument, {
@@ -791,24 +843,24 @@ const FunctionCall = memo((t0) => {
 					popover: false
 				}), index < filteredArgs.length - 1 && /* @__PURE__ */ jsx("span", { children: ", " })]
 			}, index);
-			$[24] = filteredArgs.length;
-			$[25] = t11$1;
-		} else t11$1 = $[25];
+			$[25] = filteredArgs.length;
+			$[26] = t11$1;
+		} else t11$1 = $[26];
 		t10 = filteredArgs.map(t11$1);
-		$[22] = filteredArgs;
-		$[23] = t10;
-	} else t10 = $[23];
+		$[23] = filteredArgs;
+		$[24] = t10;
+	} else t10 = $[24];
 	let t11;
-	if ($[26] !== callsQuantity) {
+	if ($[27] !== callsQuantity) {
 		t11 = /* @__PURE__ */ jsx(ClosingParenthesis, {
 			callsQuantity,
 			noQuantity: true
 		});
-		$[26] = callsQuantity;
-		$[27] = t11;
-	} else t11 = $[27];
+		$[27] = callsQuantity;
+		$[28] = t11;
+	} else t11 = $[28];
 	let t12;
-	if ($[28] !== t10 || $[29] !== t11 || $[30] !== t9) {
+	if ($[29] !== t10 || $[30] !== t11 || $[31] !== t9) {
 		t12 = /* @__PURE__ */ jsxs(PopoverContent, {
 			className: "grid grid-rows-auto backdrop-blur-md w-auto max-w-2xl max-h-[50vh] overflow-y-auto",
 			hideWhenDetached: true,
@@ -818,49 +870,49 @@ const FunctionCall = memo((t0) => {
 				t11
 			]
 		});
-		$[28] = t10;
-		$[29] = t11;
-		$[30] = t9;
-		$[31] = t12;
-	} else t12 = $[31];
+		$[29] = t10;
+		$[30] = t11;
+		$[31] = t9;
+		$[32] = t12;
+	} else t12 = $[32];
 	let t13;
-	if ($[32] !== t12 || $[33] !== t6) {
+	if ($[33] !== t12 || $[34] !== t6) {
 		t13 = /* @__PURE__ */ jsxs(Popover, { children: [t6, t12] });
-		$[32] = t12;
-		$[33] = t6;
-		$[34] = t13;
-	} else t13 = $[34];
+		$[33] = t12;
+		$[34] = t6;
+		$[35] = t13;
+	} else t13 = $[35];
 	let t14;
-	if ($[35] !== filteredArgs) {
+	if ($[36] !== filteredArgs) {
 		let t15$1;
-		if ($[37] !== filteredArgs.length) {
+		if ($[38] !== filteredArgs.length) {
 			t15$1 = (arg_2, index_0) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Argument, { arg: arg_2 }), index_0 < filteredArgs.length - 1 && /* @__PURE__ */ jsx("span", { children: ", " })] }, index_0);
-			$[37] = filteredArgs.length;
-			$[38] = t15$1;
-		} else t15$1 = $[38];
+			$[38] = filteredArgs.length;
+			$[39] = t15$1;
+		} else t15$1 = $[39];
 		t14 = filteredArgs.map(t15$1);
-		$[35] = filteredArgs;
-		$[36] = t14;
-	} else t14 = $[36];
+		$[36] = filteredArgs;
+		$[37] = t14;
+	} else t14 = $[37];
 	let t15;
-	if ($[39] !== argsGridStyle || $[40] !== t14) {
+	if ($[40] !== argsGridStyle || $[41] !== t14) {
 		t15 = /* @__PURE__ */ jsx("div", {
 			className: "grid items-center min-w-0",
 			style: argsGridStyle,
 			children: t14
 		});
-		$[39] = argsGridStyle;
-		$[40] = t14;
-		$[41] = t15;
-	} else t15 = $[41];
+		$[40] = argsGridStyle;
+		$[41] = t14;
+		$[42] = t15;
+	} else t15 = $[42];
 	let t16;
-	if ($[42] !== callsQuantity) {
+	if ($[43] !== callsQuantity) {
 		t16 = /* @__PURE__ */ jsx(ClosingParenthesis, { callsQuantity });
-		$[42] = callsQuantity;
-		$[43] = t16;
-	} else t16 = $[43];
+		$[43] = callsQuantity;
+		$[44] = t16;
+	} else t16 = $[44];
 	let t17;
-	if ($[44] !== t13 || $[45] !== t15 || $[46] !== t16) {
+	if ($[45] !== t13 || $[46] !== t15 || $[47] !== t16) {
 		t17 = /* @__PURE__ */ jsxs("div", {
 			className: "grid overflow-hidden items-center",
 			style: GRID_LAYOUT_STYLE,
@@ -870,11 +922,11 @@ const FunctionCall = memo((t0) => {
 				t16
 			]
 		});
-		$[44] = t13;
-		$[45] = t15;
-		$[46] = t16;
-		$[47] = t17;
-	} else t17 = $[47];
+		$[45] = t13;
+		$[46] = t15;
+		$[47] = t16;
+		$[48] = t17;
+	} else t17 = $[48];
 	return t17;
 });
 FunctionCall.displayName = "FunctionCall";
@@ -891,28 +943,32 @@ function _temp2$2(arg_0) {
 //#endregion
 //#region src/components/events/trace-emit-event.tsx
 const TraceEmitEvent = memo((t0) => {
-	const $ = c(5);
+	const $ = c(6);
+	if ($[0] !== "1c99155502674878739fbbcfa0a143efee75279ad69880260a5f175528b3f050") {
+		for (let $i = 0; $i < 6; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "1c99155502674878739fbbcfa0a143efee75279ad69880260a5f175528b3f050";
+	}
 	const { event } = t0;
 	let t1;
-	if ($[0] !== event.data || $[1] !== event.topic) {
+	if ($[1] !== event.data || $[2] !== event.topic) {
 		t1 = [{
 			topic: event.topic,
 			data: event.data
 		}];
-		$[0] = event.data;
-		$[1] = event.topic;
-		$[2] = t1;
-	} else t1 = $[2];
+		$[1] = event.data;
+		$[2] = event.topic;
+		$[3] = t1;
+	} else t1 = $[3];
 	const args = t1;
 	let t2;
-	if ($[3] !== args) {
+	if ($[4] !== args) {
 		t2 = /* @__PURE__ */ jsx(FunctionCall, {
 			functionName: "emit",
 			args
 		});
-		$[3] = args;
-		$[4] = t2;
-	} else t2 = $[4];
+		$[4] = args;
+		$[5] = t2;
+	} else t2 = $[5];
 	return t2;
 });
 TraceEmitEvent.displayName = "TraceEmitEvent";
@@ -920,16 +976,20 @@ TraceEmitEvent.displayName = "TraceEmitEvent";
 //#endregion
 //#region src/components/events/trace-log-event.tsx
 const TraceLogEvent = memo((t0) => {
-	const $ = c(5);
+	const $ = c(6);
+	if ($[0] !== "2ad036e2c4427811bdd655eab2630232cdaa410e5242349c3064a1c0f232d784") {
+		for (let $i = 0; $i < 6; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "2ad036e2c4427811bdd655eab2630232cdaa410e5242349c3064a1c0f232d784";
+	}
 	const { event } = t0;
 	let t1;
-	if ($[0] !== event.level) {
+	if ($[1] !== event.level) {
 		t1 = /* @__PURE__ */ jsx(LevelDot, { level: event.level });
-		$[0] = event.level;
-		$[1] = t1;
-	} else t1 = $[1];
+		$[1] = event.level;
+		$[2] = t1;
+	} else t1 = $[2];
 	let t2;
-	if ($[2] !== event.message || $[3] !== t1) {
+	if ($[3] !== event.message || $[4] !== t1) {
 		t2 = /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center gap-2",
 			children: [
@@ -938,10 +998,10 @@ const TraceLogEvent = memo((t0) => {
 				event.message
 			]
 		});
-		$[2] = event.message;
-		$[3] = t1;
-		$[4] = t2;
-	} else t2 = $[4];
+		$[3] = event.message;
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
 	return t2;
 });
 TraceLogEvent.displayName = "TraceLogEvent";
@@ -949,32 +1009,36 @@ TraceLogEvent.displayName = "TraceLogEvent";
 //#endregion
 //#region src/components/events/trace-state-event.tsx
 const TraceStateEvent = memo((t0) => {
-	const $ = c(7);
+	const $ = c(8);
+	if ($[0] !== "7c38f56f572803a01857cb4bed35b853c294cca3e11476480cd02e0ce7b86827") {
+		for (let $i = 0; $i < 8; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "7c38f56f572803a01857cb4bed35b853c294cca3e11476480cd02e0ce7b86827";
+	}
 	const { event } = t0;
 	let t1;
-	if ($[0] !== event.data.key || $[1] !== event.data.traceId || $[2] !== event.data.value) {
+	if ($[1] !== event.data.key || $[2] !== event.data.traceId || $[3] !== event.data.value) {
 		t1 = [
 			event.data.traceId,
 			event.data.key,
 			event.data.value
 		];
-		$[0] = event.data.key;
-		$[1] = event.data.traceId;
-		$[2] = event.data.value;
-		$[3] = t1;
-	} else t1 = $[3];
+		$[1] = event.data.key;
+		$[2] = event.data.traceId;
+		$[3] = event.data.value;
+		$[4] = t1;
+	} else t1 = $[4];
 	const args = t1;
 	let t2;
-	if ($[4] !== args || $[5] !== event.operation) {
+	if ($[5] !== args || $[6] !== event.operation) {
 		t2 = /* @__PURE__ */ jsx(FunctionCall, {
 			objectName: "state",
 			functionName: event.operation,
 			args
 		});
-		$[4] = args;
-		$[5] = event.operation;
-		$[6] = t2;
-	} else t2 = $[6];
+		$[5] = args;
+		$[6] = event.operation;
+		$[7] = t2;
+	} else t2 = $[7];
 	return t2;
 });
 TraceStateEvent.displayName = "TraceStateEvent";
@@ -982,24 +1046,28 @@ TraceStateEvent.displayName = "TraceStateEvent";
 //#endregion
 //#region src/components/events/trace-stream-event.tsx
 const TraceStreamEvent = memo((t0) => {
-	const $ = c(9);
+	const $ = c(10);
+	if ($[0] !== "6c8ca715a79e72803fc3cde1b57bcfc9af7f426e893ce07dc6f50cf811b702b6") {
+		for (let $i = 0; $i < 10; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "6c8ca715a79e72803fc3cde1b57bcfc9af7f426e893ce07dc6f50cf811b702b6";
+	}
 	const { event } = t0;
 	const t1 = event.data.data;
 	let t2;
-	if ($[0] !== event.data.groupId || $[1] !== event.data.id || $[2] !== t1) {
+	if ($[1] !== event.data.groupId || $[2] !== event.data.id || $[3] !== t1) {
 		t2 = [
 			event.data.groupId,
 			event.data.id,
 			t1
 		];
-		$[0] = event.data.groupId;
-		$[1] = event.data.id;
-		$[2] = t1;
-		$[3] = t2;
-	} else t2 = $[3];
+		$[1] = event.data.groupId;
+		$[2] = event.data.id;
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
 	const args = t2;
 	let t3;
-	if ($[4] !== args || $[5] !== event.calls || $[6] !== event.operation || $[7] !== event.streamName) {
+	if ($[5] !== args || $[6] !== event.calls || $[7] !== event.operation || $[8] !== event.streamName) {
 		t3 = /* @__PURE__ */ jsx(FunctionCall, {
 			topLevelClassName: "streams",
 			objectName: event.streamName,
@@ -1007,12 +1075,12 @@ const TraceStreamEvent = memo((t0) => {
 			args,
 			callsQuantity: event.calls
 		});
-		$[4] = args;
-		$[5] = event.calls;
-		$[6] = event.operation;
-		$[7] = event.streamName;
-		$[8] = t3;
-	} else t3 = $[8];
+		$[5] = args;
+		$[6] = event.calls;
+		$[7] = event.operation;
+		$[8] = event.streamName;
+		$[9] = t3;
+	} else t3 = $[9];
 	return t3;
 });
 TraceStreamEvent.displayName = "TraceStreamEvent";
@@ -1020,39 +1088,43 @@ TraceStreamEvent.displayName = "TraceStreamEvent";
 //#endregion
 //#region src/components/events/trace-event.tsx
 const TraceEvent = memo((t0) => {
-	const $ = c(8);
+	const $ = c(9);
+	if ($[0] !== "bb6873064e676dc947ff1df89d486f742da27c53a44f3427557c30d4dcc50852") {
+		for (let $i = 0; $i < 9; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "bb6873064e676dc947ff1df89d486f742da27c53a44f3427557c30d4dcc50852";
+	}
 	const { event } = t0;
 	if (event.type === "log") {
 		let t1;
-		if ($[0] !== event) {
+		if ($[1] !== event) {
 			t1 = /* @__PURE__ */ jsx(TraceLogEvent, { event });
-			$[0] = event;
-			$[1] = t1;
-		} else t1 = $[1];
+			$[1] = event;
+			$[2] = t1;
+		} else t1 = $[2];
 		return t1;
 	} else if (event.type === "emit") {
 		let t1;
-		if ($[2] !== event) {
+		if ($[3] !== event) {
 			t1 = /* @__PURE__ */ jsx(TraceEmitEvent, { event });
-			$[2] = event;
-			$[3] = t1;
-		} else t1 = $[3];
+			$[3] = event;
+			$[4] = t1;
+		} else t1 = $[4];
 		return t1;
 	} else if (event.type === "state") {
 		let t1;
-		if ($[4] !== event) {
+		if ($[5] !== event) {
 			t1 = /* @__PURE__ */ jsx(TraceStateEvent, { event });
-			$[4] = event;
-			$[5] = t1;
-		} else t1 = $[5];
+			$[5] = event;
+			$[6] = t1;
+		} else t1 = $[6];
 		return t1;
 	} else if (event.type === "stream") {
 		let t1;
-		if ($[6] !== event) {
+		if ($[7] !== event) {
 			t1 = /* @__PURE__ */ jsx(TraceStreamEvent, { event });
-			$[6] = event;
-			$[7] = t1;
-		} else t1 = $[7];
+			$[7] = event;
+			$[8] = t1;
+		} else t1 = $[8];
 		return t1;
 	}
 });
@@ -1061,34 +1133,38 @@ TraceEvent.displayName = "TraceEvent";
 //#endregion
 //#region src/components/trace-item/trace-event-item.tsx
 const TraceEventItem = memo((t0) => {
-	const $ = c(13);
+	const $ = c(14);
+	if ($[0] !== "6a7235dddbab5b9658f53f7dc4ccc892ec78776c6bf4ebe24fc950401299f990") {
+		for (let $i = 0; $i < 14; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "6a7235dddbab5b9658f53f7dc4ccc892ec78776c6bf4ebe24fc950401299f990";
+	}
 	const { event, traceStartTime } = t0;
 	let t1;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t1 = /* @__PURE__ */ jsx("div", {
 			className: "grid place-items-center",
 			children: /* @__PURE__ */ jsx("div", { className: "w-1 h-1 rounded-full bg-emerald-500 outline outline-2 outline-emerald-500/50 -ml-[26px]" })
 		});
-		$[0] = t1;
-	} else t1 = $[0];
+		$[1] = t1;
+	} else t1 = $[1];
 	let t2;
-	if ($[1] !== event) {
+	if ($[2] !== event) {
 		t2 = /* @__PURE__ */ jsx("div", {
 			className: "grid place-items-center",
 			children: /* @__PURE__ */ jsx(EventIcon, { event })
 		});
-		$[1] = event;
-		$[2] = t2;
-	} else t2 = $[2];
+		$[2] = event;
+		$[3] = t2;
+	} else t2 = $[3];
 	const t3 = Math.floor(event.timestamp - traceStartTime);
 	let t4;
-	if ($[3] !== t3) {
+	if ($[4] !== t3) {
 		t4 = formatDuration(t3);
-		$[3] = t3;
-		$[4] = t4;
-	} else t4 = $[4];
+		$[4] = t3;
+		$[5] = t4;
+	} else t4 = $[5];
 	let t5;
-	if ($[5] !== t4) {
+	if ($[6] !== t4) {
 		t5 = /* @__PURE__ */ jsx("div", {
 			className: "grid place-items-center",
 			children: /* @__PURE__ */ jsxs("span", {
@@ -1096,31 +1172,31 @@ const TraceEventItem = memo((t0) => {
 				children: ["+", t4]
 			})
 		});
-		$[5] = t4;
-		$[6] = t5;
-	} else t5 = $[6];
+		$[6] = t4;
+		$[7] = t5;
+	} else t5 = $[7];
 	let t6;
-	if ($[7] !== event) {
+	if ($[8] !== event) {
 		t6 = /* @__PURE__ */ jsx("div", {
 			className: "grid place-items-start",
 			children: /* @__PURE__ */ jsx(TraceEvent, { event })
 		});
-		$[7] = event;
-		$[8] = t6;
-	} else t6 = $[8];
+		$[8] = event;
+		$[9] = t6;
+	} else t6 = $[9];
 	let t7;
-	if ($[9] !== t2 || $[10] !== t5 || $[11] !== t6) {
+	if ($[10] !== t2 || $[11] !== t5 || $[12] !== t6) {
 		t7 = /* @__PURE__ */ jsxs(Fragment, { children: [
 			t1,
 			t2,
 			t5,
 			t6
 		] });
-		$[9] = t2;
-		$[10] = t5;
-		$[11] = t6;
-		$[12] = t7;
-	} else t7 = $[12];
+		$[10] = t2;
+		$[11] = t5;
+		$[12] = t6;
+		$[13] = t7;
+	} else t7 = $[13];
 	return t7;
 });
 TraceEventItem.displayName = "TraceEventItem";
@@ -1128,52 +1204,56 @@ TraceEventItem.displayName = "TraceEventItem";
 //#endregion
 //#region src/components/trace-item/trace-item-detail.tsx
 const TraceItemDetail = memo((t0) => {
-	const $ = c(32);
+	const $ = c(33);
+	if ($[0] !== "1a8f3badc41dcb22bbab4d8d915d8d9b99520c2bd79570b27acfb6158532a96a") {
+		for (let $i = 0; $i < 33; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "1a8f3badc41dcb22bbab4d8d915d8d9b99520c2bd79570b27acfb6158532a96a";
+	}
 	const { trace, onClose } = t0;
 	let t1;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t1 = /* @__PURE__ */ jsx(X, {});
-		$[0] = t1;
-	} else t1 = $[0];
+		$[1] = t1;
+	} else t1 = $[1];
 	let t2;
-	if ($[1] !== onClose) {
+	if ($[2] !== onClose) {
 		t2 = [{
 			icon: t1,
 			onClick: onClose,
 			label: "Close"
 		}];
-		$[1] = onClose;
-		$[2] = t2;
-	} else t2 = $[2];
+		$[2] = onClose;
+		$[3] = t2;
+	} else t2 = $[3];
 	const actions = t2;
 	const t3 = `Viewing details from step ${trace.name}`;
 	let t4;
-	if ($[3] !== trace.endTime || $[4] !== trace.startTime) {
+	if ($[4] !== trace.endTime || $[5] !== trace.startTime) {
 		t4 = trace.endTime && /* @__PURE__ */ jsxs("span", { children: ["Duration: ", formatDuration(trace.endTime - trace.startTime)] });
-		$[3] = trace.endTime;
-		$[4] = trace.startTime;
-		$[5] = t4;
-	} else t4 = $[5];
+		$[4] = trace.endTime;
+		$[5] = trace.startTime;
+		$[6] = t4;
+	} else t4 = $[6];
 	let t5;
-	if ($[6] !== trace.entryPoint.type) {
+	if ($[7] !== trace.entryPoint.type) {
 		t5 = /* @__PURE__ */ jsx("div", {
 			className: "bg-blue-500 font-bold text-xs px-[4px] py-[2px] rounded-sm text-blue-100",
 			children: trace.entryPoint.type
 		});
-		$[6] = trace.entryPoint.type;
-		$[7] = t5;
-	} else t5 = $[7];
+		$[7] = trace.entryPoint.type;
+		$[8] = t5;
+	} else t5 = $[8];
 	let t6;
-	if ($[8] !== trace.correlationId) {
+	if ($[9] !== trace.correlationId) {
 		t6 = trace.correlationId && /* @__PURE__ */ jsxs(Badge, {
 			variant: "outline",
 			children: ["Correlated: ", trace.correlationId]
 		});
-		$[8] = trace.correlationId;
-		$[9] = t6;
-	} else t6 = $[9];
+		$[9] = trace.correlationId;
+		$[10] = t6;
+	} else t6 = $[10];
 	let t7;
-	if ($[10] !== t4 || $[11] !== t5 || $[12] !== t6) {
+	if ($[11] !== t4 || $[12] !== t5 || $[13] !== t6) {
 		t7 = /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center gap-4 text-sm text-muted-foreground mb-4",
 			children: [
@@ -1182,48 +1262,48 @@ const TraceItemDetail = memo((t0) => {
 				t6
 			]
 		});
-		$[10] = t4;
-		$[11] = t5;
-		$[12] = t6;
-		$[13] = t7;
-	} else t7 = $[13];
+		$[11] = t4;
+		$[12] = t5;
+		$[13] = t6;
+		$[14] = t7;
+	} else t7 = $[14];
 	let t8;
-	if ($[14] !== trace.events || $[15] !== trace.startTime) {
+	if ($[15] !== trace.events || $[16] !== trace.startTime) {
 		let t9$1;
-		if ($[17] !== trace.startTime) {
+		if ($[18] !== trace.startTime) {
 			t9$1 = (event, index) => /* @__PURE__ */ jsx(TraceEventItem, {
 				event,
 				traceStartTime: trace.startTime
 			}, index);
-			$[17] = trace.startTime;
-			$[18] = t9$1;
-		} else t9$1 = $[18];
+			$[18] = trace.startTime;
+			$[19] = t9$1;
+		} else t9$1 = $[19];
 		t8 = trace.events.map(t9$1);
-		$[14] = trace.events;
-		$[15] = trace.startTime;
-		$[16] = t8;
-	} else t8 = $[16];
+		$[15] = trace.events;
+		$[16] = trace.startTime;
+		$[17] = t8;
+	} else t8 = $[17];
 	let t9;
-	if ($[19] !== t8) {
+	if ($[20] !== t8) {
 		t9 = /* @__PURE__ */ jsx("div", {
 			className: "grid grid-cols-[auto_auto_auto_1fr] gap-x-2 gap-y-3 font-mono text-xs border-l-1 border-gray-500/40 pl-6",
 			children: t8
 		});
-		$[19] = t8;
-		$[20] = t9;
-	} else t9 = $[20];
+		$[20] = t8;
+		$[21] = t9;
+	} else t9 = $[21];
 	let t10;
-	if ($[21] !== t7 || $[22] !== t9) {
+	if ($[22] !== t7 || $[23] !== t9) {
 		t10 = /* @__PURE__ */ jsxs("div", {
 			className: "px-2 overflow-auto",
 			children: [t7, t9]
 		});
-		$[21] = t7;
-		$[22] = t9;
-		$[23] = t10;
-	} else t10 = $[23];
+		$[22] = t7;
+		$[23] = t9;
+		$[24] = t10;
+	} else t10 = $[24];
 	let t11;
-	if ($[24] !== trace.error) {
+	if ($[25] !== trace.error) {
 		t11 = trace.error && /* @__PURE__ */ jsxs("div", {
 			className: "p-4 bg-red-800/10",
 			children: [/* @__PURE__ */ jsx("div", {
@@ -1234,11 +1314,11 @@ const TraceItemDetail = memo((t0) => {
 				children: trace.error.stack
 			})]
 		});
-		$[24] = trace.error;
-		$[25] = t11;
-	} else t11 = $[25];
+		$[25] = trace.error;
+		$[26] = t11;
+	} else t11 = $[26];
 	let t12;
-	if ($[26] !== actions || $[27] !== onClose || $[28] !== t10 || $[29] !== t11 || $[30] !== t3) {
+	if ($[27] !== actions || $[28] !== onClose || $[29] !== t10 || $[30] !== t11 || $[31] !== t3) {
 		t12 = /* @__PURE__ */ jsxs(Sidebar, {
 			onClose,
 			initialWidth: 600,
@@ -1247,13 +1327,13 @@ const TraceItemDetail = memo((t0) => {
 			actions,
 			children: [t10, t11]
 		});
-		$[26] = actions;
-		$[27] = onClose;
-		$[28] = t10;
-		$[29] = t11;
-		$[30] = t3;
-		$[31] = t12;
-	} else t12 = $[31];
+		$[27] = actions;
+		$[28] = onClose;
+		$[29] = t10;
+		$[30] = t11;
+		$[31] = t3;
+		$[32] = t12;
+	} else t12 = $[32];
 	return t12;
 });
 TraceItemDetail.displayName = "TraceItemDetail";
@@ -1261,103 +1341,111 @@ TraceItemDetail.displayName = "TraceItemDetail";
 //#endregion
 //#region src/components/trace-timeline.tsx
 const TraceTimeline = memo(() => {
-	const $ = c(2);
+	const $ = c(3);
+	if ($[0] !== "fd73f7a8c1f8a9d942e9e6008a32a002af26b3ecbbb06d98f5a3a138c6f4c73a") {
+		for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "fd73f7a8c1f8a9d942e9e6008a32a002af26b3ecbbb06d98f5a3a138c6f4c73a";
+	}
 	const groupId = useObservabilityStore(_temp$3);
 	if (!groupId) return null;
 	let t0;
-	if ($[0] !== groupId) {
+	if ($[1] !== groupId) {
 		t0 = /* @__PURE__ */ jsx(TraceTimelineComponent, { groupId });
-		$[0] = groupId;
-		$[1] = t0;
-	} else t0 = $[1];
+		$[1] = groupId;
+		$[2] = t0;
+	} else t0 = $[2];
 	return t0;
 });
 TraceTimeline.displayName = "TraceTimeline";
 const TraceTimelineComponent = memo((t0) => {
-	const $ = c(79);
+	const $ = c(80);
+	if ($[0] !== "fd73f7a8c1f8a9d942e9e6008a32a002af26b3ecbbb06d98f5a3a138c6f4c73a") {
+		for (let $i = 0; $i < 80; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "fd73f7a8c1f8a9d942e9e6008a32a002af26b3ecbbb06d98f5a3a138c6f4c73a";
+	}
 	const { groupId } = t0;
 	let t1;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t1 = {
 			streamName: "motia-trace-group",
 			groupId: "default"
 		};
-		$[0] = t1;
-	} else t1 = $[0];
+		$[1] = t1;
+	} else t1 = $[1];
 	const { data: traceGroups } = useStreamGroup(t1);
 	let t2;
-	if ($[1] !== groupId || $[2] !== traceGroups) {
+	if ($[2] !== groupId || $[3] !== traceGroups) {
 		let t3$1;
-		if ($[4] !== groupId) {
+		if ($[5] !== groupId) {
 			t3$1 = (traceGroup) => traceGroup.id === groupId;
-			$[4] = groupId;
-			$[5] = t3$1;
-		} else t3$1 = $[5];
+			$[5] = groupId;
+			$[6] = t3$1;
+		} else t3$1 = $[6];
 		t2 = traceGroups.find(t3$1);
-		$[1] = groupId;
-		$[2] = traceGroups;
-		$[3] = t2;
-	} else t2 = $[3];
+		$[2] = groupId;
+		$[3] = traceGroups;
+		$[4] = t2;
+	} else t2 = $[4];
 	const group = t2;
 	let t3;
-	if ($[6] !== groupId) {
+	if ($[7] !== groupId) {
 		t3 = {
 			streamName: "motia-trace",
 			groupId
 		};
-		$[6] = groupId;
-		$[7] = t3;
-	} else t3 = $[7];
+		$[7] = groupId;
+		$[8] = t3;
+	} else t3 = $[8];
 	const { data } = useStreamGroup(t3);
 	const endTime = useGetEndTime(group);
 	const [zoom, setZoom] = useState(100);
 	const selectedTraceId = useObservabilityStore(_temp2$1);
 	const selectTraceId = useObservabilityStore(_temp3);
 	let t4;
-	if ($[8] !== data || $[9] !== selectedTraceId) {
+	if ($[9] !== data || $[10] !== selectedTraceId) {
 		t4 = data?.find((trace) => trace.id === selectedTraceId);
-		$[8] = data;
-		$[9] = selectedTraceId;
-		$[10] = t4;
-	} else t4 = $[10];
+		$[9] = data;
+		$[10] = selectedTraceId;
+		$[11] = t4;
+	} else t4 = $[11];
 	const selectedTrace = t4;
 	let t5;
-	if ($[11] !== zoom) {
+	if ($[12] !== zoom) {
 		t5 = () => zoom > 100 && setZoom(_temp4);
-		$[11] = zoom;
-		$[12] = t5;
-	} else t5 = $[12];
+		$[12] = zoom;
+		$[13] = t5;
+	} else t5 = $[13];
 	const zoomMinus = t5;
 	let t6;
-	if ($[13] !== zoom) {
+	if ($[14] !== zoom) {
 		t6 = () => zoom < 200 && setZoom(_temp5);
-		$[13] = zoom;
-		$[14] = t6;
-	} else t6 = $[14];
+		$[14] = zoom;
+		$[15] = t6;
+	} else t6 = $[15];
 	const zoomPlus = t6;
 	if (!group) return null;
 	const t7 = `${zoom}%`;
 	let t8;
-	if ($[15] !== t7) {
+	if ($[16] !== t7) {
 		t8 = { width: t7 };
-		$[15] = t7;
-		$[16] = t8;
-	} else t8 = $[16];
+		$[16] = t7;
+		$[17] = t8;
+	} else t8 = $[17];
 	const t9 = `${zoom}%`;
 	let t10;
-	if ($[17] !== t9) {
+	if ($[18] !== t9) {
 		t10 = { width: t9 };
-		$[17] = t9;
-		$[18] = t10;
-	} else t10 = $[18];
+		$[18] = t9;
+		$[19] = t10;
+	} else t10 = $[19];
 	const t11 = zoom <= 100;
 	let t12;
-	if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
 		t12 = /* @__PURE__ */ jsx(Minus, { className: "w-4 h-4 cursor-pointer" });
-		$[19] = t12;
-	} else t12 = $[19];
+		$[20] = t12;
+	} else t12 = $[20];
 	let t13;
-	if ($[20] !== t11 || $[21] !== zoomMinus) {
+	if ($[21] !== t11 || $[22] !== zoomMinus) {
 		t13 = /* @__PURE__ */ jsx(Button, {
 			variant: "icon",
 			size: "sm",
@@ -1366,27 +1454,27 @@ const TraceTimelineComponent = memo((t0) => {
 			disabled: t11,
 			children: t12
 		});
-		$[20] = t11;
-		$[21] = zoomMinus;
-		$[22] = t13;
-	} else t13 = $[22];
+		$[21] = t11;
+		$[22] = zoomMinus;
+		$[23] = t13;
+	} else t13 = $[23];
 	let t14;
-	if ($[23] !== zoom) {
+	if ($[24] !== zoom) {
 		t14 = /* @__PURE__ */ jsxs("span", {
 			className: "min-w-12 text-center select-none text-sm font-bold text-muted-foreground",
 			children: [zoom, "%"]
 		});
-		$[23] = zoom;
-		$[24] = t14;
-	} else t14 = $[24];
+		$[24] = zoom;
+		$[25] = t14;
+	} else t14 = $[25];
 	const t15 = zoom >= 200;
 	let t16;
-	if ($[25] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
 		t16 = /* @__PURE__ */ jsx(Plus, { className: "w-4 h-4 cursor-pointer" });
-		$[25] = t16;
-	} else t16 = $[25];
+		$[26] = t16;
+	} else t16 = $[26];
 	let t17;
-	if ($[26] !== t15 || $[27] !== zoomPlus) {
+	if ($[27] !== t15 || $[28] !== zoomPlus) {
 		t17 = /* @__PURE__ */ jsx(Button, {
 			variant: "icon",
 			size: "sm",
@@ -1395,12 +1483,12 @@ const TraceTimelineComponent = memo((t0) => {
 			disabled: t15,
 			children: t16
 		});
-		$[26] = t15;
-		$[27] = zoomPlus;
-		$[28] = t17;
-	} else t17 = $[28];
+		$[27] = t15;
+		$[28] = zoomPlus;
+		$[29] = t17;
+	} else t17 = $[29];
 	let t18;
-	if ($[29] !== t13 || $[30] !== t14 || $[31] !== t17) {
+	if ($[30] !== t13 || $[31] !== t14 || $[32] !== t17) {
 		t18 = /* @__PURE__ */ jsxs("div", {
 			className: "shrink-0 w-[200px] h-[37px] flex items-center justify-center gap-2 sticky left-0 top-0 z-10 bg-card backdrop-blur-xs backdrop-filter",
 			children: [
@@ -1409,70 +1497,70 @@ const TraceTimelineComponent = memo((t0) => {
 				t17
 			]
 		});
-		$[29] = t13;
-		$[30] = t14;
-		$[31] = t17;
-		$[32] = t18;
-	} else t18 = $[32];
+		$[30] = t13;
+		$[31] = t14;
+		$[32] = t17;
+		$[33] = t18;
+	} else t18 = $[33];
 	let t19;
-	if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
 		t19 = /* @__PURE__ */ jsx("span", { children: "0ms" });
-		$[33] = t19;
-	} else t19 = $[33];
+		$[34] = t19;
+	} else t19 = $[34];
 	const t20 = Math.floor((endTime - group.startTime) * .25);
 	let t21;
-	if ($[34] !== t20) {
+	if ($[35] !== t20) {
 		t21 = formatDuration(t20);
-		$[34] = t20;
-		$[35] = t21;
-	} else t21 = $[35];
+		$[35] = t20;
+		$[36] = t21;
+	} else t21 = $[36];
 	let t22;
-	if ($[36] !== t21) {
+	if ($[37] !== t21) {
 		t22 = /* @__PURE__ */ jsx("span", { children: t21 });
-		$[36] = t21;
-		$[37] = t22;
-	} else t22 = $[37];
+		$[37] = t21;
+		$[38] = t22;
+	} else t22 = $[38];
 	const t23 = Math.floor((endTime - group.startTime) * .5);
 	let t24;
-	if ($[38] !== t23) {
+	if ($[39] !== t23) {
 		t24 = formatDuration(t23);
-		$[38] = t23;
-		$[39] = t24;
-	} else t24 = $[39];
+		$[39] = t23;
+		$[40] = t24;
+	} else t24 = $[40];
 	let t25;
-	if ($[40] !== t24) {
+	if ($[41] !== t24) {
 		t25 = /* @__PURE__ */ jsx("span", { children: t24 });
-		$[40] = t24;
-		$[41] = t25;
-	} else t25 = $[41];
+		$[41] = t24;
+		$[42] = t25;
+	} else t25 = $[42];
 	const t26 = Math.floor((endTime - group.startTime) * .75);
 	let t27;
-	if ($[42] !== t26) {
+	if ($[43] !== t26) {
 		t27 = formatDuration(t26);
-		$[42] = t26;
-		$[43] = t27;
-	} else t27 = $[43];
+		$[43] = t26;
+		$[44] = t27;
+	} else t27 = $[44];
 	let t28;
-	if ($[44] !== t27) {
+	if ($[45] !== t27) {
 		t28 = /* @__PURE__ */ jsx("span", { children: t27 });
-		$[44] = t27;
-		$[45] = t28;
-	} else t28 = $[45];
+		$[45] = t27;
+		$[46] = t28;
+	} else t28 = $[46];
 	const t29 = Math.floor(endTime - group.startTime);
 	let t30;
-	if ($[46] !== t29) {
+	if ($[47] !== t29) {
 		t30 = formatDuration(t29);
-		$[46] = t29;
-		$[47] = t30;
-	} else t30 = $[47];
+		$[47] = t29;
+		$[48] = t30;
+	} else t30 = $[48];
 	let t31;
-	if ($[48] !== t30) {
+	if ($[49] !== t30) {
 		t31 = /* @__PURE__ */ jsx("span", { children: t30 });
-		$[48] = t30;
-		$[49] = t31;
-	} else t31 = $[49];
+		$[49] = t30;
+		$[50] = t31;
+	} else t31 = $[50];
 	let t32;
-	if ($[50] !== t22 || $[51] !== t25 || $[52] !== t28 || $[53] !== t31) {
+	if ($[51] !== t22 || $[52] !== t25 || $[53] !== t28 || $[54] !== t31) {
 		t32 = /* @__PURE__ */ jsxs("div", {
 			className: "flex justify-between font-mono p-2 w-full text-xs text-muted-foreground bg-card",
 			children: [
@@ -1483,33 +1571,33 @@ const TraceTimelineComponent = memo((t0) => {
 				t31
 			]
 		});
-		$[50] = t22;
-		$[51] = t25;
-		$[52] = t28;
-		$[53] = t31;
-		$[54] = t32;
-	} else t32 = $[54];
+		$[51] = t22;
+		$[52] = t25;
+		$[53] = t28;
+		$[54] = t31;
+		$[55] = t32;
+	} else t32 = $[55];
 	let t33;
-	if ($[55] !== t10 || $[56] !== t18 || $[57] !== t32) {
+	if ($[56] !== t10 || $[57] !== t18 || $[58] !== t32) {
 		t33 = /* @__PURE__ */ jsxs("div", {
 			className: "flex flex-1 bg-background",
 			style: t10,
 			children: [t18, t32]
 		});
-		$[55] = t10;
-		$[56] = t18;
-		$[57] = t32;
-		$[58] = t33;
-	} else t33 = $[58];
+		$[56] = t10;
+		$[57] = t18;
+		$[58] = t32;
+		$[59] = t33;
+	} else t33 = $[59];
 	const t34 = `${zoom}%`;
 	let t35;
-	if ($[59] !== t34) {
+	if ($[60] !== t34) {
 		t35 = { width: t34 };
-		$[59] = t34;
-		$[60] = t35;
-	} else t35 = $[60];
+		$[60] = t34;
+		$[61] = t35;
+	} else t35 = $[61];
 	let t36;
-	if ($[61] !== data || $[62] !== endTime || $[63] !== group.startTime || $[64] !== selectTraceId) {
+	if ($[62] !== data || $[63] !== endTime || $[64] !== group.startTime || $[65] !== selectTraceId) {
 		t36 = data?.map((trace_0) => /* @__PURE__ */ jsx(TraceItem, {
 			traceId: trace_0.id,
 			traceName: trace_0.name,
@@ -1520,25 +1608,25 @@ const TraceTimelineComponent = memo((t0) => {
 			groupEndTime: endTime,
 			onExpand: selectTraceId
 		}, trace_0.id));
-		$[61] = data;
-		$[62] = endTime;
-		$[63] = group.startTime;
-		$[64] = selectTraceId;
-		$[65] = t36;
-	} else t36 = $[65];
+		$[62] = data;
+		$[63] = endTime;
+		$[64] = group.startTime;
+		$[65] = selectTraceId;
+		$[66] = t36;
+	} else t36 = $[66];
 	let t37;
-	if ($[66] !== t35 || $[67] !== t36) {
+	if ($[67] !== t35 || $[68] !== t36) {
 		t37 = /* @__PURE__ */ jsx("div", {
 			className: "flex flex-col h-full",
 			style: t35,
 			children: t36
 		});
-		$[66] = t35;
-		$[67] = t36;
-		$[68] = t37;
-	} else t37 = $[68];
+		$[67] = t35;
+		$[68] = t36;
+		$[69] = t37;
+	} else t37 = $[69];
 	let t38;
-	if ($[69] !== t33 || $[70] !== t37 || $[71] !== t8) {
+	if ($[70] !== t33 || $[71] !== t37 || $[72] !== t8) {
 		t38 = /* @__PURE__ */ jsx("div", {
 			className: "flex flex-col flex-1 relative min-h-full min-w-[1000px]",
 			children: /* @__PURE__ */ jsxs("div", {
@@ -1547,28 +1635,28 @@ const TraceTimelineComponent = memo((t0) => {
 				children: [t33, t37]
 			})
 		});
-		$[69] = t33;
-		$[70] = t37;
-		$[71] = t8;
-		$[72] = t38;
-	} else t38 = $[72];
+		$[70] = t33;
+		$[71] = t37;
+		$[72] = t8;
+		$[73] = t38;
+	} else t38 = $[73];
 	let t39;
-	if ($[73] !== selectTraceId || $[74] !== selectedTrace) {
+	if ($[74] !== selectTraceId || $[75] !== selectedTrace) {
 		t39 = selectedTrace && /* @__PURE__ */ jsx(TraceItemDetail, {
 			trace: selectedTrace,
 			onClose: () => selectTraceId(void 0)
 		});
-		$[73] = selectTraceId;
-		$[74] = selectedTrace;
-		$[75] = t39;
-	} else t39 = $[75];
+		$[74] = selectTraceId;
+		$[75] = selectedTrace;
+		$[76] = t39;
+	} else t39 = $[76];
 	let t40;
-	if ($[76] !== t38 || $[77] !== t39) {
+	if ($[77] !== t38 || $[78] !== t39) {
 		t40 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t38, t39] });
-		$[76] = t38;
-		$[77] = t39;
-		$[78] = t40;
-	} else t40 = $[78];
+		$[77] = t38;
+		$[78] = t39;
+		$[79] = t40;
+	} else t40 = $[79];
 	return t40;
 });
 TraceTimelineComponent.displayName = "TraceTimelineComponent";
@@ -1591,24 +1679,28 @@ function _temp5(prevZoom_0) {
 //#endregion
 //#region src/hooks/use-filtered-trace-groups.ts
 const useFilteredTraceGroups = () => {
-	const $ = c(4);
+	const $ = c(5);
+	if ($[0] !== "a29b076706acde25ffc4d4424df8f47d5e87949facd0d256c49dc7eec7d042a7") {
+		for (let $i = 0; $i < 5; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "a29b076706acde25ffc4d4424df8f47d5e87949facd0d256c49dc7eec7d042a7";
+	}
 	let t0;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = {
 			streamName: "motia-trace-group",
 			groupId: "default"
 		};
-		$[0] = t0;
-	} else t0 = $[0];
+		$[1] = t0;
+	} else t0 = $[1];
 	const { data } = useStreamGroup(t0);
 	const search = useObservabilityStore(_temp$2);
 	let t1;
-	if ($[1] !== data || $[2] !== search) {
+	if ($[2] !== data || $[3] !== search) {
 		t1 = data?.filter((group) => group.name.toLowerCase().includes(search.toLowerCase()) || group.id.toLowerCase().includes(search.toLowerCase()));
-		$[1] = data;
-		$[2] = search;
-		$[3] = t1;
-	} else t1 = $[3];
+		$[2] = data;
+		$[3] = search;
+		$[4] = t1;
+	} else t1 = $[4];
 	return t1;
 };
 function _temp$2(state) {
@@ -1624,20 +1716,24 @@ const variantMap = {
 	default: "default"
 };
 const TraceStatusBadge = memo((t0) => {
-	const $ = c(3);
+	const $ = c(4);
+	if ($[0] !== "135bb98907459b4eb8cfbaba04a1232c86a5e95742a41c0a99dcf1a140fa89df") {
+		for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "135bb98907459b4eb8cfbaba04a1232c86a5e95742a41c0a99dcf1a140fa89df";
+	}
 	const { status, duration } = t0;
 	const t1 = variantMap[status];
 	const t2 = duration && status !== "failed" ? duration : status;
 	let t3;
-	if ($[0] !== t1 || $[1] !== t2) {
+	if ($[1] !== t1 || $[2] !== t2) {
 		t3 = /* @__PURE__ */ jsx(Badge, {
 			variant: t1,
 			children: t2
 		});
-		$[0] = t1;
-		$[1] = t2;
-		$[2] = t3;
-	} else t3 = $[2];
+		$[1] = t1;
+		$[2] = t2;
+		$[3] = t3;
+	} else t3 = $[3];
 	return t3;
 });
 TraceStatusBadge.displayName = "TraceStatusBadge";
@@ -1645,116 +1741,120 @@ TraceStatusBadge.displayName = "TraceStatusBadge";
 //#endregion
 //#region src/components/trace-group-item.tsx
 const TraceGroupItem = memo((t0) => {
-	const $ = c(42);
+	const $ = c(43);
+	if ($[0] !== "bae7176c6d363abcd5ae856478cbdd22c5d53c5296c21141ccf8591a2ba47e9b") {
+		for (let $i = 0; $i < 43; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "bae7176c6d363abcd5ae856478cbdd22c5d53c5296c21141ccf8591a2ba47e9b";
+	}
 	const { groupId, groupName, groupStatus, groupStartTime, groupEndTime, totalSteps, activeSteps, isSelected } = t0;
 	const selectTraceGroupId = useObservabilityStore(_temp$1);
 	let t1;
-	if ($[0] !== groupEndTime || $[1] !== groupStartTime) {
+	if ($[1] !== groupEndTime || $[2] !== groupStartTime) {
 		t1 = groupEndTime ? formatDuration(groupEndTime - groupStartTime) : void 0;
-		$[0] = groupEndTime;
-		$[1] = groupStartTime;
-		$[2] = t1;
-	} else t1 = $[2];
+		$[1] = groupEndTime;
+		$[2] = groupStartTime;
+		$[3] = t1;
+	} else t1 = $[3];
 	const duration = t1;
 	let t2;
-	if ($[3] !== groupId || $[4] !== selectTraceGroupId) {
+	if ($[4] !== groupId || $[5] !== selectTraceGroupId) {
 		t2 = () => {
 			selectTraceGroupId(groupId);
 		};
-		$[3] = groupId;
-		$[4] = selectTraceGroupId;
-		$[5] = t2;
-	} else t2 = $[5];
+		$[4] = groupId;
+		$[5] = selectTraceGroupId;
+		$[6] = t2;
+	} else t2 = $[6];
 	const onSelect = t2;
 	const t3 = `trace-${groupId}`;
 	const t4 = isSelected ? "bg-muted-foreground/10" : "hover:bg-muted/70";
 	let t5;
-	if ($[6] !== t4) {
+	if ($[7] !== t4) {
 		t5 = cn("motia-trace-group cursor-pointer transition-colors w-full text-left", t4);
-		$[6] = t4;
-		$[7] = t5;
-	} else t5 = $[7];
+		$[7] = t4;
+		$[8] = t5;
+	} else t5 = $[8];
 	let t6;
-	if ($[8] !== groupName) {
+	if ($[9] !== groupName) {
 		t6 = /* @__PURE__ */ jsx("span", {
 			className: "font-semibold text-lg truncate flex-1 min-w-0",
 			children: groupName
 		});
-		$[8] = groupName;
-		$[9] = t6;
-	} else t6 = $[9];
+		$[9] = groupName;
+		$[10] = t6;
+	} else t6 = $[10];
 	let t7;
-	if ($[10] !== duration || $[11] !== groupStatus) {
+	if ($[11] !== duration || $[12] !== groupStatus) {
 		t7 = /* @__PURE__ */ jsx(TraceStatusBadge, {
 			status: groupStatus,
 			duration
 		});
-		$[10] = duration;
-		$[11] = groupStatus;
-		$[12] = t7;
-	} else t7 = $[12];
+		$[11] = duration;
+		$[12] = groupStatus;
+		$[13] = t7;
+	} else t7 = $[13];
 	let t8;
-	if ($[13] !== t6 || $[14] !== t7) {
+	if ($[14] !== t6 || $[15] !== t7) {
 		t8 = /* @__PURE__ */ jsxs("div", {
 			className: "flex flex-row justify-between items-center gap-2",
 			children: [t6, t7]
 		});
-		$[13] = t6;
-		$[14] = t7;
-		$[15] = t8;
-	} else t8 = $[15];
+		$[14] = t6;
+		$[15] = t7;
+		$[16] = t8;
+	} else t8 = $[16];
 	let t9;
-	if ($[16] !== groupId) {
+	if ($[17] !== groupId) {
 		t9 = /* @__PURE__ */ jsx("div", {
 			"data-testid": "trace-id",
 			className: "text-xs text-muted-foreground font-mono tracking-[1px]",
 			children: groupId
 		});
-		$[16] = groupId;
-		$[17] = t9;
-	} else t9 = $[17];
+		$[17] = groupId;
+		$[18] = t9;
+	} else t9 = $[18];
 	let t10;
-	if ($[18] !== totalSteps) {
+	if ($[19] !== totalSteps) {
 		t10 = /* @__PURE__ */ jsxs("span", { children: [totalSteps, " steps"] });
-		$[18] = totalSteps;
-		$[19] = t10;
-	} else t10 = $[19];
+		$[19] = totalSteps;
+		$[20] = t10;
+	} else t10 = $[20];
 	let t11;
-	if ($[20] !== t10 || $[21] !== t9) {
+	if ($[21] !== t10 || $[22] !== t9) {
 		t11 = /* @__PURE__ */ jsxs("div", {
 			className: "flex justify-between",
 			children: [t9, t10]
 		});
-		$[20] = t10;
-		$[21] = t9;
-		$[22] = t11;
-	} else t11 = $[22];
+		$[21] = t10;
+		$[22] = t9;
+		$[23] = t11;
+	} else t11 = $[23];
 	let t12;
-	if ($[23] !== groupStartTime) {
+	if ($[24] !== groupStartTime) {
 		t12 = formatDistanceToNow(groupStartTime);
-		$[23] = groupStartTime;
-		$[24] = t12;
-	} else t12 = $[24];
+		$[24] = groupStartTime;
+		$[25] = t12;
+	} else t12 = $[25];
 	let t13;
-	if ($[25] !== t12) {
+	if ($[26] !== t12) {
 		t13 = /* @__PURE__ */ jsxs("div", {
 			className: "flex justify-between",
 			children: [t12, " ago"]
 		});
-		$[25] = t12;
-		$[26] = t13;
-	} else t13 = $[26];
+		$[26] = t12;
+		$[27] = t13;
+	} else t13 = $[27];
 	let t14;
-	if ($[27] !== activeSteps) {
+	if ($[28] !== activeSteps) {
 		t14 = activeSteps > 0 && /* @__PURE__ */ jsxs("div", {
 			className: "text-blue-600",
 			children: [activeSteps, " active"]
 		});
-		$[27] = activeSteps;
-		$[28] = t14;
-	} else t14 = $[28];
+		$[28] = activeSteps;
+		$[29] = t14;
+	} else t14 = $[29];
 	let t15;
-	if ($[29] !== t11 || $[30] !== t13 || $[31] !== t14) {
+	if ($[30] !== t11 || $[31] !== t13 || $[32] !== t14) {
 		t15 = /* @__PURE__ */ jsxs("div", {
 			className: "text-xs text-muted-foreground space-y-1",
 			children: [
@@ -1763,23 +1863,23 @@ const TraceGroupItem = memo((t0) => {
 				t14
 			]
 		});
-		$[29] = t11;
-		$[30] = t13;
-		$[31] = t14;
-		$[32] = t15;
-	} else t15 = $[32];
+		$[30] = t11;
+		$[31] = t13;
+		$[32] = t14;
+		$[33] = t15;
+	} else t15 = $[33];
 	let t16;
-	if ($[33] !== t15 || $[34] !== t8) {
+	if ($[34] !== t15 || $[35] !== t8) {
 		t16 = /* @__PURE__ */ jsxs("div", {
 			className: "p-3 flex flex-col gap-1",
 			children: [t8, t15]
 		});
-		$[33] = t15;
-		$[34] = t8;
-		$[35] = t16;
-	} else t16 = $[35];
+		$[34] = t15;
+		$[35] = t8;
+		$[36] = t16;
+	} else t16 = $[36];
 	let t17;
-	if ($[36] !== groupId || $[37] !== onSelect || $[38] !== t16 || $[39] !== t3 || $[40] !== t5) {
+	if ($[37] !== groupId || $[38] !== onSelect || $[39] !== t16 || $[40] !== t3 || $[41] !== t5) {
 		t17 = /* @__PURE__ */ jsx("button", {
 			type: "button",
 			"data-testid": t3,
@@ -1787,13 +1887,13 @@ const TraceGroupItem = memo((t0) => {
 			onClick: onSelect,
 			children: t16
 		}, groupId);
-		$[36] = groupId;
-		$[37] = onSelect;
-		$[38] = t16;
-		$[39] = t3;
-		$[40] = t5;
-		$[41] = t17;
-	} else t17 = $[41];
+		$[37] = groupId;
+		$[38] = onSelect;
+		$[39] = t16;
+		$[40] = t3;
+		$[41] = t5;
+		$[42] = t17;
+	} else t17 = $[42];
 	return t17;
 });
 TraceGroupItem.displayName = "TraceGroupItem";
@@ -1804,7 +1904,11 @@ function _temp$1(state) {
 //#endregion
 //#region src/components/traces-groups.tsx
 const TracesGroups = memo(() => {
-	const $ = c(17);
+	const $ = c(18);
+	if ($[0] !== "2bddedc9dbf436ff7f1225c5b31bfd84c69748b5b6b8e426fabda2b9e624500a") {
+		for (let $i = 0; $i < 18; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "2bddedc9dbf436ff7f1225c5b31bfd84c69748b5b6b8e426fabda2b9e624500a";
+	}
 	const groups = useFilteredTraceGroups();
 	const selectedGroupId = useObservabilityStore(_temp);
 	const selectTraceGroupId = useObservabilityStore(_temp2);
@@ -1820,37 +1924,37 @@ const TracesGroups = memo(() => {
 	}
 	const lastRunningGroupId = t0;
 	let t1;
-	if ($[0] !== groupsLength || $[1] !== lastRunningGroupId || $[2] !== selectTraceGroupId || $[3] !== selectedGroupId) {
+	if ($[1] !== groupsLength || $[2] !== lastRunningGroupId || $[3] !== selectTraceGroupId || $[4] !== selectedGroupId) {
 		t1 = () => {
 			if (lastRunningGroupId && lastRunningGroupId !== selectedGroupId) selectTraceGroupId(lastRunningGroupId);
 			else if (!lastRunningGroupId && !groupsLength && selectedGroupId) selectTraceGroupId("");
 		};
-		$[0] = groupsLength;
-		$[1] = lastRunningGroupId;
-		$[2] = selectTraceGroupId;
-		$[3] = selectedGroupId;
-		$[4] = t1;
-	} else t1 = $[4];
+		$[1] = groupsLength;
+		$[2] = lastRunningGroupId;
+		$[3] = selectTraceGroupId;
+		$[4] = selectedGroupId;
+		$[5] = t1;
+	} else t1 = $[5];
 	let t2;
-	if ($[5] !== groupsLength || $[6] !== lastRunningGroupId) {
+	if ($[6] !== groupsLength || $[7] !== lastRunningGroupId) {
 		t2 = [lastRunningGroupId, groupsLength];
-		$[5] = groupsLength;
-		$[6] = lastRunningGroupId;
-		$[7] = t2;
-	} else t2 = $[7];
+		$[6] = groupsLength;
+		$[7] = lastRunningGroupId;
+		$[8] = t2;
+	} else t2 = $[8];
 	useEffect(t1, t2);
 	let t3;
-	if ($[8] !== groups) {
+	if ($[9] !== groups) {
 		t3 = [...groups].reverse();
-		$[8] = groups;
-		$[9] = t3;
-	} else t3 = $[9];
+		$[9] = groups;
+		$[10] = t3;
+	} else t3 = $[10];
 	const reversedGroups = t3;
 	if (!groups || groups.length === 0) return null;
 	let t4;
-	if ($[10] !== reversedGroups || $[11] !== selectedGroupId) {
+	if ($[11] !== reversedGroups || $[12] !== selectedGroupId) {
 		let t5$1;
-		if ($[13] !== selectedGroupId) {
+		if ($[14] !== selectedGroupId) {
 			t5$1 = (group) => /* @__PURE__ */ jsx(TraceGroupItem, {
 				groupId: group.id,
 				groupName: group.name,
@@ -1861,23 +1965,23 @@ const TracesGroups = memo(() => {
 				activeSteps: group.metadata.activeSteps,
 				isSelected: selectedGroupId === group.id
 			}, group.id);
-			$[13] = selectedGroupId;
-			$[14] = t5$1;
-		} else t5$1 = $[14];
+			$[14] = selectedGroupId;
+			$[15] = t5$1;
+		} else t5$1 = $[15];
 		t4 = reversedGroups.map(t5$1);
-		$[10] = reversedGroups;
-		$[11] = selectedGroupId;
-		$[12] = t4;
-	} else t4 = $[12];
+		$[11] = reversedGroups;
+		$[12] = selectedGroupId;
+		$[13] = t4;
+	} else t4 = $[13];
 	let t5;
-	if ($[15] !== t4) {
+	if ($[16] !== t4) {
 		t5 = /* @__PURE__ */ jsx("div", {
 			className: "overflow-auto",
 			children: t4
 		});
-		$[15] = t4;
-		$[16] = t5;
-	} else t5 = $[16];
+		$[16] = t4;
+		$[17] = t5;
+	} else t5 = $[17];
 	return t5;
 });
 TracesGroups.displayName = "TracesGroups";
@@ -1891,23 +1995,27 @@ function _temp2(state_0) {
 //#endregion
 //#region src/components/observability-page.tsx
 const ObservabilityPage = memo(() => {
-	const $ = c(3);
+	const $ = c(4);
+	if ($[0] !== "eb4316941d86db32e402fdb6a9fa0b346d5506cfc5da93f56a7fbdbc084ca168") {
+		for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "eb4316941d86db32e402fdb6a9fa0b346d5506cfc5da93f56a7fbdbc084ca168";
+	}
 	let t0;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = /* @__PURE__ */ jsx(SearchBar, {});
-		$[0] = t0;
-	} else t0 = $[0];
+		$[1] = t0;
+	} else t0 = $[1];
 	let t1;
-	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
 		t1 = /* @__PURE__ */ jsx("div", {
 			className: "w-[300px] border-r border-border overflow-auto h-full",
 			"data-testid": "traces-container",
 			children: /* @__PURE__ */ jsx(TracesGroups, {})
 		});
-		$[1] = t1;
-	} else t1 = $[1];
+		$[2] = t1;
+	} else t1 = $[2];
 	let t2;
-	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
 		t2 = /* @__PURE__ */ jsxs("div", {
 			className: "grid grid-rows-[auto_1fr] h-full",
 			children: [t0, /* @__PURE__ */ jsxs("div", {
@@ -1919,8 +2027,8 @@ const ObservabilityPage = memo(() => {
 				})]
 			})]
 		});
-		$[2] = t2;
-	} else t2 = $[2];
+		$[3] = t2;
+	} else t2 = $[3];
 	return t2;
 });
 ObservabilityPage.displayName = "ObservabilityPage";
@@ -1928,15 +2036,19 @@ ObservabilityPage.displayName = "ObservabilityPage";
 //#endregion
 //#region src/components/observability-tab-label.tsx
 const ObservabilityTabLabel = memo(() => {
-	const $ = c(1);
+	const $ = c(2);
+	if ($[0] !== "12b48555066a60a0ff63053b795596dd6b1058a64ec587d2a2a72e7129e319e3") {
+		for (let $i = 0; $i < 2; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
+		$[0] = "12b48555066a60a0ff63053b795596dd6b1058a64ec587d2a2a72e7129e319e3";
+	}
 	let t0;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = /* @__PURE__ */ jsxs("div", {
 			"data-testid": "observability-link",
 			children: [/* @__PURE__ */ jsx(GanttChartSquare, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", { children: "Tracing" })]
 		});
-		$[0] = t0;
-	} else t0 = $[0];
+		$[1] = t0;
+	} else t0 = $[1];
 	return t0;
 });
 ObservabilityTabLabel.displayName = "ObservabilityTabLabel";