Merge pull request #14940 from estherannorzie/master

Home: Update starred entities' default message to and provide optional prop to override it

plugins/home/src/homePageComponents/StarredEntities/Content.test.tsx

@@ -82,4 +82,62 @@ describe('StarredEntitiesContent', () => {
       '/catalog/default/component/mock-starred-entity-2',
     );
   });
+
+  it('should display call to action message if no entities are starred', async () => {
+    const mockedApi = new MockStarredEntitiesApi();
+
+    const mockCatalogApi = {
+      getEntities: jest
+        .fn()
+        .mockImplementation(async () => ({ items: entities })),
+    };
+
+    const { getByText } = await renderInTestApp(
+      <TestApiProvider
+        apis={[
+          [catalogApiRef, mockCatalogApi],
+          [starredEntitiesApiRef, mockedApi],
+        ]}
+      >
+        <Content />
+      </TestApiProvider>,
+      {
+        mountedRoutes: {
+          '/catalog/:namespace/:kind/:name': entityRouteRef,
+        },
+      },
+    );
+
+    expect(
+      getByText('Click the star beside an entity name to add it to this list!'),
+    ).toBeInTheDocument();
+  });
+
+  it('should display user provided message if no entities are starred', async () => {
+    const mockedApi = new MockStarredEntitiesApi();
+
+    const mockCatalogApi = {
+      getEntities: jest
+        .fn()
+        .mockImplementation(async () => ({ items: entities })),
+    };
+
+    const { getByText } = await renderInTestApp(
+      <TestApiProvider
+        apis={[
+          [catalogApiRef, mockCatalogApi],
+          [starredEntitiesApiRef, mockedApi],
+        ]}
+      >
+        <Content noStarredEntitiesMessage="foo" />
+      </TestApiProvider>,
+      {
+        mountedRoutes: {
+          '/catalog/:namespace/:kind/:name': entityRouteRef,
+        },
+      },
+    );
+
+    expect(getByText('foo')).toBeInTheDocument();
+  });
 });

plugins/home/src/homePageComponents/StarredEntities/Content.tsx

@@ -41,7 +41,10 @@ import useAsync from 'react-use/lib/useAsync';
  *
  * @public
  */
-export const Content = () => {
+
+export const Content = (props: {
+  noStarredEntitiesMessage?: React.ReactNode | undefined;
+}) => {
   const catalogApi = useApi(catalogApiRef);
   const catalogEntityRoute = useRouteRef(entityRouteRef);
   const { starredEntities, toggleStarredEntity } = useStarredEntities();
@@ -76,7 +79,8 @@ export const Content = () => {
   if (starredEntities.size === 0)
     return (
       <Typography variant="body1">
-        You do not have any starred entities yet!
+        {props.noStarredEntitiesMessage ||
+          'Click the star beside an entity name to add it to this list!'}
       </Typography>
     );