Add warning banners for Auctions and Crowdloans (#10458)

polkadot-js · Apr 11, 2024 · a1d2458 · a1d2458
1 parent 2c47246
commit a1d2458
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/packages/page-parachains/src/Auctions/index.tsx b/packages/page-parachains/src/Auctions/index.tsx
@@ -5,8 +5,9 @@ import type { AuctionInfo, Campaigns, OwnedId, Winning } from '../types.js';
 
 import React from 'react';
 
-import { Button } from '@polkadot/react-components';
+import { Button, MarkWarning } from '@polkadot/react-components';
 
+import { useTranslation } from '../translate.js';
 import Auction from './Auction.js';
 import Bid from './Bid.js';
 import Summary from './Summary.js';
@@ -20,10 +21,15 @@ interface Props {
 }
 
 function Auctions ({ auctionInfo, campaigns, className, ownedIds, winningData }: Props): React.ReactElement<Props> {
+  const { t } = useTranslation();
   const lastWinners = winningData?.[0];
 
   return (
     <div className={className}>
+      <MarkWarning
+        className='warning centered'
+        content={t('Auctions will be deprecated in favor of Coretime. When Coretime is active in Polkadot, this page will be removed.')}
+      />
       <Summary
         auctionInfo={auctionInfo}
         lastWinners={lastWinners}

diff --git a/packages/page-parachains/src/Crowdloan/index.tsx b/packages/page-parachains/src/Crowdloan/index.tsx
@@ -5,9 +5,10 @@ import type { AuctionInfo, Campaigns, LeasePeriod, OwnedId } from '../types.js';
 
 import React from 'react';
 
-import { Button } from '@polkadot/react-components';
+import { Button, MarkWarning } from '@polkadot/react-components';
 import { useBestNumber } from '@polkadot/react-hooks';
 
+import { useTranslation } from '../translate.js';
 import FundAdd from './FundAdd.js';
 import Funds from './Funds.js';
 import Summary from './Summary.js';
@@ -21,10 +22,15 @@ interface Props {
 }
 
 function Crowdloan ({ auctionInfo, campaigns: { activeCap, activeRaised, funds, isLoading, totalCap, totalRaised }, className, leasePeriod, ownedIds }: Props): React.ReactElement<Props> {
+  const { t } = useTranslation();
   const bestNumber = useBestNumber();
 
   return (
     <div className={className}>
+      <MarkWarning
+        className='warning centered'
+        content={t('Crowdloans will be deprecated in favor of Coretime. When Coretime is active in Polkadot, this page will be removed.')}
+      />
       <Summary
         activeCap={activeCap}
         activeRaised={activeRaised}