diff --git a/clients/search-component/package.json b/clients/search-component/package.json index 9f602e7cf..b4d5f7e9a 100644 --- a/clients/search-component/package.json +++ b/clients/search-component/package.json @@ -19,7 +19,7 @@ "import": "./dist/vanilla/index.js" } }, - "version": "0.2.44", + "version": "0.2.45", "license": "MIT", "homepage": "https://github.com/devflowinc/trieve/tree/main/clients/search-component", "scripts": { diff --git a/clients/search-component/src/TrieveModal/index.css b/clients/search-component/src/TrieveModal/index.css index 29a357a88..ffe0fdae3 100644 --- a/clients/search-component/src/TrieveModal/index.css +++ b/clients/search-component/src/TrieveModal/index.css @@ -1288,7 +1288,9 @@ body { } .floating-input-container { - @apply z-[999] fixed bottom-5 flex flex-row items-center justify-start gap-2 w-2/4 p-1 pr-5 h-[55px] rounded-full cursor-pointer transition-colors duration-300 ease-in-out bg-white border-2; + @apply z-[999] fixed bottom-5 flex flex-row items-center justify-start gap-2 w-1/2 p-1 pr-5 h-[55px] rounded-full cursor-pointer transition-colors duration-300 ease-in-out bg-white border-2; + + left: 25%; &:hover { border-color: var(--tv-prop-brand-color); diff --git a/clients/ts-sdk/openapi.json b/clients/ts-sdk/openapi.json index 47ad79979..7d997b41b 100644 --- a/clients/ts-sdk/openapi.json +++ b/clients/ts-sdk/openapi.json @@ -12471,6 +12471,10 @@ "type": "string", "nullable": true }, + "floatingSearchIconPosition": { + "type": "string", + "nullable": true + }, "forBrandName": { "type": "string", "nullable": true @@ -12531,6 +12535,14 @@ "type": "boolean", "nullable": true }, + "showFloatingInput": { + "type": "boolean", + "nullable": true + }, + "showFloatingSearchIcon": { + "type": "boolean", + "nullable": true + }, "singleProductOptions": { "allOf": [ { @@ -12577,6 +12589,14 @@ "type": "boolean", "nullable": true }, + "videoLink": { + "type": "string", + "nullable": true + }, + "videoPosition": { + "type": "string", + "nullable": true + }, "zIndex": { "type": "integer", "format": "int32", diff --git a/clients/ts-sdk/src/types.gen.ts b/clients/ts-sdk/src/types.gen.ts index 2368d87d9..63249b8d5 100644 --- a/clients/ts-sdk/src/types.gen.ts +++ b/clients/ts-sdk/src/types.gen.ts @@ -2091,8 +2091,8 @@ export type PublicPageParameters = { responsive?: (boolean) | null; searchOptions?: ((PublicPageSearchOptions) | null); showFloatingButton?: (boolean) | null; - showFloatingSearchIcon?: (boolean) | null; showFloatingInput?: (boolean) | null; + showFloatingSearchIcon?: (boolean) | null; singleProductOptions?: ((SingleProductOptions) | null); suggestedQueries?: (boolean) | null; tabMessages?: Array | null; @@ -2101,6 +2101,8 @@ export type PublicPageParameters = { type?: (string) | null; useGroupSearch?: (boolean) | null; usePagefind?: (boolean) | null; + videoLink?: (string) | null; + videoPosition?: (string) | null; zIndex?: (number) | null; }; diff --git a/frontends/dashboard/src/hooks/usePublicPageSettings.tsx b/frontends/dashboard/src/hooks/usePublicPageSettings.tsx index 9772c57bc..957c5f114 100644 --- a/frontends/dashboard/src/hooks/usePublicPageSettings.tsx +++ b/frontends/dashboard/src/hooks/usePublicPageSettings.tsx @@ -209,7 +209,7 @@ export const { use: usePublicPage, provider: PublicPageProvider } = const apiHost = import.meta.env.VITE_API_HOST as unknown as string; const publicUrl = createMemo(() => { - return `${apiHost.slice(0, -4)}/demos/${ + return `${apiHost.replace("/api.", "/demos.").slice(0, -4)}/demos/${ dataset()?.dataset.tracking_id ?? datasetId() }`; }); diff --git a/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx b/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx index 92d4630f4..dc0ed4486 100644 --- a/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx +++ b/frontends/dashboard/src/pages/dataset/PublicPageSettings.tsx @@ -663,70 +663,109 @@ const PublicPageControls = () => { options={Object.keys(HeroPatterns)} /> - - -
-
- - { - setExtraParams( - "heroPattern", - "foregroundColor", - 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" - /> -
-
- + +
+
{ + value={extraParams.heroPattern?.foregroundColor || "#FFFFFF"} + onInput={(e) => { setExtraParams( "heroPattern", - "backgroundColor", + "foregroundColor", 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" /> - +
+
+ + + { + setExtraParams( + "heroPattern", + "backgroundColor", + 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" + /> + +
+
+ + { + setExtraParams( + "heroPattern", + "foregroundOpacity", + parseInt(e.currentTarget.value) / 100, + ); + }} + value={ + (extraParams.heroPattern?.foregroundOpacity || 0.5) * 100 + } + /> +
-
- - { - setExtraParams( - "heroPattern", - "foregroundOpacity", - parseFloat(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" + +
+
+
+ + } />
+ { + setExtraParams("videoLink", 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" + />
- +
+
+ + } + /> +
+ { + setExtraParams("videoPosition", 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" + /> +
+
Advanced Settings diff --git a/server/src/data/models.rs b/server/src/data/models.rs index df9dfd325..7ca214452 100644 --- a/server/src/data/models.rs +++ b/server/src/data/models.rs @@ -3257,6 +3257,12 @@ impl DatasetConfigurationDTO { use_pagefind: page_parameters_self .use_pagefind .or(page_parameters_curr.use_pagefind), + video_link: page_parameters_self + .video_link + .or(page_parameters_curr.video_link), + video_position: page_parameters_self + .video_position + .or(page_parameters_curr.video_position), }), }, DISABLE_ANALYTICS: self diff --git a/server/src/handlers/page_handler.rs b/server/src/handlers/page_handler.rs index 0f6e7c423..e44c03b54 100644 --- a/server/src/handlers/page_handler.rs +++ b/server/src/handlers/page_handler.rs @@ -256,6 +256,10 @@ pub struct PublicPageParameters { pub hide_drawn_text: Option, #[serde(skip_serializing_if = "Option::is_none")] pub use_pagefind: Option, + #[serde(skip_serializing_if = "Option::is_none")] + pub video_link: Option, + #[serde(skip_serializing_if = "Option::is_none")] + pub video_position: Option, } #[utoipa::path( diff --git a/server/src/public/page.html b/server/src/public/page.html index 2e02c7e86..29143b9a2 100644 --- a/server/src/public/page.html +++ b/server/src/public/page.html @@ -200,9 +200,6 @@ color: black; padding: 0.3rem; font-size: 0.8rem; - position: fixed; - bottom: 0.5rem; - left: 0.5rem; text-decoration: none; z-index: 20; } @@ -306,6 +303,48 @@ background-color: color-mix(in srgb, var(--brand-color), black 20%); } } + + .product-video-wrapper { + position: relative; + margin-top: 0.75rem; + margin-bottom: 0.75rem; + z-index: 15; + } + + .video-wrapper { + position: fixed; + bottom: 20px; + left: 20px; + width: 100%; + max-width: 18.5rem; + height: 14.5rem; + margin: 0; + padding: 0; + z-index: 20; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 0.5rem; + } + + .video-wrapper iframe { + width: 100%; + height: 100%; + border: none; + object-fit: cover; + } + + @media (max-width: 640px) { + .video-wrapper { + position: relative; + bottom: 0; + left: 0; + margin: 0 auto; + max-width: calc(100vw - 4rem); + height: 20rem; + } + }