From edaf89778dc854dee9e0cd7d3caa6aa47fa81309 Mon Sep 17 00:00:00 2001
From: fairlighteth <31534717+fairlighteth@users.noreply.github.com>
Date: Wed, 6 Apr 2022 10:52:33 +0100
Subject: [PATCH 1/3] Detect MetaMask: conditional AddToMetaMask button

---
 src/custom/pages/Profile/index.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/custom/pages/Profile/index.tsx b/src/custom/pages/Profile/index.tsx
index f71cc7d7db..948698a766 100644
--- a/src/custom/pages/Profile/index.tsx
+++ b/src/custom/pages/Profile/index.tsx
@@ -59,7 +59,7 @@ const COW_DECIMALS = COW[ChainId.MAINNET].decimals
 
 export default function Profile() {
   const referralLink = useReferralLink()
-  const { account, chainId } = useActiveWeb3React()
+  const { account, chainId, library } = useActiveWeb3React()
   const { profileData, isLoading, error } = useFetchProfile()
   const lastUpdated = useTimeAgo(profileData?.lastUpdated)
   const isTradesTooltipVisible = account && chainId == 1 && !!profileData?.totalTrades
@@ -227,7 +227,9 @@ export default function Profile() {
               Contract ↗
             </ExtLink>
 
-            <AddToMetamask shortLabel={true} currency={COW[chainId || 1] as Currency | undefined} />
+            {library?.provider?.isMetaMask && (
+              <AddToMetamask shortLabel={true} currency={COW[chainId || 1] as Currency | undefined} />
+            )}
 
             <Link to={`/swap?outputCurrency=${COW_CONTRACT_ADDRESS[chainId || 1]}`}>Buy COW</Link>
           </CardActions>

From 0b461e1b6e12c95379934aef053b5a9faa373a9f Mon Sep 17 00:00:00 2001
From: fairlighteth <31534717+fairlighteth@users.noreply.github.com>
Date: Wed, 6 Apr 2022 11:11:05 +0100
Subject: [PATCH 2/3] Click to copy token contract address.

---
 src/custom/pages/Profile/index.tsx  | 12 +++++++++++-
 src/custom/pages/Profile/styled.tsx | 12 +++++++++---
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/custom/pages/Profile/index.tsx b/src/custom/pages/Profile/index.tsx
index 948698a766..cd22a5d76e 100644
--- a/src/custom/pages/Profile/index.tsx
+++ b/src/custom/pages/Profile/index.tsx
@@ -54,6 +54,7 @@ import useTransactionConfirmationModal from 'hooks/useTransactionConfirmationMod
 import { SwapVCowStatus } from 'state/cowToken/actions'
 import AddToMetamask from 'components/AddToMetamask'
 import { Link } from 'react-router-dom'
+import CopyHelper from 'components/Copy'
 
 const COW_DECIMALS = COW[ChainId.MAINNET].decimals
 
@@ -223,7 +224,10 @@ export default function Profile() {
             </span>
           </BalanceDisplay>
           <CardActions>
-            <ExtLink href={getBlockExplorerUrl(chainId || 1, COW_CONTRACT_ADDRESS[chainId || 1], 'address')}>
+            <ExtLink
+              title="View contract"
+              href={getBlockExplorerUrl(chainId || 1, COW_CONTRACT_ADDRESS[chainId || 1], 'address')}
+            >
               Contract ↗
             </ExtLink>
 
@@ -231,6 +235,12 @@ export default function Profile() {
               <AddToMetamask shortLabel={true} currency={COW[chainId || 1] as Currency | undefined} />
             )}
 
+            {!library?.provider?.isMetaMask && (
+              <CopyHelper toCopy={COW_CONTRACT_ADDRESS[chainId || 1]}>
+                <div title="Click to copy token contract address">Copy contract</div>
+              </CopyHelper>
+            )}
+
             <Link to={`/swap?outputCurrency=${COW_CONTRACT_ADDRESS[chainId || 1]}`}>Buy COW</Link>
           </CardActions>
         </Card>
diff --git a/src/custom/pages/Profile/styled.tsx b/src/custom/pages/Profile/styled.tsx
index 1dc4412cef..89c576bc40 100644
--- a/src/custom/pages/Profile/styled.tsx
+++ b/src/custom/pages/Profile/styled.tsx
@@ -6,6 +6,7 @@ import * as CSS from 'csstype'
 import { transparentize } from 'polished'
 import { ExternalLink } from 'theme'
 import { ButtonCustom as AddToMetaMask } from 'components/AddToMetamask'
+import { CopyIcon as ClickToCopy } from 'components/Copy'
 
 export const Container = styled.div`
   max-width: 910px;
@@ -439,10 +440,12 @@ export const CardActions = styled.div`
   margin: auto 0 0;
 
   > a,
-  ${AddToMetaMask} {
+  ${AddToMetaMask}, > ${ClickToCopy} {
     font-size: 13px;
     height: 100%;
     font-weight: 500;
+    margin: auto 0 0;
+    padding: 0;
     line-height: 1;
     color: ${({ theme }) => theme.text1};
     display: flex;
@@ -459,9 +462,7 @@ export const CardActions = styled.div`
 
   ${AddToMetaMask} {
     border: 0;
-    padding: 0;
     min-height: initial;
-    margin: 0;
     border-radius: initial;
 
     &:hover {
@@ -478,6 +479,11 @@ export const CardActions = styled.div`
       margin: 0 6px 0 0;
     }
   }
+
+  > ${ClickToCopy} svg {
+    width: 15px;
+    margin: 0 4px 0 0;
+  }
 `
 
 export const BalanceDisplay = styled.div<{ titleSize?: number; altColor?: boolean; hAlign?: string }>`

From c2dcb52922daa0662ebe1e64a72090f985e202dc Mon Sep 17 00:00:00 2001
From: fairlight <31534717+fairlighteth@users.noreply.github.com>
Date: Wed, 6 Apr 2022 16:03:56 +0100
Subject: [PATCH 3/3]  Profile: Make elements responsive: Waterfall PR[7]
 (#384)

* Mobile responsive.

* Mobile responsive fix + add copy contract vCOW
---
 src/custom/pages/Profile/index.tsx  |  3 +++
 src/custom/pages/Profile/styled.tsx | 13 +++++++++++++
 2 files changed, 16 insertions(+)

diff --git a/src/custom/pages/Profile/index.tsx b/src/custom/pages/Profile/index.tsx
index cd22a5d76e..54ad5a401d 100644
--- a/src/custom/pages/Profile/index.tsx
+++ b/src/custom/pages/Profile/index.tsx
@@ -211,6 +211,9 @@ export default function Profile() {
               <ExtLink href={getBlockExplorerUrl(chainId || 1, V_COW_CONTRACT_ADDRESS[chainId || 1], 'address')}>
                 Contract ↗
               </ExtLink>
+              <CopyHelper toCopy={V_COW_CONTRACT_ADDRESS[chainId || 1]}>
+                <div title="Click to copy token contract address">Copy contract</div>
+              </CopyHelper>
             </CardActions>
           </Card>
         )}
diff --git a/src/custom/pages/Profile/styled.tsx b/src/custom/pages/Profile/styled.tsx
index 89c576bc40..c6edaec647 100644
--- a/src/custom/pages/Profile/styled.tsx
+++ b/src/custom/pages/Profile/styled.tsx
@@ -439,6 +439,14 @@ export const CardActions = styled.div`
   justify-content: space-between;
   margin: auto 0 0;
 
+  ${({ theme }) => theme.mediaWidth.upToSmall`
+    justify-content: center;
+    align-items: center;
+    flex-flow: column wrap;
+    gap: 32px 0;
+    margin: 12px 0;
+  `};
+
   > a,
   ${AddToMetaMask}, > ${ClickToCopy} {
     font-size: 13px;
@@ -454,6 +462,11 @@ export const CardActions = styled.div`
     text-decoration-color: transparent;
     transition: text-decoration-color 0.2s ease-in-out, color 0.2s ease-in-out;
 
+    ${({ theme }) => theme.mediaWidth.upToSmall`
+      font-size: 15px;
+      margin: 0 auto;
+    `};
+
     &:hover {
       text-decoration-color: ${({ theme }) => theme.primary1};
       color: ${({ theme }) => theme.primary1};