fix feedback

bancorprotocol · Jun 8, 2022 · abcb42c · abcb42c
1 parent 64ffd05
commit abcb42c
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 13 deletions.
diff --git a/src/elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldings.tsx b/src/elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldings.tsx
@@ -1,9 +1,10 @@
-import { memo, useState } from 'react';
+import { memo } from 'react';
 import V3ExternalHoldingsItem from 'elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldingsItem';
 import { Navigation } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/react/swiper-react';
 import { NavigationOptions } from 'swiper/types';
 import { useExternalHoldings } from 'elements/earn/portfolio/v3/externalHoldings/useExternalHoldings';
+import { ReactComponent as IconArrow } from 'assets/icons/arrow.svg';
 
 const navOptions: NavigationOptions = {
   nextEl: '.external-holding-swiper-next-btn',
@@ -13,12 +14,14 @@ const navOptions: NavigationOptions = {
 };
 
 const V3ExternalHoldings = () => {
-  const [activeIndex, setActiveIndex] = useState(1);
   const { positions } = useExternalHoldings();
 
   return positions.length ? (
     <section className="content-block p-20">
-      <h2>External Holdings at risk</h2>
+      <h2>
+        External Holdings at risk{' '}
+        <span className="text-14 text-secondary">({positions.length})</span>
+      </h2>
       <p className="mt-10 mb-20 text-secondary">
         Your holdings on other platforms are vulnerable to impermanent loss
       </p>
@@ -27,9 +30,6 @@ const V3ExternalHoldings = () => {
         spaceBetween={20}
         slidesPerView={1}
         grabCursor
-        onActiveIndexChange={({ activeIndex }) =>
-          setActiveIndex(activeIndex + 1)
-        }
         navigation={navOptions}
       >
         {positions.map((pos, i) => (
@@ -40,16 +40,13 @@ const V3ExternalHoldings = () => {
       </Swiper>
 
       {positions.length > 1 && (
-        <div className="space-x-10 flex items-center mt-10">
+        <div className="space-x-30 flex items-center mt-10">
           <button className="external-holding-swiper-prev-btn hover:text-primary">
-            {'<-'}
+            <IconArrow className="w-10 rotate-[-90deg]" />
           </button>
           <button className="external-holding-swiper-next-btn hover:text-primary">
-            {'->'}
+            <IconArrow className="w-10 rotate-[90deg]" />
           </button>
-          <div>
-            {activeIndex} of {positions.length}
-          </div>
         </div>
       )}
     </section>

diff --git a/src/elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldingsItem.tsx b/src/elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldingsItem.tsx
@@ -43,7 +43,10 @@ const V3ExternalHoldingsItem = ({ position }: Props) => {
       </div>
       <div className="mt-6 flex justify-between">
         <div>Rekt Status: </div>
-        <div className="text-error">{position.rektStatus}</div>
+        <div className="text-error">
+          {position.rektStatus !== 'At risk' && '-'}
+          {position.rektStatus}
+        </div>
       </div>
       <Button
         variant={ButtonVariant.Secondary}

diff --git a/src/elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldingsModal.tsx b/src/elements/earn/portfolio/v3/externalHoldings/V3ExternalHoldingsModal.tsx
@@ -155,6 +155,10 @@ export const V3ExternalHoldingsModal = ({
           </div>
         )}
 
+        <div className="mt-20 text-secondary text-center">
+          Amounts might vary on execution
+        </div>
+
         <Button
           onClick={handleButtonClick}
           size={ButtonSize.Full}