From 3f947b70d18d536f9c054889513f1b4ca7542b80 Mon Sep 17 00:00:00 2001
From: Peter Colapietro <petercolapietro+github@gmail.com>
Date: Fri, 27 Nov 2020 12:08:37 -0500
Subject: [PATCH] fix(react): use fragment (#3478)

The empty state's description is already wrapped in a Typography component so the one in MissingImplementsApisEmptyState is redundant.

https://github.com/backstage/backstage/blob/bbaadb63f88d0f7d42acb9fa1b1644f85bf1043e/packages/core/src/components/EmptyState/EmptyState.tsx#L57

By wrapping the EmptyState's description in a Typography the following warning is output to the console

```
react-dom.development.js?1930:89 Warning: validateDOMNesting(...): <p> cannot appear as a descendant of <p>.
    in p (created by ForwardRef(Typography))
    in ForwardRef(Typography) (created by WithStyles(ForwardRef(Typography)))
    in WithStyles(ForwardRef(Typography)) (created by MissingImplementsApisEmptyState)
    in p (created by ForwardRef(Typography))
    in ForwardRef(Typography) (created by WithStyles(ForwardRef(Typography)))
    in WithStyles(ForwardRef(Typography)) (created by EmptyState)
    in div (created by ForwardRef(Grid))
    in ForwardRef(Grid) (created by WithStyles(ForwardRef(Grid)))
    in WithStyles(ForwardRef(Grid)) (created by EmptyState)
    in div (created by ForwardRef(Grid))
    in ForwardRef(Grid) (created by WithStyles(ForwardRef(Grid)))
    in WithStyles(ForwardRef(Grid)) (created by EmptyState)
    in div (created by ForwardRef(Grid))
    in ForwardRef(Grid) (created by WithStyles(ForwardRef(Grid)))
    in WithStyles(ForwardRef(Grid)) (created by EmptyState)
    in EmptyState (created by MissingImplementsApisEmptyState)
    in MissingImplementsApisEmptyState (created by Router)
    in Router (at EntityPage.tsx:78)
    in article (created by Content)
    in Content (created by Layout)
    in Layout (created by EntityPageLayout)
    in div (created by Page)
    in ThemeProvider (created by Page)
    in Page (created by EntityPageLayout)
    in EntityPageLayout (at EntityPage.tsx:64)
    in ServiceEntityPage (at EntityPage.tsx:127)
    in EntityPage (created by EntityPageSwitch)
    in EntityPageSwitch (created by Router)
    in EntityProvider (created by Router)
    in Route (created by Router)
    in Routes (created by Router)
    in Router (at App.tsx:46)
    in Route (at App.tsx:44)
    in Routes (at App.tsx:42)
    in div (created by SidebarPage)
    in SidebarPage (at App.tsx:40)
    in Route (created by AppRouter)
    in Routes (created by AppRouter)
    in Router (created by BrowserRouter)
    in BrowserRouter (created by AppRouter)
    in AppRouter (at App.tsx:39)
    in CssBaseline (created by WithStyles(CssBaseline))
    in WithStyles(CssBaseline) (created by AppThemeProvider)
    in ThemeProvider (created by AppThemeProvider)
    in AppThemeProvider (created by Provider)
    in AppContextProvider (created by Provider)
    in ApiProvider (created by Provider)
    in Provider (at App.tsx:36)
    in App (at src/index.tsx:6)
```

Co-authored-by: Peter Colapietro <petercolapietro@gmail.com>
---
 .../MissingImplementsApisEmptyState.tsx                       | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/api-docs/src/catalog/MissingImplementsApisEmptyState/MissingImplementsApisEmptyState.tsx b/plugins/api-docs/src/catalog/MissingImplementsApisEmptyState/MissingImplementsApisEmptyState.tsx
index f13848bd19..fbb8810088 100644
--- a/plugins/api-docs/src/catalog/MissingImplementsApisEmptyState/MissingImplementsApisEmptyState.tsx
+++ b/plugins/api-docs/src/catalog/MissingImplementsApisEmptyState/MissingImplementsApisEmptyState.tsx
@@ -47,10 +47,10 @@ export const MissingImplementsApisEmptyState = () => {
       missing="field"
       title="No APIs implemented by this entity"
       description={
-        <Typography>
+        <>
           Components can implement APIs that are displayed on this page. You
           need to fill the <code>providesApis</code> field to enable this tool.
-        </Typography>
+        </>
       }
       action={
         <>