fix(primevue): primevue styling for data table hover effect (#174)

* table hover styling and refactor

* message icon

* removed unused style

* fix hover color

style-sheets/primevue-components-overrides.scss

@@ -501,23 +501,28 @@ label {
 }
 
 .#{variables.$primevue-prefix}-datatable
-    .#{variables.$primevue-prefix}-datatable-tbody
-    > tr
-    > td {
-    @extend %body-compact-01;
-    height: 3rem;
-    text-align: left;
-    box-shadow: 0 0.0625rem 0 0
-        map.get(lightTheme.$light-theme, 'border-subtle-01') inset;
-    padding: 0 1rem;
-    border: none;
+    .#{variables.$primevue-prefix}-datatable-tbody {
+    > tr > td {
+        @extend %body-compact-01;
+        height: 3rem;
+        text-align: left;
+        padding: 0 1rem;
+        border: none;
+    }
+}
+
+.#{variables.$primevue-prefix}-datatable
+    .#{variables.$primevue-prefix}-datatable-tbody {
+    > tr {
+        box-shadow: inset 0 0 0 0.031rem
+            map-get(lightTheme.$light-theme, 'border-subtle-01');
+    }
 }
 
 .#{variables.$primevue-prefix}-datatable
     .#{variables.$primevue-prefix}-datatable-tbody
-    > tr
-    > td {
-    box-shadow: 0 -0.0625rem 0 0 #dfdfe1 inset;
+    > tr:hover {
+    background-color: map.get(lightTheme.$light-theme, 'layer-hover-01');
 }
 
 .#{variables.$primevue-prefix}-sortable-column-icon {
@@ -884,6 +889,7 @@ label {
     }
 }
 
+
 /* ------------------------------------ Sidebar --------------------------------- */
 
 .#{variables.$primevue-prefix}-sidebar-left