Merge pull request #352 from EpicsDAO/improve-doc

Unstake Deactivate Withdraw

website/solv-epics-dev/messages/en/staking.json

@@ -3,21 +3,38 @@
     "title": "SOL Staking",
     "staking": "Staking",
     "unstaking": "Unstaking",
+    "withdraw": "Withdraw",
+    "deactivate": "Deactivate",
     "swap": "Swap",
     "balance": "Balance",
     "updated": "Updated!",
     "stakeSOL": "Stake SOL",
     "stakingInfo": "If you already have a stake account, you can convert it to elSOL with no fees.",
+    "canWithdrawNextEpoch": "You will be able to Withdraw in the epoch following the execution of Deactivate.",
     "stakingFromAccount": "Convert Stake Account",
     "unstakingToAccount": "Unstake to Account",
-    "unstakingCaution": "※ When you unstake, the SOL accumulated after rewards are added will be distributed to your wallet's stake account. By deactivating the stake account, the SOL will be unlocked in the next epoch. (Up to approximately 2 days)",
+    "unstakingCaution": "※ When you unstake, the SOL with the added rewards will be transferred to the stake account of your wallet. By deactivating the stake account, the SOL will unlock in the next epoch, making it withdrawable. (Up to approximately 2 days)",
     "instantUnstaking": "Use Swap to unstake your SOL instantly.",
     "StakingHeroRow": {
       "title1": "Stake SOL to Earn",
       "title2": "Additional Incentives",
       "subtitle1": "Stake your SOL in the elSOL pool (created with Solana Foundation official Stake Pool Program) to earn staking rewards and additional incentives.",
       "subtitle2": "As an elSOL holder, you contribute to the decentralization and security enhancement of the Solana blockchain."
     },
+    "Why1SOLnot1elSOLRow": {
+      "title": "Why is 1 SOL not 1 elSOL?",
+      "summary": "elSOL is a reward-bearing token that increases in value over time as staking rewards accumulate.",
+      "description": "When you stake your SOL, you receive elSOL in return. elSOL represents your staked SOL and the rights to earn staking rewards as a Liquid Staking Token (LST). The staked SOL is then distributed among high-quality validators through the elSOL stake pool, designed to achieve optimal yields. The rewards earned by these validators are added back into the pool, increasing the value of elSOL over time. This is why 1 SOL is not equal to 1 elSOL. By holding elSOL, you continue to accumulate rewards and can benefit more the longer you hold.",
+      "button1": "Get elSOL",
+      "button2": "What is elSOL?"
+    },
+    "HavingLiquidityRow": {
+      "title": "What is a Liquid Staking Token (LST)?",
+      "summary": "Unlike traditional staking, LSTs can be swapped at any time and offer opportunities for additional yield.",
+      "description": "A Liquid Staking Token (LST) represents the ownership of your staked tokens and the rewards they earn, while maintaining liquidity. As an LST, elSOL allows you to freely swap it for other tokens without locking them, unlike traditional staking. Additionally, you can provide elSOL to Liquidity Pools on DeFi platforms like Orca to potentially earn higher yields compared to regular staking. This allows you to earn staking rewards while also leveraging the DeFi ecosystem to maximize your assets' efficiency.",
+      "button1": "Get elSOL",
+      "button2": "DeFi"
+    },
     "DirectStakingRow": {
       "title1": "Stake SOL",
       "title2": "for Max TrueAPY",

website/solv-epics-dev/messages/ja/staking.json

@@ -3,21 +3,38 @@
     "title": "SOL ステーキング",
     "staking": "ステーク",
     "unstaking": "アンステーク",
+    "withdraw": "引き出し",
+    "deactivate": "解除 (Deactivate)",
     "swap": "スワップ",
     "balance": "残高",
     "updated": "更新完了!",
     "stakeSOL": "SOLをステーク",
     "stakingInfo": "すでにステークアカウントをお持ちの方は手数料無料でelSOLと交換することができます。",
+    "canWithdrawNextEpoch": "解除 (Deactivate) を実行した次のエポックにSOLがアンロックされ、「引き出し」が可能になります。",
     "stakingFromAccount": "ステークアカウントを交換",
     "unstakingToAccount": "アカウントにアンステーク",
-    "unstakingCaution": "※ アンステークを行うと、報酬追加後のSOLがステークアカウントとしてご利用のウォレットに払い出されます。ステークアカウントを解除することで次のエポックにSOLがアンロックされます。(最大約2日)",
+    "unstakingCaution": "※ アンステークを行うと、報酬追加後のSOLがステークアカウントとしてご利用のウォレットに払い出されます。ステークアカウントを解除(Deactivate)することで次のエポックにSOLがアンロックされ、引き出しできるようになります。(最大約2日)",
     "instantUnstaking": "即時アンステークにはスワップをご利用ください",
     "StakingHeroRow": {
       "title1": "Stake SOL to Earn",
       "title2": "Additional Incentives",
       "subtitle1": "SOLをelSOLプール(Solana Foundation 公式の Stake Pool Program で作成)にステークし、ステーキング報酬と追加インセンティブを獲得しましょう。",
       "subtitle2": "elSOL ホルダーとして、Solanaブロックチェーンの分散化とセキュリティ向上に貢献できます。"
     },
+    "Why1SOLnot1elSOLRow": {
+      "title": "なぜ 1SOL は 1 elSOL ではないの？",
+      "summary": "elSOLは時間の経過とともに報酬が蓄積され、その価値が増加するリワードベアリング型のトークンです。",
+      "description": "あなたがSOLをステークする際、その対価としてelSOLを受け取ります。elSOLはステークされたSOLと、その報酬を受け取る権利を表すLiquid Staking Token (LST) です。その後、ステークされたSOLはelSOLステークプールを通じて高品質なバリデータに分散ステーキングされ、最適な利回りを得るように設計されています。バリデータから得られた報酬はプールに蓄積されるため、時間の経過とともにelSOLの価値が増加します。これが、1 SOLが1 elSOLと等価ではなくなる理由です。長期保有することでelSOLは報酬を蓄積し、より多くの利益を得ることが可能です。",
+      "button1": "Get elSOL",
+      "button2": "elSOL とは？"
+    },
+    "HavingLiquidityRow": {
+      "title": "Liquid Staking Token (LST) とは？",
+      "summary": "通常のステーキングとは異なり、いつでもトークンスワップが可能であり、追加の利回りを狙うこともできます。",
+      "description": "Liquid Staking Token (LST) とは、ステーキングされたトークンの所有権と報酬を表す、流動性のあるトークンです。elSOLはLSTであるため、通常のステーキングのようにトークンをロックする必要がなく、いつでも自由に他のトークンと交換可能です。また、elSOLをOrca等のDeFiプラットフォームのLiquidity Poolに提供することで、通常のステーキングよりも高い利回りを狙うことができます。これにより、ステーキング報酬を受け取りつつ、DeFiエコシステムで資産を効率的に運用することが可能となります。",
+      "button1": "Get elSOL",
+      "button2": "DeFi"
+    },
     "DirectStakingRow": {
       "title1": "Stake SOL",
       "title2": "for Max TrueAPY",

website/solv-epics-dev/src/app/[locale]/(default)/staking/DirectStakingTabs.tsx

@@ -7,19 +7,22 @@ import { useState } from 'react'
 import BlinksWalletIndicator from '@/components/solana/BlinksWalletIndicator'
 import BlinksComponent from '@/components/solana/BlinksComponent'
 import { VALIDATORS_BLINKS_BASE_URL } from '@/constants/links'
+import { useWallet } from '@solana/wallet-adapter-react'
+import { Button } from '@/components/ui/button'
 
 export default function DirectStakingTabs() {
   const t = useTranslations()
-
+  const { publicKey } = useWallet()
   const [tabValue, setTabValue] = useState('epics')
 
   return (
     <>
       <div className="grid gap-6">
         <Tabs value={tabValue} onValueChange={setTabValue} className="w-full">
-          <TabsList className="mb-7 grid w-full grid-cols-2">
+          <TabsList className="mb-7 grid w-full grid-cols-3">
             <TabsTrigger value="epics">Epics DAO</TabsTrigger>
             <TabsTrigger value="labo">ELSOUL</TabsTrigger>
+            <TabsTrigger value="unstake">{t('staking.unstaking')}</TabsTrigger>
           </TabsList>
           <TabsContent value="epics">
             <BlinksComponent
@@ -31,6 +34,35 @@ export default function DirectStakingTabs() {
               actionUrl={`${VALIDATORS_BLINKS_BASE_URL}/v1/stake/delegate?validator=labo`}
             />
           </TabsContent>
+          <TabsContent value="unstake">
+            <BlinksComponent
+              actionUrl={`${VALIDATORS_BLINKS_BASE_URL}/v1/unstake/deactivate?pubkey=${publicKey}`}
+            />
+            {publicKey && (
+              <div className="mt-5 grid gap-4 sm:grid-cols-7">
+                <div className="w-full sm:col-span-5">
+                  <p className="text-xs text-zinc-500 dark:text-zinc-200">
+                    {t('staking.canWithdrawNextEpoch')}
+                  </p>
+                </div>
+                <div className="flex w-full flex-col items-center justify-center sm:col-span-2">
+                  <Button
+                    variant="outline"
+                    onClick={() => {
+                      setTabValue('withdraw')
+                    }}
+                  >
+                    {t('staking.withdraw')}
+                  </Button>
+                </div>
+              </div>
+            )}
+          </TabsContent>
+          <TabsContent value="withdraw">
+            <BlinksComponent
+              actionUrl={`${VALIDATORS_BLINKS_BASE_URL}/v1/unstake/withdraw?pubkey=${publicKey}`}
+            />
+          </TabsContent>
         </Tabs>
         <BlinksWalletIndicator />
       </div>

website/solv-epics-dev/src/app/[locale]/(default)/staking/StakingTabs.tsx

@@ -80,8 +80,26 @@ export default function StakingTabs() {
                   <p className="text-xs text-zinc-500 dark:text-zinc-200">
                     {t('staking.unstakingCaution')}
                   </p>
+                  <div className="my-4 flex flex-row items-center gap-4">
+                    <Button
+                      variant="outline"
+                      onClick={() => {
+                        setTabValue('deactivate')
+                      }}
+                    >
+                      {t('staking.deactivate')}
+                    </Button>
+                    <Button
+                      variant="outline"
+                      onClick={() => {
+                        setTabValue('withdraw')
+                      }}
+                    >
+                      {t('staking.withdraw')}
+                    </Button>
+                  </div>
                 </div>
-                <div className="flex w-full flex-col items-center justify-center sm:col-span-2">
+                <div className="flex w-full flex-col items-center justify-start sm:col-span-2">
                   <p className="px-1 pb-2 text-center text-xs text-zinc-500 dark:text-zinc-200">
                     {t('staking.instantUnstaking')}
                   </p>
@@ -97,6 +115,35 @@ export default function StakingTabs() {
               </div>
             )}
           </TabsContent>
+          <TabsContent value="deactivate">
+            <BlinksComponent
+              actionUrl={`${VALIDATORS_BLINKS_BASE_URL}/v1/unstake/deactivate?pubkey=${publicKey}`}
+            />
+            {publicKey && (
+              <div className="mt-5 grid gap-4 sm:grid-cols-7">
+                <div className="w-full sm:col-span-5">
+                  <p className="text-xs text-zinc-500 dark:text-zinc-200">
+                    {t('staking.canWithdrawNextEpoch')}
+                  </p>
+                </div>
+                <div className="flex w-full flex-col items-center justify-center sm:col-span-2">
+                  <Button
+                    variant="outline"
+                    onClick={() => {
+                      setTabValue('withdraw')
+                    }}
+                  >
+                    {t('staking.withdraw')}
+                  </Button>
+                </div>
+              </div>
+            )}
+          </TabsContent>
+          <TabsContent value="withdraw">
+            <BlinksComponent
+              actionUrl={`${VALIDATORS_BLINKS_BASE_URL}/v1/unstake/withdraw?pubkey=${publicKey}`}
+            />
+          </TabsContent>
           <TabsContent value="swap">
             <BlinksComponent
               actionUrl={`${VALIDATORS_BLINKS_BASE_URL}/v1/swap?pubkey=${publicKey}`}