imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Extract Password field from Registration into a reusable component

Browse source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-05-14 20:19:15 +01:00
parent eb6796bd0e
commit cf3c4d9e5f
8 changed files with 148 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/views/elements/Validation.tsx
View file

@ -19,7 +19,7 @@ limitations under the License.
import React from "react";
import classNames from "classnames";
type Data = Pick<IValidateArgs, "value" | "allowEmpty">;
type Data = Pick<IFieldState, "value" | "allowEmpty">;
interface IRule<T> {
key: string;
@ -32,15 +32,20 @@ interface IRule<T> {
interface IArgs<T> {
rules: IRule<T>[];
description(): React.ReactChild;
description(this: T): React.ReactChild;
}
interface IValidateArgs {
export interface IFieldState {
value: string;
focused: boolean;
allowEmpty: boolean;
}
export interface IValidationResult {
valid?: boolean;
feedback?: React.ReactChild;
}
/**
* Creates a validation function from a set of rules describing what to validate.
* Generic T is the "this" type passed to the rule methods
@ -62,7 +67,7 @@ interface IValidateArgs {
* the overall validity and a feedback UI that can be rendered for more detail.
*/
export default function withValidation<T = undefined>({ description, rules }: IArgs<T>) {
return async function onValidate({ value, focused, allowEmpty = true }: IValidateArgs) {
return async function onValidate({ value, focused, allowEmpty = true }: IFieldState): Promise<IValidationResult> {
if (!value && allowEmpty) {
return {
valid: null,