idanoo/autobrr
1
0
Fork 0
mirror of https://github.com/idanoo/autobrr synced 2025-07-23 08:49:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(filters): add form validation (#890)

Browse source 
* feat(filters): add form validation

* feat(filters): show toast on validation error

* chore: update package.json
This commit is contained in:
ze0s 2023-05-01 14:44:17 +02:00 • committed by GitHub
parent 83e9232b98
commit 124031f510
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 146 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

36
web/src/components/inputs/select.tsx
View file

@ -116,21 +116,27 @@ export const IndexerMultiSelect = ({
<Field name={name} type="select" multiple={true}>
{({
field,
meta,
form: { setFieldValue }
}: FieldProps) => (
<RMSC
{...field}
options={options}
labelledBy={name}
value={field.value && field.value.map((item: IndexerMultiSelectOption) => ({
value: item.id, label: item.name
}))}
onChange={(values: MultiSelectOption[]) => {
const item = values && values.map((i) => ({ id: i.value, name: i.label }));
setFieldValue(field.name, item);
}}
className={settingsContext.darkTheme ? "dark" : ""}
/>
<>
<RMSC
{...field}
options={options}
labelledBy={name}
value={field.value && field.value.map((item: IndexerMultiSelectOption) => ({
value: item.id, label: item.name
}))}
onChange={(values: MultiSelectOption[]) => {
const item = values && values.map((i) => ({ id: i.value, name: i.label }));
setFieldValue(field.name, item);
}}
className={settingsContext.darkTheme ? "dark" : ""}
/>
{meta.touched && meta.error && (
<p className="error text-sm text-red-600 mt-1">* {meta.error}</p>
)}
</>
)}
</Field>
</div>
@ -153,6 +159,7 @@ export function DownloadClientSelect({
<Field name={name} type="select">
{({
field,
meta,
form: { setFieldValue }
}: FieldProps) => (
<Listbox
@ -231,6 +238,9 @@ export function DownloadClientSelect({
))}
</Listbox.Options>
</Transition>
{meta.touched && meta.error && (
<p className="error text-sm text-red-600 mt-1">* {meta.error}</p>
)}
</div>
</>
)}