fix: issues found

Ref: #1456, #1457, #1458, #1460
Itheum · Oct 12, 2024 · e0cb1cb · e0cb1cb
1 parent e1e3843
commit e0cb1cb
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 26 deletions.
diff --git a/src/components/Liveliness/LivelinessStakingSol.tsx b/src/components/Liveliness/LivelinessStakingSol.tsx
@@ -954,7 +954,7 @@ export const LivelinessStakingSol: React.FC = () => {
                             onClick={() => {
                               setWithdrawBondConfirmationWorkflow({
                                 bondId: currentBond.bondId,
-                                bondAmount: ((currentBond.bondAmount.toNumber() / 10 ** 9) * withdrawPenalty) / 100,
+                                bondAmount: currentBond.bondAmount.toNumber() / 10 ** 9,
                               });
                             }}>
                             Withdraw Bond
@@ -1095,21 +1095,35 @@ export const LivelinessStakingSol: React.FC = () => {
               setWithdrawBondConfirmationWorkflow(undefined);
             }}
             onProceed={() => {
-              handleWithdrawBondClick(withdrawBondConfirmationWorkflow!.bondId!, (withdrawBondConfirmationWorkflow!.bondAmount * withdrawPenalty) / 100);
+              handleWithdrawBondClick(
+                withdrawBondConfirmationWorkflow!.bondId!,
+                withdrawBondConfirmationWorkflow!.bondAmount - (withdrawBondConfirmationWorkflow!.bondAmount * withdrawPenalty) / 100
+              );
               setWithdrawBondConfirmationWorkflow(undefined);
             }}
             bodyContent={
               <>
                 <Text fontSize="sm" pb={3} opacity=".8">
-                  {`Collection: ${withdrawBondConfirmationWorkflow?.bondId}, Bond Amount: ${withdrawBondConfirmationWorkflow?.bondAmount}`}
+                  {`Collection: ${withdrawBondConfirmationWorkflow?.bondId},   Bond Amount: ${withdrawBondConfirmationWorkflow?.bondAmount}`}
+                </Text>
+                <Text color={"red"} fontWeight="bold" fontSize="lg" pb={3} opacity="1">
+                  {`Bond Amount to receive: ${(
+                    (withdrawBondConfirmationWorkflow?.bondAmount ?? 0) -
+                    ((withdrawBondConfirmationWorkflow?.bondAmount ?? 0) * withdrawPenalty) / 100
+                  ).toFixed(2)}`}
                 </Text>
                 <Text mb="5">There are a few items to consider before you proceed with the bond withdraw:</Text>
                 <UnorderedList mt="2" p="2">
-                  <ListItem>Withdrawing before bond expiry incurs a penalty; no penalty after expiry, and you get the full amount back.</ListItem>
+                  <ListItem>
+                    Withdrawing before bond expiry incurs a penalty of{" "}
+                    <Text as="span" fontSize="md" color="red">
+                      {withdrawPenalty}%
+                    </Text>
+                    ; no penalty after expiry, and you get the full amount back.
+                  </ListItem>
                   <ListItem>Penalties are non-refundable.</ListItem>
                   <ListItem>After withdrawal, your Liveliness score drops to zero, visible to buyers if your Data NFT is listed.</ListItem>
                   <ListItem>Once withdrawn, you {`can't `}re-bond to regain the Liveliness score or earn staking rewards.</ListItem>
-                  <ListItem>If the bond was linked to your Primary NFMe ID Vault, {`you'll`} need to set up a new one as your primary.</ListItem>
                 </UnorderedList>
 
                 <Text mt="5">With the above in mind, are your SURE you want to proceed and Withdraw Bond?</Text>

diff --git a/src/components/SolanaNfts/WalletDataNftSol.tsx b/src/components/SolanaNfts/WalletDataNftSol.tsx
@@ -4,13 +4,16 @@ import { Box, Skeleton } from "@chakra-ui/react";
 import { DasApiAsset } from "@metaplex-foundation/digital-asset-standard-api";
 import NftMediaComponent from "components/NftMediaComponent";
 import { DEFAULT_NFT_IMAGE } from "libs/mxConstants";
+import { SOLANA_EXPLORER_URL } from "libs/Solana/config";
+import { useNetworkConfiguration } from "contexts/sol/SolNetworkConfigurationProvider";
 
 interface WalletDataNftSolProps {
   index: number;
   solDataNft: DasApiAsset;
 }
 
 const WalletDataNftSol: React.FC<WalletDataNftSolProps> = ({ index, solDataNft }) => {
+  const { networkConfiguration } = useNetworkConfiguration();
   return (
     <Skeleton fitContent={true} isLoaded={true} borderRadius="16px" display="flex" alignItems="center" justifyContent="center">
       <Box
@@ -30,7 +33,9 @@ const WalletDataNftSol: React.FC<WalletDataNftSolProps> = ({ index, solDataNft }
           imageWidth="236px"
           autoSlideInterval={Math.floor(Math.random() * 6000 + 6000)} // random number between 6 and 12 seconds
           onLoad={() => {}}
-          openNftDetailsDrawer={() => {}}
+          openNftDetailsDrawer={() => {
+            window.open(`${SOLANA_EXPLORER_URL}address/${solDataNft.id}?cluster=${networkConfiguration}`, "_blank");
+          }}
           marginTop="1.5rem"
           borderRadius="16px"
         />

diff --git a/src/pages/AdvertiseData/TradeData.tsx b/src/pages/AdvertiseData/TradeData.tsx
@@ -63,30 +63,29 @@ export const TradeData: React.FC = () => {
           Mint your Data Streams or Data Assets as Data NFTs and list and trade them in the peer-to-peer Data NFT Marketplace.
         </Heading>
         <Wrap shouldWrapChildren={true} spacing={5} display={"flex"} flexDir={"row"} justifyContent={{ base: "center", md: "start" }} overflow={"unset"}>
-          {!connected && (
-            <Box maxW="xs" overflow="hidden" mt={5} border=".01rem solid transparent" borderColor="#00C79740" borderRadius="0.75rem">
-              <Image src="https://itheum-static.s3.ap-southeast-2.amazonaws.com/data-stream.png" alt="" rounded="lg" />
+          <Box maxW="xs" overflow="hidden" mt={5} border=".01rem solid transparent" borderColor="#00C79740" borderRadius="0.75rem">
+            <Image src="https://itheum-static.s3.ap-southeast-2.amazonaws.com/data-stream.png" alt="" rounded="lg" />
 
-              <Box p="6">
-                <Box display="flex" alignItems="baseline">
-                  <Box mt="1" fontWeight="semibold" as="h4" lineHeight="tight" noOfLines={1}>
-                    Any Data Stream as a Data NFT-FT
-                  </Box>
+            <Box p="6">
+              <Box display="flex" alignItems="baseline">
+                <Box mt="1" fontWeight="semibold" as="h4" lineHeight="tight" noOfLines={1}>
+                  Any Data Stream as a Data NFT-FT
                 </Box>
-                <Button
-                  mt="3"
-                  colorScheme="teal"
-                  variant="outline"
-                  borderRadius="xl"
-                  onClick={() => {
-                    setIsDrawerOpen(!isDrawerOpen);
-                    setPrefilledData(null);
-                  }}>
-                  <Text color={colorMode === "dark" ? "white" : "black"}>Mint Data NFT</Text>
-                </Button>
               </Box>
+              <Button
+                mt="3"
+                colorScheme="teal"
+                variant="outline"
+                borderRadius="xl"
+                onClick={() => {
+                  setIsDrawerOpen(!isDrawerOpen);
+                  setPrefilledData(null);
+                }}>
+                <Text color={colorMode === "dark" ? "white" : "black"}>Mint Data NFT</Text>
+              </Button>
             </Box>
-          )}
+          </Box>
+
           <ProgramCard
             key={nfMeIDVaultConfig.program}
             item={nfMeIDVaultConfig}