cleanup validators and allow string return as error message

This commit is contained in:
cupcakearmy 2019-10-19 20:15:54 +02:00
parent 43db9630a4
commit 6070ee2227
3 changed files with 16 additions and 16 deletions

View File

@ -8,7 +8,8 @@ export type useFormOptions = {
setter?: string setter?: string
} }
export type useFormValidatorFunction = (s: any) => boolean | Promise<boolean> export type useFormValidatorFunctionReturn = boolean | string
export type useFormValidatorFunction = (s: any) => useFormValidatorFunctionReturn | Promise<useFormValidatorFunctionReturn>
export type useFormValidatorMethod = useFormValidatorFunction | RegExp export type useFormValidatorMethod = useFormValidatorFunction | RegExp
export type useFormValidatorObject = { export type useFormValidatorObject = {
@ -50,7 +51,7 @@ export const useForm = <T extends object, U extends { [key in keyof T]: useFormV
}) })
} }
const _validateAll = async (value: any, object: useFormValidator): Promise<boolean> => { const _validateAll = async (value: any, object: useFormValidator): Promise<useFormValidatorFunctionReturn> => {
const validator = isFormValidatorObject(object) ? object.validator : object const validator = isFormValidatorObject(object) ? object.validator : object
if (validator.constructor.name === 'Function') return (validator as useFormValidatorFunction)(value) if (validator.constructor.name === 'Function') return (validator as useFormValidatorFunction)(value)
@ -59,28 +60,26 @@ export const useForm = <T extends object, U extends { [key in keyof T]: useFormV
else return false else return false
} }
const _getErrorMessage = (result: useFormValidatorFunctionReturn, key: keyof T, validator: useFormValidatorMethod | useFormValidatorObject) =>
result === true ? undefined : result.constructor.name === 'String' ? result : isFormValidatorObject(validator) && validator.message ? validator.message : defaultErrorMessage(key)
const _validate = (key: keyof T, value: any) => { const _validate = (key: keyof T, value: any) => {
const validator: useFormValidatorParameter | undefined = validators[key] const validator: useFormValidatorParameter | undefined = validators[key]
if (!validator) return if (!validator) return
if (Array.isArray(validator)) { if (Array.isArray(validator)) {
Promise.all(validator.map(v => _validateAll(value, v))).then(result => { Promise.all(validator.map(v => _validateAll(value, v))).then(results => {
const index = result.indexOf(false) const i = results.findIndex(result => result !== true)
setErrors({ setErrors({
...errors, ...errors,
[key]: [key]: i === -1 ? undefined : _getErrorMessage(results[i], key, validator[i]),
index === -1
? undefined
: isFormValidatorObject(validator[index]) && (validator[index] as useFormValidatorObject).message
? (validator[index] as useFormValidatorObject).message
: defaultErrorMessage(key),
}) })
}) })
} else { } else {
_validateAll(value, validator).then(valid => { _validateAll(value, validator).then(result => {
setErrors({ setErrors({
...errors, ...errors,
[key]: valid ? undefined : isFormValidatorObject(validator) && validator.message ? validator.message : defaultErrorMessage(key), [key]: _getErrorMessage(result, key, validator),
}) })
}) })
} }

View File

@ -1,6 +1,6 @@
{ {
"name": "formhero", "name": "formhero",
"version": "0.0.6", "version": "0.0.7",
"main": "dist/index.js", "main": "dist/index.js",
"typings": "dist/index.d.ts", "typings": "dist/index.d.ts",
"scripts": { "scripts": {

View File

@ -15,13 +15,14 @@ const initial = {
const Index: React.FC = () => { const Index: React.FC = () => {
const { field, form, errors, isValid, setForm, setErrors, setField } = useForm(initial, { const { field, form, errors, isValid, setForm, setErrors, setField } = useForm(initial, {
username: [ username: [
/^test/, /^abc/,
{ {
validator: async () => { validator: async (s: string) => {
return true return true
}, },
message: 'Digits please', message: 'Async shit not working',
}, },
(s: string) => (s.includes('d') ? true : 'Needs the D'),
], ],
password: { password: {
validator: /^.{3,}$/, validator: /^.{3,}$/,