Merge branch 'main' of github.com:ArkProjectNFTs/ark-market into yoha…

…n/home-main-carousel
ArkProjectNFTs · Jul 8, 2024 · 7480d96 · 7480d96
2 parents 738aab6 + 9abb78e
commit 7480d96
Show file tree

Hide file tree

Showing 23 changed files with 481 additions and 197 deletions.
diff --git a/apps/arkmarket/src/app/assets/[contract_address]/[token_id]/components/accept-offer.tsx b/apps/arkmarket/src/app/assets/[contract_address]/[token_id]/components/accept-offer.tsx
@@ -12,30 +12,38 @@ import { useAccount } from "@starknet-react/core";
 import { areAddressesEqual } from "@ark-market/ui";
 import { Button } from "@ark-market/ui/button";
 
-import type { Offer, Token, TokenMarketData } from "~/types";
 import { env } from "~/env";
 
 interface AcceptOfferProps {
-  token: Token;
-  tokenMarketData: TokenMarketData;
-  offer: Offer;
+  offerOrderHash: string;
+  offerAmount: string;
+
+  tokenOwner: string;
+  tokenContractAddress: string;
+  tokenId: string;
+  tokenIsListed: boolean;
+  tokenListingOrderHash: string;
 }
 
 const AcceptOffer: React.FC<AcceptOfferProps> = ({
-  token,
-  tokenMarketData,
-  offer,
+  offerAmount,
+  offerOrderHash,
+  tokenIsListed,
+  tokenListingOrderHash,
+  tokenContractAddress,
+  tokenId,
+  tokenOwner,
 }) => {
   const { address, account } = useAccount();
   const { fulfillOffer, status } = useFulfillOffer();
   const { fulfill: fulfillAuction, status: statusAuction } =
     useFulfillAuction();
   const type = useOrderType({
-    orderHash: BigInt(tokenMarketData.order_hash),
+    orderHash: BigInt(tokenListingOrderHash),
   });
   const isAuction = type === "AUCTION";
-  const isOwner = areAddressesEqual(token.owner, address);
-  const isListed = tokenMarketData.is_listed;
+  const isOwner = areAddressesEqual(tokenOwner, address);
+  const isListed = tokenIsListed;
 
   if (!account || !isOwner) {
     return null;
@@ -46,19 +54,19 @@ const AcceptOffer: React.FC<AcceptOfferProps> = ({
       await fulfillAuction({
         starknetAccount: account,
         brokerId: env.NEXT_PUBLIC_BROKER_ID,
-        tokenAddress: token.contract_address,
-        tokenId: token.token_id,
-        orderHash: tokenMarketData.order_hash,
-        relatedOrderHash: offer.order_hash,
-        startAmount: offer.offer_amount,
+        tokenAddress: tokenContractAddress,
+        tokenId,
+        orderHash: tokenListingOrderHash,
+        relatedOrderHash: offerOrderHash,
+        startAmount: offerAmount,
       });
     } else {
       await fulfillOffer({
         starknetAccount: account,
         brokerId: env.NEXT_PUBLIC_BROKER_ID,
-        tokenAddress: token.contract_address,
-        tokenId: token.token_id,
-        orderHash: offer.order_hash,
+        tokenAddress: tokenContractAddress,
+        tokenId,
+        orderHash: offerOrderHash,
       });
     }
   };

diff --git a/apps/arkmarket/src/app/assets/[contract_address]/[token_id]/components/cancel-offer.tsx b/apps/arkmarket/src/app/assets/[contract_address]/[token_id]/components/cancel-offer.tsx
@@ -8,14 +8,17 @@ import { useAccount } from "@starknet-react/core";
 import { Button } from "@ark-market/ui/button";
 import { toast } from "@ark-market/ui/toast";
 
-import type { Offer, Token } from "~/types";
-
 interface CancelOfferProps {
-  token: Token;
-  offer: Offer;
+  tokenContractAddress: string;
+  tokenId: string;
+  offerOrderHash: string;
 }
 
-const CancelOffer: React.FC<CancelOfferProps> = ({ token, offer }) => {
+const CancelOffer = ({
+  offerOrderHash,
+  tokenContractAddress,
+  tokenId,
+}: CancelOfferProps) => {
   const { account } = useAccount();
   const { cancel, status } = useCancel();
 
@@ -32,9 +35,9 @@ const CancelOffer: React.FC<CancelOfferProps> = ({ token, offer }) => {
 
     await cancel({
       starknetAccount: account,
-      tokenAddress: token.contract_address,
-      tokenId: BigInt(token.token_id),
-      orderHash: BigInt(offer.order_hash),
+      tokenAddress: tokenContractAddress,
+      tokenId: BigInt(tokenId),
+      orderHash: BigInt(offerOrderHash),
     });
   };
 
@@ -45,7 +48,7 @@ const CancelOffer: React.FC<CancelOfferProps> = ({ token, offer }) => {
   const isLoading = ["loading", "cancelling"].includes(status);
 
   return (
-    <Button size="sm" onClick={handleClick} disabled={isLoading}>
+    <Button size="xl" onClick={handleClick} disabled={isLoading}>
       {status === "loading" ? (
         <ReloadIcon className="animate-spin" />
       ) : (

diff --git a/apps/arkmarket/src/app/assets/[contract_address]/[token_id]/components/token-offers.tsx b/apps/arkmarket/src/app/assets/[contract_address]/[token_id]/components/token-offers.tsx
@@ -106,13 +106,21 @@ const TokenOffers: React.FC<TokenOffersProps> = ({
                         <div className="flex space-x-2">
                           {isOwner && tokenMarketData && (
                             <AcceptOffer
-                              token={token}
-                              tokenMarketData={tokenMarketData}
-                              offer={offer}
+                              offerAmount={offer.offer_amount}
+                              offerOrderHash={offer.order_hash}
+                              tokenContractAddress={token.contract_address}
+                              tokenId={token.token_id}
+                              tokenIsListed={tokenMarketData.is_listed}
+                              tokenListingOrderHash={tokenMarketData.order_hash}
+                              tokenOwner={token.owner}
                             />
                           )}
                           {areAddressesEqual(offer.offer_maker, address) && (
-                            <CancelOffer token={token} offer={offer} />
+                            <CancelOffer
+                              tokenId={token.token_id}
+                              offerOrderHash={offer.order_hash}
+                              tokenContractAddress={token.contract_address}
+                            />
                           )}
                         </div>
                       </TableCell>

diff --git a/apps/arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-about.tsx b/apps/arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-about.tsx
@@ -35,9 +35,6 @@ export default function TokenAbout({
   }, [contractAddress]);
 
   const ownerShortenedAddress = useMemo(() => {
-    if (tokenInfos.owner === null) {
-      return undefined;
-    }
     return `${tokenInfos.owner.slice(0, 4)}...${tokenInfos.owner.slice(-4)}`;
   }, [tokenInfos.owner]);
 

diff --git a/.../src/app/token/[contractAddress]/[tokenId]/components/token-actions-accept-best-offer.tsx b/.../src/app/token/[contractAddress]/[tokenId]/components/token-actions-accept-best-offer.tsx
@@ -75,7 +75,7 @@ export default function TokenActionsAcceptBestOffer({
         <Tag size={24} className="absolute left-4" />
       )}
       Accept offer
-      <Separator orientation="vertical" className="h-5" />
+      <Separator orientation="vertical" className="mx-2 h-5" />
       {formatEther(BigInt(tokenMarketData.top_bid.amount))} ETH
     </Button>
   );

diff --git a/.../arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-actions-buttons.tsx b/.../arkmarket/src/app/token/[contractAddress]/[tokenId]/components/token-actions-buttons.tsx
@@ -59,8 +59,8 @@ export default function TokenActionsButtons({
               </>
             ) : (
               <TokenActionsCreateListing
+                collection={collection}
                 token={token}
-                tokenMarketData={tokenMarketData}
               />
             )}
           </>