diff --git a/packages/eslint-config-kibana/typescript.js b/packages/eslint-config-kibana/typescript.js
index 17dd32b766ab7..d2add33ae3e10 100644
--- a/packages/eslint-config-kibana/typescript.js
+++ b/packages/eslint-config-kibana/typescript.js
@@ -72,7 +72,24 @@ module.exports = {
           '@typescript-eslint/ban-types': [
             'error',
             {
-              types: { SFC: null, 'React.SFC': null },
+              types: {
+                SFC: {
+                  message: 'Use FC or FunctionComponent instead.',
+                  fixWith: 'FC',
+                },
+                'React.SFC': {
+                  message: 'Use FC or FunctionComponent instead.',
+                  fixWith: 'React.FC',
+                },
+                StatelessComponent: {
+                  message: 'Use FunctionComponent instead.',
+                  fixWith: 'FunctionComponent',
+                },
+                'React.StatelessComponent': {
+                  message: 'Use FunctionComponent instead.',
+                  fixWith: 'React.FunctionComponent',
+                },
+              },
             },
           ],
           camelcase: 'off',
diff --git a/x-pack/legacy/plugins/siem/public/components/autocomplete_field/index.tsx b/x-pack/legacy/plugins/siem/public/components/autocomplete_field/index.tsx
index 408743d261797..b78f2b0d07d39 100644
--- a/x-pack/legacy/plugins/siem/public/components/autocomplete_field/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/autocomplete_field/index.tsx
@@ -307,7 +307,7 @@ const withUnfocused = (state: AutocompleteFieldState) => ({
   isFocused: false,
 });
 
-export const FixedEuiFieldSearch: React.SFC<React.InputHTMLAttributes<HTMLInputElement> &
+export const FixedEuiFieldSearch: React.FC<React.InputHTMLAttributes<HTMLInputElement> &
   EuiFieldSearchProps & {
     inputRef?: (element: HTMLInputElement | null) => void;
     onSearch: (value: string) => void;
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/controls.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/controls.tsx
index 5f3691f668103..bb42824d6ec05 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/controls.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/controls.tsx
@@ -26,7 +26,7 @@ interface CheckupControlsProps extends ReactIntl.InjectedIntlProps {
   onGroupByChange: (groupBy: GroupByOption) => void;
 }
 
-export const CheckupControlsUI: StatelessComponent<CheckupControlsProps> = ({
+export const CheckupControlsUI: FunctionComponent<CheckupControlsProps> = ({
   allDeprecations,
   loadingState,
   loadData,
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/cell.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/cell.tsx
index 29a0076d00d0e..47a85d91fd44c 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/cell.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/cell.tsx
@@ -30,7 +30,7 @@ interface DeprecationCellProps {
 /**
  * Used to display a deprecation with links to docs, a health indicator, and other descriptive information.
  */
-export const DeprecationCell: StatelessComponent<DeprecationCellProps> = ({
+export const DeprecationCell: FunctionComponent<DeprecationCellProps> = ({
   headline,
   healthColor,
   reindexIndexName,
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/grouped.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/grouped.tsx
index 9ce0b8a8cefd3..160d802260d1a 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/grouped.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/grouped.tsx
@@ -59,7 +59,7 @@ export const filterDeps = (level: LevelFilterOption, search: string = '') => {
 /**
  * A single accordion item for a grouped deprecation item.
  */
-export const DeprecationAccordion: StatelessComponent<{
+export const DeprecationAccordion: FunctionComponent<{
   id: string;
   deprecations: EnrichedDeprecationInfo[];
   title: string;
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/health.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/health.tsx
index ab4daece767a0..071b62dde7744 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/health.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/health.tsx
@@ -36,7 +36,7 @@ interface DeprecationHealthProps {
   single?: boolean;
 }
 
-const SingleHealth: StatelessComponent<{ level: DeprecationInfo['level']; label: string }> = ({
+const SingleHealth: FunctionComponent<{ level: DeprecationInfo['level']; label: string }> = ({
   level,
   label,
 }) => (
@@ -52,7 +52,7 @@ const SingleHealth: StatelessComponent<{ level: DeprecationInfo['level']; label:
  * Displays a summary health for a list of deprecations that shows the number and level of severity
  * deprecations in the list.
  */
-export const DeprecationHealth: StatelessComponent<DeprecationHealthProps> = ({
+export const DeprecationHealth: FunctionComponent<DeprecationHealthProps> = ({
   deprecations,
   single = false,
 }) => {
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/list.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/list.tsx
index cb38b848b3bd7..d88113bc22710 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/list.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/list.tsx
@@ -21,7 +21,7 @@ const sortByLevelDesc = (a: DeprecationInfo, b: DeprecationInfo) => {
 /**
  * Used to show a single deprecation message with any detailed information.
  */
-const MessageDeprecation: StatelessComponent<{ deprecation: EnrichedDeprecationInfo }> = ({
+const MessageDeprecation: FunctionComponent<{ deprecation: EnrichedDeprecationInfo }> = ({
   deprecation,
 }) => {
   const items = [];
@@ -44,7 +44,7 @@ const MessageDeprecation: StatelessComponent<{ deprecation: EnrichedDeprecationI
 /**
  * Used to show a single (simple) deprecation message with any detailed information.
  */
-const SimpleMessageDeprecation: StatelessComponent<{ deprecation: EnrichedDeprecationInfo }> = ({
+const SimpleMessageDeprecation: FunctionComponent<{ deprecation: EnrichedDeprecationInfo }> = ({
   deprecation,
 }) => {
   const items = [];
@@ -64,7 +64,7 @@ interface IndexDeprecationProps {
 /**
  * Shows a single deprecation and table of affected indices with details for each index.
  */
-const IndexDeprecation: StatelessComponent<IndexDeprecationProps> = ({ deprecation, indices }) => {
+const IndexDeprecation: FunctionComponent<IndexDeprecationProps> = ({ deprecation, indices }) => {
   return (
     <DeprecationCell docUrl={deprecation.url}>
       <IndexDeprecationTable indices={indices} />
@@ -76,7 +76,7 @@ const IndexDeprecation: StatelessComponent<IndexDeprecationProps> = ({ deprecati
  * A list of deprecations that is either shown as individual deprecation cells or as a
  * deprecation summary for a list of indices.
  */
-export const DeprecationList: StatelessComponent<{
+export const DeprecationList: FunctionComponent<{
   deprecations: EnrichedDeprecationInfo[];
   currentGroupBy: GroupByOption;
 }> = ({ deprecations, currentGroupBy }) => {
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/index.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/index.tsx
index 834f5f4afe5f6..254e375c403a5 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/index.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/index.tsx
@@ -24,7 +24,7 @@ import { LoadingErrorBanner } from '../../error_banner';
 import { LoadingState, UpgradeAssistantTabProps } from '../../types';
 import { Steps } from './steps';
 
-export const OverviewTab: StatelessComponent<UpgradeAssistantTabProps> = props => (
+export const OverviewTab: FunctionComponent<UpgradeAssistantTabProps> = props => (
   <Fragment>
     <EuiSpacer />
 
diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/steps.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/steps.tsx
index d43a86d2b0e06..656c1f813bdf7 100644
--- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/steps.tsx
+++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/overview/steps.tsx
@@ -92,8 +92,11 @@ const START_UPGRADE_STEP = {
   ),
 };
 
-export const StepsUI: StatelessComponent<UpgradeAssistantTabProps &
-  ReactIntl.InjectedIntlProps> = ({ checkupData, setSelectedTabIndex, intl }) => {
+export const StepsUI: FunctionComponent<UpgradeAssistantTabProps & ReactIntl.InjectedIntlProps> = ({
+  checkupData,
+  setSelectedTabIndex,
+  intl,
+}) => {
   const checkupDataTyped = (checkupData! as unknown) as { [checkupType: string]: any[] };
   const countByType = Object.keys(checkupDataTyped).reduce((counts, checkupType) => {
     counts[checkupType] = checkupDataTyped[checkupType].length;