From a9819589403a3a1114167f594a096a1d8fa6a918 Mon Sep 17 00:00:00 2001
From: sylenien <nikita@openreplay.com>
Date: Wed, 10 Aug 2022 16:48:59 +0200
Subject: [PATCH] fix(ui): minor style fixes

---
 frontend/app/components/Dashboard/NewDashboard.tsx         | 7 -------
 .../Dashboard/components/DashboardList/DashboardList.tsx   | 2 +-
 .../components/DashboardList/DashboardListItem.tsx         | 2 +-
 .../Dashboard/components/DashboardList/DashboardsView.tsx  | 4 ++--
 .../Dashboard/components/MetricListItem/MetricListItem.tsx | 6 +-----
 .../Dashboard/components/MetricsList/MetricsList.tsx       | 2 +-
 .../Dashboard/components/MetricsView/MetricsView.tsx       | 4 ++--
 7 files changed, 8 insertions(+), 19 deletions(-)

diff --git a/frontend/app/components/Dashboard/NewDashboard.tsx b/frontend/app/components/Dashboard/NewDashboard.tsx
index af0e1ed88..2f9496591 100644
--- a/frontend/app/components/Dashboard/NewDashboard.tsx
+++ b/frontend/app/components/Dashboard/NewDashboard.tsx
@@ -29,13 +29,6 @@ function NewDashboard(props: RouteComponentProps<RouterProps>) {
                 dashboardStore.selectDashboardById(dashboardId);
             }
         });
-        if (!dashboardId && location.pathname.includes('dashboard')) {
-            dashboardStore.selectDefaultDashboard().then(({ dashboardId }) => {
-                props.history.push(withSiteId(`/dashboard/${dashboardId}`, siteId));
-            }, () => {
-                props.history.push(withSiteId('/dashboard', siteId));
-            })
-        }
     }, [siteId]);
 
     return useObserver(() => (
diff --git a/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx b/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
index 5ce208da8..466103dc8 100644
--- a/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardList/DashboardList.tsx
@@ -31,7 +31,7 @@ function DashboardList() {
             }   
         >
             <div className="mt-3 border-b">
-                <div className="grid grid-cols-12 p-4 font-medium">
+                <div className="grid grid-cols-12 py-2 font-medium">
                   <div className="col-span-8">Title</div>
                   <div  className="col-span-2">Visibility</div>
                   <div className="col-span-2 text-right">Created</div>
diff --git a/frontend/app/components/Dashboard/components/DashboardList/DashboardListItem.tsx b/frontend/app/components/Dashboard/components/DashboardList/DashboardListItem.tsx
index 8a40c2139..5e82ac2b6 100644
--- a/frontend/app/components/Dashboard/components/DashboardList/DashboardListItem.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardList/DashboardListItem.tsx
@@ -23,7 +23,7 @@ function DashboardListItem(props: Props) {
     };
     return (
         <>
-            <div className="grid grid-cols-12 p-4 border-t select-none">
+            <div className="grid grid-cols-12 py-4 border-t select-none">
                 <div className="col-span-8 flex items-start">
                     <div className="flex items-center link capitalize-first" onClick={onItemClick}>
                         <div className="w-9 h-9 rounded-full bg-tealx-lightest flex items-center justify-center mr-2">
diff --git a/frontend/app/components/Dashboard/components/DashboardList/DashboardsView.tsx b/frontend/app/components/Dashboard/components/DashboardList/DashboardsView.tsx
index 2564cea2b..10bbfc50d 100644
--- a/frontend/app/components/Dashboard/components/DashboardList/DashboardsView.tsx
+++ b/frontend/app/components/Dashboard/components/DashboardList/DashboardsView.tsx
@@ -22,7 +22,7 @@ function DashboardsView({ history, siteId }: { history: any, siteId: string }) {
 
     return (
         <div style={{ maxWidth: '1300px', margin: 'auto'}} className="bg-white rounded p-4">
-            <div className="flex items-center mb-4 justify-between px-4">
+            <div className="flex items-center mb-4 justify-between">
                 <div className="flex items-baseline mr-3">
                     <PageTitle title="Dashboards" className="" />
                 </div>
@@ -31,7 +31,7 @@ function DashboardsView({ history, siteId }: { history: any, siteId: string }) {
                     <DashboardSearch />
                 </div>
             </div>
-            <div className="text-xl text-disabled-text flex items-center pl-4">
+            <div className="text-xl text-disabled-text flex items-center">
                 <Icon name="info-circle-fill" className="mr-2" size={18} />
                 A dashboard is a custom visualization using your OpenReplay data.
             </div>
diff --git a/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx b/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
index 38af42702..52747a86c 100644
--- a/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
+++ b/frontend/app/components/Dashboard/components/MetricListItem/MetricListItem.tsx
@@ -63,19 +63,15 @@ function MetricListItem(props: Props) {
 
     
     return (
-        <div className="grid grid-cols-12 p-4 border-t select-none">
+        <div className="grid grid-cols-12 py-4 border-t select-none">
             <div className="col-span-3 flex items-start">
                 <div className="flex items-center">
-                    {/* <div className="w-8 h-8 rounded-full bg-tealx-lightest flex items-center justify-center mr-2">
-                        <Icon name={getIcon(metric.metricType)} size="14" color="tealx"  />
-                    </div> */}
                     <MetricTypeIcon type={metric.metricType} />
                     <Link to={`/metrics/${metric.metricId}`} className="link capitalize-first">
                         {metric.name}
                     </Link>
                 </div>
             </div>
-            {/* <div><Label className="capitalize">{metric.metricType}</Label></div> */}
             <div className="col-span-3">{metric.owner}</div>
             <div className="col-span-4">
                 <div className="flex items-center">
diff --git a/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx b/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
index 166be1b40..8c453688e 100644
--- a/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
+++ b/frontend/app/components/Dashboard/components/MetricsList/MetricsList.tsx
@@ -37,7 +37,7 @@ function MetricsList() {
             }   
         >
             <div className="mt-3 border-b rounded bg-white">
-                <div className="grid grid-cols-12 p-4 font-medium">
+                <div className="grid grid-cols-12 py-2 font-medium">
                     <div className="col-span-3">Title</div>
                     <div className="col-span-3">Owner</div>
                     <div  className="col-span-4">Visibility</div>
diff --git a/frontend/app/components/Dashboard/components/MetricsView/MetricsView.tsx b/frontend/app/components/Dashboard/components/MetricsView/MetricsView.tsx
index 288b9e1f0..abdf2e5e2 100644
--- a/frontend/app/components/Dashboard/components/MetricsView/MetricsView.tsx
+++ b/frontend/app/components/Dashboard/components/MetricsView/MetricsView.tsx
@@ -17,7 +17,7 @@ function MetricsView(props: Props) {
     }, []);
     return useObserver(() => (
         <div style={{ maxWidth: '1300px', margin: 'auto'}} className="bg-white rounded p-4">
-            <div className="flex items-center mb-4 justify-between px-4">
+            <div className="flex items-center mb-4 justify-between">
                 <div className="flex items-baseline mr-3">
                     <PageTitle title="Metrics" className="" />
                 </div>
@@ -26,7 +26,7 @@ function MetricsView(props: Props) {
                     <MetricsSearch />
                 </div>
             </div>
-            <div className="text-xl text-disabled-text flex items-center pl-4">
+            <div className="text-xl text-disabled-text flex items-center">
                 <Icon name="info-circle-fill" className="mr-2" size={18} />
                 Create custom Metrics to capture key interactions and track KPIs.
             </div>