From 6d44c7a44c688513dd329b6df70e7ab0a9d07973 Mon Sep 17 00:00:00 2001
From: Joe Zhu <aidai524@gmail.com>
Date: Mon, 5 Feb 2024 23:40:46 +0800
Subject: [PATCH] update farm apy position (#473)

Co-authored-by: xieqian <dss@192.168.0.100>
---
 src/components/meme/SeedsBox.tsx | 39 ++++++++++++++++++++++++++++----
 1 file changed, 34 insertions(+), 5 deletions(-)

diff --git a/src/components/meme/SeedsBox.tsx b/src/components/meme/SeedsBox.tsx
index 8243adcc8..551ee1a0d 100644
--- a/src/components/meme/SeedsBox.tsx
+++ b/src/components/meme/SeedsBox.tsx
@@ -193,6 +193,16 @@ const SeedsBox = () => {
     </div>`;
     return result;
   }
+  function getFarmAPYTip(seed_id) {
+    const b = getSeedApr(lpSeeds[seed_id]);
+    const result = `<div class="px-2 text-xs text-farmText">
+          <div class="flex items-center justify-between text-xs text-farmText gap-3.5">
+              <span>Farm APR</span>
+              <span class="text-white text-sm">${formatPercentage(b)}</span>
+          </div>
+    </div>`;
+    return result;
+  }
   return (
     <div className="grid gap-4 mt-14 xsm:grid-cols-1 xsm:grid-rows-1 lg:grid-cols-2 lg:grid-rows-2 xsm:mx-3">
       {Object.entries(seeds).map(([seed_id, seed]) => {
@@ -227,7 +237,7 @@ const SeedsBox = () => {
                   <span className="text-xl gotham_bold text-white">
                     {seed.token_meta_data.symbol}
                   </span>
-                  {hasLpSeed ? (
+                  {/* {hasLpSeed ? (
                     <div
                       onClick={() => {
                         goFarmDetail(seed_id);
@@ -254,7 +264,26 @@ const SeedsBox = () => {
                       </div>
                       <CustomTooltip id={`lp_farm_${seed_id}`} />
                     </div>
-                  )}
+                  )} */}
+                  <div
+                    data-class="reactTip"
+                    data-tooltip-id={`lp_farm_${seed_id}`}
+                    data-place="top"
+                    data-tooltip-html={getFarmAPYTip(seed_id)}
+                  >
+                    <div
+                      onClick={() => {
+                        goFarmDetail(seed_id);
+                      }}
+                      className="flex items-center border border-memePoolBoxBorderColor gap-2 rounded-lg h-8 px-2 cursor-pointer"
+                    >
+                      <span className="text-xs text-white">
+                        {seed.token_meta_data.symbol}/NEAR
+                      </span>
+                      <ArrowRightIcon />
+                    </div>
+                    <CustomTooltip id={`lp_farm_${seed_id}`} />
+                  </div>
                 </div>
                 <p className="text-sm text-primaryText xsm:hidden">
                   {memeConfig.description[seed_id]}
@@ -278,8 +307,8 @@ const SeedsBox = () => {
                 seed={seeds[seed_id]}
                 pending={is_pending}
                 ended={is_ended}
-                subValue={getSeedApr(lpSeeds[seed_id])}
-                subTargetValue={hasLpSeed ? '' : '-'}
+                // subValue={getSeedApr(lpSeeds[seed_id])}
+                // subTargetValue={hasLpSeed ? '' : '-'}
                 isAPY={true}
               />
               <Template title="Feeders" value={getFeeder(seed_id)} />
@@ -481,7 +510,7 @@ function Template({
         </div>` +
       farmStr +
       `</div>
-        <div class="flex items-center justify-between text-xs text-farmText gap-3.5 mt-2">
+        <div class="hidden items-center justify-between text-xs text-farmText gap-3.5 mt-2">
           <span>Farm APR</span>
           <span class="text-white text-sm">${
             subTargetValue || formatPercentage(subValue)