From bb50fddbc68908aa90f077af48e5471bd957c8dc Mon Sep 17 00:00:00 2001
From: rohitmalhotra1420 <rohit.malhotra1420@gmail.com>
Date: Tue, 12 Nov 2024 15:33:36 +0530
Subject: [PATCH 1/2] DAPP-1967-bonus-activity-container-position-fix

---
 .../components/BonusActivitiesSection.tsx     | 20 +++++++++++++------
 .../RewardsActivitiesBottomSection.tsx        |  5 ++---
 2 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/src/modules/rewards/components/BonusActivitiesSection.tsx b/src/modules/rewards/components/BonusActivitiesSection.tsx
index 2f078e50f7..4f769fe4bd 100644
--- a/src/modules/rewards/components/BonusActivitiesSection.tsx
+++ b/src/modules/rewards/components/BonusActivitiesSection.tsx
@@ -18,7 +18,7 @@ import { useRewardsContext } from 'contexts/RewardsContext';
 import { walletToCAIP10 } from 'helpers/w2w';
 
 // components
-import { Alert, Box, Text } from 'blocks';
+import { Alert, Box, Lozenge, Star, Text } from 'blocks';
 import { BonusActivitiesItem } from './BonusActivitiesItem';
 
 export type BonusActivitiesSectionProps = {};
@@ -69,12 +69,20 @@ const BonusActivities: FC<BonusActivitiesSectionProps> = () => {
       flexDirection="column"
       gap="spacing-sm"
     >
-      <Text
-        variant="h4-bold"
-        color="text-primary"
+      <Box
+        display="flex"
+        flexDirection="row"
+        gap="spacing-xs"
+        alignItems="center"
       >
-        Bonus Activities
-      </Text>
+        <Text
+          variant="h4-bold"
+          color="text-primary"
+        >
+          Bonus Activities
+        </Text>
+        <Lozenge icon={<Star />}>NEW</Lozenge>
+      </Box>
 
       {errorMessage && (
         <Box width="-webkit-fill-available">
diff --git a/src/modules/rewards/components/RewardsActivitiesBottomSection.tsx b/src/modules/rewards/components/RewardsActivitiesBottomSection.tsx
index 01dbfbdec1..84c3d1f750 100644
--- a/src/modules/rewards/components/RewardsActivitiesBottomSection.tsx
+++ b/src/modules/rewards/components/RewardsActivitiesBottomSection.tsx
@@ -28,8 +28,6 @@ const RewardsActivitiesBottomSection: FC<RewardsActivitiesBottomSectionProps> =
         <RewardsActivitiesSection />
       </Box>
 
-      <BonusActivities />
-
       <Box
         backgroundColor="surface-primary"
         borderRadius="radius-md"
@@ -50,7 +48,6 @@ const RewardsActivitiesBottomSection: FC<RewardsActivitiesBottomSectionProps> =
         display="flex"
         flexDirection="column"
         padding={{ ml: 'spacing-sm', initial: 'spacing-md' }}
-        margin="spacing-none spacing-none spacing-md spacing-none"
       >
         <StakePushSection
           lifeTime={true}
@@ -58,6 +55,8 @@ const RewardsActivitiesBottomSection: FC<RewardsActivitiesBottomSectionProps> =
           subtitle="Visit [app.push.org/yield](https://app.push.org/yield) and stake tokens in the Fee Pool or LP Pool to activate multipliers."
         />
       </Box>
+
+      <BonusActivities />
     </Box>
   );
 };

From b80e53805159a188f05a148caa9a437de8e0f3de Mon Sep 17 00:00:00 2001
From: rohitmalhotra1420 <rohit.malhotra1420@gmail.com>
Date: Tue, 12 Nov 2024 16:19:46 +0530
Subject: [PATCH 2/2] DAPP-1967 added lozenge tags support in staking
 activities

---
 .../StakePushActivitiesListItem.tsx           | 29 +++++++++++++++++--
 1 file changed, 26 insertions(+), 3 deletions(-)

diff --git a/src/modules/rewards/components/StakePushActivitiesListItem.tsx b/src/modules/rewards/components/StakePushActivitiesListItem.tsx
index 501bb0806d..0d071ddb36 100644
--- a/src/modules/rewards/components/StakePushActivitiesListItem.tsx
+++ b/src/modules/rewards/components/StakePushActivitiesListItem.tsx
@@ -6,7 +6,7 @@ import { Activity, StakeActivityResponse, UsersActivity } from 'queries';
 import { useAccount } from 'hooks';
 
 // components
-import { Box, Button, Lock, Multiplier, RewardsBell, Skeleton, Text } from 'blocks';
+import { Box, Button, Lock, Lozenge, Multiplier, RewardsBell, Skeleton, Star, Text } from 'blocks';
 import { RewardsActivityIcon } from './RewardsActivityIcon';
 import { ActivityButton } from './ActivityButton';
 
@@ -93,7 +93,11 @@ const StakePushActivitiesListItem: FC<StakeActivitiesItemProps> = ({
             gap={{ ml: 'spacing-sm', initial: 'spacing-xxxs' }}
             alignItems={{ ml: 'center' }}
           >
-            <Box display={{ ml: 'block', initial: 'none' }}>
+            <Box
+              display={{ ml: 'flex', initial: 'none' }}
+              flexDirection="column"
+              alignItems="center"
+            >
               <Text
                 color="text-primary"
                 variant="h6-bold"
@@ -101,8 +105,19 @@ const StakePushActivitiesListItem: FC<StakeActivitiesItemProps> = ({
               >
                 {activity?.activityTitle}
               </Text>
+              {activity?.tags?.map((tag) => (
+                <Lozenge
+                  size="small"
+                  icon={<Star />}
+                >
+                  {tag}
+                </Lozenge>
+              ))}
             </Box>
-            <Box display={{ ml: 'none', initial: 'block' }}>
+            <Box
+              display={{ ml: 'none', initial: 'flex' }}
+              gap="spacing-xs"
+            >
               <Text
                 color="text-primary"
                 variant="bl-semibold"
@@ -110,6 +125,14 @@ const StakePushActivitiesListItem: FC<StakeActivitiesItemProps> = ({
               >
                 {activity?.activityTitle}
               </Text>
+              {activity?.tags?.map((tag) => (
+                <Lozenge
+                  size="small"
+                  icon={<Star />}
+                >
+                  {tag}
+                </Lozenge>
+              ))}
             </Box>
 
             {activity.points > 0 && (