Fix snapshots & linting

kubevirt · Apr 12, 2019 · ff3d7b9 · ff3d7b9
1 parent 447fe88
commit ff3d7b9
Show file tree

Hide file tree

Showing 27 changed files with 116 additions and 86 deletions.
diff --git a/sass/components/Dashboard/dashboard.scss b/sass/components/Dashboard/dashboard.scss
@@ -1,13 +1,14 @@
 .kubevirt-dashboard__body {
-  padding: .75rem;
+  padding: 0.75rem;
   background-color: whitesmoke;
 }
 
 .kubevirt-dashboard__card {
-  margin: .75rem;
-  .card-pf-title {
-    font-size:1rem;
-  }
+  margin: 0.75rem;
+}
+
+.kubevirt-dashboard__card-title {
+  font-size: 1rem;
 }
 
 .kubevirt-dashboard__card-heading {

diff --git a/src/components/ClusterOverview/Alerts/tests/__snapshots__/Alerts.test.js.snap b/src/components/ClusterOverview/Alerts/tests/__snapshots__/Alerts.test.js.snap
@@ -7,7 +7,9 @@ exports[`<Alerts /> renders correctly 1`] = `
   <DashboardCardHeader
     className={null}
   >
-    <DashboardCardTitle>
+    <DashboardCardTitle
+      className={null}
+    >
       Alerts
     </DashboardCardTitle>
   </DashboardCardHeader>

diff --git a/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap b/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Capacity /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Capacity
     </h2>
@@ -100,7 +100,7 @@ exports[`<Capacity /> renders correctly in Loading state 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Capacity
     </h2>

diff --git a/src/components/ClusterOverview/Compliance/tests/__snapshots__/Compliance.test.js.snap b/src/components/ClusterOverview/Compliance/tests/__snapshots__/Compliance.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Compliance /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Compliance
     </h2>

diff --git a/src/components/ClusterOverview/Details/tests/__snapshots__/Details.test.js.snap b/src/components/ClusterOverview/Details/tests/__snapshots__/Details.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Details /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Details
     </h2>

diff --git a/src/components/ClusterOverview/Events/tests/__snapshots__/Events.test.js.snap b/src/components/ClusterOverview/Events/tests/__snapshots__/Events.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Events /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading kubevirt-events__card-header"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Events
     </h2>
@@ -18,7 +18,7 @@ exports[`<Events /> renders correctly 1`] = `
     >
       <span
         aria-hidden="true"
-        class="fa fa-info-circle fa-2x"
+        class="fa fa-info-circle kubevirt-dashboard__icon-sm"
       />
     </button>
   </div>

diff --git a/src/components/ClusterOverview/Health/tests/__snapshots__/Health.test.js.snap b/src/components/ClusterOverview/Health/tests/__snapshots__/Health.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Health /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Health
     </h2>

diff --git a/src/components/ClusterOverview/Health/tests/__snapshots__/HealthBody.test.js.snap b/src/components/ClusterOverview/Health/tests/__snapshots__/HealthBody.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Health /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Health
     </h2>

diff --git a/src/components/ClusterOverview/Inventory/tests/__snapshots__/Inventory.test.js.snap b/src/components/ClusterOverview/Inventory/tests/__snapshots__/Inventory.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Inventory /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster inventory
     </h2>
@@ -18,7 +18,7 @@ exports[`<Inventory /> renders correctly 1`] = `
     >
       <span
         aria-hidden="true"
-        class="fa fa-info-circle fa-2x"
+        class="fa fa-info-circle kubevirt-dashboard__icon-sm"
       />
     </button>
   </div>
@@ -42,7 +42,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"
@@ -84,7 +84,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"
@@ -111,7 +111,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"
@@ -151,7 +151,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"

diff --git a/src/components/ClusterOverview/TopConsumers/tests/__snapshots__/TopConsumers.test.js.snap b/src/components/ClusterOverview/TopConsumers/tests/__snapshots__/TopConsumers.test.js.snap
@@ -8,7 +8,7 @@ exports[`<TopConsumers /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Top Consumers
     </h2>
@@ -18,7 +18,7 @@ exports[`<TopConsumers /> renders correctly 1`] = `
     >
       <span
         aria-hidden="true"
-        class="fa fa-info-circle fa-2x"
+        class="fa fa-info-circle kubevirt-dashboard__icon-sm"
       />
     </button>
   </div>

diff --git a/src/components/ClusterOverview/Utilization/tests/__snapshots__/Utilization.test.js.snap b/src/components/ClusterOverview/Utilization/tests/__snapshots__/Utilization.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Utilization /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Utilization
     </h2>
@@ -119,7 +119,7 @@ exports[`<Utilization /> renders correctly in Loading state 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Utilization
     </h2>

diff --git a/src/components/ClusterOverview/tests/__snapshots__/ClusterOverview.test.js.snap b/src/components/ClusterOverview/tests/__snapshots__/ClusterOverview.test.js.snap
@@ -24,7 +24,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Details
                 </h2>
@@ -83,7 +83,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Cluster inventory
                 </h2>
@@ -93,7 +93,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 >
                   <span
                     aria-hidden="true"
-                    class="fa fa-info-circle fa-2x"
+                    class="fa fa-info-circle kubevirt-dashboard__icon-sm"
                   />
                 </button>
               </div>
@@ -117,7 +117,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -159,7 +159,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -186,7 +186,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -226,7 +226,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -257,7 +257,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading kubevirt-events__card-header"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Cluster Events
                 </h2>
@@ -267,7 +267,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 >
                   <span
                     aria-hidden="true"
-                    class="fa fa-info-circle fa-2x"
+                    class="fa fa-info-circle kubevirt-dashboard__icon-sm"
                   />
                 </button>
               </div>
@@ -295,7 +295,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Top Consumers
                 </h2>
@@ -305,7 +305,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 >
                   <span
                     aria-hidden="true"
-                    class="fa fa-info-circle fa-2x"
+                    class="fa fa-info-circle kubevirt-dashboard__icon-sm"
                   />
                 </button>
               </div>

diff --git a/src/components/Dashboard/DashboardCard/DashboardCardTitle.js b/src/components/Dashboard/DashboardCard/DashboardCardTitle.js
@@ -1,15 +1,22 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import classNames from 'classnames';
 import { CardTitle } from 'patternfly-react';
 
-const DashboardCardTitle = ({ children, ...props }) => <CardTitle {...props}>{children}</CardTitle>;
+const DashboardCardTitle = ({ className, children, ...props }) => (
+  <CardTitle {...props} className={classNames('kubevirt-dashboard__card-title', className)}>
+    {children}
+  </CardTitle>
+);
 
 DashboardCardTitle.defaultProps = {
   children: null,
+  className: null,
 };
 
 DashboardCardTitle.propTypes = {
   children: PropTypes.node,
+  className: PropTypes.string,
 };
 
 export default DashboardCardTitle;
diff --git a/src/components/Dashboard/DashboardCard/tests/__snapshots__/DashboardCardTitle.test.js.snap b/src/components/Dashboard/DashboardCard/tests/__snapshots__/DashboardCardTitle.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`<DashboardCardTitle /> renders correctly 1`] = `
 <CardTitle
-  className=""
+  className="kubevirt-dashboard__card-title"
 >
   content
 </CardTitle>

diff --git a/...omponents/Dashboard/DashboardCard/tests/__snapshots__/DashboardCardTitleHelp.test.js.snap b/...omponents/Dashboard/DashboardCard/tests/__snapshots__/DashboardCardTitleHelp.test.js.snap
@@ -28,8 +28,8 @@ exports[`<DashboardCardTitleHelp /> renders correctly 1`] = `
     disabled={false}
   >
     <Icon
+      className="kubevirt-dashboard__icon-sm"
       name="info-circle"
-      size="2x"
       type="fa"
     />
   </Button>

diff --git a/src/components/Dashboard/Inventory/InventoryItemStatus.js b/src/components/Dashboard/Inventory/InventoryItemStatus.js
@@ -8,7 +8,11 @@ const StatusPropTypes = {
 
 const OkStatus = ({ count }) => (
   <div className="kubevirt-inventory__row-status-item">
-    <Icon type="fa" name="check-circle" className="kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm" />
+    <Icon
+      type="fa"
+      name="check-circle"
+      className="kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
+    />
     <span className="kubevirt-inventory__row-status-item-text">{count}</span>
   </div>
 );
@@ -17,7 +21,11 @@ OkStatus.propTypes = StatusPropTypes;
 
 const WarnStatus = ({ count }) => (
   <div className="kubevirt-inventory__row-status-item">
-    <Icon type="fa" name="exclamation-triangle" className="kubevirt-inventory__row-status-item-icon--warn kubevirt-dashboard__icon-sm" />
+    <Icon
+      type="fa"
+      name="exclamation-triangle"
+      className="kubevirt-inventory__row-status-item-icon--warn kubevirt-dashboard__icon-sm"
+    />
     <span className="kubevirt-inventory__row-status-item-text">{count}</span>
   </div>
 );
@@ -26,7 +34,11 @@ WarnStatus.propTypes = StatusPropTypes;
 
 const ErrorStatus = ({ count }) => (
   <div className="kubevirt-inventory__row-status-item">
-    <Icon type="fa" name="exclamation-circle" className="kubevirt-inventory__row-status-item-icon--error kubevirt-dashboard__icon-sm" />
+    <Icon
+      type="fa"
+      name="exclamation-circle"
+      className="kubevirt-inventory__row-status-item-icon--error kubevirt-dashboard__icon-sm"
+    />
     <span className="kubevirt-inventory__row-status-item-text">{count}</span>
   </div>
 );
@@ -35,7 +47,11 @@ ErrorStatus.propTypes = StatusPropTypes;
 
 const InProgressStatus = ({ count }) => (
   <div className="kubevirt-inventory__row-status-item">
-    <Icon type="pf" name="in-progress" className="kubevirt-inventory__row-status-item-icon--in-progress kubevirt-dashboard__icon-s" />
+    <Icon
+      type="pf"
+      name="in-progress"
+      className="kubevirt-inventory__row-status-item-icon--in-progress kubevirt-dashboard__icon-sm"
+    />
     <span className="kubevirt-inventory__row-status-item-text">{count}</span>
   </div>
 );