diff --git a/src/layouts/MainLayout.tsx b/src/layouts/MainLayout.tsx index 02f77a4fd8..87e468ab33 100644 --- a/src/layouts/MainLayout.tsx +++ b/src/layouts/MainLayout.tsx @@ -118,12 +118,25 @@ const getCampaignConfigs = () => ({ }, }); +const routeCampaigns = { + '/sgho': { + notifyText: "Earn 4% higher yield on savings GHO using OKX's GHO staking vault.", + buttonText: 'Learn more', + buttonAction: { + type: 'url' as const, + value: 'https://web3.okx.com/earn/activity/aave-gho', + target: '_blank' as const, + }, + bannerVersion: 'sgho-okx-v1', + }, +}; + export function MainLayout({ children }: { children: ReactNode }) { const campaignConfigs = getCampaignConfigs(); return ( <> - + diff --git a/src/layouts/TopBarNotify.tsx b/src/layouts/TopBarNotify.tsx index 799f1b0ea5..2a208531b1 100644 --- a/src/layouts/TopBarNotify.tsx +++ b/src/layouts/TopBarNotify.tsx @@ -31,12 +31,15 @@ interface CampaignConfig { interface NetworkCampaigns { [chainId: number]: CampaignConfig; } - +interface RouteCampaigns { + [route: string]: CampaignConfig; +} interface TopBarNotifyProps { campaigns: NetworkCampaigns; + routeCampaigns?: RouteCampaigns; } -export default function TopBarNotify({ campaigns }: TopBarNotifyProps) { +export default function TopBarNotify({ campaigns, routeCampaigns }: TopBarNotifyProps) { const { breakpoints } = useTheme(); const md = useMediaQuery(breakpoints.down('md')); const sm = useMediaQuery(breakpoints.down('sm')); @@ -49,7 +52,7 @@ export default function TopBarNotify({ campaigns }: TopBarNotifyProps) { return campaigns[currentChainId] || null; }; - const currentCampaign = getCurrentCampaign(); + const currentCampaign = routeCampaigns?.[router.pathname] ?? getCurrentCampaign() ?? null; const [showWarning, setShowWarning] = useState(() => { if (!currentCampaign) return false; @@ -103,13 +106,13 @@ export default function TopBarNotify({ campaigns }: TopBarNotifyProps) { case 'route': router.push(currentCampaign.buttonAction.value); break; - // case 'modal': - // console.log( - // 'Modal action:', - // currentCampaign.buttonAction.value, - // currentCampaign.buttonAction.params - // ); - break; + // case 'modal': + // console.log( + // 'Modal action:', + // currentCampaign.buttonAction.value, + // currentCampaign.buttonAction.params + // ); + // break; } };