Skip to content

Commit 4e6f0b3

Browse files
fix label for chunk length setting (#4515)
1 parent 8bc6aa7 commit 4e6f0b3

File tree

5 files changed

+90
-24
lines changed

5 files changed

+90
-24
lines changed

frontend/src/components/EmbeddingSelection/GenericOpenAiOptions/index.jsx

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React, { useState } from "react";
2-
import { CaretDown, CaretUp } from "@phosphor-icons/react";
2+
import { CaretDown, CaretUp, Info } from "@phosphor-icons/react";
3+
import { Tooltip } from "react-tooltip";
34

45
export default function GenericOpenAiEmbeddingOptions({ settings }) {
56
const [showAdvancedControls, setShowAdvancedControls] = useState(false);
@@ -37,9 +38,22 @@ export default function GenericOpenAiEmbeddingOptions({ settings }) {
3738
/>
3839
</div>
3940
<div className="flex flex-col w-60">
40-
<label className="text-white text-sm font-semibold block mb-3">
41-
Max embedding chunk length
42-
</label>
41+
<div
42+
data-tooltip-place="top"
43+
data-tooltip-id="max-embedding-chunk-length-tooltip"
44+
className="flex gap-x-1 items-center mb-3"
45+
>
46+
<Info
47+
size={16}
48+
className="text-theme-text-secondary cursor-pointer"
49+
/>
50+
<label className="text-white text-sm font-semibold block">
51+
Max embedding chunk length
52+
</label>
53+
<Tooltip id="max-embedding-chunk-length-tooltip">
54+
Maximum length of text chunks, in characters, for embedding.
55+
</Tooltip>
56+
</div>
4357
<input
4458
type="number"
4559
name="EmbeddingModelMaxChunkLength"

frontend/src/components/EmbeddingSelection/LMStudioOptions/index.jsx

Lines changed: 19 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ import React, { useEffect, useState } from "react";
22
import System from "@/models/system";
33
import PreLoader from "@/components/Preloader";
44
import { LMSTUDIO_COMMON_URLS } from "@/utils/constants";
5-
import { CaretDown, CaretUp } from "@phosphor-icons/react";
5+
import { CaretDown, CaretUp, Info } from "@phosphor-icons/react";
6+
import { Tooltip } from "react-tooltip";
67
import useProviderEndpointAutoDiscovery from "@/hooks/useProviderEndpointAutoDiscovery";
78

89
export default function LMStudioEmbeddingOptions({ settings }) {
@@ -32,9 +33,22 @@ export default function LMStudioEmbeddingOptions({ settings }) {
3233
<div className="w-full flex items-start gap-[36px] mt-1.5">
3334
<LMStudioModelSelection settings={settings} basePath={basePath.value} />
3435
<div className="flex flex-col w-60">
35-
<label className="text-white text-sm font-semibold block mb-2">
36-
Max Embedding Chunk Length
37-
</label>
36+
<div
37+
data-tooltip-place="top"
38+
data-tooltip-id="max-embedding-chunk-length-tooltip"
39+
className="flex gap-x-1 items-center mb-3"
40+
>
41+
<Info
42+
size={16}
43+
className="text-theme-text-secondary cursor-pointer"
44+
/>
45+
<label className="text-white text-sm font-semibold block">
46+
Max embedding chunk length
47+
</label>
48+
<Tooltip id="max-embedding-chunk-length-tooltip">
49+
Maximum length of text chunks, in characters, for embedding.
50+
</Tooltip>
51+
</div>
3852
<input
3953
type="number"
4054
name="EmbeddingModelMaxChunkLength"
@@ -48,7 +62,7 @@ export default function LMStudioEmbeddingOptions({ settings }) {
4862
autoComplete="off"
4963
/>
5064
<p className="text-xs leading-[18px] font-base text-white text-opacity-60 mt-2">
51-
Maximum length of text chunks for embedding.
65+
Maximum length of text chunks, in characters, for embedding.
5266
</p>
5367
</div>
5468
</div>

frontend/src/components/EmbeddingSelection/LiteLLMOptions/index.jsx

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useEffect, useState } from "react";
22
import System from "@/models/system";
3-
import { Warning } from "@phosphor-icons/react";
3+
import { Warning, Info } from "@phosphor-icons/react";
44
import { Tooltip } from "react-tooltip";
55

66
export default function LiteLLMOptions({ settings }) {
@@ -35,9 +35,22 @@ export default function LiteLLMOptions({ settings }) {
3535
apiKey={apiKey}
3636
/>
3737
<div className="flex flex-col w-60">
38-
<label className="text-white text-sm font-semibold block mb-3">
39-
Max embedding chunk length
40-
</label>
38+
<div
39+
data-tooltip-place="top"
40+
data-tooltip-id="max-embedding-chunk-length-tooltip"
41+
className="flex gap-x-1 items-center mb-3"
42+
>
43+
<Info
44+
size={16}
45+
className="text-theme-text-secondary cursor-pointer"
46+
/>
47+
<label className="text-white text-sm font-semibold block">
48+
Max embedding chunk length
49+
</label>
50+
<Tooltip id="max-embedding-chunk-length-tooltip">
51+
Maximum length of text chunks, in characters, for embedding.
52+
</Tooltip>
53+
</div>
4154
<input
4255
type="number"
4356
name="EmbeddingModelMaxChunkLength"

frontend/src/components/EmbeddingSelection/LocalAiOptions/index.jsx

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import React, { useEffect, useState } from "react";
2-
import { CaretDown, CaretUp } from "@phosphor-icons/react";
2+
import { CaretDown, CaretUp, Info } from "@phosphor-icons/react";
33
import System from "@/models/system";
44
import PreLoader from "@/components/Preloader";
55
import { LOCALAI_COMMON_URLS } from "@/utils/constants";
66
import useProviderEndpointAutoDiscovery from "@/hooks/useProviderEndpointAutoDiscovery";
7+
import { Tooltip } from "react-tooltip";
78

89
export default function LocalAiOptions({ settings }) {
910
const {
@@ -30,9 +31,22 @@ export default function LocalAiOptions({ settings }) {
3031
basePath={basePath.value}
3132
/>
3233
<div className="flex flex-col w-60">
33-
<label className="text-white text-sm font-semibold block mb-2">
34-
Max embedding chunk length
35-
</label>
34+
<div
35+
data-tooltip-place="top"
36+
data-tooltip-id="max-embedding-chunk-length-tooltip"
37+
className="flex gap-x-1 items-center mb-3"
38+
>
39+
<Info
40+
size={16}
41+
className="text-theme-text-secondary cursor-pointer"
42+
/>
43+
<label className="text-white text-sm font-semibold block">
44+
Max embedding chunk length
45+
</label>
46+
<Tooltip id="max-embedding-chunk-length-tooltip">
47+
Maximum length of text chunks, in characters, for embedding.
48+
</Tooltip>
49+
</div>
3650
<input
3751
type="number"
3852
name="EmbeddingModelMaxChunkLength"

frontend/src/components/EmbeddingSelection/OllamaOptions/index.jsx

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ import React, { useEffect, useState } from "react";
22
import System from "@/models/system";
33
import PreLoader from "@/components/Preloader";
44
import { OLLAMA_COMMON_URLS } from "@/utils/constants";
5-
import { CaretDown, CaretUp } from "@phosphor-icons/react";
5+
import { CaretDown, CaretUp, Info } from "@phosphor-icons/react";
6+
import { Tooltip } from "react-tooltip";
67
import useProviderEndpointAutoDiscovery from "@/hooks/useProviderEndpointAutoDiscovery";
78

89
export default function OllamaEmbeddingOptions({ settings }) {
@@ -35,9 +36,22 @@ export default function OllamaEmbeddingOptions({ settings }) {
3536
basePath={basePath.value}
3637
/>
3738
<div className="flex flex-col w-60">
38-
<label className="text-white text-sm font-semibold block mb-2">
39-
Max Embedding Chunk Length
40-
</label>
39+
<div
40+
data-tooltip-place="top"
41+
data-tooltip-id="max-embedding-chunk-length-tooltip"
42+
className="flex gap-x-1 items-center mb-3"
43+
>
44+
<Info
45+
size={16}
46+
className="text-theme-text-secondary cursor-pointer"
47+
/>
48+
<label className="text-white text-sm font-semibold block">
49+
Max embedding chunk length
50+
</label>
51+
<Tooltip id="max-embedding-chunk-length-tooltip">
52+
Maximum length of text chunks, in characters, for embedding.
53+
</Tooltip>
54+
</div>
4155
<input
4256
type="number"
4357
name="EmbeddingModelMaxChunkLength"
@@ -50,9 +64,6 @@ export default function OllamaEmbeddingOptions({ settings }) {
5064
required={true}
5165
autoComplete="off"
5266
/>
53-
<p className="text-xs leading-[18px] font-base text-white text-opacity-60 mt-2">
54-
Maximum length of text chunks for embedding.
55-
</p>
5667
</div>
5768
</div>
5869
<div className="flex justify-start mt-4">

0 commit comments

Comments
 (0)