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
diff --git a/tests/unit/__snapshots__/AppNavigation.spec.js.snap b/tests/unit/__snapshots__/AppNavigation.spec.js.snap
index f97a1fc..04410ca 100644
--- a/tests/unit/__snapshots__/AppNavigation.spec.js.snap
+++ b/tests/unit/__snapshots__/AppNavigation.spec.js.snap
@@ -32,10 +32,10 @@
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 @@
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 @@
>
<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 @@
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 @@
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 @@
>
<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"
>