From 0d22eb80f5a66fc32f44f46ff00e92d9edf40a61 Mon Sep 17 00:00:00 2001
From: Sudheer Salavadi <connect.uxmaster@gmail.com>
Date: Tue, 9 Jul 2024 15:23:23 +0530
Subject: [PATCH] Minor updates in dashboard and cards list views.

---
 .../DashboardList/DashboardList.tsx           | 17 +++++-----
 .../MetricListItem/MetricListItem.tsx         |  2 +-
 .../MetricViewHeader/MetricViewHeader.tsx     |  4 +--
 .../components/MetricsList/ListView.tsx       | 34 ++++++++++---------
 4 files changed, 30 insertions(+), 27 deletions(-)

diff --git a/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx b/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
index 9e5881129..e44b338d5 100644
--- a/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
@@ -34,14 +34,6 @@ function DashboardList({ siteId }: { siteId: string }) {
             sortDirections: ['ascend', 'descend'],
             render: (t) => <div className="link cap-first">{t}</div>,
         },
-        {
-            title: 'Last Modified',
-            dataIndex: 'updatedAt',
-            width: '16.67%',
-            sorter: (a, b) => a.updatedAt.toMillis() - b.updatedAt.toMillis(),
-            sortDirections: ['ascend', 'descend'],
-            render: (date) => checkForRecent(date, 'LLL dd, yyyy, hh:mm a'),
-        },
         {
             title: 'Owner',
             dataIndex: 'owner',
@@ -50,6 +42,15 @@ function DashboardList({ siteId }: { siteId: string }) {
             sortDirections: ['ascend', 'descend'],
             render: (owner) => <div className="cap-first">{owner}</div>,
         },
+        {
+            title: 'Last Modified',
+            dataIndex: 'updatedAt',
+            width: '16.67%',
+            sorter: (a, b) => a.updatedAt.toMillis() - b.updatedAt.toMillis(),
+            sortDirections: ['ascend', 'descend'],
+            render: (date) => checkForRecent(date, 'LLL dd, yyyy, hh:mm a'),
+        },
+        
         {
             title: (
                 <div className={'flex items-center justify-start gap-2'}>
diff --git a/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx b/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
index edcb63a4f..bbb948801 100644
--- a/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
+++ b/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
@@ -28,7 +28,7 @@ function MetricTypeIcon({ type }: any) {
 
   return (
     <Tooltip title={<div className="capitalize">{card.title}</div>}>
-      <Avatar src={card.icon && <Icon name={card.icon} size="16" color="tealx" />} className="bg-tealx-lightest mr-2" />
+      <Avatar src={card.icon && <Icon name={card.icon} size="16" color="tealx" />}  size="small" className="bg-tealx-lightest mr-2" />
     </Tooltip>
   );
 }
diff --git a/frontend/app/components/Dashboard/components/MetricViewHeader/MetricViewHeader.tsx b/frontend/app/components/Dashboard/components/MetricViewHeader/MetricViewHeader.tsx
index b36eb68c9..ac9d69bdd 100644
--- a/frontend/app/components/Dashboard/components/MetricViewHeader/MetricViewHeader.tsx
+++ b/frontend/app/components/Dashboard/components/MetricViewHeader/MetricViewHeader.tsx
@@ -64,7 +64,7 @@ function MetricViewHeader({ siteId }: { siteId: string }) {
                 <div className='flex items-center gap-6'>
                     <ListViewToggler />
 
-                    <Toggler
+                    {/* <Toggler
                         label='My Cards'
                         checked={filter.showMine}
                         name='test'
@@ -72,7 +72,7 @@ function MetricViewHeader({ siteId }: { siteId: string }) {
                         onChange={() =>
                             metricStore.updateKey('filter', { ...filter, showMine: !filter.showMine })
                         }
-                    />
+                    /> */}
                 </div>
 
                 <NewDashboardModal
diff --git a/frontend/app/components/Dashboard/components/MetricsList/ListView.tsx b/frontend/app/components/Dashboard/components/MetricsList/ListView.tsx
index 6cc12a7a3..07ffedd7e 100644
--- a/frontend/app/components/Dashboard/components/MetricsList/ListView.tsx
+++ b/frontend/app/components/Dashboard/components/MetricsList/ListView.tsx
@@ -100,7 +100,6 @@ const ListView: React.FC<Props> = (props: Props) => {
       dataIndex: 'name',
       key: 'title',
       className: 'cap-first',
-      width: '35%',
       sorter: true,
       render: (text: string, metric: Metric) => (
         <MetricListItem
@@ -122,7 +121,7 @@ const ListView: React.FC<Props> = (props: Props) => {
       dataIndex: 'owner',
       key: 'owner',
       className: 'capitalize',
-      width: '25%',
+      width: '30%',
       sorter: true,
       render: (text: string, metric: Metric) => (
         <MetricListItem
@@ -138,6 +137,7 @@ const ListView: React.FC<Props> = (props: Props) => {
       dataIndex: 'lastModified',
       key: 'lastModified',
       sorter: true,
+      width: '16.67%',
       render: (text: string, metric: Metric) => (
         <MetricListItem
           key={metric.metricId}
@@ -147,24 +147,25 @@ const ListView: React.FC<Props> = (props: Props) => {
         />
       )
     },
-    {
-      title: 'Visibility',
-      dataIndex: 'visibility',
-      key: 'visibility',
-      width: '10%',
-      render: (text: string, metric: Metric) => (
-        <MetricListItem
-          key={metric.metricId}
-          metric={metric}
-          siteId={siteId}
-          renderColumn="visibility"
-        />
-      )
-    },
+    // {
+    //   title: 'Visibility',
+    //   dataIndex: 'visibility',
+    //   key: 'visibility',
+    //   width: '10%',
+    //   render: (text: string, metric: Metric) => (
+    //     <MetricListItem
+    //       key={metric.metricId}
+    //       metric={metric}
+    //       siteId={siteId}
+    //       renderColumn="visibility"
+    //     />
+    //   )
+    // },
     {
       title: '',
       key: 'options',
       className: 'text-right',
+      width: '5%',
       render: (text: string, metric: Metric) => (
         <MetricListItem
           key={metric.metricId}
@@ -182,6 +183,7 @@ const ListView: React.FC<Props> = (props: Props) => {
       dataSource={paginatedData}
       rowKey="metricId"
       onChange={handleTableChange}
+      size='middle'
       rowSelection={
         !disableSelection
           ? {