mirror of
https://github.com/lone-cloud/gerbil
synced 2026-06-03 19:54:44 -07:00
less jarring initial loading of saved config values on the general tab
This commit is contained in:
parent
504fe809dd
commit
667d7e5ee2
2 changed files with 68 additions and 46 deletions
|
|
@ -1,10 +1,21 @@
|
|||
import { Stack, Text, Group, TextInput, Slider } from '@mantine/core';
|
||||
import {
|
||||
Stack,
|
||||
Text,
|
||||
Group,
|
||||
TextInput,
|
||||
Slider,
|
||||
Transition,
|
||||
} from '@mantine/core';
|
||||
import { InfoTooltip } from '@/components/InfoTooltip';
|
||||
import { BackendSelector } from '@/components/screens/Launch/GeneralTab/BackendSelector';
|
||||
import { ModelFileField } from '@/components/screens/Launch/ModelFileField';
|
||||
import { useLaunchConfig } from '@/hooks/useLaunchConfig';
|
||||
|
||||
export const GeneralTab = () => {
|
||||
interface GeneralTabProps {
|
||||
configLoaded?: boolean;
|
||||
}
|
||||
|
||||
export const GeneralTab = ({ configLoaded = true }: GeneralTabProps) => {
|
||||
const {
|
||||
model,
|
||||
contextSize,
|
||||
|
|
@ -14,50 +25,61 @@ export const GeneralTab = () => {
|
|||
} = useLaunchConfig();
|
||||
|
||||
return (
|
||||
<Stack gap="md">
|
||||
<BackendSelector />
|
||||
<Transition
|
||||
mounted={configLoaded}
|
||||
transition="fade"
|
||||
duration={100}
|
||||
timingFunction="ease-out"
|
||||
>
|
||||
{(styles) => (
|
||||
<Stack gap="md" style={styles}>
|
||||
<BackendSelector />
|
||||
|
||||
<ModelFileField
|
||||
label="Text Model File"
|
||||
value={model}
|
||||
placeholder="Select a .gguf model file or enter a direct URL to file"
|
||||
tooltip="Select a GGUF text generation model file for chat and completion tasks."
|
||||
onChange={handleModelChange}
|
||||
onSelectFile={handleSelectModelFile}
|
||||
showSearchHF
|
||||
searchUrl="https://huggingface.co/models?pipeline_tag=text-generation&library=gguf&sort=trending"
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Group justify="space-between" align="center" mb="xs">
|
||||
<Group gap="xs" align="center">
|
||||
<Text size="sm" fw={500}>
|
||||
Context Size
|
||||
</Text>
|
||||
<InfoTooltip label="Controls the memory allocated for maximum context size. The larger the context, the larger the required memory." />
|
||||
</Group>
|
||||
<TextInput
|
||||
value={contextSize?.toString() || ''}
|
||||
onChange={(event) =>
|
||||
handleContextSizeChangeWithStep(Number(event.target.value) || 256)
|
||||
}
|
||||
type="number"
|
||||
min={256}
|
||||
max={131072}
|
||||
step={256}
|
||||
size="sm"
|
||||
w={100}
|
||||
<ModelFileField
|
||||
label="Text Model File"
|
||||
value={model}
|
||||
placeholder="Select a .gguf model file or enter a direct URL to file"
|
||||
tooltip="Select a GGUF text generation model file for chat and completion tasks."
|
||||
onChange={handleModelChange}
|
||||
onSelectFile={handleSelectModelFile}
|
||||
showSearchHF
|
||||
searchUrl="https://huggingface.co/models?pipeline_tag=text-generation&library=gguf&sort=trending"
|
||||
/>
|
||||
</Group>
|
||||
<Slider
|
||||
value={contextSize}
|
||||
min={256}
|
||||
max={131072}
|
||||
step={1}
|
||||
onChange={handleContextSizeChangeWithStep}
|
||||
style={{ marginBottom: '0.5rem' }}
|
||||
/>
|
||||
</div>
|
||||
</Stack>
|
||||
|
||||
<div>
|
||||
<Group justify="space-between" align="center" mb="xs">
|
||||
<Group gap="xs" align="center">
|
||||
<Text size="sm" fw={500}>
|
||||
Context Size
|
||||
</Text>
|
||||
<InfoTooltip label="Controls the memory allocated for maximum context size. The larger the context, the larger the required memory." />
|
||||
</Group>
|
||||
<TextInput
|
||||
value={contextSize?.toString() || ''}
|
||||
onChange={(event) =>
|
||||
handleContextSizeChangeWithStep(
|
||||
Number(event.target.value) || 256
|
||||
)
|
||||
}
|
||||
type="number"
|
||||
min={256}
|
||||
max={131072}
|
||||
step={256}
|
||||
size="sm"
|
||||
w={100}
|
||||
/>
|
||||
</Group>
|
||||
<Slider
|
||||
value={contextSize}
|
||||
min={256}
|
||||
max={131072}
|
||||
step={1}
|
||||
onChange={handleContextSizeChangeWithStep}
|
||||
style={{ marginBottom: '0.5rem' }}
|
||||
/>
|
||||
</div>
|
||||
</Stack>
|
||||
)}
|
||||
</Transition>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -345,7 +345,7 @@ export const LaunchScreen = ({ onLaunch }: LaunchScreenProps) => {
|
|||
</Tabs.List>
|
||||
|
||||
<Tabs.Panel value="general">
|
||||
<GeneralTab />
|
||||
<GeneralTab configLoaded={configLoaded} />
|
||||
</Tabs.Panel>
|
||||
|
||||
<Tabs.Panel value="advanced">
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue