From 9e0eb8f7c953b4e44737b7641acb561f9afeea20 Mon Sep 17 00:00:00 2001
From: David Echelberger <eberger727@gmail.com>
Date: Wed, 20 Apr 2022 00:32:26 -0400
Subject: [PATCH 1/2] [alignment] home dashboard recent events vertical scroll

Signed-off-by: David Echelberger <eberger727@gmail.com>
---
 src/components/Cards/FireFlyCard.tsx |  1 -
 src/pages/Home/views/Dashboard.tsx   | 70 +++++++++++++++++-----------
 2 files changed, 42 insertions(+), 29 deletions(-)

diff --git a/src/components/Cards/FireFlyCard.tsx b/src/components/Cards/FireFlyCard.tsx
index f7412f8b..f9e1704e 100644
--- a/src/components/Cards/FireFlyCard.tsx
+++ b/src/components/Cards/FireFlyCard.tsx
@@ -50,7 +50,6 @@ export const FireFlyCard: React.FC<Props> = ({ cardData, size }) => {
           alignItems={'flex-start'}
           justifyContent="flex-start"
           item
-          direction="column"
           sx={{ height: COMPONENT_HEIGHT, width: '100%', overflow: 'auto' }}
         >
           {cardData.component}
diff --git a/src/pages/Home/views/Dashboard.tsx b/src/pages/Home/views/Dashboard.tsx
index 975981a4..9d5a9ac7 100644
--- a/src/pages/Home/views/Dashboard.tsx
+++ b/src/pages/Home/views/Dashboard.tsx
@@ -338,32 +338,40 @@ export const HomeDashboard: () => JSX.Element = () => {
       clickPath: FF_NAV_PATHS.activityTimelinePath(selectedNamespace),
       component: (
         <>
-          {recentEventTxs?.length === 0 ? (
-            <EmptyStateCard text={t('noRecentTransactions')} />
-          ) : !recentEventTxs ? (
-            <SkeletonCardList numElements={7} />
-          ) : (
-            recentEventTxs.map((event) => (
-              <React.Fragment key={event.id}>
-                <EventCardWrapper
-                  onHandleViewTx={(tx: ITransaction) => {
-                    setViewTx(tx);
-                    setSlideSearchParam(tx.id);
-                  }}
-                  link={
-                    event.tx
-                      ? FF_NAV_PATHS.activityTxDetailPath(
-                          selectedNamespace,
-                          event.tx
-                        )
-                      : FF_NAV_PATHS.activityTxPath(selectedNamespace)
-                  }
-                  {...{ event }}
-                />
-                <Grid sx={{ padding: '1px' }} />
-              </React.Fragment>
-            ))
-          )}
+          <Grid
+            container
+            direction="column"
+            item
+            alignItems="flex-start"
+            justifyContent="flex-start"
+          >
+            {recentEventTxs?.length === 0 ? (
+              <EmptyStateCard text={t('noRecentTransactions')} />
+            ) : !recentEventTxs ? (
+              <SkeletonCardList numElements={7} />
+            ) : (
+              recentEventTxs.map((event) => (
+                <React.Fragment key={event.id}>
+                  <EventCardWrapper
+                    onHandleViewTx={(tx: ITransaction) => {
+                      setViewTx(tx);
+                      setSlideSearchParam(tx.id);
+                    }}
+                    link={
+                      event.tx
+                        ? FF_NAV_PATHS.activityTxDetailPath(
+                            selectedNamespace,
+                            event.tx
+                          )
+                        : FF_NAV_PATHS.activityTxPath(selectedNamespace)
+                    }
+                    {...{ event }}
+                  />
+                  <Grid sx={{ padding: '1px' }} />
+                </React.Fragment>
+              ))
+            )}
+          </Grid>
         </>
       ),
     },
@@ -372,7 +380,13 @@ export const HomeDashboard: () => JSX.Element = () => {
       headerText: t('recentNetworkEvents'),
       clickPath: FF_NAV_PATHS.activityTimelinePath(selectedNamespace),
       component: (
-        <>
+        <Grid
+          container
+          direction="column"
+          item
+          alignItems="flex-start"
+          justifyContent="flex-start"
+        >
           {recentEvents?.length === 0 ? (
             <EmptyStateCard text={t('noRecentNetworkEvents')} />
           ) : !recentEvents ? (
@@ -403,7 +417,7 @@ export const HomeDashboard: () => JSX.Element = () => {
               </React.Fragment>
             ))
           )}
-        </>
+        </Grid>
       ),
     },
   ];

From 1e1013d97dcba53212fe9625931f24ab86d785e7 Mon Sep 17 00:00:00 2001
From: David Echelberger <eberger727@gmail.com>
Date: Wed, 20 Apr 2022 00:34:36 -0400
Subject: [PATCH 2/2] [alignment]

Signed-off-by: David Echelberger <eberger727@gmail.com>
---
 src/pages/Home/views/Dashboard.tsx | 70 +++++++++++++++---------------
 1 file changed, 34 insertions(+), 36 deletions(-)

diff --git a/src/pages/Home/views/Dashboard.tsx b/src/pages/Home/views/Dashboard.tsx
index 9d5a9ac7..398e636f 100644
--- a/src/pages/Home/views/Dashboard.tsx
+++ b/src/pages/Home/views/Dashboard.tsx
@@ -337,42 +337,40 @@ export const HomeDashboard: () => JSX.Element = () => {
       headerText: t('myRecentTransactions'),
       clickPath: FF_NAV_PATHS.activityTimelinePath(selectedNamespace),
       component: (
-        <>
-          <Grid
-            container
-            direction="column"
-            item
-            alignItems="flex-start"
-            justifyContent="flex-start"
-          >
-            {recentEventTxs?.length === 0 ? (
-              <EmptyStateCard text={t('noRecentTransactions')} />
-            ) : !recentEventTxs ? (
-              <SkeletonCardList numElements={7} />
-            ) : (
-              recentEventTxs.map((event) => (
-                <React.Fragment key={event.id}>
-                  <EventCardWrapper
-                    onHandleViewTx={(tx: ITransaction) => {
-                      setViewTx(tx);
-                      setSlideSearchParam(tx.id);
-                    }}
-                    link={
-                      event.tx
-                        ? FF_NAV_PATHS.activityTxDetailPath(
-                            selectedNamespace,
-                            event.tx
-                          )
-                        : FF_NAV_PATHS.activityTxPath(selectedNamespace)
-                    }
-                    {...{ event }}
-                  />
-                  <Grid sx={{ padding: '1px' }} />
-                </React.Fragment>
-              ))
-            )}
-          </Grid>
-        </>
+        <Grid
+          container
+          direction="column"
+          item
+          alignItems="flex-start"
+          justifyContent="flex-start"
+        >
+          {recentEventTxs?.length === 0 ? (
+            <EmptyStateCard text={t('noRecentTransactions')} />
+          ) : !recentEventTxs ? (
+            <SkeletonCardList numElements={7} />
+          ) : (
+            recentEventTxs.map((event) => (
+              <React.Fragment key={event.id}>
+                <EventCardWrapper
+                  onHandleViewTx={(tx: ITransaction) => {
+                    setViewTx(tx);
+                    setSlideSearchParam(tx.id);
+                  }}
+                  link={
+                    event.tx
+                      ? FF_NAV_PATHS.activityTxDetailPath(
+                          selectedNamespace,
+                          event.tx
+                        )
+                      : FF_NAV_PATHS.activityTxPath(selectedNamespace)
+                  }
+                  {...{ event }}
+                />
+                <Grid sx={{ padding: '1px' }} />
+              </React.Fragment>
+            ))
+          )}
+        </Grid>
       ),
     },
     // Recent Network Events