From 1fd1013353ab00566881cc10aa255d6069cd84d2 Mon Sep 17 00:00:00 2001
From: "m.ray" <16125548+MadalinaRaicu@users.noreply.github.com>
Date: Tue, 19 Mar 2024 14:53:03 +0200
Subject: [PATCH] feat(trading): rewards container tweaks (#6037)

---
 .../rewards-container/active-rewards.tsx      |  5 ++--
 .../rewards-container/rewards-container.tsx   | 25 ++++++++++---------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/apps/trading/components/rewards-container/active-rewards.tsx b/apps/trading/components/rewards-container/active-rewards.tsx
index 5fa88a1833..c03d3f5509 100644
--- a/apps/trading/components/rewards-container/active-rewards.tsx
+++ b/apps/trading/components/rewards-container/active-rewards.tsx
@@ -3,7 +3,6 @@ import {
   VegaIcon,
   VegaIconNames,
   TradingInput,
-  TinyScroll,
 } from '@vegaprotocol/ui-toolkit';
 import {
   type TransferNode,
@@ -120,7 +119,7 @@ export const ActiveRewards = ({ currentEpoch }: { currentEpoch: number }) => {
         />
       )}
       {/** CARDS */}
-      <TinyScroll className="grid gap-x-8 gap-y-10 h-fit grid-cols-[repeat(auto-fill,_minmax(230px,_1fr))] md:grid-cols-[repeat(auto-fill,_minmax(230px,_1fr))] lg:grid-cols-[repeat(auto-fill,_minmax(320px,_1fr))] xl:grid-cols-[repeat(auto-fill,_minmax(335px,_1fr))] max-h-[40rem] overflow-auto pr-2">
+      <div className="grid gap-x-8 gap-y-10 h-fit grid-cols-[repeat(auto-fill,_minmax(230px,_1fr))] md:grid-cols-[repeat(auto-fill,_minmax(230px,_1fr))] lg:grid-cols-[repeat(auto-fill,_minmax(320px,_1fr))] xl:grid-cols-[repeat(auto-fill,_minmax(335px,_1fr))] pr-2">
         {data
           .filter((n) => applyFilter(n, filter))
           .map((node, i) => (
@@ -131,7 +130,7 @@ export const ActiveRewards = ({ currentEpoch }: { currentEpoch: number }) => {
               requirements={requirements}
             />
           ))}
-      </TinyScroll>
+      </div>
     </Card>
   );
 };
diff --git a/apps/trading/components/rewards-container/rewards-container.tsx b/apps/trading/components/rewards-container/rewards-container.tsx
index 03388fe66d..86174f7673 100644
--- a/apps/trading/components/rewards-container/rewards-container.tsx
+++ b/apps/trading/components/rewards-container/rewards-container.tsx
@@ -246,6 +246,19 @@ export const RewardsContainer = () => {
           })}
       </div>
       <div className="grid auto-rows-min grid-cols-6 gap-3">
+        <Card
+          title={t('Rewards history')}
+          className="lg:col-span-full hidden md:block"
+          loading={rewardsLoading}
+          noBackgroundOnMobile={true}
+          highlight={true}
+        >
+          <RewardsHistoryContainer
+            epoch={Number(epochData?.epoch.id)}
+            pubKey={pubKey}
+            assets={assetMap}
+          />
+        </Card>
         {pubKey && activityStreakBenefitTiers.tiers?.length > 0 && (
           <Card
             title={t('Activity Streak')}
@@ -287,18 +300,6 @@ export const RewardsContainer = () => {
           </Card>
         )}
         <ActiveRewards currentEpoch={Number(epochData?.epoch.id)} />
-        <Card
-          title={t('Rewards history')}
-          className="lg:col-span-full hidden md:block"
-          loading={rewardsLoading}
-          noBackgroundOnMobile={true}
-        >
-          <RewardsHistoryContainer
-            epoch={Number(epochData?.epoch.id)}
-            pubKey={pubKey}
-            assets={assetMap}
-          />
-        </Card>
       </div>
     </div>
   );