chore: 🤖 add "no items" messaging when sets are empty

addons/rose/addon/styles/rose/components/layout/_centered.scss

@@ -3,4 +3,5 @@
 .rose-layout-centered {
   display: flex;
   justify-content: center;
+  padding: sizing.rems(xl) 0;
 }

ui/core/app/templates/orgs/org/projects/index.hbs

@@ -13,17 +13,37 @@
   </page.actions>
 
   <page.body>
-    <Rose::Cards as |cards|>
-      {{#each @model as |project|}}
-        <cards.link
-          @title={{project.name}}
-          @subtitle={{project.id}}
-          @description={{project.description}}
-          @route="orgs.org.projects.project"
-          @model={{project}}
-        />
-      {{/each}}
-    </Rose::Cards>
+
+    {{#if @model}}
+
+      <Rose::Cards as |cards|>
+        {{#each @model as |project|}}
+          <cards.link
+            @title={{project.name}}
+            @subtitle={{project.id}}
+            @description={{project.description}}
+            @route="orgs.org.projects.project"
+            @model={{project}}
+          />
+        {{/each}}
+      </Rose::Cards>
+
+    {{else}}
+
+      <Rose::Layout::Centered>
+        <Rose::Message @title={{t 'titles.empty-set'}} as |message|>
+          <message.description>
+            {{t 'descriptions.empty-set'}}
+          </message.description>
+          <message.link @route="orgs.org.projects.new">
+            <Rose::Icon @name="plus-circle-outline" />
+            {{t 'titles.new'}}
+          </message.link>
+        </Rose::Message>
+      </Rose::Layout::Centered>
+
+    {{/if}}
+
   </page.body>
 
 </Rose::Layout::Page>

ui/core/app/templates/orgs/org/projects/project/host-catalogs/index.hbs

@@ -6,6 +6,7 @@
 
   <page.header>
     <h2>{{t 'resources.host-catalogs'}}</h2>
+    <p>{{t 'descriptions.host-catalogs'}}</p>
   </page.header>
 
   <page.actions>
@@ -17,33 +18,51 @@
   </page.actions>
 
   <page.body>
-    <p>{{t 'descriptions.host-catalogs'}}</p>
 
-    <Rose::Table as |table|>
-      <table.header as |header|>
-        <header.row as |row|>
-          <row.cell>{{t 'form.label.name'}}</row.cell>
-          <row.cell>{{t 'form.label.type'}}</row.cell>
-          <row.cell>{{t 'form.label.description'}}</row.cell>
-        </header.row>
-      </table.header>
-      <table.body as |body|>
-        {{#each @model as |hostCatalog|}}
-          <body.row as |row|>
-            <row.cell>
-              <LinkTo
-                @route="orgs.org.projects.project.host-catalogs.host-catalog"
-                @model={{hostCatalog}}
-              >
-                {{hostCatalog.name}}
-              </LinkTo>
-            </row.cell>
-            <row.cell>{{hostCatalog.type}}</row.cell>
-            <row.cell>{{hostCatalog.description}}</row.cell>
-          </body.row>
-        {{/each}}
-      </table.body>
-    </Rose::Table>
+    {{#if @model}}
+
+      <Rose::Table as |table|>
+        <table.header as |header|>
+          <header.row as |row|>
+            <row.cell>{{t 'form.label.name'}}</row.cell>
+            <row.cell>{{t 'form.label.type'}}</row.cell>
+            <row.cell>{{t 'form.label.description'}}</row.cell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model as |hostCatalog|}}
+            <body.row as |row|>
+              <row.cell>
+                <LinkTo
+                  @route="orgs.org.projects.project.host-catalogs.host-catalog"
+                  @model={{hostCatalog}}
+                >
+                  {{hostCatalog.name}}
+                </LinkTo>
+              </row.cell>
+              <row.cell>{{hostCatalog.type}}</row.cell>
+              <row.cell>{{hostCatalog.description}}</row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+
+    {{else}}
+
+      <Rose::Layout::Centered>
+        <Rose::Message @title={{t 'titles.empty-set'}} as |message|>
+          <message.description>
+            {{t 'descriptions.empty-set'}}
+          </message.description>
+          <message.link @route="orgs.org.projects.project.host-catalogs.new">
+            <Rose::Icon @name="plus-circle-outline" />
+            {{t 'titles.new'}}
+          </message.link>
+        </Rose::Message>
+      </Rose::Layout::Centered>
+      
+    {{/if}}
+
   </page.body>
 
 </Rose::Layout::Page>

ui/core/translations/en-us.yaml

@@ -12,8 +12,10 @@ titles:
   new: New
   overview: Overview
   settings: Settings
+  empty-set: No Items Yet
 descriptions:
   host-catalogs: Overview of collections of hosts and host sets.
+  empty-set: There are no items to display yet.  You may be able to add items or try back later.
 states:
   info: Info
   success: Success