remove React's FC type from codebase (#3527)

* WIP-packages: remove React's FC type from codebase

* remove FC from other directories

* fix build failures

* add types to required packages

packages/test-utils/src/testUtils/appWrappers.test.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { FC, useEffect } from 'react';
+import React, { useEffect } from 'react';
 import { render } from '@testing-library/react';
 import { wrapInTestApp, renderInTestApp } from './appWrappers';
 import { Route, Routes } from 'react-router';
@@ -54,7 +54,7 @@ describe('wrapInTestApp', () => {
 
   it('should render a component in a test app without warning about missing act()', async () => {
     const { error } = await withLogCollector(['error'], async () => {
-      const Foo: FC<{}> = () => {
+      const Foo = () => {
         return <p>foo</p>;
       };
 
@@ -66,7 +66,7 @@ describe('wrapInTestApp', () => {
   });
 
   it('should render a node in a test app', async () => {
-    const Foo: FC<{}> = () => {
+    const Foo = () => {
       return <p>foo</p>;
     };
 
@@ -75,7 +75,7 @@ describe('wrapInTestApp', () => {
   });
 
   it('should provide mock API implementations', async () => {
-    const A: FC<{}> = () => {
+    const A = () => {
       const errorApi = useApi(errorApiRef);
       errorApi.post(new Error('NOPE'));
       return null;
@@ -96,7 +96,7 @@ describe('wrapInTestApp', () => {
   it('should allow custom API implementations', async () => {
     const mockErrorApi = new MockErrorApi({ collect: true });
 
-    const A: FC<{}> = () => {
+    const A = () => {
       const errorApi = useApi(errorApiRef);
       useEffect(() => {
         errorApi.post(new Error('NOPE'));

packages/test-utils/src/testUtils/appWrappers.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { ComponentType, ReactNode, FC, ReactElement } from 'react';
+import React, { ComponentType, ReactNode, ReactElement } from 'react';
 import { MemoryRouter } from 'react-router';
 import { Route } from 'react-router-dom';
 import { lightTheme } from '@backstage/theme';
@@ -31,7 +31,7 @@ const { PrivateAppImpl } = privateExports;
 const NotFoundErrorPage = () => {
   throw new Error('Reached NotFound Page');
 };
-const BootErrorPage: FC<BootErrorPageProps> = ({ step, error }) => {
+const BootErrorPage = ({ step, error }: BootErrorPageProps) => {
   throw new Error(`Reached BootError Page at step ${step} with error ${error}`);
 };
 const Progress = () => <div data-testid="progress" />;
@@ -86,7 +86,7 @@ export function wrapInTestApp(
   if (Component instanceof Function) {
     Wrapper = Component;
   } else {
-    Wrapper = (() => Component) as FC;
+    Wrapper = () => Component as React.ReactElement;
   }
 
   const AppProvider = app.getProvider();