IA update: Add logs and update overview icon

This is the first patchset of the information architecture changes.
These changes are the result of several months of design research with
users to improve the existing information architecture (IA). More
information can we found in the Github story.

This patchset will add a Logs section and move event logs and dumps from
the Health section to the new Logs section. It will also update the icon
used for the Overview page.

Github story: https://github.com/openbmc/webui-vue/issues/56

Testing:
1. IBM build:
  - Logs contained Event logs and dumps
  - Both pages rendered when clicking link
2. Intel build
  - Logs contained Event logs only
  - Logs page rendered when clicking link
3. Tested default build
  - Logs contained Event logs only
  - Logs page rendered when clicking link

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I4621837202cf5ad3469d6ea460d9a5bdc79c8816

21 files changed, 220 insertions, 54 deletions

diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index f7989d2ee..df6acbf71 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -49,7 +49,7 @@
         <!-- Right aligned nav items -->
         <b-navbar-nav class="ml-auto helper-menu">
           <b-nav-item
-            to="/health/event-logs"
+            to="/logs/event-logs"
             data-test-id="appHeader-container-health"
           >
             <status-icon :status="healthStatusIcon" />
diff --git a/src/components/AppNavigation/AppNavigationMixin.js b/src/components/AppNavigation/AppNavigationMixin.js
index f9ba0776d..42552da5f 100644
--- a/src/components/AppNavigation/AppNavigationMixin.js
+++ b/src/components/AppNavigation/AppNavigationMixin.js
@@ -1,4 +1,5 @@
-import IconAnalytics from '@carbon/icons-vue/es/analytics/16';
+import IconDashboard from '@carbon/icons-vue/es/dashboard/16';
+import IconTextLinkAnalysis from '@carbon/icons-vue/es/text-link--analysis/16';
 import IconDataCheck from '@carbon/icons-vue/es/data--check/16';
 import IconSettingsAdjust from '@carbon/icons-vue/es/settings--adjust/16';
 import IconSettings from '@carbon/icons-vue/es/settings/16';
@@ -7,7 +8,8 @@ import IconChevronUp from '@carbon/icons-vue/es/chevron--up/16';
 
 const AppNavigationMixin = {
   components: {
-    iconOverview: IconAnalytics,
+    iconOverview: IconDashboard,
+    iconLogs: IconTextLinkAnalysis,
     iconHealth: IconDataCheck,
     iconControl: IconSettingsAdjust,
     iconConfiguration: IconSettings,
@@ -24,15 +26,22 @@ const AppNavigationMixin = {
           icon: 'iconOverview',
         },
         {
-          id: 'health',
-          label: this.$t('appNavigation.health'),
-          icon: 'iconHealth',
+          id: 'logs',
+          label: this.$t('appNavigation.logs'),
+          icon: 'iconLogs',
           children: [
             {
               id: 'event-logs',
               label: this.$t('appNavigation.eventLogs'),
-              route: '/health/event-logs',
+              route: '/logs/event-logs',
             },
+          ],
+        },
+        {
+          id: 'health',
+          label: this.$t('appNavigation.health'),
+          icon: 'iconHealth',
+          children: [
             {
               id: 'hardware-status',
               label: this.$t('appNavigation.hardwareStatus'),
diff --git a/src/env/components/AppNavigation/ibm.js b/src/env/components/AppNavigation/ibm.js
index b8186a44c..8792ccc8f 100644
--- a/src/env/components/AppNavigation/ibm.js
+++ b/src/env/components/AppNavigation/ibm.js
@@ -1,4 +1,5 @@
-import IconAnalytics from '@carbon/icons-vue/es/analytics/16';
+import IconDashboard from '@carbon/icons-vue/es/dashboard/16';
+import IconTextLinkAnalysis from '@carbon/icons-vue/es/text-link--analysis/16';
 import IconDataCheck from '@carbon/icons-vue/es/data--check/16';
 import IconSettingsAdjust from '@carbon/icons-vue/es/settings--adjust/16';
 import IconSettings from '@carbon/icons-vue/es/settings/16';
@@ -7,7 +8,8 @@ import IconChevronUp from '@carbon/icons-vue/es/chevron--up/16';
 
 const AppNavigationMixin = {
   components: {
-    iconOverview: IconAnalytics,
+    iconOverview: IconDashboard,
+    iconLogs: IconTextLinkAnalysis,
     iconHealth: IconDataCheck,
     iconControl: IconSettingsAdjust,
     iconConfiguration: IconSettings,
@@ -24,20 +26,27 @@ const AppNavigationMixin = {
           icon: 'iconOverview',
         },
         {
-          id: 'health',
-          label: this.$t('appNavigation.health'),
-          icon: 'iconHealth',
+          id: 'logs',
+          label: this.$t('appNavigation.logs'),
+          icon: 'iconLogs',
           children: [
             {
               id: 'dumps',
               label: this.$t('appNavigation.dumps'),
-              route: '/health/dumps',
+              route: '/logs/dumps',
             },
             {
               id: 'event-logs',
               label: this.$t('appNavigation.eventLogs'),
-              route: '/health/event-logs',
+              route: '/logs/event-logs',
             },
+          ],
+        },
+        {
+          id: 'health',
+          label: this.$t('appNavigation.health'),
+          icon: 'iconHealth',
+          children: [
             {
               id: 'hardware-status',
               label: this.$t('appNavigation.hardwareStatus'),
diff --git a/src/env/components/AppNavigation/intel.js b/src/env/components/AppNavigation/intel.js
index 7144487be..9c3591f5c 100644
--- a/src/env/components/AppNavigation/intel.js
+++ b/src/env/components/AppNavigation/intel.js
@@ -1,4 +1,5 @@
-import IconAnalytics from '@carbon/icons-vue/es/analytics/16';
+import IconDashboard from '@carbon/icons-vue/es/dashboard/16';
+import IconTextLinkAnalysis from '@carbon/icons-vue/es/text-link--analysis/16';
 import IconDataCheck from '@carbon/icons-vue/es/data--check/16';
 import IconSettingsAdjust from '@carbon/icons-vue/es/settings--adjust/16';
 import IconSettings from '@carbon/icons-vue/es/settings/16';
@@ -7,7 +8,8 @@ import IconChevronUp from '@carbon/icons-vue/es/chevron--up/16';
 
 const AppNavigationMixin = {
   components: {
-    iconOverview: IconAnalytics,
+    iconOverview: IconDashboard,
+    iconLogs: IconTextLinkAnalysis,
     iconHealth: IconDataCheck,
     iconControl: IconSettingsAdjust,
     iconConfiguration: IconSettings,
@@ -24,15 +26,22 @@ const AppNavigationMixin = {
           icon: 'iconOverview',
         },
         {
-          id: 'health',
-          label: this.$t('appNavigation.health'),
-          icon: 'iconHealth',
+          id: 'logs',
+          label: this.$t('appNavigation.logs'),
+          icon: 'iconLogs',
           children: [
             {
               id: 'event-logs',
               label: this.$t('appNavigation.eventLogs'),
-              route: '/health/event-logs',
+              route: '/logs/event-logs',
             },
+          ],
+        },
+        {
+          id: 'health',
+          label: this.$t('appNavigation.health'),
+          icon: 'iconHealth',
+          children: [
             {
               id: 'hardware-status',
               label: this.$t('appNavigation.hardwareStatus'),
diff --git a/src/env/router/ibm.js b/src/env/router/ibm.js
index 91b70a70f..8b94cf78a 100644
--- a/src/env/router/ibm.js
+++ b/src/env/router/ibm.js
@@ -3,7 +3,7 @@ import ChangePassword from '@/views/ChangePassword';
 import ClientSessions from '@/views/AccessControl/ClientSessions';
 import ConsoleLayout from '@/layouts/ConsoleLayout.vue';
 import DateTimeSettings from '@/views/Configuration/DateTimeSettings';
-import EventLogs from '@/views/Health/EventLogs';
+import EventLogs from '@/views/Logs/EventLogs';
 import FactoryReset from '@/views/Control/FactoryReset';
 import Firmware from '@/views/Configuration/Firmware';
 import HardwareStatus from '@/views/Health/HardwareStatus';
@@ -29,7 +29,7 @@ import SslCertificates from '@/views/AccessControl/SslCertificates';
 import i18n from '@/i18n';
 
 // Custom components
-import Dumps from '@/views/Health/Dumps';
+import Dumps from '@/views/Logs/Dumps';
 
 const routes = [
   {
@@ -96,7 +96,7 @@ const routes = [
         },
       },
       {
-        path: '/health/dumps',
+        path: '/logs/dumps',
         name: 'dumps',
         component: Dumps,
         meta: {
@@ -104,7 +104,7 @@ const routes = [
         },
       },
       {
-        path: '/health/event-logs',
+        path: '/logs/event-logs',
         name: 'event-logs',
         component: EventLogs,
         meta: {
diff --git a/src/env/router/intel.js b/src/env/router/intel.js
index 53f6154e8..3e3349d00 100644
--- a/src/env/router/intel.js
+++ b/src/env/router/intel.js
@@ -3,7 +3,7 @@ import ChangePassword from '@/views/ChangePassword';
 import ClientSessions from '@/views/AccessControl/ClientSessions';
 import ConsoleLayout from '@/layouts/ConsoleLayout.vue';
 import DateTimeSettings from '@/views/Configuration/DateTimeSettings';
-import EventLogs from '@/views/Health/EventLogs';
+import EventLogs from '@/views/Logs/EventLogs';
 import Firmware from '@/views/Configuration/Firmware';
 import HardwareStatus from '@/views/Health/HardwareStatus';
 import Kvm from '@/views/Control/Kvm';
@@ -100,7 +100,7 @@ const routes = [
         },
       },
       {
-        path: '/health/event-logs',
+        path: '/logs/event-logs',
         name: 'event-logs',
         component: EventLogs,
         meta: {
diff --git a/src/env/store/ibm.js b/src/env/store/ibm.js
index ff20b9cf0..787f89755 100644
--- a/src/env/store/ibm.js
+++ b/src/env/store/ibm.js
@@ -1,5 +1,5 @@
 import store from '@/store';
-import DumpsStore from '@/store/modules/Health/DumpsStore';
+import DumpsStore from '@/store/modules/Logs/DumpsStore';
 
 store.unregisterModule('virtualMedia');
 
diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index eccd302a2..a5fd82024 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -111,6 +111,7 @@
     "health": "Health",
     "kvm": "@:appPageTitle.kvm",
     "ldap": "@:appPageTitle.ldap",
+    "logs": "Logs",
     "localUserManagement": "@:appPageTitle.localUserManagement",
     "managePowerUsage": "@:appPageTitle.managePowerUsage",
     "networkSettings": "@:appPageTitle.networkSettings",
diff --git a/src/router/routes.js b/src/router/routes.js
index 7501073a3..1c5d57b12 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -2,7 +2,7 @@ import AppLayout from '@/layouts/AppLayout.vue';
 import ChangePassword from '@/views/ChangePassword';
 import ConsoleLayout from '@/layouts/ConsoleLayout.vue';
 import DateTimeSettings from '@/views/Configuration/DateTimeSettings';
-import EventLogs from '@/views/Health/EventLogs';
+import EventLogs from '@/views/Logs/EventLogs';
 import FactoryReset from '@/views/Control/FactoryReset';
 import Firmware from '@/views/Configuration/Firmware';
 import HardwareStatus from '@/views/Health/HardwareStatus';
@@ -104,7 +104,7 @@ const routes = [
         },
       },
       {
-        path: '/health/event-logs',
+        path: '/logs/event-logs',
         name: 'event-logs',
         component: EventLogs,
         meta: {
diff --git a/src/store/index.js b/src/store/index.js
index 29dfe4fc8..5aba4663b 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -13,7 +13,7 @@ import ControlStore from './modules/Control/ControlStore';
 import PowerControlStore from './modules/Control/PowerControlStore';
 import PowerPolicyStore from './modules/Control/PowerPolicyStore';
 import NetworkSettingStore from './modules/Configuration/NetworkSettingsStore';
-import EventLogStore from './modules/Health/EventLogStore';
+import EventLogStore from './modules/Logs/EventLogStore';
 import SensorsStore from './modules/Health/SensorsStore';
 import ServerLedStore from './modules/Control/ServerLedStore';
 import SystemStore from './modules/Health/SystemStore';
diff --git a/src/store/modules/Health/DumpsStore.js b/src/store/modules/Logs/DumpsStore.js
index 3b91354bc..3b91354bc 100644
--- a/src/store/modules/Health/DumpsStore.js
+++ b/src/store/modules/Logs/DumpsStore.js
diff --git a/src/store/modules/Health/EventLogStore.js b/src/store/modules/Logs/EventLogStore.js
index c9bd82fd3..c9bd82fd3 100644
--- a/src/store/modules/Health/EventLogStore.js
+++ b/src/store/modules/Logs/EventLogStore.js
diff --git a/src/views/Health/Dumps/Dumps.vue b/src/views/Logs/Dumps/Dumps.vue
index 4538b3050..4538b3050 100644
--- a/src/views/Health/Dumps/Dumps.vue
+++ b/src/views/Logs/Dumps/Dumps.vue
diff --git a/src/views/Health/Dumps/DumpsForm.vue b/src/views/Logs/Dumps/DumpsForm.vue
index 02ec18642..02ec18642 100644
--- a/src/views/Health/Dumps/DumpsForm.vue
+++ b/src/views/Logs/Dumps/DumpsForm.vue
diff --git a/src/views/Health/Dumps/DumpsModalConfirmation.vue b/src/views/Logs/Dumps/DumpsModalConfirmation.vue
index f8e20cfd5..f8e20cfd5 100644
--- a/src/views/Health/Dumps/DumpsModalConfirmation.vue
+++ b/src/views/Logs/Dumps/DumpsModalConfirmation.vue
diff --git a/src/views/Health/Dumps/index.js b/src/views/Logs/Dumps/index.js
index 65525fb06..65525fb06 100644
--- a/src/views/Health/Dumps/index.js
+++ b/src/views/Logs/Dumps/index.js
diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Logs/EventLogs/EventLogs.vue
index fa3f43cbd..fa3f43cbd 100644
--- a/src/views/Health/EventLogs/EventLogs.vue
+++ b/src/views/Logs/EventLogs/EventLogs.vue
diff --git a/src/views/Health/EventLogs/index.js b/src/views/Logs/EventLogs/index.js
index 521efde4a..521efde4a 100644
--- a/src/views/Health/EventLogs/index.js
+++ b/src/views/Logs/EventLogs/index.js
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index 885db07c8..b8f876ac4 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -2,7 +2,7 @@
   <div>
     <b-button
       variant="link"
-      to="/health/event-logs"
+      to="/logs/event-logs"
       data-test-id="overviewEvents-button-eventLogs"
       class="float-md-right"
     >
diff --git a/tests/unit/__snapshots__/AppHeader.spec.js.snap b/tests/unit/__snapshots__/AppHeader.spec.js.snap
index 02d99b16c..b472bcbc3 100644
--- a/tests/unit/__snapshots__/AppHeader.spec.js.snap
+++ b/tests/unit/__snapshots__/AppHeader.spec.js.snap
@@ -68,7 +68,7 @@ exports[`AppHeader.vue should render correctly 1`] = `
       >
         <b-nav-item
           data-test-id="appHeader-container-health"
-          to="/health/event-logs"
+          to="/logs/event-logs"
         >
           <span
             class="status-icon secondary"
diff --git a/tests/unit/__snapshots__/AppNavigation.spec.js.snap b/tests/unit/__snapshots__/AppNavigation.spec.js.snap
index f97a1fc0b..04410ca9d 100644
--- a/tests/unit/__snapshots__/AppNavigation.spec.js.snap
+++ b/tests/unit/__snapshots__/AppNavigation.spec.js.snap
@@ -32,10 +32,10 @@ exports[`AppNavigation.vue should render correctly 1`] = `
               xmlns="http://www.w3.org/2000/svg"
             >
               <path
-                d="M4,2H2V28a2,2,0,0,0,2,2H30V28H4Z"
+                d="M24 21H26V26H24zM20 16H22V26H20zM11 26a5.0059 5.0059 0 01-5-5H8a3 3 0 103-3V16a5 5 0 010 10z"
               />
               <path
-                d="M30,9H23v2h3.59L19,18.59l-4.29-4.3a1,1,0,0,0-1.42,0L6,21.59,7.41,23,14,16.41l4.29,4.3a1,1,0,0,0,1.42,0L28,12.41V16h2Z"
+                d="M28,2H4A2.002,2.002,0,0,0,2,4V28a2.0023,2.0023,0,0,0,2,2H28a2.0027,2.0027,0,0,0,2-2V4A2.0023,2.0023,0,0,0,28,2Zm0,9H14V4H28ZM12,4v7H4V4ZM4,28V13H28.0007l.0013,15Z"
               />
             </svg>
             
@@ -47,6 +47,84 @@ exports[`AppNavigation.vue should render correctly 1`] = `
           class="nav-item"
         >
           <button
+            aria-controls="logs"
+            aria-expanded="false"
+            class="btn btn-link collapsed"
+            data-test-id="nav-button-logs"
+            type="button"
+          >
+            <svg
+              aria-hidden="true"
+              fill="currentColor"
+              focusable="false"
+              height="16"
+              preserveAspectRatio="xMidYMid meet"
+              viewBox="0 0 32 32"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M8 10H16V12H8zM8 6H20V8H8zM8 2H20V4H8z"
+              />
+              <path
+                d="M4.7111,28l5.6312-9.9961,7.4341,6.49A2,2,0,0,0,20.86,23.96l6.9707-10.4034-1.6622-1.1132-7,10.4472-.07.1035-7.4345-6.4907a2.0032,2.0032,0,0,0-3.0806.5308L4,25.1826V2H2V28a2.0023,2.0023,0,0,0,2,2H30V28Z"
+              />
+            </svg>
+            
+              appNavigation.logs
+              
+            <svg
+              aria-hidden="true"
+              class="icon-expand"
+              fill="currentColor"
+              focusable="false"
+              height="16"
+              preserveAspectRatio="xMidYMid meet"
+              viewBox="0 0 16 16"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M8 5L13 10 12.3 10.7 8 6.4 3.7 10.7 3 10z"
+              />
+            </svg>
+          </button>
+           
+          <transition-stub
+            class="nav-item__nav"
+            css="true"
+            enteractiveclass="collapsing"
+            enterclass=""
+            entertoclass="collapse show"
+            leaveactiveclass="collapsing"
+            leaveclass="collapse show"
+            leavetoclass="collapse"
+          >
+            <ul
+              class="collapse"
+              id="logs"
+              style="display: none;"
+            >
+              <li
+                class="nav-item"
+              >
+                <a
+                  class="nav-link"
+                  data-test-id="nav-item-event-logs"
+                  href="#/logs/event-logs"
+                >
+                  
+                  appNavigation.eventLogs
+                
+                </a>
+              </li>
+            </ul>
+          </transition-stub>
+        </li>
+        <li
+          class="nav-item"
+        >
+          <button
             aria-controls="health"
             aria-expanded="false"
             class="btn btn-link collapsed"
@@ -125,15 +203,6 @@ exports[`AppNavigation.vue should render correctly 1`] = `
               >
                 <a
                   class="nav-link"
-                  data-test-id="nav-item-event-logs"
-                  href="#/health/event-logs"
-                >
-                  
-                  appNavigation.eventLogs
-                
-                </a>
-                <a
-                  class="nav-link"
                   data-test-id="nav-item-hardware-status"
                   href="#/health/hardware-status"
                 >
@@ -575,10 +644,10 @@ exports[`AppNavigation.vue should render with nav-container open 1`] = `
               xmlns="http://www.w3.org/2000/svg"
             >
               <path
-                d="M4,2H2V28a2,2,0,0,0,2,2H30V28H4Z"
+                d="M24 21H26V26H24zM20 16H22V26H20zM11 26a5.0059 5.0059 0 01-5-5H8a3 3 0 103-3V16a5 5 0 010 10z"
               />
               <path
-                d="M30,9H23v2h3.59L19,18.59l-4.29-4.3a1,1,0,0,0-1.42,0L6,21.59,7.41,23,14,16.41l4.29,4.3a1,1,0,0,0,1.42,0L28,12.41V16h2Z"
+                d="M28,2H4A2.002,2.002,0,0,0,2,4V28a2.0023,2.0023,0,0,0,2,2H28a2.0027,2.0027,0,0,0,2-2V4A2.0023,2.0023,0,0,0,28,2Zm0,9H14V4H28ZM12,4v7H4V4ZM4,28V13H28.0007l.0013,15Z"
               />
             </svg>
             
@@ -590,6 +659,84 @@ exports[`AppNavigation.vue should render with nav-container open 1`] = `
           class="nav-item"
         >
           <button
+            aria-controls="logs"
+            aria-expanded="false"
+            class="btn btn-link collapsed"
+            data-test-id="nav-button-logs"
+            type="button"
+          >
+            <svg
+              aria-hidden="true"
+              fill="currentColor"
+              focusable="false"
+              height="16"
+              preserveAspectRatio="xMidYMid meet"
+              viewBox="0 0 32 32"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M8 10H16V12H8zM8 6H20V8H8zM8 2H20V4H8z"
+              />
+              <path
+                d="M4.7111,28l5.6312-9.9961,7.4341,6.49A2,2,0,0,0,20.86,23.96l6.9707-10.4034-1.6622-1.1132-7,10.4472-.07.1035-7.4345-6.4907a2.0032,2.0032,0,0,0-3.0806.5308L4,25.1826V2H2V28a2.0023,2.0023,0,0,0,2,2H30V28Z"
+              />
+            </svg>
+            
+              appNavigation.logs
+              
+            <svg
+              aria-hidden="true"
+              class="icon-expand"
+              fill="currentColor"
+              focusable="false"
+              height="16"
+              preserveAspectRatio="xMidYMid meet"
+              viewBox="0 0 16 16"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M8 5L13 10 12.3 10.7 8 6.4 3.7 10.7 3 10z"
+              />
+            </svg>
+          </button>
+           
+          <transition-stub
+            class="nav-item__nav"
+            css="true"
+            enteractiveclass="collapsing"
+            enterclass=""
+            entertoclass="collapse show"
+            leaveactiveclass="collapsing"
+            leaveclass="collapse show"
+            leavetoclass="collapse"
+          >
+            <ul
+              class="collapse"
+              id="logs"
+              style="display: none;"
+            >
+              <li
+                class="nav-item"
+              >
+                <a
+                  class="nav-link"
+                  data-test-id="nav-item-event-logs"
+                  href="#/logs/event-logs"
+                >
+                  
+                  appNavigation.eventLogs
+                
+                </a>
+              </li>
+            </ul>
+          </transition-stub>
+        </li>
+        <li
+          class="nav-item"
+        >
+          <button
             aria-controls="health"
             aria-expanded="false"
             class="btn btn-link collapsed"
@@ -668,15 +815,6 @@ exports[`AppNavigation.vue should render with nav-container open 1`] = `
               >
                 <a
                   class="nav-link"
-                  data-test-id="nav-item-event-logs"
-                  href="#/health/event-logs"
-                >
-                  
-                  appNavigation.eventLogs
-                
-                </a>
-                <a
-                  class="nav-link"
                   data-test-id="nav-item-hardware-status"
                   href="#/health/hardware-status"
                 >