chore: code-review comments

Signed-off-by: blam <ben@blam.sh>

plugins/scaffolder/src/next/TemplateWizardPage/Stepper/Stepper.tsx

@@ -27,8 +27,7 @@ import { Theme as MuiTheme } from '@rjsf/material-ui';
 import React, { useMemo, useState } from 'react';
 import { FieldExtensionOptions } from '../../../extensions';
 import { TemplateParameterSchema } from '../../../types';
-import { createAsyncValidator } from './createAsyncValidators';
-import { createFieldValidation } from './schema';
+import { createAsyncValidators } from './createAsyncValidators';
 import { useTemplateSchema } from './useTemplateSchema';
 
 const useStyles = makeStyles(theme => ({
@@ -74,9 +73,9 @@ export const Stepper = (props: StepperProps) => {
     );
   }, [props.extensions]);
 
-  const validator = useMemo(() => {
+  const validation = useMemo(() => {
     const { mergedSchema } = steps[activeStep];
-    return createAsyncValidator(mergedSchema, validators, {
+    return createAsyncValidators(mergedSchema, validators, {
       apiHolder,
     });
   }, [steps, activeStep, validators, apiHolder]);
@@ -86,9 +85,11 @@ export const Stepper = (props: StepperProps) => {
   };
 
   const handleNext = async ({ formData }: { formData: JsonObject }) => {
+    // TODO(blam): What do we do about loading states, does each field extension get a chance
+    // to display it's own loading? Or should we grey out the entire form.
     setErrors(undefined);
 
-    const returnedValidation = await validator(formData);
+    const returnedValidation = await validation(formData);
 
     const hasErrors = Object.values(returnedValidation).some(i => {
       return i.__errors.length > 0;

plugins/scaffolder/src/next/TemplateWizardPage/Stepper/createAsyncValidators.test.ts

@@ -15,7 +15,7 @@
  */
 import { JsonObject } from '@backstage/types';
 import { CustomFieldValidator } from '../../../extensions';
-import { createAsyncValidator } from './createAsyncValidators';
+import { createAsyncValidators } from './createAsyncValidators';
 
 describe('createAsyncValidators', () => {
   it('should call the correct functions for validation', async () => {
@@ -43,7 +43,7 @@ describe('createAsyncValidators', () => {
 
     const validators = { NameField: jest.fn(), AddressField: jest.fn() };
 
-    const validate = createAsyncValidator(schema, validators, {
+    const validate = createAsyncValidators(schema, validators, {
       apiHolder: { get: jest.fn() },
     });
 
@@ -98,7 +98,7 @@ describe('createAsyncValidators', () => {
       }
     };
 
-    const validate = createAsyncValidator(
+    const validate = createAsyncValidators(
       schema,
       {
         NameField: NameField as CustomFieldValidator<unknown>,

plugins/scaffolder/src/next/TemplateWizardPage/Stepper/createAsyncValidators.ts

@@ -21,7 +21,7 @@ import { CustomFieldValidator } from '../../../extensions';
 import { Draft07 as JSONSchema } from 'json-schema-library';
 import { createFieldValidation } from './schema';
 
-export const createAsyncValidator = (
+export const createAsyncValidators = (
   rootSchema: JsonObject,
   validators: Record<string, undefined | CustomFieldValidator<unknown>>,
   context: {
@@ -41,7 +41,11 @@ export const createAsyncValidator = (
         const validator = validators[definitionInSchema['ui:field']];
         if (validator) {
           const fieldValidation = createFieldValidation();
-          await validator(value, fieldValidation, context);
+          try {
+            await validator(value, fieldValidation, context);
+          } catch (ex) {
+            fieldValidation.addError(ex.message);
+          }
           formValidation[key] = fieldValidation;
         }
       }

plugins/scaffolder/src/next/TemplateWizardPage/Stepper/schema.ts

@@ -114,7 +114,6 @@ export const extractSchemaFromStep = (
 /**
  * @alpha
  * Creates a field validation object for use in react jsonschema form
- * @returns {FieldValidation} A field validation object that can be used to validate a field
  */
 export const createFieldValidation = (): FieldValidation => {
   const fieldValidation: FieldValidation = {