Improve home screen for limited-access users (#77665)

Author: legrego

src/plugins/home/public/application/components/__snapshots__/home.test.js.snap

@@ -163,7 +163,10 @@ export class Home extends Component {
                   </EuiFlexItem>
 
                   {stackManagement ? (
-                    <EuiFlexItem className="homHeader__actionItem">
+                    <EuiFlexItem
+                      className="homHeader__actionItem"
+                      data-test-subj="homManagementActionItem"
+                    >
                       <EuiButtonEmpty
                         onClick={createAppNavigationHandler(stackManagement.path)}
                         iconType="gear"

src/plugins/home/public/application/components/home.js

@@ -88,4 +88,9 @@ describe('ManageData', () => {
     );
     expect(component).toMatchSnapshot();
   });
+
+  test('render empty without any features', () => {
+    const component = shallowWithIntl(<ManageData addBasePath={addBasePathMock} features={[]} />);
+    expect(component).toMatchSnapshot();
+  });
 });

src/plugins/home/public/application/components/manage_data/__snapshots__/manage_data.test.tsx.snap

@@ -36,31 +36,37 @@ export const ManageData: FC<Props> = ({ addBasePath, features }) => (
   <>
     {features.length > 1 && <EuiHorizontalRule margin="xl" aria-hidden="true" />}
 
-    <section className="homDataManage" aria-labelledby="homDataManage__title">
-      <EuiTitle size="s">
-        <h2 id="homDataManage__title">
-          <FormattedMessage id="home.manageData.sectionTitle" defaultMessage="Manage your data" />
-        </h2>
-      </EuiTitle>
+    {features.length > 0 && (
+      <section
+        className="homDataManage"
+        aria-labelledby="homDataManage__title"
+        data-test-subj="homDataManage"
+      >
+        <EuiTitle size="s">
+          <h2 id="homDataManage__title">
+            <FormattedMessage id="home.manageData.sectionTitle" defaultMessage="Manage your data" />
+          </h2>
+        </EuiTitle>
 
-      <EuiSpacer size="m" />
+        <EuiSpacer size="m" />
 
-      <EuiFlexGroup className="homDataManage__content">
-        {features.map((feature) => (
-          <EuiFlexItem key={feature.id}>
-            <Synopsis
-              id={feature.id}
-              onClick={createAppNavigationHandler(feature.path)}
-              description={feature.description}
-              iconType={feature.icon}
-              title={feature.title}
-              url={addBasePath(feature.path)}
-              wrapInPanel
-            />
-          </EuiFlexItem>
-        ))}
-      </EuiFlexGroup>
-    </section>
+        <EuiFlexGroup className="homDataManage__content">
+          {features.map((feature) => (
+            <EuiFlexItem key={feature.id}>
+              <Synopsis
+                id={feature.id}
+                onClick={createAppNavigationHandler(feature.path)}
+                description={feature.description}
+                iconType={feature.icon}
+                title={feature.title}
+                url={addBasePath(feature.path)}
+                wrapInPanel
+              />
+            </EuiFlexItem>
+          ))}
+        </EuiFlexGroup>
+      </section>
+    )}
   </>
 );
 

src/plugins/home/public/application/components/manage_data/manage_data.test.tsx

@@ -53,6 +53,7 @@ interface Props {
 export const SolutionPanel: FC<Props> = ({ addBasePath, solution }) => (
   <EuiFlexItem
     key={solution.id}
+    data-test-subj={`homSolutionPanel homSolutionPanel_${solution.id}`}
     className={`${
       solution.id === 'kibana' ? 'homSolutions__group homSolutions__group--single' : ''
     } homSolutions__item`}

src/plugins/home/public/application/components/manage_data/manage_data.tsx

@@ -88,6 +88,40 @@ describe('FeatureCatalogueRegistry', () => {
         expect(service.get()).toEqual([]);
       });
     });
+
+    describe('visibility filtering', () => {
+      test('retains items with no "visible" callback', () => {
+        const service = new FeatureCatalogueRegistry();
+        service.setup().register(DASHBOARD_FEATURE);
+        const capabilities = { catalogue: {} } as any;
+        service.start({ capabilities });
+        expect(service.get()).toEqual([DASHBOARD_FEATURE]);
+      });
+
+      test('retains items with a "visible" callback which returns "true"', () => {
+        const service = new FeatureCatalogueRegistry();
+        const feature = {
+          ...DASHBOARD_FEATURE,
+          visible: () => true,
+        };
+        service.setup().register(feature);
+        const capabilities = { catalogue: {} } as any;
+        service.start({ capabilities });
+        expect(service.get()).toEqual([feature]);
+      });
+
+      test('removes items with a "visible" callback which returns "false"', () => {
+        const service = new FeatureCatalogueRegistry();
+        const feature = {
+          ...DASHBOARD_FEATURE,
+          visible: () => false,
+        };
+        service.setup().register(feature);
+        const capabilities = { catalogue: {} } as any;
+        service.start({ capabilities });
+        expect(service.get()).toEqual([]);
+      });
+    });
   });
 
   describe('title sorting', () => {

src/plugins/home/public/application/components/solutions_section/__snapshots__/solution_panel.test.tsx.snap

@@ -45,6 +45,8 @@ export interface FeatureCatalogueEntry {
   readonly showOnHomePage: boolean;
   /** An ordinal used to sort features relative to one another for display on the home page */
   readonly order?: number;
+  /** Optional function to control visibility of this feature. */
+  readonly visible?: () => boolean;
 }
 
 /** @public */
@@ -103,7 +105,10 @@ export class FeatureCatalogueRegistry {
     }
     const capabilities = this.capabilities;
     return [...this.features.values()]
-      .filter((entry) => capabilities.catalogue[entry.id] !== false)
+      .filter(
+        (entry) =>
+          capabilities.catalogue[entry.id] !== false && (entry.visible ? entry.visible() : true)
+      )
       .sort(compareByKey('title'));
   }
 

src/plugins/home/public/application/components/solutions_section/solution_panel.tsx

@@ -47,6 +47,8 @@ export class ManagementPlugin implements Plugin<ManagementSetup, ManagementStart
 
   private readonly appUpdater = new BehaviorSubject<AppUpdater>(() => ({}));
 
+  private hasAnyEnabledApps = true;
+
   constructor(private initializerContext: PluginInitializerContext) {}
 
   public setup(core: CoreSetup, { home }: ManagementSetupDependencies) {
@@ -65,6 +67,7 @@ export class ManagementPlugin implements Plugin<ManagementSetup, ManagementStart
         path: '/app/management',
         showOnHomePage: false,
         category: FeatureCatalogueCategory.ADMIN,
+        visible: () => this.hasAnyEnabledApps,
       });
     }
 
@@ -96,11 +99,11 @@ export class ManagementPlugin implements Plugin<ManagementSetup, ManagementStart
 
   public start(core: CoreStart) {
     this.managementSections.start({ capabilities: core.application.capabilities });
-    const hasAnyEnabledApps = getSectionsServiceStartPrivate()
+    this.hasAnyEnabledApps = getSectionsServiceStartPrivate()
       .getSectionsEnabled()
       .some((section) => section.getAppsEnabled().length > 0);
 
-    if (!hasAnyEnabledApps) {
+    if (!this.hasAnyEnabledApps) {
       this.appUpdater.next(() => {
         return {
           status: AppStatus.inaccessible,