From a1fbe820294d2ef78f73b184fc04bbac8ee59396 Mon Sep 17 00:00:00 2001
From: cdxker <fdenzell@gmail.com>
Date: Thu, 12 Dec 2024 13:32:41 -0800
Subject: [PATCH] feature: convert public page to single install script tag

---
 server/src/public/search-component-code.html | 69 +++++++++++---------
 1 file changed, 38 insertions(+), 31 deletions(-)

diff --git a/server/src/public/search-component-code.html b/server/src/public/search-component-code.html
index 04a453cb01..1e9c2a4fa8 100644
--- a/server/src/public/search-component-code.html
+++ b/server/src/public/search-component-code.html
@@ -1,81 +1,88 @@
 <pre class="-my-4"> 
 <code class="language-javascript">
-import { TrieveModalSearch } from 'trieve-search-component';
-import 'trieve-search-component/styles';
+&lt;link
+  rel="stylesheet"
+  href="https://unpkg.com/trieve-search-component@0.2.15/dist/index.css"
+/&gt;
 
-const App = () => {
-  return (
-    &lt;TrieveModalSearch
+&lt;script type="module"&gt;
+  import {renderToDiv} from 'https://unpkg.com/trieve-search-component@0.2.15/dist/vanilla/index.js';
+  window.addEventListener('load', () => {
+    const root = document.getElementById('root');
+    renderToDiv(root, 
       {% if params.apiKey -%}
-      apiKey="{{ params.apiKey }}"
+      apiKey: "{{ params.apiKey }}"
       {% endif -%}
       {% if params.baseUrl -%}
-      baseUrl="{{ params.baseUrl }}"
+      baseUrl: "{{ params.baseUrl }}"
       {% endif -%}
       {% if params.type -%}
-      type="{{ params.type }}"
+      type: "{{ params.type }}"
       {% endif -%}
       {% if params.suggestedQueries -%}
-      suggestedQueries={{ params.suggestedQueries }}
+      suggestedQueries: {{ params.suggestedQueries }}
       {% endif -%}
       {% if params.analytics -%}
-      analytics={{ params.analytics }}
+      analytics: {{ params.analytics }}
       {% endif -%}
       {% if params.tags -%}
-      tags={{ params.tags }}
+      tags: {{ params.tags }}
       {% endif -%}
       {% if params.responsive -%}
-      responsive={{ params.responsive }}
+      responsive: {{ params.responsive }}
       {% endif -%}
       {% if params.chat -%}
-      chat="{{ params.chat}}"
+      chat: "{{ params.chat}}"
       {% endif -%}
       {% if params.theme -%}
-      theme="{{ params.theme }}"
+      theme: "{{ params.theme }}"
       {% endif -%}
       {% if params.search_options -%}
-      search_options={{ params.searchOptions }}
+      search_options: {{ params.searchOptions }}
       {% endif -%}
       {% if params.brandLogoImgSrcUrl -%}
-      brandLogoImgSrcUrl="{{ params.brandLogoImgSrcUrl }}"
+      brandLogoImgSrcUrl: "{{ params.brandLogoImgSrcUrl }}"
       {% endif -%}
       {% if params.brandName -%}
-      brandName="{{ params.brandName }}"
+      brandName: "{{ params.brandName }}"
       {% endif -%}
       {% if params.problemLink -%}
-      problemLink="{{ params.problemLink }}"
+      problemLink: "{{ params.problemLink }}"
       {% endif -%}
       {% if params.brandColor -%}
-      brandColor="{{ params.brandColor }}"
+      brandColor: "{{ params.brandColor }}"
       {% endif -%}
       {% if params.placeholder -%}
-      placeholder="{{ params.placeholder }}"
+      placeholder: "{{ params.placeholder }}"
       {% endif -%}
       {% if params.defaultSearchQueries -%}
-      defaultSearchQueries={{ params.defaultSearchQueries }}
+      defaultSearchQueries: {{ params.defaultSearchQueries }}
       {% endif -%}
       {% if params.defaultAiQuestions -%}
-      defaultAiQuestions={{ params.defaultAiQuestions }}
+      defaultAiQuestions: {{ params.defaultAiQuestions }}
       {% endif -%}
       {% if params.defaultSearchMode -%}
-      defaultSearchMode="{{ params.defaultSearchMode }}"
+      defaultSearchMode: "{{ params.defaultSearchMode }}"
       {% endif -%}
       {% if params.useGroupSearch -%}
-      useGroupSearch={{ params.useGroupSearch }}
+      useGroupSearch: {{ params.useGroupSearch }}
       {% endif -%}
       {% if params.allowSwitchingModes -%}
-      allowSwitchingModes={{ params.allowSwitchingModes }}
+      allowSwitchingModes: {{ params.allowSwitchingModes }}
       {% endif -%}
       {% if params.defaultCurrency -%}
-      defaultCurrency="{{ params.defaultCurrency }}"
+      defaultCurrency: "{{ params.defaultCurrency }}"
       {% endif -%}
       {% if params.currencyPosition -%}
-      currencyPosition="{{ params.currencyPosition }}"
+      currencyPosition: "{{ params.currencyPosition }}"
       {% endif -%}
       {% if params.debounceMs -%}
-      debounceMs={{ params.debounceMs }}
+      debounceMs: {{ params.debounceMs }}
       {% endif -%}
-    /&gt;
-  );
-} </code>
+
+    )
+  });
+&lt;/script&gt;
+
+</code>
 </pre>