feat(airdrop): congratulation

MORIOM70 · Jan 18, 2022 · e71f2ed · e71f2ed
1 parent 54c2754
commit e71f2ed
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 17 deletions.
diff --git a/src/component/ClaimAirdrop/SubComponent/index.tsx b/src/component/ClaimAirdrop/SubComponent/index.tsx
@@ -3,10 +3,10 @@ import clsx from 'clsx';
 import { Modal, Spin, Space, Button } from 'antd';
 
 import styles from '../styles.module.scss';
-import twitterIcon from './img/twitter.svg';
-import mediumIcon from './img/medium.svg';
-import telegramIcon from './img/telegram.svg';
-import discordIcon from './img/discord.svg';
+import TwitterIcon from './img/twitter.svg';
+import MediumIcon from './img/medium.svg';
+import TelegramIcon from './img/telegram.svg';
+import DiscordIcon from './img/discord.svg';
 import BackwardIcon from './img/backward.svg';
 
 export const ComfirmModalTitleWithCRAB = ({ crabQuantity='100' }) => (
@@ -40,6 +40,13 @@ export const ComfirmModalTitleForCcongratulation = () => (
   </div>
 );
 
+export const CongratulationContent = () => (
+  <div>
+    <p>The airdrop token 100 CRAB has been sent to the destination address that you filled before, please track this transfer through the Subview:</p>
+    <p><a href='#'>View in Subview Explorer</a></p>
+  </div>
+);
+
 export const ComfirmModalButton = ({
   text='OK',
   onClick=()=>{},
@@ -163,12 +170,10 @@ export const AmountSection = ({ amount='100' }) => (
 );
 
 export const SocialLinks = () => (
-  <div>
-    <Space size='large'>
-      <a href='#'><img alt='...' src={twitterIcon} /></a>
-      <a href='#'><img alt='...' src={mediumIcon} /></a>
-      <a href='#'><img alt='...' src={telegramIcon} /></a>
-      <a href='#'><img alt='...' src={discordIcon} /></a>
-    </Space>
-  </div>
+  <Space className={styles.socialLinks} size='large'>
+    <a href='#'><TwitterIcon /></a>
+    <a href='#'><MediumIcon /></a>
+    <a href='#'><TelegramIcon/></a>
+    <a href='#'><DiscordIcon /></a>
+  </Space>
 );
diff --git a/src/component/ClaimAirdrop/index.tsx b/src/component/ClaimAirdrop/index.tsx
@@ -10,6 +10,7 @@ import {
   GithubAccountSection,
   AmountSection,
   SocialLinks,
+  CongratulationContent,
   ComfirmModalTitleWithCRAB,
   ComfirmModalTitleForSorry,
   ComfirmModalTitleForComfirm,
@@ -39,14 +40,13 @@ const ClaimAirdrop: React.FC<Props> = ({ className }) => {
       </div>
       <ComfirmModal
         visible={visibleComfirmModal}
-        title={<ComfirmModalTitleForComfirm onBack={() => setVisibleComfirmModal(false)} />}
-        footer={<ComfirmModalButton onClick={() => setVisibleComfirmModal(false)} text='Comfirm and Claim CRAB' disabled={false} />}
+        title={<ComfirmModalTitleForCcongratulation />}
+        // footer={<ComfirmModalButton onClick={() => setVisibleComfirmModal(false)} text='Comfirm and Claim CRAB' disabled={false} />}
+        footer={<SocialLinks />}
         onCancel={() => setVisibleComfirmModal(false)}
       >
         <Space direction='vertical' size='middle' style={{ width: '100%' }}>
-          <GithubAccountSection />
-          <DestinationSection comfirmAddress='0xe59261f6D4088BcD69985A3D369Ff14cC54EF1E5' />
-          <AmountSection />
+          <CongratulationContent />
         </Space>
       </ComfirmModal>
       <LoadingModal

diff --git a/src/component/ClaimAirdrop/styles.module.scss b/src/component/ClaimAirdrop/styles.module.scss
@@ -274,3 +274,8 @@
     }
   }
 }
+
+.socialLinks {
+  display: flex;
+  justify-content: center;
+}