feat(gui): add labels to dropdowns
This commit is contained in:
parent
45a097a56b
commit
d3f460759a
|
@ -40,12 +40,12 @@ export function OnnxWeb(props: OnnxWebProps) {
|
|||
</Box>
|
||||
<Box sx={{ my: 4 }}>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<QueryList result={models} labels={MODEL_LABELS} value={model}
|
||||
<QueryList result={models} labels={MODEL_LABELS} value={model} name='Model'
|
||||
onChange={(value) => {
|
||||
setModel(value);
|
||||
}}
|
||||
/>
|
||||
<QueryList result={platforms} labels={PLATFORM_LABELS} value={platform}
|
||||
<QueryList result={platforms} labels={PLATFORM_LABELS} value={platform} name='Platform'
|
||||
onChange={(value) => {
|
||||
setPlatform(value);
|
||||
}}
|
||||
|
|
|
@ -1,10 +1,11 @@
|
|||
import { doesExist, mustDefault, mustExist } from '@apextoaster/js-utils';
|
||||
import { MenuItem, Select } from '@mui/material';
|
||||
import { FormControl, InputLabel, MenuItem, Select } from '@mui/material';
|
||||
import * as React from 'react';
|
||||
import { UseQueryResult } from 'react-query';
|
||||
|
||||
export interface QueryListProps {
|
||||
labels: Record<string, string>;
|
||||
name: string;
|
||||
result: UseQueryResult<Array<string>>;
|
||||
value: string;
|
||||
|
||||
|
@ -32,11 +33,14 @@ export function QueryList(props: QueryListProps) {
|
|||
|
||||
// else: success
|
||||
const data = mustExist(result.data);
|
||||
return <Select value={value} onChange={(e) => {
|
||||
if (doesExist(props.onChange)) {
|
||||
props.onChange(e.target.value);
|
||||
}
|
||||
}}>
|
||||
{data.map((name) => <MenuItem key={name} value={name}>{mustDefault(labels[name], name)}</MenuItem>)}
|
||||
</Select>;
|
||||
return <FormControl>
|
||||
<InputLabel>{props.name}</InputLabel>
|
||||
<Select value={value} onChange={(e) => {
|
||||
if (doesExist(props.onChange)) {
|
||||
props.onChange(e.target.value);
|
||||
}
|
||||
}}>
|
||||
{data.map((name) => <MenuItem key={name} value={name}>{mustDefault(labels[name], name)}</MenuItem>)}
|
||||
</Select>
|
||||
</FormControl>;
|
||||
}
|
||||
|
|
|
@ -51,7 +51,7 @@ export function Txt2Img(props: Txt2ImgProps) {
|
|||
return <Box>
|
||||
<Stack spacing={2}>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<QueryList result={schedulers} value={scheduler} labels={SCHEDULER_LABELS}
|
||||
<QueryList result={schedulers} value={scheduler} labels={SCHEDULER_LABELS} name='Scheduler'
|
||||
onChange={(value) => {
|
||||
setScheduler(value);
|
||||
}}
|
||||
|
|
Loading…
Reference in New Issue