θΏ™ζ˜―indexlocζδΎ›ηš„ζœεŠ‘οΌŒδΈθ¦θΎ“ε…₯任何密码
Skip to content

feat/embedding-chunk-config-improvements #4454 #4512

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed

feat/embedding-chunk-config-improvements #4454 #4512

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 26 additions & 8 deletions frontend/src/components/EmbeddingSelection/GenericOpenAiOptions/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,20 @@ import { CaretDown, CaretUp } from "@phosphor-icons/react";

export default function GenericOpenAiEmbeddingOptions({ settings }) {
const [showAdvancedControls, setShowAdvancedControls] = useState(false);
const [maxChunkLength, setMaxChunkLength] = useState(
settings?.EmbeddingModelMaxChunkLength || 8192
);

const handleMaxChunkLengthChange = (e) => {
setMaxChunkLength(Number(e.target.value));
};

const estimatedTokens = Math.round(maxChunkLength / 4.2);
return (
<div className="w-full flex flex-col gap-y-7">
<div className="w-full flex items-center gap-[36px] mt-1.5 flex-wrap">
<div className="w-full flex items-start gap-[36px] mt-1.5 flex-wrap">
<div className="flex flex-col w-60">
<label className="text-white text-sm font-semibold block mb-3">
<label className="text-white text-sm font-semibold block mb-2">
Base URL
</label>
<input
Expand All @@ -22,7 +31,7 @@ export default function GenericOpenAiEmbeddingOptions({ settings }) {
/>
</div>
<div className="flex flex-col w-60">
<label className="text-white text-sm font-semibold block mb-3">
<label className="text-white text-sm font-semibold block mb-2">
Embedding Model
</label>
<input
Expand All @@ -36,26 +45,35 @@ export default function GenericOpenAiEmbeddingOptions({ settings }) {
spellCheck={false}
/>
</div>
<div className="flex flex-col w-60">
<label className="text-white text-sm font-semibold block mb-3">
Max embedding chunk length
<div className="flex flex-col w-80">
<label className="text-white text-sm font-semibold block mb-2">
Max Embedding Chunk Length (Characters)
</label>
<input
type="number"
name="EmbeddingModelMaxChunkLength"
className="border-none bg-theme-settings-input-bg text-white placeholder:text-theme-settings-input-placeholder text-sm rounded-lg focus:outline-primary-button active:outline-primary-button outline-none block w-full p-2.5"
placeholder="8192"
min={1}
value={maxChunkLength}
onChange={handleMaxChunkLengthChange}
onScroll={(e) => e.target.blur()}
defaultValue={settings?.EmbeddingModelMaxChunkLength}
required={false}
autoComplete="off"
/>
<div className="mt-2 space-y-1">
<p className="text-xs leading-[18px] font-base text-white text-opacity-60">
Maximum length of text chunks in characters for embedding.
</p>
<p className="text-xs leading-[18px] font-base text-blue-400">
Estimated tokens: ~{estimatedTokens} (chars Γ· 4.2)
</p>
</div>
</div>
</div>
<div className="w-full flex items-center gap-[36px]">
<div className="flex flex-col w-60">
<div className="flex flex-col gap-y-1 mb-4">
<div className="flex flex-col gap-y-1 mb-2">
<label className="text-white text-sm font-semibold flex items-center gap-x-2">
API Key <p className="!text-xs !italic !font-thin">optional</p>
</label>
Expand Down
19 changes: 13 additions & 6 deletions frontend/src/components/EmbeddingSelection/LMStudioOptions/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,13 +27,15 @@ export default function LMStudioEmbeddingOptions({ settings }) {
setMaxChunkLength(Number(e.target.value));
};

const estimatedTokens = Math.round(maxChunkLength / 4.2);

return (
<div className="w-full flex flex-col gap-y-7">
<div className="w-full flex items-start gap-[36px] mt-1.5">
<LMStudioModelSelection settings={settings} basePath={basePath.value} />
<div className="flex flex-col w-60">
<div className="flex flex-col w-80">
<label className="text-white text-sm font-semibold block mb-2">
Max Embedding Chunk Length
Max Embedding Chunk Length (Characters)
</label>
<input
type="number"
Expand All @@ -47,9 +49,14 @@ export default function LMStudioEmbeddingOptions({ settings }) {
required={true}
autoComplete="off"
/>
<p className="text-xs leading-[18px] font-base text-white text-opacity-60 mt-2">
Maximum length of text chunks for embedding.
</p>
<div className="mt-2 space-y-1">
<p className="text-xs leading-[18px] font-base text-white text-opacity-60">
Maximum length of text chunks in characters for embedding.
</p>
<p className="text-xs leading-[18px] font-base text-blue-400">
Estimated tokens: ~{estimatedTokens} (chars Γ· 4.2)
</p>
</div>
</div>
</div>
<div className="flex justify-start mt-4">
Expand Down Expand Up @@ -153,7 +160,7 @@ function LMStudioModelSelection({ settings, basePath = null }) {
className="border-none bg-theme-settings-input-bg border-gray-500 text-white text-sm rounded-lg block w-full p-2.5"
>
<option disabled={true} selected={true}>
{!!basePath
{basePath
? "--loading available models--"
: "Enter LM Studio URL first"}
</option>
Expand Down
36 changes: 27 additions & 9 deletions frontend/src/components/EmbeddingSelection/LiteLLMOptions/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,21 @@ export default function LiteLLMOptions({ settings }) {
const [basePath, setBasePath] = useState(settings?.LiteLLMBasePath);
const [apiKeyValue, setApiKeyValue] = useState(settings?.LiteLLMAPIKey);
const [apiKey, setApiKey] = useState(settings?.LiteLLMAPIKey);
const [maxChunkLength, setMaxChunkLength] = useState(
settings?.EmbeddingModelMaxChunkLength || 8192
);

const handleMaxChunkLengthChange = (e) => {
setMaxChunkLength(Number(e.target.value));
};

const estimatedTokens = Math.round(maxChunkLength / 4.2);

return (
<div className="w-full flex flex-col gap-y-7">
<div className="w-full flex items-center gap-[36px] mt-1.5">
<div className="w-full flex items-start gap-[36px] mt-1.5">
<div className="flex flex-col w-60">
<label className="text-white text-sm font-semibold block mb-3">
<label className="text-white text-sm font-semibold block mb-2">
Base URL
</label>
<input
Expand All @@ -34,26 +43,35 @@ export default function LiteLLMOptions({ settings }) {
basePath={basePath}
apiKey={apiKey}
/>
<div className="flex flex-col w-60">
<label className="text-white text-sm font-semibold block mb-3">
Max embedding chunk length
<div className="flex flex-col w-80">
<label className="text-white text-sm font-semibold block mb-2">
Max Embedding Chunk Length (Characters)
</label>
<input
type="number"
name="EmbeddingModelMaxChunkLength"
className="border-none bg-theme-settings-input-bg text-white placeholder:text-theme-settings-input-placeholder text-sm rounded-lg focus:outline-primary-button active:outline-primary-button outline-none block w-full p-2.5"
placeholder="8192"
min={1}
value={maxChunkLength}
onChange={handleMaxChunkLengthChange}
onScroll={(e) => e.target.blur()}
defaultValue={settings?.EmbeddingModelMaxChunkLength}
required={false}
autoComplete="off"
/>
<div className="mt-2 space-y-1">
<p className="text-xs leading-[18px] font-base text-white text-opacity-60">
Maximum length of text chunks in characters for embedding.
</p>
<p className="text-xs leading-[18px] font-base text-blue-400">
Estimated tokens: ~{estimatedTokens} (chars Γ· 4.2)
</p>
</div>
</div>
</div>
<div className="w-full flex items-center gap-[36px]">
<div className="flex flex-col w-60">
<div className="flex flex-col gap-y-1 mb-4">
<div className="flex flex-col gap-y-1 mb-2">
<label className="text-white text-sm font-semibold flex items-center gap-x-2">
API Key <p className="!text-xs !italic !font-thin">optional</p>
</label>
Expand Down Expand Up @@ -101,7 +119,7 @@ function LiteLLMModelSelection({ settings, basePath = null, apiKey = null }) {
if (loading || customModels.length == 0) {
return (
<div className="flex flex-col w-60">
<label className="text-white text-sm font-semibold block mb-3">
<label className="text-white text-sm font-semibold block mb-2">
Embedding Model Selection
</label>
<select
Expand All @@ -122,7 +140,7 @@ function LiteLLMModelSelection({ settings, basePath = null, apiKey = null }) {
return (
<div className="flex flex-col w-60">
<div className="flex items-center">
<label className="text-white text-sm font-semibold block mb-3">
<label className="text-white text-sm font-semibold block mb-2">
Embedding Model Selection
</label>
<EmbeddingModelTooltip />
Expand Down
26 changes: 22 additions & 4 deletions frontend/src/components/EmbeddingSelection/LocalAiOptions/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,30 +20,48 @@ export default function LocalAiOptions({ settings }) {
});
const [apiKeyValue, setApiKeyValue] = useState(settings?.LocalAiApiKey);
const [apiKey, setApiKey] = useState(settings?.LocalAiApiKey);
const [maxChunkLength, setMaxChunkLength] = useState(
settings?.EmbeddingModelMaxChunkLength || 1000
);

const handleMaxChunkLengthChange = (e) => {
setMaxChunkLength(Number(e.target.value));
};

const estimatedTokens = Math.round(maxChunkLength / 4.2);

return (
<div className="w-full flex flex-col gap-y-7">
<div className="w-full flex items-center gap-[36px] mt-1.5">
<div className="w-full flex items-start gap-[36px] mt-1.5">
<LocalAIModelSelection
settings={settings}
apiKey={apiKey}
basePath={basePath.value}
/>
<div className="flex flex-col w-60">
<div className="flex flex-col w-80">
<label className="text-white text-sm font-semibold block mb-2">
Max embedding chunk length
Max Embedding Chunk Length (Characters)
</label>
<input
type="number"
name="EmbeddingModelMaxChunkLength"
className="border-none bg-theme-settings-input-bg text-white placeholder:text-theme-settings-input-placeholder text-sm rounded-lg focus:outline-primary-button active:outline-primary-button outline-none block w-full p-2.5"
placeholder="1000"
min={1}
value={maxChunkLength}
onChange={handleMaxChunkLengthChange}
onScroll={(e) => e.target.blur()}
defaultValue={settings?.EmbeddingModelMaxChunkLength}
required={false}
autoComplete="off"
/>
<div className="mt-2 space-y-1">
<p className="text-xs font-base text-white text-opacity-60">
Maximum length of text chunks in characters for embedding.
</p>
<p className="text-xs font-base text-blue-400">
Estimated tokens: ~{estimatedTokens} (chars Γ· 4.2)
</p>
</div>
</div>
<div className="flex flex-col w-60">
<div className="flex flex-col gap-y-1 mb-2">
Expand Down
19 changes: 13 additions & 6 deletions frontend/src/components/EmbeddingSelection/OllamaOptions/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,16 +27,18 @@ export default function OllamaEmbeddingOptions({ settings }) {
setMaxChunkLength(Number(e.target.value));
};

const estimatedTokens = Math.round(maxChunkLength / 4.2);

return (
<div className="w-full flex flex-col gap-y-7">
<div className="w-full flex items-start gap-[36px] mt-1.5">
<OllamaEmbeddingModelSelection
settings={settings}
basePath={basePath.value}
/>
<div className="flex flex-col w-60">
<div className="flex flex-col w-80">
<label className="text-white text-sm font-semibold block mb-2">
Max Embedding Chunk Length
Max Embedding Chunk Length (Characters)
</label>
<input
type="number"
Expand All @@ -50,9 +52,14 @@ export default function OllamaEmbeddingOptions({ settings }) {
required={true}
autoComplete="off"
/>
<p className="text-xs leading-[18px] font-base text-white text-opacity-60 mt-2">
Maximum length of text chunks for embedding.
</p>
<div className="mt-2 space-y-1">
<p className="text-xs leading-[18px] font-base text-white text-opacity-60">
Maximum length of text chunks in characters for embedding.
</p>
<p className="text-xs leading-[18px] font-base text-blue-400">
Estimated tokens: ~{estimatedTokens} (chars Γ· 4.2)
</p>
</div>
</div>
</div>
<div className="flex justify-start mt-4">
Expand Down Expand Up @@ -152,7 +159,7 @@ function OllamaEmbeddingModelSelection({ settings, basePath = null }) {
className="border-none bg-theme-settings-input-bg border-gray-500 text-white text-sm rounded-lg block w-full p-2.5"
>
<option disabled={true} selected={true}>
{!!basePath
{basePath
? "--loading available models--"
: "Enter Ollama URL first"}
</option>
Expand Down