diff --git a/frontend/components/template/Form.tsx b/frontend/components/template/Form.tsx index 71d3ea8617d246580b4e3cc12d4cdeee69007d29..089b64c450062092121ee0badcc280380e34937d 100644 --- a/frontend/components/template/Form.tsx +++ b/frontend/components/template/Form.tsx @@ -7,19 +7,20 @@ import { CutterField } from 'lib/client'; type FormFieldProps = { field: CutterField; flagged: boolean }; const Formfield: FC<FormFieldProps> = ({ field, flagged }) => { - // TODO: type assertion because API schema issues - const defaultValue = field.default as string | boolean; - return ( <div className={field.default === BLANK_FIELD ? '-mb-3' : ''}> <label htmlFor={field.name}>{field.prompt ?? field.name}</label>{' '} {flagged && <Badge type="warning">Missing</Badge>} - {field.default != BLANK_FIELD && - (typeof defaultValue == 'string' ? ( - <TextInput field={field} flagged={flagged} className="mt-1" /> - ) : Array.isArray(defaultValue) ? ( - <SelectInput field={field} flagged={flagged} className="mt-1" /> - ) : undefined)} + {field.default != BLANK_FIELD && ( + <> + {field.type === 'text' && ( + <TextInput field={field} flagged={flagged} className="mt-1" /> + )} + {field.type === 'select' && ( + <SelectInput field={field} flagged={flagged} className="mt-1" /> + )} + </> + )} </div> ); }; diff --git a/frontend/components/template/SelectInput.tsx b/frontend/components/template/SelectInput.tsx index 2e10149b1594aab16c59a0354f32986b40dfb642..4ea8eb50ee6919ec5182afe2408b9722dd9d2a0b 100644 --- a/frontend/components/template/SelectInput.tsx +++ b/frontend/components/template/SelectInput.tsx @@ -12,7 +12,7 @@ const SelectInput: FC<SelectInputProps> = ({ field, flagged = false, className } <select name={field.name} id={field.name} - className={clsx('selectpicker form-control', flagged && 'border-warning', className)} + className={clsx('rounded', flagged && 'border-warning', className)} > {field.options?.map((option) => ( <option value={option.name} key={option.name}> diff --git a/frontend/components/template/TextInput.tsx b/frontend/components/template/TextInput.tsx index 98f98136584aadb217574193db9d52a73d35e8ad..06f0901f2e766340d1dc00ad4e5d4fca03fb6f27 100644 --- a/frontend/components/template/TextInput.tsx +++ b/frontend/components/template/TextInput.tsx @@ -10,7 +10,7 @@ type TextInputProps = { const TextInput: FC<TextInputProps> = ({ field, flagged = false, className }) => { return ( <input - className={clsx('input', flagged && 'border-warning', className)} + className={clsx('rounded input', flagged && 'border-warning', className)} type="text" name={field.name} id={field.name}