use current tab for filtering in ask mode

core/assets/package.json

@@ -17,7 +17,7 @@
     "typescript": "^5.4.5"
   },
   "dependencies": {
-    "@getcanary/web": "^0.0.88",
+    "@getcanary/web": "^0.0.90",
     "chart.js": "^4.4.4",
     "clipboard": "^2.0.11",
     "clsx": "^2.1.1",

core/lib/canary/interactions/responder.ex

@@ -4,12 +4,13 @@ defmodule Canary.Interactions.Responder do
   @callback run(
               session :: any(),
               query :: String.t(),
+              pattern :: String.t() | nil,
               client :: any(),
               handle_delta :: function()
             ) :: {:ok, any()} | {:error, any()}
 
-  def run(session, query, client, handle_delta \\ nil) do
-    impl().run(session, query, client, handle_delta)
+  def run(session, query, pattern, client, handle_delta \\ nil) do
+    impl().run(session, query, pattern, client, handle_delta)
   end
 
   defp impl, do: Application.get_env(:canary, :responder, Responder.Default)
@@ -21,14 +22,22 @@ defmodule Canary.Interactions.Responder.Default do
 
   alias Canary.Interactions.Client
 
-  def run(session, request, %Client{account: account, sources: sources}, handle_delta) do
+  def run(session, query, pattern, %Client{account: account, sources: sources}, handle_delta) do
     Task.Supervisor.start_child(Canary.TaskSupervisor, fn ->
-      Canary.Interactions.Message.add_user!(session, request)
+      Canary.Interactions.Message.add_user!(session, query)
     end)
 
     model = Application.fetch_env!(:canary, :chat_completion_model_response)
     source = sources |> Enum.at(0)
-    {:ok, %{search: docs}} = Canary.Searcher.run(source, request)
+    {:ok, %{search: docs}} = Canary.Searcher.run(source, query)
+
+    docs =
+      if is_nil(pattern) do
+        docs
+      else
+        docs
+        |> Enum.filter(fn doc -> Canary.Native.glob_match(pattern, URI.parse(doc.url).path) end)
+      end
 
     messages = [
       %{
@@ -83,7 +92,7 @@ defmodule Canary.Interactions.Responder.Default do
         #{render_history(session.messages)}
 
         <user_question>
-        #{request}
+        #{query}
         </user_question>
 
         <instruction>

core/lib/canary_web/operations_controller.ex

@@ -7,12 +7,21 @@ defmodule CanaryWeb.OperationsController do
   defp find_client(conn, _opts) do
     err_msg = "no client found with the given key"
 
-    case Canary.Interactions.Client.find_web(conn.params["key"]) do
-      {:ok, client} -> conn |> assign(:client, client)
+    with {:ok, token} <- get_token_from_header(conn),
+         {:ok, client} <- Canary.Interactions.Client.find_web(token) do
+      conn |> assign(:client, client)
+    else
       _ -> conn |> send_resp(401, err_msg) |> halt()
     end
   end
 
+  defp get_token_from_header(conn) do
+    case Plug.Conn.get_req_header(conn, "authorization") do
+      ["Bearer " <> token] -> {:ok, token}
+      _ -> :error
+    end
+  end
+
   defp ensure_valid_host(conn, _opts) do
     err_msg = "invalid host"
     host_url = conn.assigns.client.web_host_url
@@ -99,7 +108,7 @@ defmodule CanaryWeb.OperationsController do
     end
   end
 
-  def ask(conn, %{"id" => id, "query" => query}) do
+  def ask(conn, %{"id" => id, "query" => query, "pattern" => pattern}) do
     client = conn.assigns.client
     {:ok, session} = Canary.Interactions.find_or_create_session(client.account, {:web, id})
 
@@ -116,6 +125,7 @@ defmodule CanaryWeb.OperationsController do
       Canary.Interactions.Responder.run(
         session,
         query,
+        pattern,
         client,
         fn data -> send(here, data) end
       )

core/native/canary_native/src/tests/html.rs

@@ -758,3 +758,31 @@ fn to_md_with_marker() {
     *
     "###);
 }
+
+#[test]
+fn to_md_vitepress_code() {
+    let html = r#"
+<div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark has-diff vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">canary-root</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> framework</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line diff remove"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">canary-provider-vitepress-minisearch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line diff add"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">canary-provider-cloud</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> api-key</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"KEY"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> api-base</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"https://cloud.getcanary.dev"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">      &lt;!-- Rest of the code --&gt;</span></span>
+<span class="line diff add"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">canary-provider-cloud</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line diff remove"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  &lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">canary-provider-vitepress-minisearch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">canary-root</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div>
+    "#;
+
+    let md = html::to_md(&html).unwrap();
+    assert_snapshot!(md, @r###"
+    html
+
+    ```
+    <canary-root framework="vitepress">
+      <canary-provider-vitepress-minisearch>
+        <canary-provider-cloud api-key="KEY" api-base="https://cloud.getcanary.dev">
+          <!-- Rest of the code -->
+        </canary-provider-cloud>
+      </canary-provider-vitepress-minisearch>
+    </canary-root>
+    ```
+    "###);
+}

js/apps/docs/contents/docs/common/guides/conditional-callout.md

@@ -35,8 +35,8 @@ const { localeIndex } = useData();
   <canary-provider-vitepress-minisearch :localeIndex="localeIndex">
     <canary-content>
         <canary-search slot="mode">
-          <canary-callout-discord slot="body"></canary-callout-discord>
           <canary-search-input slot="input"></canary-search-input>
+          <canary-callout-discord slot="body"></canary-callout-discord>
           <canary-search-results slot="body"></canary-search-results>
         </canary-search>
     </canary-content>

js/apps/docs/contents/docs/common/guides/spliting-tabs.md

@@ -36,8 +36,8 @@ const { localeIndex } = useData();
   <canary-provider-vitepress-minisearch :localeIndex="localeIndex">
     <canary-content>
         <canary-search slot="mode">
-          <canary-callout-discord slot="body"></canary-callout-discord>
           <canary-search-input slot="input"></canary-search-input>
+          <canary-callout-discord slot="body"></canary-callout-discord>
           <canary-search-results-tabs
             slot="body"
             :tabs="JSON.stringify(pattern)"

js/apps/docs/package.json

@@ -17,7 +17,7 @@
     "vue": "^3.4.35"
   },
   "dependencies": {
-    "@getcanary/web": "^0.0.89",
+    "@getcanary/web": "^0.0.90",
     "@vercel/analytics": "^1.3.1",
     "chart.js": "^4.4.3",
     "timeago.js": "^4.0.2",

js/packages/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getcanary/web",
-  "version": "0.0.89",
+  "version": "0.0.90",
   "type": "module",
   "main": "dist/components/canary-root.js",
   "files": [

js/packages/web/src/components/canary-provider-cloud.ts

@@ -41,11 +41,14 @@ export class CanaryProviderCloud extends LitElement {
 
   static styles = wrapper;
 
-  search: SearchFunction = async (query, signal) => {
+  search: SearchFunction = async (payload, signal) => {
     const params = {
       method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ key: this.apiKey, query }),
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${this.apiKey}`,
+      },
+      body: JSON.stringify(payload),
       signal,
     };
 
@@ -57,12 +60,15 @@ export class CanaryProviderCloud extends LitElement {
     return res.json();
   };
 
-  ask: AskFunction = async (id, query, handleDelta, signal) => {
+  ask: AskFunction = async (payload, handleDelta, signal) => {
     const url = `${this.apiBase}/api/v1/ask`;
     const params = {
       method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ id, key: this.apiKey, query }),
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${this.apiKey}`,
+      },
+      body: JSON.stringify(payload),
       signal,
     };
 

js/packages/web/src/components/canary-provider-mock.ts

@@ -26,7 +26,7 @@ export class CanaryProviderMock extends LitElement {
 
   static styles = wrapper;
 
-  search: SearchFunction = async (_query, _signal) => {
+  search: SearchFunction = async (_payload, _signal) => {
     await new Promise((resolve) =>
       setTimeout(resolve, Math.random() * 300 + 200),
     );
@@ -77,7 +77,7 @@ export class CanaryProviderMock extends LitElement {
     return { search: search };
   };
 
-  ask: AskFunction = async (_id, _query, handleDelta, _signal) => {
+  ask: AskFunction = async (_payload, handleDelta, _signal) => {
     await new Promise((resolve) => setTimeout(resolve, 1000));
     handleDelta({ type: "progress", content: "hello" });
     await new Promise((resolve) => setTimeout(resolve, 100));

js/packages/web/src/components/canary-provider-pagefind.ts

@@ -87,7 +87,7 @@ export class CanaryProviderPagefind extends LitElement {
     this._pagefind.preload(query);
   };
 
-  search: SearchFunction = async (query, signal) => {
+  search: SearchFunction = async ({ query }, signal) => {
     const maxPages = this.options.maxPages ?? DEFAULT_MAX_PAGES;
 
     const { results: pages } = await this._pagefind.search(query);

js/packages/web/src/components/canary-provider-vitepress-minisearch.ts

@@ -87,7 +87,7 @@ export class CanaryProviderVitepressMinisearch extends LitElement {
 
   static styles = wrapper;
 
-  search: SearchFunction = async (query, _signal) => {
+  search: SearchFunction = async ({ query }, _signal) => {
     return new Promise((resolve) => {
       if (!this.minisearch) {
         resolve({ search: [] });

js/packages/web/src/components/canary-search-results-tabs.ts

@@ -8,6 +8,7 @@ import { searchContext } from "../contexts";
 import pm from "picomatch";
 
 import type { SearchContext, SearchReference, TabDefinitions } from "../types";
+import { createEvent } from "../store";
 import { TaskStatus } from "../store/managers";
 
 import "./canary-search-references";
@@ -39,13 +40,11 @@ export class CanarySearchResultsTabs extends LitElement {
     if (typeof this.tabs === "string") {
       this.tabs = JSON.parse(this.tabs);
     }
+
+    this.dispatchEvent(createEvent({ type: "register_tab", data: this.tabs }));
   }
 
   updated(changed: PropertyValues<this>) {
-    if (!this._selectedTab && this.tabs.length > 0) {
-      this._selectedTab = this.tabs[0].name;
-    }
-
     if (changed.has("_groupedReferences") && !changed.has("_selectedTab")) {
       const relevantGroup = Object.entries(this._groupedReferences).reduce(
         (acc, [group, references]) => {
@@ -61,7 +60,7 @@ export class CanarySearchResultsTabs extends LitElement {
         this._selectedTab,
       );
 
-      this._selectedTab = relevantGroup;
+      this._handleChangeTab(relevantGroup);
     }
   }
 
@@ -103,7 +102,7 @@ export class CanarySearchResultsTabs extends LitElement {
           const selected = name === this._selectedTab;
           const selectable = counts[name] > 0;
 
-          return html`<div @click=${() => this._handleTabClick(name)}>
+          return html`<div @click=${() => this._handleChangeTab(name)}>
             <input
               type="radio"
               name="mode"
@@ -131,8 +130,11 @@ export class CanarySearchResultsTabs extends LitElement {
     `;
   }
 
-  private _handleTabClick(name: string): void {
+  private _handleChangeTab(name: string): void {
     this._selectedTab = name;
+
+    const index = this.tabs.findIndex((tab) => tab.name === name);
+    this.dispatchEvent(createEvent({ type: "set_tab", data: index }));
   }
 
   private _groupReferences(