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/app/src/App.tsx

@@ -21,7 +21,7 @@ import {
   SignInPage,
   createRouteRef,
 } from '@backstage/core';
-import React, { FC } from 'react';
+import React from 'react';
 import Root from './components/Root';
 import * as plugins from './plugins';
 import { apis } from './apis';
@@ -92,7 +92,7 @@ const AppRoutes = () => (
   </Routes>
 );
 
-const App: FC<{}> = () => (
+const App = () => (
   <AppProvider>
     <AlertDisplay />
     <OAuthRequestDialog />

packages/app/src/components/Root/LogoFull.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { FC } from 'react';
+import React from 'react';
 import { makeStyles } from '@material-ui/core';
 
 const useStyles = makeStyles({
@@ -26,7 +26,7 @@ const useStyles = makeStyles({
     fill: '#7df3e1',
   },
 });
-const LogoFull: FC<{}> = () => {
+const LogoFull = () => {
   const classes = useStyles();
 
   return (

packages/app/src/components/Root/LogoIcon.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import React, { FC } from 'react';
+import React from 'react';
 import { makeStyles } from '@material-ui/core';
 
 const useStyles = makeStyles({
@@ -27,7 +27,7 @@ const useStyles = makeStyles({
   },
 });
 
-const LogoIcon: FC<{}> = () => {
+const LogoIcon = () => {
   const classes = useStyles();
 
   return (

packages/app/src/components/Root/Root.tsx

@@ -14,8 +14,7 @@
  * limitations under the License.
  */
 
-import React, { FC, useContext } from 'react';
-import PropTypes from 'prop-types';
+import React, { useContext, PropsWithChildren } from 'react';
 import { Link, makeStyles } from '@material-ui/core';
 import HomeIcon from '@material-ui/icons/Home';
 import ExtensionIcon from '@material-ui/icons/Extension';
@@ -55,7 +54,7 @@ const useSidebarLogoStyles = makeStyles({
   },
 });
 
-const SidebarLogo: FC<{}> = () => {
+const SidebarLogo = () => {
   const classes = useSidebarLogoStyles();
   const { isOpen } = useContext(SidebarContext);
 
@@ -73,7 +72,7 @@ const SidebarLogo: FC<{}> = () => {
   );
 };
 
-const Root: FC<{}> = ({ children }) => (
+const Root = ({ children }: PropsWithChildren<{}>) => (
   <SidebarPage>
     <Sidebar>
       <SidebarLogo />
@@ -102,8 +101,4 @@ const Root: FC<{}> = ({ children }) => (
   </SidebarPage>
 );
 
-Root.propTypes = {
-  children: PropTypes.node,
-};
-
 export default Root;