root/gpustack-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: common components

Browse Source
This commit is contained in:
jialin
2024-05-17 17:12:30 +08:00
parent fa522fb89e
commit c948110153
11 changed files with 681 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/playground/components/params-settings.tsx
+130 -81
View File
@@ -1,6 +1,7 @@
import SealInput from '@/components/seal-form/seal-input';
import SealSelect from '@/components/seal-form/seal-select';
import { INPUT_WIDTH } from '@/constants';
import { Button, Form, Space } from 'antd';
import { Button, Form, Select, Space } from 'antd';
type ParamsSettingsProps = {
seed?: number;
@@ -15,7 +16,7 @@ type ParamsSettingsProps = {
maxTokens?: number;
};
const ParamsSettings: React.FC = () => {
const ParamsSettings: React.FC<{ onClose: () => void }> = ({ onClose }) => {
const initialValues = {
seed: 1,
stopSequence: 1,
@@ -38,6 +39,11 @@ const ParamsSettings: React.FC = () => {
console.log('handleOnFinishFailed', errorInfo);
};
const handleCancel = () => {
form.resetFields();
onClose();
};
return (
<Form
name="modelparams"
@@ -45,91 +51,134 @@ const ParamsSettings: React.FC = () => {
onFinish={handleOnFinish}
onFinishFailed={handleOnFinishFailed}
>
<Form.Item<ParamsSettingsProps> name="seed" rules={[{ required: true }]}>
<SealInput.Input
label="Seed"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="stopSequence"
rules={[{ required: true }]}
<div
style={{
maxHeight: '450px',
overflow: 'auto',
paddingRight: 'var(--ant-popover-inner-padding)'
}}
>
<SealInput.Input
label="Stop Sequence"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="temperature"
rules={[{ required: true }]}
>
<SealInput.Input
label="Temperature"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps> name="topK" rules={[{ required: true }]}>
<SealInput.Input
label="TopK"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps> name="topP" rules={[{ required: true }]}>
<SealInput.Input
label="TopP"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="repeatPenalty"
rules={[{ required: true }]}
>
<SealInput.Input
label="Repeat Penalty"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="repeatLastN"
rules={[{ required: true }]}
>
<SealInput.Input
label="Repeat Last N"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps> name="tfsZ" rules={[{ required: true }]}>
<SealInput.Input
label="TFSZ"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="contextLength"
rules={[{ required: true }]}
>
<SealInput.Input
label="Context Length"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="maxTokens"
rules={[{ required: true }]}
>
<SealInput.Input
label="Max Tokens"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="seed"
rules={[{ required: true }]}
>
<SealInput.Input
label="Seed"
disabled={true}
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="select"
rules={[{ required: true }]}
>
<SealSelect
label="Select"
disabled={true}
style={{ width: INPUT_WIDTH.default }}
>
<Select.Option value={1}>1</Select.Option>
<Select.Option value={2}>2</Select.Option>
<Select.Option value={3}>3</Select.Option>
</SealSelect>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="stopSequence"
rules={[{ required: true }]}
>
<SealInput.Input
label="Stop Sequence"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="temperature"
rules={[{ required: true }]}
>
<SealInput.Input
label="Temperature"
style={{ width: INPUT_WIDTH.default }}
disabled={true}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="topK"
rules={[{ required: true }]}
>
<SealInput.Input
label="TopK"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="topP"
rules={[{ required: true }]}
>
<SealInput.Input
label="TopP"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="repeatPenalty"
rules={[{ required: true }]}
>
<SealInput.Input
label="Repeat Penalty"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="repeatLastN"
rules={[{ required: true }]}
>
<SealInput.Search
label="Repeat Last N"
style={{ width: INPUT_WIDTH.default }}
disabled={true}
></SealInput.Search>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="tfsZ"
rules={[{ required: true }]}
>
<SealInput.Input
label="TFSZ"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Input>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="contextLength"
rules={[{ required: true }]}
>
<SealInput.Number
label="Context Length"
style={{ width: INPUT_WIDTH.default }}
></SealInput.Number>
</Form.Item>
<Form.Item<ParamsSettingsProps>
name="maxTokens"
rules={[{ required: true }]}
>
<SealInput.TextArea
label="Max Tokens"
style={{ width: INPUT_WIDTH.default }}
></SealInput.TextArea>
</Form.Item>
</div>
<Form.Item noStyle>
<Space
size={20}
align="end"
style={{ width: '100%', display: 'flex', justifyContent: 'end' }}
style={{
width: '100%',
display: 'flex',
justifyContent: 'end',
paddingRight: 'var(--ant-popover-inner-padding)',
paddingTop: 'var(--ant-popover-inner-padding)'
}}
>
<Button>Cancel</Button>
<Button onClick={handleCancel}>Cancel</Button>
<Button type="primary" htmlType="submit">
Submit
</Button>