Merge pull request #192 from So-Fan/SD-419-accept-and-decline-button-…

…display-in-offers SD-419-accept-and-decline-button-display-in-offers
So-Fan · Aug 20, 2023 · a112305 · a112305
2 parents 167c916 + e758576
commit a112305
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 40 deletions.
diff --git a/client/src/Components/UserProfileComponents/DataTitles/DataTitles.css b/client/src/Components/UserProfileComponents/DataTitles/DataTitles.css
@@ -72,7 +72,7 @@
   left: 700px;
 }
 .received-offers-date-title {
-  left: 950px;
+  left: 895px;
   position: relative;
 }
 @media (max-width: 1300px) {

diff --git a/client/src/Components/UserProfileComponents/FormulatedOffers/FormulatedOffers.js b/client/src/Components/UserProfileComponents/FormulatedOffers/FormulatedOffers.js
@@ -100,12 +100,12 @@ function FormulatedOffers({
           offersFromTitle="From"
           offersToTitle="To"
           offersStatusTitle="Status"
-          offersNftTitleclassName="formulated-offers-nft-title"
-          yourOffersTitleclassName="formulated-offers-your-offers-title"
-          offersFromTitleclassName="formulated-offers-from-title"
-          offersToTitleclassName="formulated-offers-to-title"
-          offersStatusTitleclassName="formulated-offers-status-title"
-          offersDateTitleclassName="formulated-offers-date-title"
+          offersNftTitleClass="formulated-offers-nft-title"
+          yourOffersTitleClass="formulated-offers-your-offers-title"
+          offersFromTitleClass="formulated-offers-from-title"
+          offersToTitleClass="formulated-offers-to-title"
+          offersStatusTitleClass="formulated-offers-status-title"
+          offersDateTitleClass="formulated-offers-date-title"
         />
         <div className="nft-list-formulated-offer-container">
           {reversedNftsFromOwner?.map((user, index, apiNftData) => (
@@ -139,12 +139,12 @@ function FormulatedOffers({
                   <div className={displayCurrentOffersStatus()}></div>
                 </>
               }
-              offersNftContentclassName="formulated-offers-nft-picture-and-title"
-              offersYourOffersPriceclassName="formulated-offers-your-offers-price"
-              offersFromclassName="formulated-offers-from"
-              offersToclassName="formulated-offers-to"
-              offersStatusclassName="formulated-offers-status"
-              offersDateclassName="formulated-offers-date"
+              offersNftContentClass="formulated-offers-nft-picture-and-title"
+              offersYourOffersPriceClass="formulated-offers-your-offers-price"
+              offersFromClass="formulated-offers-from"
+              offersToClass="formulated-offers-to"
+              offersStatusClass="formulated-offers-status"
+              offersDateClass="formulated-offers-date"
             />
           ))}
         </div>

diff --git a/client/src/Components/UserProfileComponents/NftList/NftList.css b/client/src/Components/UserProfileComponents/NftList/NftList.css
@@ -138,28 +138,28 @@
   left: 0px;
 }
 .received-offers-offers-price {
-  left: 100px;
+  left: 60px;
 }
 .received-offers-from {
-  left: 263px;
+  left: 203px;
 }
 .received-offers-to {
-  left: 405px;
+  left: 345px;
 }
 .received-offers-date {
-  left: 387px;
+  left: 287px;
 }
 .received-offers-decline {
   cursor: pointer;
   display: flex;
   position: relative;
-  left: 450px;
+  left: 360px;
 }
 .received-offers-accept {
   cursor: pointer;
   display: flex;
   position: relative;
-  left: 460px;
+  left: 380px;
 }
 @media (max-width: 1300px) {
   .nft-date-transfer-user-activity {

diff --git a/client/src/Components/UserProfileComponents/NftList/NftList.js b/client/src/Components/UserProfileComponents/NftList/NftList.js
@@ -38,6 +38,7 @@ function NftList({
   nftTransferDate,
   // formulated offers
   isFormulatedOffersSectionActive,
+  isReceivedOffersSessionActive,
   isUserActivitySectionActive,
   ethPrice,
   //
@@ -52,6 +53,9 @@ function NftList({
   ).toLocaleString("fr-FR", { maximumFractionDigits: 1 });
   // console.log(nftsFromOwnerFloorPrice);
   // console.log(handleAcceptOffersClick);
+  receivedFrom = "DonOfSomething";
+  // receivedTo = "DonOfSomething";
+  // console.log(transferNftDataApi.to)
   return (
     // Backend here
     <div className="user-nft-transfer-container">
@@ -81,12 +85,12 @@ function NftList({
       </div>
       <div className={`nft-from-user-activity ${offersToClass}`}>
         {isUserActivitySectionActive && <>{transferNftDataApi.from}</>}
-        {isFormulatedOffersSectionActive && (
-          <>
-            {transferNftDataApi.to}
-            {/* {offersTo} */}
-          </>
-        )}
+        {/* {isFormulatedOffersSectionActive && ( <> */}
+        {/* {transferNftDataApi.to} */}
+        {/* {offersTo} */}
+        {/* </> )} */}
+
+        {isReceivedOffersSessionActive && <>{transferNftDataApi.to}</>}
       </div>
       <div className={`nft-to-user-activity ${offersStatusClass}`}>
         {isUserActivitySectionActive && <> {transferNftDataApi.to}</>}
@@ -97,7 +101,7 @@ function NftList({
       </div>
       <div className={`nft-decline-received-offers ${offersDeclineClass}`}>
         <img
-        // récupérer les données de l'élément cliqué
+          // récupérer les données de l'élément cliqué
           onClick={() =>
             handleRejectedOffersClick(
               nftsFromOwnerImage,
@@ -113,7 +117,7 @@ function NftList({
       </div>
       <div className={`nft-accept-received-offers ${offersAcceptClass}`}>
         <img
-        // récupérer les données de l'élément cliqué
+          // récupérer les données de l'élément cliqué
           onClick={() =>
             handleAcceptOffersClick(
               nftsFromOwnerImage,

diff --git a/client/src/Components/UserProfileComponents/ReceivedOffers/ReceivedOffers.js b/client/src/Components/UserProfileComponents/ReceivedOffers/ReceivedOffers.js
@@ -50,11 +50,11 @@ function ReceivedOffers({
         offersFromTitle="From"
         offersToTitle="To"
         //
-        offersNftTitleclassName="formulated-offers-nft-title"
-        yourOffersTitleclassName="received-offers-offers-title"
-        offersFromTitleclassName="received-offers-from-title"
-        offersToTitleclassName="received-offers-to-title"
-        offersDateTitleclassName="received-offers-date-title"
+        offersNftTitleClass="formulated-offers-nft-title"
+        yourOffersTitleClass="received-offers-offers-title"
+        offersFromTitleClass="received-offers-from-title"
+        offersToTitleClass="received-offers-to-title"
+        offersDateTitleClass="received-offers-date-title"
         // Nft data list
       />
       <div className="received-offers-nft-list-container">
@@ -77,24 +77,25 @@ function ReceivedOffers({
               apiNftData[i]?.contract?.openSea?.floorPrice
             }
             ethPrice={ethPrice}
-            nftsFromOwnerQuantity={apiNftData[i]?.balance}
+            // nftsFromOwnerQuantity={apiNftData[i]?.balance}
             //
             transferNftDataApi={transferNftDataApi.transfers[i]}
             nftTransferDate={nftTransferDate[i]}
             //
             handleAcceptOffersClick={handleAcceptOffersClick}
             handleRejectedOffersClick={handleRejectedOffersClick}
             handleOffersChoice={handleOffersChoice}
+            isReceivedOffersSessionActive={true}
             //
             // setDataPopupConfirmation={setDataPopupConfirmation}
             //
-            offersNftContentclassName="received-offers-nft-picture-and-title"
-            offersYourOffersPriceclassName="received-offers-offers-price"
-            offersFromclassName="received-offers-from"
-            offersToclassName="received-offers-to"
-            offersDateclassName="received-offers-date"
-            offersDeclineclassName="received-offers-decline"
-            offersAcceptclassName="received-offers-accept"
+            offersNftContentClass="received-offers-nft-picture-and-title"
+            offersYourOffersPriceClass="received-offers-offers-price"
+            offersFromClass="received-offers-from"
+            offersToClass="received-offers-to"
+            offersDateClass="received-offers-date"
+            offersDeclineClass="received-offers-decline"
+            offersAcceptClass="received-offers-accept"
           />
         ))}
       </div>