Merge pull request #114 from mstable/feat/yield-app-link

Feat/yield app link
mstable · Aug 3, 2023 · 7e3cf24 · 7e3cf24
2 parents 71d4a2a + ba007ad
commit 7e3cf24
Show file tree

Hide file tree

Showing 4 changed files with 75 additions and 44 deletions.
diff --git a/src/components/home/Adverts.tsx b/src/components/home/Adverts.tsx
@@ -8,51 +8,72 @@ import { LinkButton } from '../CTA'
 
 import type { FC } from 'react'
 
-const Container = styled.section`
+const Container = styled.div`
   width: 100%;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   gap: 2rem;
+`
+
+const ContainerWithSpacing = styled(Container)`
   ${({ theme }) => theme.mixins.sectionSpacing};
 `
 
 export const Adverts: FC = () => (
-  <Container>
-    <Card bgColor="blue">
-      <CardHeader>
-        <h2>New MTA Yield</h2>
-      </CardHeader>
-      <CardContent>
-        <p>
-          New opportunity to earn <b>&gt;100% APR</b> by providing MTA liquidity on Optimism Velodrome.
-        </p>
-      </CardContent>
-      <CardActions>
-        <LinkButton href="https://app.optimism.io/bridge/deposit" highlight>
-          Bridge to Optimism
-        </LinkButton>
-        <LinkButton
-          href="https://app.velodrome.finance/deposit?token0=0x7f5c764cbc14f9669b88837ca1490cca17c31607&token1=0x929b939f8524c3be977af57a4a0ad3fb1e374b50&stable=false"
-          highlight
-        >
-          Earn &gt;100% APR
-        </LinkButton>
-      </CardActions>
-    </Card>
-    <Card bgColor="pink">
-      <CardHeader>
-        <h2>MTA Buyback</h2>
-      </CardHeader>
-      <CardContent>
-        <p>Burn MTA to receive stablecoin yield on Optimism. Swap fixed at $0.0318 USD / MTA.</p>
-      </CardContent>
-      <CardActions>
-        <LinkButton href="" disabled>
-          More Coming Soon
-        </LinkButton>
-      </CardActions>
-    </Card>
-  </Container>
+  <>
+    <Container>
+      <Card bgColor="pink">
+        <CardHeader>
+          <h2>mStable Meta Harvester</h2>
+        </CardHeader>
+        <CardContent>
+          <p>Discover the Future of Yield Farming! 🚀</p>
+          <p>Unlock maximum returns with Meta Harvester, the vault that redefines DeFi yield farming. </p>
+        </CardContent>
+        <CardActions>
+          <LinkButton href="https://yield.mstable.app/vault/0x9c6de13d4648a6789017641f6b1a025816e66228" highlight external={false}>
+            Meta Harvester
+          </LinkButton>
+        </CardActions>
+      </Card>
+    </Container>
+    <ContainerWithSpacing>
+      <Card bgColor="blue">
+        <CardHeader>
+          <h2>New MTA Yield</h2>
+        </CardHeader>
+        <CardContent>
+          <p>
+            New opportunity to earn <b>&gt;100% APR</b> by providing MTA liquidity on Optimism Velodrome.
+          </p>
+        </CardContent>
+        <CardActions>
+          <LinkButton href="https://app.optimism.io/bridge/deposit" highlight>
+            Bridge to Optimism
+          </LinkButton>
+          <LinkButton
+            href="https://app.velodrome.finance/deposit?token0=0x7f5c764cbc14f9669b88837ca1490cca17c31607&token1=0x929b939f8524c3be977af57a4a0ad3fb1e374b50&stable=false"
+            highlight
+          >
+            Earn &gt;100% APR
+          </LinkButton>
+        </CardActions>
+      </Card>
+      <Card bgColor="pink">
+        <CardHeader>
+          <h2>MTA Buyback</h2>
+        </CardHeader>
+        <CardContent>
+          <p>Burn MTA to receive stablecoin yield on Optimism. Swap fixed at $0.0318 USD / MTA.</p>
+        </CardContent>
+        <CardActions>
+          <LinkButton href="https://withdraw.mstable.app/burn" external={false}>
+            MTA Buyback
+          </LinkButton>
+        </CardActions>
+      </Card>
+    </ContainerWithSpacing>
+  </>
 )
diff --git a/src/components/home/Products.tsx b/src/components/home/Products.tsx
@@ -28,8 +28,8 @@ export const Products: FC = () => {
           <p>New yield products to earn best in market yields.</p>
         </CardContent>
         <CardActions>
-          <LinkButton href="" disabled>
-            More Coming Soon
+          <LinkButton href="https://yield.mstable.app" highlight external={false}>
+            mStable Yield App
           </LinkButton>
         </CardActions>
       </Card>
@@ -41,7 +41,9 @@ export const Products: FC = () => {
           <p>Withdraw from your legacy mStable product positions.</p>
         </CardContent>
         <CardActions>
-          <LinkButton href="https://withdraw.mstable.app">Legacy Support App</LinkButton>
+          <LinkButton href="https://withdraw.mstable.app" external={false}>
+            Legacy Support
+          </LinkButton>
         </CardActions>
       </Card>
     </Container>

diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
@@ -221,7 +221,8 @@ const KeepUpdated: FC = () => (
 const Risk: FC = () => (
   <RiskContainer>
     <RiskLabel>
-      All DeFi products carry risk. Please do your own research before using.<br/>
+      All DeFi products carry risk. Please do your own research before using.
+      <br />
       <a href="https://docs.mstable.org/advanced/app-usage-terms-and-conditions">Read more ↗</a>
     </RiskLabel>
   </RiskContainer>
@@ -237,7 +238,7 @@ export const Footer: FC = () => {
         <Top>
           <div>
             <Header>Protocol</Header>
-            <ExternalLinkChevron href="https://mstable.app">App</ExternalLinkChevron>
+            <ExternalLinkChevron href="https://yield.mstable.app/">App</ExternalLinkChevron>
             <ExternalLinkChevron href="https://docs.mstable.org/">Documentation</ExternalLinkChevron>
             <ExternalLinkChevron href="https://developers.mstable.org/">Developers</ExternalLinkChevron>
             <LinkChevron href="/save">About Save</LinkChevron>

diff --git a/src/components/layout/Navbar.tsx b/src/components/layout/Navbar.tsx
@@ -91,7 +91,14 @@ const urls: {
   title: string
   href: string
   isButton?: boolean
+  highlight?: boolean
 }[] = [
+  {
+    title: 'Open App',
+    href: 'https://yield.mstable.app/',
+    isButton: true,
+    highlight: true,
+  },
   {
     title: 'Legacy Support',
     href: 'https://withdraw.mstable.app',
@@ -101,10 +108,10 @@ const urls: {
 
 const DesktopLinks: FC = () => (
   <ul>
-    {urls.map(({ title, href, isButton = false }) => (
+    {urls.map(({ title, href, isButton = false, highlight }) => (
       <li key={title}>
         {isButton ? (
-          <LinkButton external={false} href={href}>
+          <LinkButton external={false} href={href} highlight={highlight}>
             {title}
           </LinkButton>
         ) : (