From 9c5dad138367fe1763db58b0d69bd6ee926e2cda Mon Sep 17 00:00:00 2001
From: jeramysoucy <jeramy.soucy@elastic.co>
Date: Mon, 25 Jul 2022 18:18:40 -0400
Subject: [PATCH] Added loading message to spaces navigation.

---
 x-pack/plugins/spaces/public/constants.ts            | 12 +++++++++++-
 .../nav_control/components/spaces_description.tsx    |  5 +++--
 .../public/nav_control/nav_control_popover.tsx       |  1 +
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/x-pack/plugins/spaces/public/constants.ts b/x-pack/plugins/spaces/public/constants.ts
index b513a8affacf82..a2f84bccdb33f6 100644
--- a/x-pack/plugins/spaces/public/constants.ts
+++ b/x-pack/plugins/spaces/public/constants.ts
@@ -16,10 +16,20 @@ export const getSpacesFeatureDescription = () => {
         'Organize your dashboards and other saved objects into meaningful categories.',
     });
   }
-
   return spacesFeatureDescription;
 };
 
+let spacesLoadingMessage: string;
+
+export const getSpacesLoadingMessage = () => {
+  if (!spacesLoadingMessage) {
+    spacesLoadingMessage = i18n.translate('xpack.spaces.loadingMessage', {
+      defaultMessage: 'Loading...',
+    });
+  }
+  return spacesLoadingMessage;
+};
+
 export const DEFAULT_OBJECT_NOUN = i18n.translate('xpack.spaces.shareToSpace.objectNoun', {
   defaultMessage: 'object',
 });
diff --git a/x-pack/plugins/spaces/public/nav_control/components/spaces_description.tsx b/x-pack/plugins/spaces/public/nav_control/components/spaces_description.tsx
index dcbd6f21ada8fa..95ae881057edca 100644
--- a/x-pack/plugins/spaces/public/nav_control/components/spaces_description.tsx
+++ b/x-pack/plugins/spaces/public/nav_control/components/spaces_description.tsx
@@ -13,11 +13,12 @@ import React from 'react';
 
 import type { ApplicationStart, Capabilities } from '@kbn/core/public';
 
-import { getSpacesFeatureDescription } from '../../constants';
+import { getSpacesFeatureDescription, getSpacesLoadingMessage } from '../../constants';
 import { ManageSpacesButton } from './manage_spaces_button';
 
 interface Props {
   id: string;
+  isLoading: boolean;
   toggleSpaceSelector: () => void;
   capabilities: Capabilities;
   navigateToApp: ApplicationStart['navigateToApp'];
@@ -33,7 +34,7 @@ export const SpacesDescription: FC<Props> = (props: Props) => {
   return (
     <EuiContextMenuPanel {...panelProps}>
       <EuiText className="spcDescription__text">
-        <p>{getSpacesFeatureDescription()}</p>
+        <p>{props.isLoading ? getSpacesLoadingMessage() : getSpacesFeatureDescription()}</p>
       </EuiText>
       <div key="manageSpacesButton" className="spcDescription__manageButtonWrapper">
         <ManageSpacesButton
diff --git a/x-pack/plugins/spaces/public/nav_control/nav_control_popover.tsx b/x-pack/plugins/spaces/public/nav_control/nav_control_popover.tsx
index 0c847b07ca83e6..3472f83daf2371 100644
--- a/x-pack/plugins/spaces/public/nav_control/nav_control_popover.tsx
+++ b/x-pack/plugins/spaces/public/nav_control/nav_control_popover.tsx
@@ -79,6 +79,7 @@ export class NavControlPopover extends Component<Props, State> {
       element = (
         <SpacesDescription
           id={popoutContentId}
+          isLoading={this.state.loading}
           toggleSpaceSelector={this.toggleSpaceSelector}
           capabilities={this.props.capabilities}
           navigateToApp={this.props.navigateToApp}