@recombine-ai/platform 0.3.0 → 0.5.0-test.0

package/build/bosun-app/frontend/server/chunks/entries/pages/traces/conversations/{_layout.svelte.js-Dvn3tfM7.js → _layout.svelte.js-B4Yws-GS.js}

@@ -1,21 +1,22 @@
-import { ap as head, ao as ensure_array_like, a8 as escape_html, R as derived, a9 as attr_class, ae as attr } from '../../../../chunks/index.js-DczFGj-7.js';
+import { ap as head, ao as ensure_array_like, a8 as escape_html, ae as attr, a9 as attr_class, R as derived, ad as bind_props } from '../../../../chunks/index.js-DczFGj-7.js';
 import { g as goto } from '../../../../chunks/client.js-C_B2rv3r.js';
 import { p as page } from '../../../../chunks/index2.js-DYVLcO2-.js';
 import { B as Button } from '../../../../chunks/Button.js-IbO6ojjD.js';
 import { I as Icon } from '../../../../chunks/Icon.js-DzsiLkia.js';
 import { I as Input } from '../../../../chunks/Input.js-V9tWKRFS.js';
-import { p as persistTelescopeSourceId, T as TelescopeClient } from '../../../../chunks/source-selection.js-Cc6RX6-m.js';
+import { p as persistTelescopeSourceId, T as TelescopeClient, a as TELESCOPE_SOURCE_QUERY_PARAM } from '../../../../chunks/source-selection.js-BpCr9ar-.js';
 import { T as Tabs, a as Tab } from '../../../../chunks/Tab.js-DpBcUmVx.js';
 import { A as AgentSidebar } from '../../../../chunks/AgentSidebar.js-CFHwsTeS.js';
 import { g as getAgentsContext } from '../../../../chunks/agents-context.js-DdI5kzRS.js';
 import '../../../../chunks/trpc-client.js-zIPF9ytu.js';
+import { M as Modal } from '../../../../chunks/Modal.js-BUDSUOER.js';
 import '../../../../chunks/uneval.js-5Y6J9rDU.js';
 import '../../../../chunks/exports.js-8HOoaa4e.js';
 import '../../../../chunks/utils.js-BQzn9ikS.js';
 import '../../../../chunks/event.js-BfLhxAp5.js';
 import '../../../../chunks/root.js-CJvqqGUj.js';
 import '../../../../chunks/state.svelte.js-DDOPLPl-.js';
-import '../../../../chunks/schemas.js-W-DP3mDr.js';
+import '../../../../chunks/schemas.js-b9Mui_5N.js';
 import '../../../../chunks/index4.js-C9gg2iSH.js';
 import '../../../../chunks/index-server.js-CALBgpac.js';
 import '../../../../chunks/shared-server.js-DaWdgxVh.js';
@@ -37,7 +38,8 @@ class MockGenerator {
         medium: i % 2 === 0 ? "phone" : "whatsapp",
         phoneNumber: `+44 7700 ${String(1e3 + i % 90).padStart(4, "0")}`,
         duration: Math.floor(Math.random() * 600),
-        createdAt: now - i * 36e5
+        createdAt: now - i * 36e5,
+        analytics: {}
       });
     }
     let filtered = items;
@@ -134,6 +136,179 @@ function mulberry32(seed) {
   };
 }
 const mockGenerator = new MockGenerator();
+const ANALYTICS_FILTERS_QUERY_PARAM = "filters";
+function withAnalyticsFilters(url, filters) {
+  const nextUrl = new URL(url);
+  if (filters.length === 0) {
+    nextUrl.searchParams.delete(ANALYTICS_FILTERS_QUERY_PARAM);
+  } else {
+    nextUrl.searchParams.set(ANALYTICS_FILTERS_QUERY_PARAM, JSON.stringify(filters));
+  }
+  return nextUrl;
+}
+function AnalyticsFilterDialog($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let { open = false, fields, getValues, onAdd } = $$props;
+    let fieldName = "";
+    let values = [];
+    let selectedValues = [];
+    let freeformValue = "";
+    const selectedField = derived(() => fields.find((field) => field.field === fieldName));
+    const usesFreeform = derived(() => (selectedField()?.distinctValueCount ?? 0) > 50);
+    const parsedFreeformValue = derived(() => {
+      const field = selectedField();
+      const value = String(freeformValue).trim();
+      if (!field || !value) return void 0;
+      if (field.type === "number") {
+        const number = Number(value);
+        return Number.isFinite(number) ? number : void 0;
+      }
+      if (field.type === "boolean") {
+        if (value.toLowerCase() === "true") return true;
+        if (value.toLowerCase() === "false") return false;
+        return void 0;
+      }
+      return value;
+    });
+    const canAdd = derived(() => !!selectedField() && true && true && (usesFreeform() ? parsedFreeformValue() !== void 0 : selectedValues.length > 0));
+    function selectField(event) {
+      fieldName = event.currentTarget.value;
+      selectedValues = [];
+      freeformValue = "";
+    }
+    function sameValue(left, right) {
+      return typeof left === typeof right && left === right;
+    }
+    function isSelected(value) {
+      return selectedValues.some((selected) => sameValue(selected, value));
+    }
+    function formatValue(value) {
+      if (typeof value === "boolean") return value ? "Yes" : "No";
+      return String(value);
+    }
+    function addFilter() {
+      const field = selectedField();
+      if (!field || !canAdd()) return;
+      onAdd({
+        field: field.field,
+        operator: "in",
+        values: usesFreeform() ? [parsedFreeformValue()] : selectedValues
+      });
+      open = false;
+    }
+    let $$settled = true;
+    let $$inner_renderer;
+    function $$render_inner($$renderer3) {
+      {
+        let children = function($$renderer4) {
+          $$renderer4.push(`<div class="flex flex-col gap-4">`);
+          if (fields.length === 0) {
+            $$renderer4.push("<!--[0-->");
+            $$renderer4.push(`<p class="text-sm text-rc-gray-200">There are no more analytics fields to filter.</p>`);
+          } else {
+            $$renderer4.push("<!--[-1-->");
+            $$renderer4.push(`<label class="flex flex-col gap-1.5 text-sm text-rc-gray-200"><span>Field</span> `);
+            $$renderer4.select(
+              {
+                class: "rounded-lg border border-rc-gray-500 bg-rc-gray-900 px-3 py-2 text-rc-gray-100 focus:border-rc-gray-400 focus:outline-none focus:ring-0",
+                value: fieldName,
+                onchange: selectField
+              },
+              ($$renderer5) => {
+                $$renderer5.push(`<!--[-->`);
+                const each_array = ensure_array_like(fields);
+                for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
+                  let field = each_array[$$index];
+                  $$renderer5.option({ value: field.field }, ($$renderer6) => {
+                    $$renderer6.push(`${escape_html(field.field)}`);
+                  });
+                }
+                $$renderer5.push(`<!--]-->`);
+              }
+            );
+            $$renderer4.push(`</label> `);
+            if (selectedField()) {
+              $$renderer4.push("<!--[0-->");
+              if (usesFreeform()) {
+                $$renderer4.push("<!--[0-->");
+                $$renderer4.push(`<label class="flex flex-col gap-1.5 text-sm text-rc-gray-200"><span>Value</span> `);
+                Input($$renderer4, {
+                  type: selectedField().type === "number" ? "number" : "text",
+                  class: "w-full !border-rc-gray-500 !bg-rc-gray-900 !py-2",
+                  onkeydown: (event) => {
+                    if (event.key === "Enter" && canAdd()) addFilter();
+                  },
+                  get value() {
+                    return freeformValue;
+                  },
+                  set value($$value) {
+                    freeformValue = $$value;
+                    $$settled = false;
+                  }
+                });
+                $$renderer4.push(`<!----> <span class="text-xs text-rc-gray-400">This field has ${escape_html(selectedField().distinctValueCount)} distinct values.</span></label>`);
+              } else {
+                $$renderer4.push("<!--[-1-->");
+                $$renderer4.push(`<fieldset class="flex flex-col gap-1.5"><legend class="mb-1 text-sm text-rc-gray-200">Values</legend> <div class="rc-scroll max-h-72 overflow-y-auto rounded-lg border border-rc-gray-600 bg-rc-gray-900 p-1"><!--[-->`);
+                const each_array_1 = ensure_array_like(values);
+                for (let $$index_1 = 0, $$length = each_array_1.length; $$index_1 < $$length; $$index_1++) {
+                  let item = each_array_1[$$index_1];
+                  $$renderer4.push(`<label class="flex cursor-pointer items-center gap-3 rounded px-3 py-2 text-sm text-rc-gray-100 hover:bg-rc-gray-700"><input type="checkbox"${attr("checked", isSelected(item.value), true)}/> <span class="min-w-0 flex-1 break-words">${escape_html(formatValue(item.value))}</span> <span class="ml-auto text-[calc(0.875rem-1pt)] tabular-nums text-rc-gray-400">${escape_html(item.count)}</span></label>`);
+                }
+                $$renderer4.push(`<!--]--></div></fieldset>`);
+              }
+              $$renderer4.push(`<!--]-->`);
+            } else {
+              $$renderer4.push("<!--[-1-->");
+            }
+            $$renderer4.push(`<!--]-->`);
+          }
+          $$renderer4.push(`<!--]--></div>`);
+        }, footer = function($$renderer4) {
+          Button($$renderer4, {
+            variant: "secondary",
+            onclick: () => open = false,
+            children: ($$renderer5) => {
+              $$renderer5.push(`<!---->Cancel`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer4.push(`<!----> `);
+          Button($$renderer4, {
+            onclick: addFilter,
+            disabled: !canAdd(),
+            children: ($$renderer5) => {
+              $$renderer5.push(`<!---->Add filter`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer4.push(`<!---->`);
+        };
+        Modal($$renderer3, {
+          title: "Add analytics filter",
+          class: "!max-w-lg",
+          get open() {
+            return open;
+          },
+          set open($$value) {
+            open = $$value;
+            $$settled = false;
+          },
+          children,
+          footer,
+          $$slots: { default: true, footer: true }
+        });
+      }
+    }
+    do {
+      $$settled = true;
+      $$inner_renderer = $$renderer2.copy();
+      $$render_inner($$inner_renderer);
+    } while (!$$settled);
+    $$renderer2.subsume($$inner_renderer);
+    bind_props($$props, { open });
+  });
+}
 function _layout($$renderer, $$props) {
   $$renderer.component(($$renderer2) => {
     const client = new TelescopeClient(fetch);
@@ -150,36 +325,68 @@ function _layout($$renderer, $$props) {
     let lastConversationId = null;
     let loading = false;
     let error = null;
-    let totalLoaded = 0;
     let telescopeSources = [];
     let telescopeSourceId = "";
+    let analyticsFields = [];
+    let activeAnalyticsFilters = [];
+    let analyticsFieldsLoading = false;
+    let analyticsFieldsError = null;
+    let filterDialogOpen = false;
+    let conversationRequestId = 0;
+    let analyticsFieldsRequestId = 0;
+    const availableAnalyticsFields = derived(() => analyticsFields.filter((field) => !activeAnalyticsFilters.some((filter) => filter.field === field.field)));
+    let loadedConversationFilterKey = null;
+    const currentConversationFilterKey = derived(() => JSON.stringify([currentAgent(), telescopeSourceId, activeAnalyticsFilters]));
+    const currentConversations = derived(() => loadedConversationFilterKey === currentConversationFilterKey() ? conversations : void 0);
+    const totalLoaded = derived(() => currentConversations()?.items.length ?? 0);
     let { useMock = false, children } = $$props;
     const { onError } = getAgentsContext();
     function fmtDate(ms) {
       return new Date(ms).toLocaleString();
     }
     function fmtDuration(sec) {
-      const mm = Math.floor(sec / 60);
-      const ss = sec % 60;
+      const totalSeconds = Math.round(sec);
+      const mm = Math.floor(totalSeconds / 60);
+      const ss = totalSeconds % 60;
       return `${mm}:${String(ss).padStart(2, "0")}`;
     }
+    function resetSelectionData() {
+      conversationRequestId += 1;
+      analyticsFieldsRequestId += 1;
+      selectedConversation = null;
+      conversations = void 0;
+      loadedConversationFilterKey = null;
+      analyticsFields = [];
+      activeAnalyticsFilters = [];
+      cursorStack = [];
+      lastConversationId = null;
+      loading = true;
+      analyticsFieldsLoading = true;
+      analyticsFieldsError = null;
+      filterDialogOpen = false;
+    }
     function buildAgentSearch(agentId = currentAgent(), region = agentId === currentAgent() ? currentRegion() : "") {
       const params = new URLSearchParams();
       if (agentId) params.set("agent", agentId);
       if (agentId && region) params.set("region", region);
+      if (telescopeSourceId) params.set(TELESCOPE_SOURCE_QUERY_PARAM, telescopeSourceId);
+      if (agentId === currentAgent() && activeAnalyticsFilters.length > 0) {
+        params.set(ANALYTICS_FILTERS_QUERY_PARAM, JSON.stringify(activeAnalyticsFilters));
+      }
       const search = params.toString();
       return search ? `?${search}` : "";
     }
     function buildConversationsUrl(agentId = currentAgent()) {
       return `${viewBase()}/conversations${buildAgentSearch(agentId)}`;
     }
-    async function fetchConversationsFromApi(phoneNumber, limit = pageSize, lastConversationId2, agentId) {
+    async function fetchConversationsFromApi(phoneNumber, limit = pageSize, lastConversationId2, agentId, analyticsFilters = activeAnalyticsFilters) {
       if (useMock) {
         return mockGenerator.fetchConversations(limit, phoneNumber, lastConversationId2 ?? void 0);
       } else {
         return client.getConversations({
           phoneNumber,
           agentId,
+          analyticsFilters,
           limit: Number(limit),
           lastConversationId: lastConversationId2 ?? void 0
         });
@@ -195,36 +402,83 @@ function _layout($$renderer, $$props) {
       telescopeSourceId = next;
       persistTelescopeSourceId(next);
       client.setSourceId(next);
-      selectedConversation = null;
+      resetSelectionData();
       await goto(buildConversationsUrl());
-      await loadFirstPage();
+      await Promise.all([loadAnalyticsFields(), loadFirstPage()]);
     }
     async function loadPage() {
+      const requestId = ++conversationRequestId;
+      const requestedFilters = activeAnalyticsFilters.map((filter) => ({ ...filter, values: [...filter.values] }));
+      const requestAgent = currentAgent();
+      const requestFilterKey = JSON.stringify([requestAgent, telescopeSourceId, requestedFilters]);
       loading = true;
       error = null;
       try {
-        const resp = await fetchConversationsFromApi(phoneQuery || void 0, pageSize, lastConversationId ?? void 0, currentAgent() || void 0);
-        let filteredItems = Array.isArray(resp.items) ? resp.items.slice() : [];
-        filteredItems = filteredItems.filter((c) => !!c?.phoneNumber);
+        const resp = await fetchConversationsFromApi(phoneQuery || void 0, pageSize, lastConversationId ?? void 0, requestAgent || void 0, requestedFilters);
+        if (requestId !== conversationRequestId || requestFilterKey !== currentConversationFilterKey()) return;
+        const items = Array.isArray(resp.items) ? resp.items.slice() : [];
         conversations = {
           limit: resp.limit,
-          items: filteredItems,
+          items,
           lastConversationId: resp.lastConversationId
         };
-        totalLoaded = filteredItems.length;
+        loadedConversationFilterKey = requestFilterKey;
         lastConversationId = resp.lastConversationId ?? null;
-        loading = false;
       } catch (e) {
-        loading = false;
-        error = e.message || "Unknown error";
-        onError(`Error loading conversations: ${error}`);
+        if (requestId !== conversationRequestId || requestFilterKey !== currentConversationFilterKey()) return;
+        error = "Conversations could not be loaded for this selection.";
+        onError(error);
         console.error("Load page error:", e);
+      } finally {
+        if (requestId === conversationRequestId) loading = false;
       }
     }
+    async function loadAnalyticsFields() {
+      const requestId = ++analyticsFieldsRequestId;
+      analyticsFieldsLoading = true;
+      analyticsFieldsError = null;
+      analyticsFields = [];
+      if (useMock || !currentAgent()) {
+        analyticsFieldsLoading = false;
+        return;
+      }
+      try {
+        const response = await client.getAnalyticsFields(currentAgent());
+        if (requestId !== analyticsFieldsRequestId) return;
+        analyticsFields = response.items;
+      } catch (e) {
+        if (requestId !== analyticsFieldsRequestId) return;
+        analyticsFieldsError = "Filters are unavailable for this selection.";
+        console.error("Failed to load analytics fields:", e);
+      } finally {
+        if (requestId === analyticsFieldsRequestId) analyticsFieldsLoading = false;
+      }
+    }
+    function getAnalyticsFieldValues(field, cursor) {
+      if (!currentAgent()) throw new Error("Select an agent before loading analytics values.");
+      return client.getAnalyticsFieldValues(currentAgent(), field, 50, cursor);
+    }
+    function addAnalyticsFilter(filter) {
+      void setAnalyticsFilters([...activeAnalyticsFilters, filter]);
+    }
+    async function setAnalyticsFilters(filters) {
+      activeAnalyticsFilters = filters;
+      JSON.stringify(filters);
+      const nextUrl = withAnalyticsFilters(page.url, filters);
+      await goto(`${nextUrl.pathname}${nextUrl.search}${nextUrl.hash}`);
+      await loadFirstPage();
+    }
+    function formatAnalyticsValue(value) {
+      if (typeof value === "boolean") return value ? "Yes" : "No";
+      return String(value);
+    }
+    function formatAnalyticsFilter(filter) {
+      return `${filter.field}: ${filter.values.map(formatAnalyticsValue).join(", ")}`;
+    }
     async function onNext() {
-      if (!conversations?.lastConversationId) return;
-      cursorStack.push(conversations.lastConversationId);
-      lastConversationId = conversations.lastConversationId;
+      if (!currentConversations()?.lastConversationId) return;
+      cursorStack.push(currentConversations().lastConversationId);
+      lastConversationId = currentConversations().lastConversationId;
       await loadPage();
     }
     async function onPrev() {
@@ -237,8 +491,8 @@ function _layout($$renderer, $$props) {
     }
     function toggleSort() {
       sortDesc = !sortDesc;
-      if (conversations?.items) {
-        conversations.items.sort((a, b) => sortDesc ? b.createdAt - a.createdAt : a.createdAt - b.createdAt);
+      if (currentConversations()?.items) {
+        currentConversations().items.sort((a, b) => sortDesc ? b.createdAt - a.createdAt : a.createdAt - b.createdAt);
       }
     }
     function onPageSizeChange(e) {
@@ -269,13 +523,13 @@ function _layout($$renderer, $$props) {
     async function handleAgentClick(agentId, event) {
       event?.stopPropagation();
       if (agentId === currentAgent()) return;
-      selectedConversation = null;
+      resetSelectionData();
       await goto(buildConversationsUrl(agentId));
     }
     async function handleAllAgentsClick(event) {
       event?.stopPropagation();
       if (!currentAgent()) return;
-      selectedConversation = null;
+      resetSelectionData();
       await goto(buildConversationsUrl(""));
     }
     let $$settled = true;
@@ -386,6 +640,25 @@ function _layout($$renderer, $$props) {
         },
         $$slots: { default: true }
       });
+      $$renderer3.push(`<!----> <!--[-->`);
+      const each_array_1 = ensure_array_like(activeAnalyticsFilters);
+      for (let $$index_1 = 0, $$length = each_array_1.length; $$index_1 < $$length; $$index_1++) {
+        let filter = each_array_1[$$index_1];
+        $$renderer3.push(`<div class="flex max-w-80 items-center gap-1 rounded-lg border border-rc-gray-500 bg-rc-gray-700 py-1 pl-3 pr-1 text-sm text-rc-gray-100"${attr("title", formatAnalyticsFilter(filter))}><span class="truncate">${escape_html(formatAnalyticsFilter(filter))}</span> <button type="button" class="flex-none rounded p-1 text-rc-gray-300 hover:bg-rc-gray-600 hover:text-rc-gray-100"${attr("aria-label", `Remove ${filter.field} filter`)}>`);
+        Icon($$renderer3, { name: "close", width: 16, height: 16 });
+        $$renderer3.push(`<!----></button></div>`);
+      }
+      $$renderer3.push(`<!--]--> `);
+      Button($$renderer3, {
+        variant: "secondary",
+        disabled: analyticsFieldsLoading || availableAnalyticsFields().length === 0,
+        title: analyticsFieldsError ?? "Add analytics filter",
+        onclick: () => filterDialogOpen = true,
+        children: ($$renderer4) => {
+          $$renderer4.push(`<!---->Add filter`);
+        },
+        $$slots: { default: true }
+      });
       $$renderer3.push(`<!----></div></label></div> <div class="hidden items-center gap-2"><div class="text-rc-gray-200">Sort:</div> `);
       Button($$renderer3, {
         onclick: toggleSort,
@@ -428,25 +701,25 @@ function _layout($$renderer, $$props) {
       $$renderer3.push(`<!----> `);
       Button($$renderer3, {
         onclick: onNext,
-        disabled: !conversations?.items.length,
+        disabled: !currentConversations()?.items.length,
         children: ($$renderer4) => {
           $$renderer4.push(`<!---->Next`);
         },
         $$slots: { default: true }
       });
-      $$renderer3.push(`<!----> <div class="text-sm text-rc-gray-200">Items: ${escape_html(totalLoaded)}</div></div></div> <div class="ml-auto whitespace-nowrap text-sm"><span class="text-gray-400">API Mode:</span> <span class="font-semibold text-rc-green-200">${escape_html(useMock ? "Mock (local)" : "Live")}</span></div></div></nav> <main class="flex flex-1 overflow-hidden"><div class="flex h-full w-1/3 flex-col"><div class="flex-none border-b border-rc-gray-300/40 p-4"><h2 class="text-lg font-semibold text-rc-gray-100">Conversations</h2></div> <div class="rc-scroll min-h-0 flex-1 overflow-scroll px-3 py-4">`);
+      $$renderer3.push(`<!----> <div class="text-sm text-rc-gray-200">Items: ${escape_html(totalLoaded())}</div></div></div> <div class="ml-auto whitespace-nowrap text-sm"><span class="text-gray-400">API Mode:</span> <span class="font-semibold text-rc-green-200">${escape_html(useMock ? "Mock (local)" : "Live")}</span></div></div></nav> <main class="flex flex-1 overflow-hidden"><div class="flex h-full w-1/3 flex-col"><div class="flex-none border-b border-rc-gray-300/40 p-4"><h2 class="text-lg font-semibold text-rc-gray-100">Conversations</h2></div> <div class="rc-scroll min-h-0 flex-1 overflow-scroll px-3 py-4">`);
       if (loading) {
         $$renderer3.push("<!--[0-->");
         $$renderer3.push(`<p class="py-8 text-center text-rc-gray-200">Loading...</p>`);
-      } else if (!conversations?.items?.length) {
+      } else if (!currentConversations()?.items?.length) {
         $$renderer3.push("<!--[1-->");
         $$renderer3.push(`<p class="py-8 text-center text-rc-gray-300">No conversations found</p>`);
       } else {
         $$renderer3.push("<!--[-1-->");
         $$renderer3.push(`<ul class="space-y-2"><!--[-->`);
-        const each_array_1 = ensure_array_like(conversations.items);
-        for (let $$index_1 = 0, $$length = each_array_1.length; $$index_1 < $$length; $$index_1++) {
-          let conversation = each_array_1[$$index_1];
+        const each_array_2 = ensure_array_like(currentConversations().items);
+        for (let $$index_2 = 0, $$length = each_array_2.length; $$index_2 < $$length; $$index_2++) {
+          let conversation = each_array_2[$$index_2];
           $$renderer3.push(`<li${attr_class(
             `cursor-pointer rounded-lg p-3 transition-colors ${(page.params.conversationId ? conversation.conversationId === page.params.conversationId : conversation.conversationId === selectedConversation?.conversationId) ? "bg-rc-gray-600" : "bg-rc-gray-700 hover:bg-rc-gray-650"}`,
             "svelte-1uk1thp"
@@ -457,13 +730,33 @@ function _layout($$renderer, $$props) {
           } else {
             $$renderer3.push("<!--[-1-->");
           }
-          $$renderer3.push(`<!--]--></div> <p class="text-sm text-gray-400">Duration: ${escape_html(fmtDuration(conversation.duration ?? 0))}</p></div></div></li>`);
+          $$renderer3.push(`<!--]--></div> `);
+          if (conversation.medium === "phone" && conversation.duration !== void 0) {
+            $$renderer3.push("<!--[0-->");
+            $$renderer3.push(`<p class="text-sm text-gray-400">Duration: ${escape_html(fmtDuration(conversation.duration))}</p>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+          }
+          $$renderer3.push(`<!--]--></div></div></li>`);
         }
         $$renderer3.push(`<!--]--></ul>`);
       }
       $$renderer3.push(`<!--]--></div></div> <div class="flex h-full w-2/3 flex-col bg-rc-gray-980">`);
       children($$renderer3);
-      $$renderer3.push(`<!----></div></main></div></div>`);
+      $$renderer3.push(`<!----></div></main></div></div> `);
+      AnalyticsFilterDialog($$renderer3, {
+        fields: availableAnalyticsFields(),
+        getValues: getAnalyticsFieldValues,
+        onAdd: addAnalyticsFilter,
+        get open() {
+          return filterDialogOpen;
+        },
+        set open($$value) {
+          filterDialogOpen = $$value;
+          $$settled = false;
+        }
+      });
+      $$renderer3.push(`<!---->`);
     }
     do {
       $$settled = true;
@@ -475,4 +768,4 @@ function _layout($$renderer, $$props) {
 }
 
 export { _layout as default };
-//# sourceMappingURL=_layout.svelte.js-Dvn3tfM7.js.map
+//# sourceMappingURL=_layout.svelte.js-B4Yws-GS.js.map