chore: fixing up typescript

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

plugins/scaffolder/package.json

@@ -56,6 +56,7 @@
     "@react-hookz/web": "^15.0.0",
     "@rjsf/core": "^5.0.0-beta.2",
     "@rjsf/material-ui": "^5.0.0-beta.2",
+    "@rjsf/utils": "^5.0.0-beta.2",
     "@rjsf/validator-ajv6": "^5.0.0-beta.2",
     "@types/json-schema": "^7.0.9",
     "@uiw/react-codemirror": "^4.9.3",

plugins/scaffolder/src/components/MultistepJsonForm/FieldOverrides/DescriptionField.tsx

@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { MarkdownContent } from '@backstage/core-components';
-import { FieldProps } from '@rjsf/core';
+import { FieldProps } from '@rjsf/utils';
 
 export const DescriptionField = ({ description }: FieldProps) =>
   description && <MarkdownContent content={description} linkTarget="_blank" />;

plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx

@@ -29,7 +29,8 @@ import {
   useApi,
   featureFlagsApiRef,
 } from '@backstage/core-plugin-api';
-import { FormProps, IChangeEvent, UiSchema, withTheme } from '@rjsf/core';
+import { UiSchema } from '@rjsf/utils';
+import { FormProps, IChangeEvent, withTheme } from '@rjsf/core';
 import { Theme } from '@rjsf/material-ui';
 import validator from '@rjsf/validator-ajv6';
 import React, { useState } from 'react';
@@ -215,7 +216,7 @@ export const MultistepJsonForm = (props: Props) => {
                   formData={formData}
                   formContext={{ formData }}
                   onChange={onChange}
-                  onSubmit={e => {
+                  onSubmit={(e: any) => {
                     if (e.errors.length === 0) handleNext();
                   }}
                   {...formProps}

plugins/scaffolder/src/components/TemplatePage/createValidator.test.ts

@@ -17,7 +17,7 @@
 import { createValidator } from './createValidator';
 import { CustomFieldValidator } from '../../extensions';
 import { ApiHolder } from '@backstage/core-plugin-api';
-import { FormValidation } from '@rjsf/core';
+import { FormValidation } from '@rjsf/utils';
 
 describe('createValidator', () => {
   const validators: Record<string, undefined | CustomFieldValidator<unknown>> =

plugins/scaffolder/src/components/TemplatePage/createValidator.ts

@@ -15,7 +15,7 @@
  */
 
 import { CustomFieldValidator } from '../../extensions';
-import { FormValidation } from '@rjsf/core';
+import { FormValidation } from '@rjsf/utils';
 import { JsonObject, JsonValue } from '@backstage/types';
 import { ApiHolder } from '@backstage/core-plugin-api';
 

plugins/scaffolder/src/components/fields/EntityNamePicker/validation.test.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { FieldValidation } from '@rjsf/core';
+import { FieldValidation } from '@rjsf/utils';
 import { KubernetesValidatorFunctions } from '@backstage/catalog-model';
 import { entityNamePickerValidation } from './validation';
 

plugins/scaffolder/src/components/fields/EntityNamePicker/validation.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { FieldValidation } from '@rjsf/core';
+import { FieldValidation } from '@rjsf/utils';
 import { KubernetesValidatorFunctions } from '@backstage/catalog-model';
 
 export const entityNamePickerValidation = (

plugins/scaffolder/src/components/fields/EntityPicker/EntityPicker.test.tsx

@@ -17,7 +17,7 @@
 import { Entity } from '@backstage/catalog-model';
 import { CatalogApi, catalogApiRef } from '@backstage/plugin-catalog-react';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
-import { FieldProps } from '@rjsf/core';
+import { FieldProps } from '@rjsf/utils';
 import { fireEvent } from '@testing-library/react';
 import React from 'react';
 import { EntityPicker } from './EntityPicker';

plugins/scaffolder/src/components/fields/OwnerPicker/OwnerPicker.test.tsx

@@ -17,7 +17,7 @@
 import { Entity } from '@backstage/catalog-model';
 import { CatalogApi, catalogApiRef } from '@backstage/plugin-catalog-react';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
-import { FieldProps } from '@rjsf/core';
+import { FieldProps } from '@rjsf/utils';
 import React from 'react';
 import { OwnerPicker } from './OwnerPicker';
 

plugins/scaffolder/src/components/fields/RepoUrlPicker/RepoUrlPicker.test.tsx

@@ -15,7 +15,8 @@
  */
 import React, { useContext } from 'react';
 import { RepoUrlPicker } from './RepoUrlPicker';
-import Form from '@rjsf/core';
+import { withTheme } from '@rjsf/core';
+import { Theme } from '@rjsf/material-ui';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
 import {
   scmIntegrationsApiRef,
@@ -50,6 +51,8 @@ describe('RepoUrlPicker', () => {
     getCredentials: jest.fn().mockResolvedValue({ token: 'abc123' }),
   };
 
+  const Form = withTheme(Theme);
+
   describe('happy path rendering', () => {
     it('should render the repo url picker with minimal props', async () => {
       const onSubmit = jest.fn();

plugins/scaffolder/src/components/fields/RepoUrlPicker/validation.test.ts

@@ -15,7 +15,7 @@
  */
 
 import { repoPickerValidation } from './validation';
-import { FieldValidation } from '@rjsf/core';
+import { FieldValidation } from '@rjsf/utils';
 import { ScmIntegrations } from '@backstage/integration';
 import { ConfigReader } from '@backstage/core-app-api';
 import { ApiHolder } from '@backstage/core-plugin-api';

plugins/scaffolder/src/components/fields/RepoUrlPicker/validation.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { FieldValidation } from '@rjsf/core';
+import { FieldValidation } from '@rjsf/utils';
 import { ApiHolder } from '@backstage/core-plugin-api';
 import { scmIntegrationsApiRef } from '@backstage/integration-react';
 

plugins/scaffolder/src/extensions/types.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { ApiHolder } from '@backstage/core-plugin-api';
-import { FieldValidation, FieldProps } from '@rjsf/core';
+import { FieldValidation, FieldProps } from '@rjsf/utils';
 
 /**
  * Field validation type for Custom Field Extensions.

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

@@ -22,7 +22,8 @@ import {
   Button,
   makeStyles,
 } from '@material-ui/core';
-import { FieldValidation, withTheme } from '@rjsf/core';
+import { withTheme } from '@rjsf/core';
+import { FieldValidation } from '@rjsf/utils';
 import { Theme as MuiTheme } from '@rjsf/material-ui';
 import React, { useMemo, useState } from 'react';
 import { FieldExtensionOptions } from '../../../extensions';

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

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { FieldValidation } from '@rjsf/core';
+import { FieldValidation } from '@rjsf/utils';
 import { JsonObject } from '@backstage/types';
 import { ApiHolder } from '@backstage/core-plugin-api';
 import { CustomFieldValidator } from '../../../extensions';

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

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { JsonObject } from '@backstage/types';
-import { FieldValidation, UiSchema } from '@rjsf/core';
+import { FieldValidation, UiSchema } from '@rjsf/utils';
 
 function isObject(value: unknown): value is JsonObject {
   return typeof value === 'object' && value !== null && !Array.isArray(value);

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

@@ -15,7 +15,7 @@
  */
 import { featureFlagsApiRef, useApi } from '@backstage/core-plugin-api';
 import { JsonObject } from '@backstage/types';
-import { UiSchema } from '@rjsf/core';
+import { UiSchema } from '@rjsf/utils';
 import { TemplateParameterSchema } from '../../../types';
 import { extractSchemaFromStep } from './schema';