From a1d2458347f300d9f2d1c659008567ab79cbe90b Mon Sep 17 00:00:00 2001
From: Tarik Gul <47201679+TarikGul@users.noreply.github.com>
Date: Thu, 11 Apr 2024 08:44:15 -0400
Subject: [PATCH] Add warning banners for Auctions and Crowdloans (#10458)

---
 packages/page-parachains/src/Auctions/index.tsx  | 8 +++++++-
 packages/page-parachains/src/Crowdloan/index.tsx | 8 +++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/page-parachains/src/Auctions/index.tsx b/packages/page-parachains/src/Auctions/index.tsx
index 89c56db58df6..6bdf6d91b167 100644
--- 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
index b0b9ca4715e3..45c294bf401f 100644
--- 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}