Merge branch 'master' of https://github.com/cybercongress/cyb-ts into…

… feat/tauri-app
cybercongress · Aug 15, 2024 · f1472ed · f1472ed
2 parents 197d3f7 + 727d9c6
commit f1472ed
Show file tree

Hide file tree

Showing 10 changed files with 67 additions and 89 deletions.
diff --git a/src/components/Tabs/TabItem/TabItem.module.scss b/src/components/Tabs/TabItem/TabItem.module.scss
@@ -3,7 +3,7 @@
 @mixin active-saber($position) {
   $color-saber: 'white';
   color: #fff;
-  font-size: 1.125rem;
+  font-size: 24px;
 
   &:hover {
     color: #fff;
@@ -12,9 +12,7 @@
 
   @if ($position ==left or $position ==right) {
     @include saber($color-saber, $position);
-  }
-
-  @else {
+  } @else {
     @include saber-horizontal($color-saber);
   }
 }
@@ -36,6 +34,7 @@
   width: 100%;
   font-size: 1rem;
   z-index: 0;
+  transition: all 0.3s ease;
 
   &:hover {
     color: var(--blue-light);
@@ -78,7 +77,7 @@
   @include changeWidth('before');
 
   &::before {
-    width: 100%
+    width: 100%;
   }
 
   border-right: unset;
@@ -91,4 +90,4 @@
     @include active-saber(left);
     @include changeWidth('before');
   }
-}
+}
diff --git a/src/components/tooltip/tooltip.tsx b/src/components/tooltip/tooltip.tsx
@@ -24,6 +24,7 @@ export type TooltipProps = {
 function AdviserTooltipWrapper({
   children,
   tooltip,
+  contentStyle,
 }: {
   children: React.ReactNode;
   tooltip: React.ReactNode;
@@ -47,7 +48,7 @@ function AdviserTooltipWrapper({
   return (
     <div
       ref={ref}
-      // style={contentStyle}
+      style={contentStyle}
       onMouseEnter={onMouseEnter}
       onMouseLeave={onMouseLeave}
     >

diff --git a/src/components/valueImg/imgDenom.tsx b/src/components/valueImg/imgDenom.tsx
@@ -9,9 +9,9 @@ import hydrogen from 'images/hydrogen.svg';
 import tocyb from 'images/boot.png';
 import boot from 'images/large-green.png';
 import defaultImg from 'images/large-orange-circle.png';
+import useQueueIpfsContent from 'src/hooks/useQueueIpfsContent';
 import Tooltip from '../tooltip/tooltip';
 import { trimString } from '../../utils/utils';
-import useQueueIpfsContent from 'src/hooks/useQueueIpfsContent';
 import styles from './TextDenom.module.scss';
 import lp from './images/lp.png';
 
@@ -129,6 +129,7 @@ function ImgDenom({
       <div>
         <Tooltip
           placement="top"
+          contentStyle={{ display: 'flex' }}
           tooltip={<div className={styles.denom}>{tooltipText}</div>}
         >
           {img}

diff --git a/src/containers/ipfs/components/AdviserMeta/AdviserMeta.module.scss b/src/containers/ipfs/components/AdviserMeta/AdviserMeta.module.scss
@@ -31,7 +31,7 @@
 
     .rank {
       display: flex;
-      align-items: center;
+      align-items: baseline;
       gap: 5px;
       color: rgb(221 255 255 / 38%);
       font-size: 14px;
@@ -40,6 +40,14 @@
         color: white;
         line-height: 23px;
       }
+
+      a {
+        cursor: help;
+
+        &:hover {
+          opacity: 0.8;
+        }
+      }
     }
   }
 

diff --git a/src/containers/ipfs/components/AdviserMeta/AdviserMeta.tsx b/src/containers/ipfs/components/AdviserMeta/AdviserMeta.tsx
@@ -1,4 +1,4 @@
-import { Rank, Account } from 'src/components';
+import { Account } from 'src/components';
 import { timeSince, formatCurrency } from 'src/utils/utils';
 import useRank from 'src/features/cyberlinks/rank/useRank';
 import { Link } from 'react-router-dom';
@@ -27,7 +27,14 @@ function AdviserMeta({ cid, type, size }: Props) {
             <span className={styles.number}>
               {rank.toLocaleString().replaceAll(',', ' ')}
             </span>
-            <Rank hash={cid} rank={rank} />
+            <Link
+              to="https://docs.cyb.ai/#/page/cyberank"
+              replace
+              target="_blank"
+            >
+              🦠
+            </Link>
+            {/* <Rank hash={cid} rank={rank} /> */}
           </div>
         )}
       </div>

diff --git a/src/containers/mint/InfoText/InfoText.module.scss b/src/containers/mint/InfoText/InfoText.module.scss
@@ -2,9 +2,6 @@
   text-align: center;
   grid-area: 2/2/2/2;
   font-size: 16px;
-  position: absolute;
-  bottom: 30px;
-
   color: var(--grayscale-dark);
 
   strong {
@@ -13,7 +10,7 @@
     white-space: nowrap;
   }
 
-  >div {
+  > div {
     display: inline-block !important;
   }
-}
+}
diff --git a/src/containers/sigma/components/CardPassport/index.tsx b/src/containers/sigma/components/CardPassport/index.tsx
@@ -1,9 +1,9 @@
 import { useMemo, useEffect, useContext } from 'react';
-import { Dots, ContainerGradientText } from '../../../../components';
+import { Citizenship } from 'src/types/citizenship';
+import { Dots } from '../../../../components';
 import { useGetBalanceBostrom } from '../../hooks';
 import { SigmaContext } from '../../SigmaContext';
 import { TitleCard, RowBalancesDetails } from '../cardUi';
-import { Citizenship } from 'src/types/citizenship';
 import styles from './CardPassport.module.scss';
 
 type Props = {
@@ -24,7 +24,9 @@ function CardPassport({
     useGetBalanceBostrom(address);
 
   useEffect(() => {
-    if (!address) return;
+    if (!address) {
+      return;
+    }
 
     updateDataCap({ [address]: { ...totalAmountInLiquid } });
   }, [address, totalAmountInLiquid]);

diff --git a/src/containers/sigma/components/cardUi/RowBalancesDetails/index.tsx b/src/containers/sigma/components/cardUi/RowBalancesDetails/index.tsx
@@ -30,8 +30,6 @@ function RowBalancesDetails({ balance }) {
     return false;
   }, [balance]);
 
-  // console.log('balance', balance)
-
   const useAmountTotal = useMemo(() => {
     if (balance.total) {
       const { amount, denom } = balance.total;
@@ -118,14 +116,11 @@ function RowBalancesDetails({ balance }) {
           {(state) => {
             return (
               <div
-                className={cx(styles.containerDetailsBalance, {
-                  [styles[`containerDetailsBalance${state}`]]:
-                    Object.keys(balance).length === 5,
-                  [styles[`containerDetailsBalanceMain${state}`]]:
-                    Object.keys(balance).length === 7,
-                  [styles[`containerDetailsBalanceMainComm${state}`]]:
-                    Object.keys(balance).length === 8,
-                })}
+                className={cx(
+                  styles.containerDetailsBalance,
+                  styles[`containerDetailsBalance${state}`],
+                  styles[`length-${Object.keys(balance).length}`]
+                )}
               >
                 <DetailsBalance data={balance} />
               </div>

diff --git a/src/containers/sigma/components/cardUi/RowBalancesDetails/styles.module.scss b/src/containers/sigma/components/cardUi/RowBalancesDetails/styles.module.scss
@@ -1,4 +1,4 @@
-@import 'src/style/mixins.scss';
+@import 'src/style/mixins';
 
 .container {
   display: grid;
@@ -10,85 +10,46 @@
 
 .containerDetailsBalance {
   position: relative;
-  min-height: 0px;
-  height: 0px;
+  min-height: 0;
+  height: 0;
   padding-left: 23px;
   transition: 0.5s ease-in-out;
   opacity: 0;
 
   &entering {
-    opacity: 0;
     transition: 1ms ease-in-out;
   }
 
   &entered {
     opacity: 1;
-    min-height: 110px;
-    height: 1px;
-    margin-top: 30px;
-  }
-
-  &exiting {
-    opacity: 0;
-    transition: 0.3s ease-in-out;
-  }
-
-  &exited {
-    opacity: 0;
-    height: 0px;
-    min-height: 0px;
-    visibility: hidden;
-  }
-}
-
-.containerDetailsBalanceMain {
-  &entering {
-    opacity: 0;
-    transition: 1ms ease-in-out;
-  }
 
-  &entered {
-    opacity: 1;
-    min-height: 200px;
-    height: 1px;
-    margin-top: 20px;
-  }
+    &.length- {
+      &5 {
+        min-height: 110px;
+      }
 
-  &exiting {
-    opacity: 0;
-    transition: 0.5s ease-in-out;
-  }
+      &6 {
+        min-height: 170px;
+      }
 
-  &exited {
-    opacity: 0;
-    height: 0px;
-    min-height: 0px;
-    visibility: hidden;
-  }
-}
+      &7 {
+        min-height: 200px;
+      }
 
-.containerDetailsBalanceMainComm {
-  &entering {
-    opacity: 0;
-    transition: 1ms ease-in-out;
-  }
+      &8 {
+        min-height: 260px;
+      }
+    }
 
-  &entered {
-    opacity: 1;
-    min-height: 260px;
     height: 1px;
     margin-top: 30px;
   }
 
   &exiting {
-    opacity: 0;
-    transition: 0.5s ease-in-out;
+    transition: 0.3s ease-in-out;
   }
 
   &exited {
-    opacity: 0;
-    height: 0px;
-    min-height: 0px;
     visibility: hidden;
   }
 }
diff --git a/src/containers/sigma/hooks/utils.js b/src/containers/sigma/hooks/utils.js
@@ -22,9 +22,12 @@ export const initValueMainToken = {
   melting: { ...initValue },
   growth: { ...initValue },
   total: { ...initValue },
-  cyberver: { ...initValue },
 };
 
+if (isPussyChain) {
+  initValueMainToken.cyberver = { ...initValue };
+}
+
 const initValueResponseFunc = (denom = '', amount = 0) => {
   return { denom, amount };
 };
@@ -95,9 +98,13 @@ function useCyberverBalance({ address }) {
   const total1 = s1.data?.reduce((acc, { stake }) => acc + stake, 0) || 0;
   const total2 = s2.data?.reduce((acc, { stake }) => acc + stake, 0) || 0;
 
-  const totalCyberver = (total1 + total2).toString();
+  const total = total1 + total2;
+
+  if (total === 0) {
+    return null;
+  }
 
-  return totalCyberver;
+  return total.toString();
 }
 
 export const useGetBalance = (addressBech32) => {