From 1f8cc17cf18b83f40d1d84c8b3f6acf456f26e53 Mon Sep 17 00:00:00 2001
From: Aleka Cheung <aforaleka@gmail.com>
Date: Tue, 13 Feb 2024 14:36:52 -0500
Subject: [PATCH] show trading rewards in testnet

---
 package.json                                  |  2 +-
 pnpm-lock.yaml                                | 16 ++++++------
 .../token/rewards/RewardHistoryPanel.tsx      | 25 ++++++++++++++++++-
 src/pages/token/rewards/RewardsPage.tsx       |  9 ++++---
 4 files changed, 39 insertions(+), 13 deletions(-)

diff --git a/package.json b/package.json
index 21a395d..007d568 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,7 @@
     "@cosmjs/tendermint-rpc": "^0.32.1",
     "@dydxprotocol/v4-abacus": "^1.4.2",
     "@dydxprotocol/v4-client-js": "^1.0.20",
-    "@dydxprotocol/v4-localization": "^1.1.28",
+    "@dydxprotocol/v4-localization": "^1.1.29",
     "@ethersproject/providers": "^5.7.2",
     "@js-joda/core": "^5.5.3",
     "@radix-ui/react-accordion": "^1.1.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cf7b4f5..ff3b335 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,9 +1,5 @@
 lockfileVersion: '6.0'
 
-settings:
-  autoInstallPeers: true
-  excludeLinksFromLockfile: false
-
 overrides:
   follow-redirects: 1.15.3
 
@@ -36,8 +32,8 @@ dependencies:
     specifier: ^1.0.20
     version: 1.0.20
   '@dydxprotocol/v4-localization':
-    specifier: ^1.1.28
-    version: 1.1.28
+    specifier: ^1.1.29
+    version: 1.1.29
   '@ethersproject/providers':
     specifier: ^5.7.2
     version: 5.7.2
@@ -1323,8 +1319,8 @@ packages:
       - utf-8-validate
     dev: false
 
-  /@dydxprotocol/v4-localization@1.1.28:
-    resolution: {integrity: sha512-R8hGDbJvZb9HsI0jwYIYDS3aNM3T0aLlXOnogihGrRRibZs874XJy5fCGBW2aRXAyDu56nbjkyuOAQCkF3KP1Q==}
+  /@dydxprotocol/v4-localization@1.1.29:
+    resolution: {integrity: sha512-o9lxsYl5ObqO9OUyxiKuUxoBmYZk0qGDeNxGScY8uMRq4Ahhz3BPxAC7jUYypCNAMpieiQjVGxMnnhIbwEkm2w==}
     dev: false
 
   /@dydxprotocol/v4-proto@4.0.0-dev.0:
@@ -16053,3 +16049,7 @@ packages:
   /zwitch@2.0.4:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
     dev: true
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
diff --git a/src/pages/token/rewards/RewardHistoryPanel.tsx b/src/pages/token/rewards/RewardHistoryPanel.tsx
index c79da79..d98f515 100644
--- a/src/pages/token/rewards/RewardHistoryPanel.tsx
+++ b/src/pages/token/rewards/RewardHistoryPanel.tsx
@@ -9,10 +9,13 @@ import {
   HistoricalTradingRewardsPeriods,
 } from '@/constants/abacus';
 
+import { isMainnet } from '@/constants/networks';
 import { STRING_KEYS } from '@/constants/localization';
+
 import breakpoints from '@/styles/breakpoints';
 import { layoutMixins } from '@/styles/layoutMixins';
 
+import { Output, OutputType } from '@/components/Output';
 import { Panel } from '@/components/Panel';
 import { ToggleGroup } from '@/components/ToggleGroup';
 import { WithTooltip } from '@/components/WithTooltip';
@@ -20,6 +23,9 @@ import { TradingRewardHistoryTable } from '@/views/tables/TradingRewardHistoryTa
 
 import abacusStateManager from '@/lib/abacus';
 
+// TODO: set in env featureFlag config
+const REWARDS_HISTORY_START_DATE_MS = isMainnet ? 1706486400000 : 1704844800000;
+
 export const RewardHistoryPanel = () => {
   const stringGetter = useStringGetter();
 
@@ -47,7 +53,20 @@ export const RewardHistoryPanel = () => {
             <WithTooltip tooltip="reward-history">
               <h3>{stringGetter({ key: STRING_KEYS.REWARD_HISTORY })}</h3>
             </WithTooltip>
-            <span>{stringGetter({ key: STRING_KEYS.REWARD_HISTORY_DESCRIPTION })}</span>
+            <span>
+              {stringGetter({
+                key: STRING_KEYS.REWARD_HISTORY_DESCRIPTION,
+                params: {
+                  REWARDS_HISTORY_START_DATE: (
+                    <Styled.Output
+                      type={OutputType.Date}
+                      value={REWARDS_HISTORY_START_DATE_MS}
+                      timeOptions={{ useUTC: true }}
+                    />
+                  ),
+                },
+              })}
+            </span>
           </Styled.Title>
           <ToggleGroup
             items={[
@@ -103,3 +122,7 @@ Styled.Content = styled.div`
   ${layoutMixins.flexColumn}
   gap: 0.75rem;
 `;
+
+Styled.Output = styled(Output)`
+  display: inline;
+`;
diff --git a/src/pages/token/rewards/RewardsPage.tsx b/src/pages/token/rewards/RewardsPage.tsx
index b550f36..2935d76 100644
--- a/src/pages/token/rewards/RewardsPage.tsx
+++ b/src/pages/token/rewards/RewardsPage.tsx
@@ -1,6 +1,7 @@
 import styled, { AnyStyledComponent, css } from 'styled-components';
 import { useNavigate } from 'react-router-dom';
 
+import { isMainnet } from '@/constants/networks';
 import { STRING_KEYS } from '@/constants/localization';
 import { AppRoute } from '@/constants/routes';
 
@@ -27,6 +28,8 @@ const RewardsPage = () => {
   const { isTablet, isNotTablet } = useBreakpoints();
   const navigate = useNavigate();
 
+  const showTradingRewards = testFlags.showTradingRewards || !isMainnet;
+
   return (
     <div>
       {isTablet && (
@@ -37,7 +40,7 @@ const RewardsPage = () => {
       )}
       <DetachedSection>
         <Styled.GridLayout
-          showTradingRewards={testFlags.showTradingRewards}
+          showTradingRewards={showTradingRewards}
           showMigratePanel={import.meta.env.VITE_V3_TOKEN_ADDRESS && isNotTablet}
         >
           {import.meta.env.VITE_V3_TOKEN_ADDRESS && isNotTablet && <Styled.MigratePanel />}
@@ -51,7 +54,7 @@ const RewardsPage = () => {
             </>
           )}
 
-          {testFlags.showTradingRewards && (
+          {showTradingRewards && (
             <Styled.TradingRewardsColumn>
               <TradingRewardsSummaryPanel />
               {isTablet && <RewardsHelpPanel />}
@@ -60,7 +63,7 @@ const RewardsPage = () => {
           )}
 
           {isNotTablet && (
-            <Styled.OtherColumn showTradingRewards={testFlags.showTradingRewards}>
+            <Styled.OtherColumn showTradingRewards={showTradingRewards}>
               <RewardsHelpPanel />
             </Styled.OtherColumn>
           )}