feature: tags are defineable via public page

devflowinc · Dec 9, 2024 · 8660b52 · 8660b52
1 parent 13e4000
commit 8660b52
Show file tree

Hide file tree

Showing 9 changed files with 99 additions and 9 deletions.
diff --git a/clients/search-component/src/TrieveModal/index.css b/clients/search-component/src/TrieveModal/index.css
@@ -219,7 +219,7 @@ body {
       }
 
       .bottom-row {
-        @apply flex justify-between items-center px-4;
+        @apply flex justify-between items-center px-4 2xl:px-0 max-w-6xl mx-auto;
 
         button {
           @apply px-2 text-sm py-1 rounded-md;

diff --git a/clients/ts-sdk/openapi.json b/clients/ts-sdk/openapi.json
@@ -12103,6 +12103,13 @@
             },
             "nullable": true
           },
+          "tags": {
+            "type": "array",
+            "items": {
+              "$ref": "#/components/schemas/PublicPageTag"
+            },
+            "nullable": true
+          },
           "theme": {
             "allOf": [
               {
@@ -12275,6 +12282,29 @@
           }
         }
       },
+      "PublicPageTag": {
+        "type": "object",
+        "required": [
+          "tag"
+        ],
+        "properties": {
+          "iconClassName": {
+            "type": "string",
+            "nullable": true
+          },
+          "label": {
+            "type": "string",
+            "nullable": true
+          },
+          "selected": {
+            "type": "boolean",
+            "nullable": true
+          },
+          "tag": {
+            "type": "string"
+          }
+        }
+      },
       "PublicPageTheme": {
         "type": "string",
         "enum": [

diff --git a/clients/ts-sdk/src/types.gen.ts b/clients/ts-sdk/src/types.gen.ts
@@ -1985,6 +1985,7 @@ export type PublicPageParameters = {
     searchOptions?: ((PublicPageSearchOptions) | null);
     suggestedQueries?: (boolean) | null;
     tabMessages?: Array<PublicPageTabMessage> | null;
+    tags?: Array<PublicPageTag> | null;
     theme?: ((PublicPageTheme) | null);
     type?: (string) | null;
     useGroupSearch?: (boolean) | null;
@@ -2044,6 +2045,13 @@ export type PublicPageTabMessage = {
     title: string;
 };
 
+export type PublicPageTag = {
+    iconClassName?: (string) | null;
+    label?: (string) | null;
+    selected?: (boolean) | null;
+    tag: string;
+};
+
 export type PublicPageTheme = 'light' | 'dark';
 
 export type QdrantChunkMetadata = {

diff --git a/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx b/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx
@@ -367,7 +367,7 @@ const PublicPageControls = () => {
               onChange={(e) => {
                 setExtraParams("defaultSearchQueries", e);
               }}
-              addLabel="Add Example"
+              addLabel="Add Example Search"
               addClass="text-sm"
               inputClass="block w-full rounded border border-neutral-300 px-3 py-1.5 shadow-sm placeholder:text-neutral-400 focus:outline-magenta-500 sm:text-sm sm:leading-6"
             />
@@ -390,11 +390,47 @@ const PublicPageControls = () => {
               onChange={(e) => {
                 setExtraParams("defaultAiQuestions", e);
               }}
-              addLabel="Add Example"
+              addLabel="Add Example Question"
               addClass="text-sm"
               inputClass="block w-full rounded border border-neutral-300 px-3 py-1.5 shadow-sm placeholder:text-neutral-400 focus:outline-magenta-500 sm:text-sm sm:leading-6"
             />
           </div>
+          <div class="grow">
+            <div class="flex items-center gap-1">
+              <label class="block" for="">
+                Tags
+              </label>
+              <Tooltip
+                tooltipText="Default tag filters for the search component. Each field has a `tag, label, iconClassName` separated by commas. Only tag is required."
+                body={<FaRegularCircleQuestion class="h-3 w-3 text-black" />}
+              />
+            </div>
+            <MultiStringInput
+              placeholder={`documentation,docs,fa-solid fa-info`}
+              value={
+                extraParams.tags?.map((tag) => {
+                  return `${tag.tag},${tag.label},${tag.iconClassName}`;
+                }) ?? []
+              }
+              onChange={(e) => {
+                setExtraParams(
+                  "tags",
+                  e.map((tag) => {
+                    const [tagStr, label, iconClassName] = tag.split(",");
+                    return {
+                      tag: tagStr,
+                      label,
+                      iconClassName,
+                    };
+                  }),
+                );
+              }}
+              addLabel="Add Tag"
+              addClass="text-sm"
+              inputClass="block w-full rounded border border-neutral-300 px-3 py-1.5 shadow-sm placeholder:text-neutral-400 focus:outline-magenta-500 sm:text-sm sm:leading-6"
+            />
+          </div>
+          <div />
           <div class="grow">
             <div class="flex items-center gap-1">
               <label class="block">Placeholder Text</label>

diff --git a/server/src/data/models.rs b/server/src/data/models.rs
@@ -3099,6 +3099,7 @@ impl DatasetConfigurationDTO {
                     analytics: page_parameters_self
                         .analytics
                         .or(page_parameters_curr.analytics),
+                    tags: page_parameters_self.tags.or(page_parameters_curr.tags),
                     suggested_queries: page_parameters_self
                         .suggested_queries
                         .or(page_parameters_curr.suggested_queries),

diff --git a/server/src/handlers/page_handler.rs b/server/src/handlers/page_handler.rs
@@ -134,6 +134,15 @@ pub struct OpenGraphMetadata {
     description: Option<String>,
 }
 
+#[derive(Serialize, Deserialize, Debug, Clone, ToSchema, Default)]
+#[serde(rename_all = "camelCase")]
+pub struct PublicPageTag {
+    tag: String,
+    label: Option<String>,
+    selected: Option<bool>,
+    icon_class_name: Option<String>,
+}
+
 #[derive(Serialize, Deserialize, Debug, Clone, ToSchema, Default)]
 #[serde(rename_all = "camelCase")]
 pub struct PublicPageParameters {
@@ -148,6 +157,8 @@ pub struct PublicPageParameters {
     #[serde(skip_serializing_if = "Option::is_none")]
     pub analytics: Option<bool>,
     #[serde(skip_serializing_if = "Option::is_none")]
+    pub tags: Option<Vec<PublicPageTag>>,
+    #[serde(skip_serializing_if = "Option::is_none")]
     pub suggested_queries: Option<bool>,
     #[serde(skip_serializing_if = "Option::is_none")]
     pub responsive: Option<bool>,

diff --git a/server/src/lib.rs b/server/src/lib.rs
@@ -267,10 +267,6 @@ impl Modify for SecurityAddon {
     ),
     components(
         schemas(
-            handlers::page_handler::PublicPageTheme,
-            handlers::page_handler::PublicPageParameters,
-            handlers::page_handler::PublicPageTabMessage,
-            handlers::page_handler::HeroPattern,
             handlers::auth_handler::AuthQuery,
             handlers::topic_handler::CreateTopicReqPayload,
             handlers::topic_handler::CloneTopicReqPayload,
@@ -394,6 +390,11 @@ impl Modify for SecurityAddon {
             handlers::stripe_handler::CreateSetupCheckoutSessionResPayload,
             handlers::page_handler::PublicPageSearchOptions,
             handlers::page_handler::OpenGraphMetadata,
+            handlers::page_handler::PublicPageTag,
+            handlers::page_handler::PublicPageTheme,
+            handlers::page_handler::PublicPageParameters,
+            handlers::page_handler::PublicPageTabMessage,
+            handlers::page_handler::HeroPattern,
             data::models::ChunkReqPayloadFields,
             data::models::ChunkReqPayloadMapping,
             data::models::ChunkReqPayloadMappings,

diff --git a/server/src/public/page.html b/server/src/public/page.html
@@ -4,7 +4,7 @@
     <link rel="stylesheet" href="/static/output.css" />
     <link
       rel="stylesheet"
-      href="https://unpkg.com/[email protected].10/dist/index.css"
+      href="https://unpkg.com/[email protected].11/dist/index.css"
     />
     <link
       rel="apple-touch-icon"
@@ -181,7 +181,7 @@
     </style>
 
     <script type="module">
-      import {renderToDiv} from 'https://unpkg.com/[email protected].10/dist/vanilla/index.js';
+      import {renderToDiv} from 'https://unpkg.com/[email protected].11/dist/vanilla/index.js';
       window.addEventListener('load', () => {
         const root = document.getElementById('root');
         renderToDiv(root, {

diff --git a/server/src/public/search-component-code.html b/server/src/public/search-component-code.html
@@ -19,6 +19,9 @@
       {% if params.analytics -%}
       analytics={{ params.analytics }}
       {% endif -%}
+      {% if params.tags -%}
+      tags={{ params.tags }}
+      {% endif -%}
       {% if params.responsive -%}
       responsive={{ params.responsive }}
       {% endif -%}