Merge pull request #78 from rairprotocol/58-user-data-improvement

Remove user data query call
rairprotocol · Jun 27, 2024 · ce0ad65 · ce0ad65
2 parents 6671dd3 + 7c77715
commit ce0ad65
Show file tree

Hide file tree

Showing 10 changed files with 74 additions and 153 deletions.
diff --git a/rair-front/src/components/MockUpPage/NftList/NftItem.tsx b/rair-front/src/components/MockUpPage/NftList/NftItem.tsx
@@ -8,17 +8,11 @@ import React, {
 import ReactPlayer from 'react-player';
 import { useNavigate } from 'react-router-dom';
 import axios from 'axios';
-import { constants, utils } from 'ethers';
 import { useStateIfMounted } from 'use-state-if-mounted';
 
 import { INftItemComponent } from './nftList.types';
 
-import {
-  TNftItemResponse,
-  TTokenData,
-  TUserResponse
-} from '../../../axios.responseTypes';
-import { UserType } from '../../../ducks/users/users.types';
+import { TNftItemResponse, TTokenData } from '../../../axios.responseTypes';
 import useIPFSImageLink from '../../../hooks/useIPFSImageLink';
 import useWindowDimensions from '../../../hooks/useWindowDimensions';
 import { defaultHotDrops } from '../../../images';
@@ -44,15 +38,13 @@ const NftItemComponent: React.FC<INftItemComponent> = ({
   index,
   playing,
   setPlaying,
-  className
+  className,
+  userData
 }) => {
   const navigate = useNavigate();
   const [metaDataProducts, setMetaDataProducts] = useStateIfMounted<
     TTokenData | undefined
   >(undefined);
-  const [accountData, setAccountData] = useStateIfMounted<UserType | null>(
-    null
-  );
   const [isFileUrl, setIsFileUrl] = useState<string>();
 
   const { width } = useWindowDimensions();
@@ -79,20 +71,6 @@ const NftItemComponent: React.FC<INftItemComponent> = ({
     }
   }, [metaDataProducts, setIsFileUrl]);
 
-  const getInfoFromUser = useCallback(async () => {
-    // find user
-    if (
-      ownerCollectionUser &&
-      utils.isAddress(ownerCollectionUser) &&
-      ownerCollectionUser !== constants.AddressZero
-    ) {
-      const result = await axios
-        .get<TUserResponse>(`/api/users/${ownerCollectionUser}`)
-        .then((res) => res.data);
-      setAccountData(result.user);
-    }
-  }, [ownerCollectionUser, setAccountData]);
-
   const handlePlaying = (el?: unknown) => {
     if (el === null) {
       setPlaying(null);
@@ -223,10 +201,6 @@ const NftItemComponent: React.FC<INftItemComponent> = ({
     getProductAsync();
   }, [getProductAsync]);
 
-  useEffect(() => {
-    getInfoFromUser();
-  }, [getInfoFromUser]);
-
   const displayImage = metaDataProducts?.metadata?.image_thumbnail
     ? metaDataProducts.metadata.image_thumbnail
     : ipfsLink
@@ -366,25 +340,23 @@ const NftItemComponent: React.FC<INftItemComponent> = ({
                 {collectionName.length > 12 ? '...' : ''}
                 <div className="brief-info-nftItem">
                   <div>
-                    {accountData ? (
+                    {userData ? (
                       <div className="collection-block-user-creator">
                         <img
                           src={
-                            accountData.avatar
-                              ? accountData.avatar
-                              : defaultAvatar
+                            userData.avatar ? userData.avatar : defaultAvatar
                           }
                           alt="User Avatar"
                         />
                         <h5 style={{ wordBreak: 'break-all', ...mobileFont }}>
-                          {accountData.nickName
-                            ? accountData.nickName.length > 16
-                              ? accountData.nickName.slice(0, 5) +
+                          {userData.nickName
+                            ? userData.nickName.length > 16
+                              ? userData.nickName.slice(0, 5) +
                                 '...' +
-                                accountData.nickName.slice(
-                                  accountData.nickName.length - 4
+                                userData.nickName.slice(
+                                  userData.nickName.length - 4
                                 )
-                              : accountData.nickName
+                              : userData.nickName
                             : ownerCollectionUser.slice(0, 5) +
                               '...' +
                               ownerCollectionUser.slice(

diff --git a/rair-front/src/components/MockUpPage/NftList/NftList.tsx b/rair-front/src/components/MockUpPage/NftList/NftList.tsx
@@ -42,7 +42,7 @@ const NftListComponent: React.FC<INftListComponent> = ({
       ? defaultHotDrops
       : `${
           import.meta.env.VITE_IPFS_GATEWAY
-        }/QmNtfjBAPYEFxXiHmY5kcPh9huzkwquHBcn9ZJHGe7hfaW`;
+        }QmcV94NurwfWVGpXTST1we8uDbYiVQamKe87WEHK6DRzqa`;
 
   const filteredData =
     data &&
@@ -79,15 +79,14 @@ const NftListComponent: React.FC<INftListComponent> = ({
             if (contractData.cover !== 'none') {
               return (
                 <NftItem
-                  key={`${
-                    contractData.id + '-' + contractData.productId + index
-                  }`}
+                  key={index}
                   pict={contractData.cover ? contractData.cover : defaultImg}
                   contractName={contractData.contract}
                   price={contractData.offerData.map((p) => String(p.price))}
                   blockchain={contractData.blockchain}
                   collectionName={contractData.name}
                   ownerCollectionUser={contractData.user}
+                  userData={contractData.userData}
                   index={index}
                   playing={playing}
                   setPlaying={setPlaying}

diff --git a/rair-front/src/components/MockUpPage/NftList/nftList.types.ts b/rair-front/src/components/MockUpPage/NftList/nftList.types.ts
@@ -30,6 +30,7 @@ export interface INftItemComponent {
   playing: number | null;
   setPlaying: (arg: null | number) => void;
   className?: string;
+  userData?: UserType;
 }
 
 export type TSortChoice = 'down' | 'up';

diff --git a/rair-front/src/components/ResalePage/ListOffers.tsx b/rair-front/src/components/ResalePage/ListOffers.tsx
diff --git a/rair-front/src/components/UserProfilePage/UserProfilePage.tsx b/rair-front/src/components/UserProfilePage/UserProfilePage.tsx
@@ -143,7 +143,7 @@ const UserProfilePage: React.FC = () => {
 
       const covers = contractsFiltered.map((item: TContract) => ({
         id: item._id,
-        productId: item.products?._id ?? 'wut',
+        productId: item.products?._id,
         blockchain: item.blockchain,
         collectionIndexInContract: item.products.collectionIndexInContract,
         contract: item.contractAddress,

diff --git a/rair-front/src/ducks/nftData/action.ts b/rair-front/src/ducks/nftData/action.ts
@@ -6,47 +6,47 @@ import { TTokenData } from '../../axios.responseTypes';
 const getNftDataStart = () =>
   ({
     type: types.GET_NFTLIST_START
-  } as const);
+  }) as const;
 
 const getNftDataStartWithParams = (params: object) =>
   ({
     type: types.GET_NFTLIST_START,
     params
-  } as const);
+  }) as const;
 
 const setNftData = (nftList: Array<TNftDataItem>) =>
   ({
     type: types.GET_NFTLIST_COMPLETE,
     nftList
-  } as const);
+  }) as const;
 
 const getNftListTotal = (nftListTotal: number) =>
   ({
     type: types.GET_NFT_LIST_TOTAL,
     nftListTotal
-  } as const);
+  }) as const;
 
 const getNftListTotalClear = () =>
   ({
     type: types.GET_NFT_TOTAL_CLEAR
-  } as const);
+  }) as const;
 
 const getNftDataError = (errorMessage: string) =>
   ({
     type: types.GET_NFT_DATA_ERROR,
     errorMessage
-  } as const);
+  }) as const;
 
 const setTokenDataStart = () =>
   ({
     type: types.SET_TOKEN_DATA_START
-  } as const);
+  }) as const;
 
 const setTokenData = (tokenData: { [index: string]: TTokenData }) =>
-  ({ type: types.SET_TOKEN_DATA, tokenData } as const);
+  ({ type: types.SET_TOKEN_DATA, tokenData }) as const;
 
 const setTokenDataTotalCount = (tokenDataListTotal) =>
-  ({ type: types.SET_TOKEN_DATA_TOTAL_COUNT, tokenDataListTotal } as const);
+  ({ type: types.SET_TOKEN_DATA_TOTAL_COUNT, tokenDataListTotal }) as const;
 
 export {
   getNftDataError,

diff --git a/rair-front/src/ducks/nftData/saga.ts b/rair-front/src/ducks/nftData/saga.ts
@@ -28,7 +28,7 @@ export function* setNftDataContract({ params }: TParamsNftDataProps) {
     if (data.success) {
       const covers = data.contracts.map((item: TContract) => ({
         id: item._id,
-        productId: item.products?._id ?? 'wut',
+        productId: item.products?._id,
         blockchain: item.blockchain,
         collectionIndexInContract: item.products.collectionIndexInContract,
         contract: item.contractAddress,

diff --git a/rair-front/src/images/index.tsx b/rair-front/src/images/index.tsx
@@ -11,6 +11,7 @@ import avatar from './defaultAvatarProfile.webp';
 import discordIconWhiteNoBorder from './discord-white-no-border.webp';
 import documentIcon from './documentIcon.svg';
 import ethereum from './ethereum-logo.svg';
+import tokenLogoRair from './favicon2.png';
 import grandpaGif from './grandpa.gif';
 import hotdropsDefaultBanner from './hotDrops_defaultBanner.png';
 import defaultHotDropsImg from './hotdrops-default.png';
@@ -35,7 +36,6 @@ import rairTechLogoWhite from './rairTechLogoWhite.webp';
 import rarible from './rarible-logo.webp';
 import verifiedIcon from './verify-icon.png';
 import yotiLogo from './yoti-logo.png';
-import tokenLogoRair from './favicon2.png';
 
 // images
 export const bgLogoBlack = blackBg;

diff --git a/rair-node/bin/api/contracts/contracts.Service.js b/rair-node/bin/api/contracts/contracts.Service.js
@@ -220,6 +220,34 @@ module.exports = {
         },
       };
       options.push(lookupProduct, { $unwind: '$products' });
+      const lookupUser = {
+        $lookup: {
+          from: 'User',
+          let: {
+            usr: '$user',
+          },
+          pipeline: [
+            {
+              $match: {
+                $expr: {
+                  $and: [
+                    {
+                      $eq: ['$publicAddress', '$$usr'],
+                    },
+                  ],
+                },
+              },
+            },
+          ],
+          as: 'userData',
+        },
+      };
+      options.push(lookupUser, {
+        $unwind: {
+          path: '$userData',
+          preserveNullAndEmptyArrays: true,
+        },
+      });
 
       if (category.length > 0) {
         const categoryIds = category.map((cat) => new ObjectId(cat));
@@ -262,38 +290,6 @@ module.exports = {
       }
 
       options.push(
-        {
-          $lookup: {
-            from: 'OfferPool',
-            let: {
-              contr: '$_id',
-              prod: '$products.collectionIndexInContract',
-            },
-            pipeline: [
-              {
-                $match: {
-                  $expr: {
-                    $and: [
-                      {
-                        $eq: ['$contract', '$$contr'],
-                      },
-                      {
-                        $eq: ['$product', '$$prod'],
-                      },
-                    ],
-                  },
-                },
-              },
-            ],
-            as: 'offerPool',
-          },
-        },
-        {
-          $unwind: {
-            path: '$offerPool',
-            preserveNullAndEmptyArrays: true,
-          },
-        },
         {
           $lookup: {
             from: 'Offer',
@@ -326,7 +322,6 @@ module.exports = {
               { diamond: true, 'products.offers': { $not: { $size: 0 } } },
               {
                 diamond: { $in: [false, undefined] },
-                offerPool: { $ne: null },
                 'products.offers': { $not: { $size: 0 } },
               },
             ],