woocommerce/plugins/woocommerce-blocks/assets/js/base/context/hooks/use-validation.ts

/**
 * External dependencies
 */
import { useCallback } from '@wordpress/element';
import type {
	ValidationData,
	ValidationContextError,
} from '@woocommerce/type-defs/contexts';
import { useDispatch, useSelect } from '@wordpress/data';
import { VALIDATION_STORE_KEY } from '@woocommerce/block-data';

/**
 * Custom hook for setting for adding errors to the validation system.
 */
export const useValidation = (): ValidationData => {
	const {
		clearValidationError,
		hideValidationError,
		setValidationErrors,
	} = useDispatch( VALIDATION_STORE_KEY );
	const { hasValidationErrors, getValidationError } = useSelect(
		( select ) => {
			const store = select( VALIDATION_STORE_KEY );
			return {
				hasValidationErrors: store.hasValidationErrors,
				getValidationError: store.getValidationError(),
			};
		}
	);
	const prefix = 'extensions-errors';

	return {
		hasValidationErrors: hasValidationErrors(),
		getValidationError: useCallback(
			( validationErrorId: string ) =>
				getValidationError( `${ prefix }-${ validationErrorId }` ),
			[ getValidationError ]
		),
		clearValidationError: useCallback(
			( validationErrorId: string ) =>
				clearValidationError( `${ prefix }-${ validationErrorId }` ),
			[ clearValidationError ]
		),
		hideValidationError: useCallback(
			( validationErrorId: string ) =>
				hideValidationError( `${ prefix }-${ validationErrorId }` ),
			[ hideValidationError ]
		),
		setValidationErrors: useCallback(
			( errorsObject: Record< string, ValidationContextError > ) =>
				setValidationErrors(
					Object.fromEntries(
						Object.entries( errorsObject ).map(
							( [ validationErrorId, error ] ) => [
								`${ prefix }-${ validationErrorId }`,
								error,
							]
						)
					)
				),
			[ setValidationErrors ]
		),
	};
};