feature: add floating action button options to dashboard publicpagese…

…ttings
devflowinc · Dec 16, 2024 · 6483310 · 6483310
1 parent 57d2ff1
commit 6483310
Show file tree

Hide file tree

Showing 8 changed files with 82 additions and 6 deletions.
diff --git a/clients/search-component/README.md b/clients/search-component/README.md
@@ -73,8 +73,8 @@ declare module "solid-js" {
 
 #### Props
 
-| Name                 | Type                                                                                           | Default                                                                 |
-| ---------------------- | ---------------------------------------------------------------------------------------------- | ------------------------------------------                            |
+| Name                 | Type                                                                                             | Default                                                               |
+| ---------------------- | ---------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
 | datasetId              | string                                                                                         | ''                                                                    |
 | apiKey                 | string                                                                                         | ''                                                                    |
 | baseUrl                | string                                                                                         | "https://api.trieve.ai"                                               |
@@ -98,8 +98,8 @@ declare module "solid-js" {
 | brandFontFamily        | string                                                                                         | Maven Pro                                                             |
 | problemLink            | string (example: "mailto:[email protected]?subject=")                                             | null                                                                  |
 | responsive             | boolean                                                                                        | false                                                                 |
-| floatingButtonPosition | "top-left", "top-right", "bottom-left", or "bottom-right"                                      | "bottom-right"
-| showFloatingButton     | boolean                                                                                        | true
+| floatingButtonPosition | "top-left", "top-right", "bottom-left", or "bottom-right"                                      | "bottom-right"                                                        |
+| showFloatingButton     | boolean                                                                                        | false                                                                 |        
 
 ### Search Results
 

diff --git a/clients/ts-sdk/openapi.json b/clients/ts-sdk/openapi.json
@@ -12324,6 +12324,10 @@
             },
             "nullable": true
           },
+          "floatingButtonPosition": {
+            "type": "string",
+            "nullable": true
+          },
           "forBrandName": {
             "type": "string",
             "nullable": true
@@ -12376,6 +12380,10 @@
             ],
             "nullable": true
           },
+          "showFloatingButton": {
+            "type": "boolean",
+            "nullable": true
+          },
           "singleProductOptions": {
             "allOf": [
               {

diff --git a/clients/ts-sdk/src/types.gen.ts b/clients/ts-sdk/src/types.gen.ts
@@ -2055,6 +2055,7 @@ export type PublicPageParameters = {
     defaultCurrency?: (string) | null;
     defaultSearchMode?: (string) | null;
     defaultSearchQueries?: Array<(string)> | null;
+    floatingButtonPosition?: (string) | null;
     forBrandName?: (string) | null;
     headingPrefix?: (string) | null;
     heroPattern?: ((HeroPattern) | null);
@@ -2065,6 +2066,7 @@ export type PublicPageParameters = {
     problemLink?: (string) | null;
     responsive?: (boolean) | null;
     searchOptions?: ((PublicPageSearchOptions) | null);
+    showFloatingButton?: (boolean) | null;
     singleProductOptions?: ((SingleProductOptions) | null);
     suggestedQueries?: (boolean) | null;
     tabMessages?: Array<PublicPageTabMessage> | null;

diff --git a/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx b/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx
@@ -755,6 +755,56 @@ const PublicPageControls = () => {
               </div>
             </div>
 
+            <div class="grid grid-cols-2 gap-4">
+              <div class="flex gap-2">
+                <div class="flex items-center gap-1">
+                  <label class="block" for="">
+                    Show Floating Chat Button
+                  </label>
+                  <Tooltip
+                    tooltipText="Show a floating chat button on the page"
+                    body={
+                      <FaRegularCircleQuestion class="h-3 w-3 text-black" />
+                    }
+                  />
+                </div>
+                <input
+                  type="checkbox"
+                  checked={extraParams.showFloatingButton || false}
+                  onChange={(e) => {
+                    setExtraParams(
+                      "showFloatingButton",
+                      e.currentTarget.checked,
+                    );
+                  }}
+                  class="block w-4 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="">
+                    Floating Chat Button Position
+                  </label>
+                  <Tooltip
+                    tooltipText="Either top-right, bottom-right, top-left, or bottom-left"
+                    body={
+                      <FaRegularCircleQuestion class="h-3 w-3 text-black" />
+                    }
+                  />
+                </div>
+                <input
+                  value={extraParams.floatingButtonPosition || "bottom-right"}
+                  onChange={(e) => {
+                    setExtraParams(
+                      "floatingButtonPosition",
+                      e.currentTarget.value,
+                    );
+                  }}
+                  class="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="grid grid-cols-2 gap-4">
               <div class="flex gap-2">
                 <div class="flex items-center gap-1">

diff --git a/server/src/data/models.rs b/server/src/data/models.rs
@@ -3147,6 +3147,12 @@ impl DatasetConfigurationDTO {
                     currency_position: page_parameters_self
                         .currency_position
                         .or(page_parameters_curr.currency_position),
+                    floating_button_position: page_parameters_self
+                        .floating_button_position
+                        .or(page_parameters_curr.floating_button_position),
+                    show_floating_button: page_parameters_self
+                        .show_floating_button
+                        .or(page_parameters_curr.show_floating_button),
                     debounce_ms: page_parameters_self
                         .debounce_ms
                         .or(page_parameters_curr.debounce_ms),

diff --git a/server/src/handlers/page_handler.rs b/server/src/handlers/page_handler.rs
@@ -213,6 +213,10 @@ pub struct PublicPageParameters {
     #[serde(skip_serializing_if = "Option::is_none")]
     pub currency_position: Option<String>,
     #[serde(skip_serializing_if = "Option::is_none")]
+    pub floating_button_position: Option<String>,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub show_floating_button: Option<bool>,
+    #[serde(skip_serializing_if = "Option::is_none")]
     pub debounce_ms: Option<i32>,
     #[serde(skip_serializing_if = "Option::is_none")]
     pub hero_pattern: Option<HeroPattern>,

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].25/dist/index.css"
+      href="https://unpkg.com/[email protected].26/dist/index.css"
     />
     <link
       rel="apple-touch-icon"
@@ -267,7 +267,7 @@
     </style>
 
     <script type="module">
-      import {renderToDiv} from 'https://unpkg.com/[email protected].25/dist/vanilla/index.js';
+      import {renderToDiv} from 'https://unpkg.com/[email protected].26/dist/vanilla/index.js';
       const root = document.getElementById('root');
       renderToDiv(root, {
         ... {{params | tojson}}

diff --git a/server/src/public/search-component-code.html b/server/src/public/search-component-code.html
@@ -79,6 +79,12 @@
       {% if params.currencyPosition -%}
       currencyPosition: "{{ params.currencyPosition }}",
       {% endif -%}
+      {% if params.showFloatingButton -%}
+      showFloatingButton: "{{ params.showFloatingButton }}",
+      {% endif -%}
+      {% if params.floatingButtongPosition -%}
+      floatingButtongPosition: "{{ params.floatingButtongPosition }}",
+      {% endif -%}
       {% if params.debounceMs -%}
       debounceMs: {{ params.debounceMs }},
       {% endif -%}