chore: Center the Spinner in the loading screen and add Loading message

packages/hawtio/src/ui/page/HawtioLoading.tsx

@@ -1,10 +1,29 @@
-import { Page, PageSection, Spinner } from '@patternfly/react-core'
+import { Grid, GridItem, Page, PageSection, Spinner, Text, TextContent, TextVariants } from '@patternfly/react-core'
 import React from 'react'
 
 export const HawtioLoading: React.FunctionComponent = () => (
   <Page>
-    <PageSection>
-      <Spinner isSVG aria-label='Loading Hawtio' />
-    </PageSection>
+    <Grid
+      hasGutter
+      style={{
+        display: 'flex',
+        height: '100vh',
+        width: '100vw',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+      }}
+    >
+      <GridItem span={12}>
+        <Spinner diameter='60px' isSVG aria-label='Loading Hawtio' />
+      </GridItem>
+      <GridItem span={12}>
+        <TextContent>
+          <Text className={'--pf-global--Color--200'} component={TextVariants.h3}>
+            Loading ...
+          </Text>
+        </TextContent>
+      </GridItem>
+    </Grid>
   </Page>
 )