Merge branch 'dev' into 94-update-theming-elements-header-text-color-…

…to-primary-button-color-for-icons
mfrosi · Jul 12, 2024 · a155228 · a155228
2 parents 3956016 + f3f2e4f
commit a155228
Show file tree

Hide file tree

Showing 69 changed files with 1,462 additions and 587 deletions.
diff --git a/.env.sample b/.env.sample
@@ -42,7 +42,7 @@ base_mainnet_rpc=https://base-mainnet.g.alchemy.com/v2/LPVexfumI81FHrSqJyhwpZ9yb
 #default image for NFTs that have no metadata
 default_product_cover=https://rair.myfilebase.com/ipfs/QmcV94NurwfWVGpXTST1we8uDbYiVQamKe87WEHK6DRzqa
 #ipfs configuration - pinata or ipfs
-ipfs_service=pinata
+ipfs_service=filebase
 ipfs_gateway=http://rairipfs:8080/ipfs
 ipfs_api=http://rairipfs:5001
 #gcp storage configuration

diff --git a/.github/workflows/MoveToNextIteration.yml b/.github/workflows/MoveToNextIteration.yml
@@ -0,0 +1,20 @@
+on:
+  schedule:
+    # Runs "at 05:00, only on Tuesday" (see https://crontab.guru)
+    - cron: '0 5 * * 2'
+
+jobs:
+  move-to-next-iteration:
+    name: Move to next iteration
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: blombard/move-to-next-iteration@master
+      with:
+        owner: rairprotocol
+        number: 1
+        token: ${{ secrets.PROJECT_PAT }}
+        iteration-field: Iteration
+        iteration: last
+        new-iteration: current
+        excluded-statuses: "Done,Won't Fix"
diff --git a/rair-front/Dockerfile.prod b/rair-front/Dockerfile.prod
@@ -1,6 +1,6 @@
 # build environment
 
-FROM node:21.2.0 as build
+FROM node:22.4.0 as build
 
 WORKDIR /usr/src/minting
 
@@ -22,4 +22,4 @@ COPY --from=build /usr/src/minting/nginx/nginx.conf /etc/nginx/conf.d/default.co
 EXPOSE 80
 
 # The default parameters to ENTRYPOINT (unless overruled on the command line)
-CMD ["nginx", "-g", "daemon off;"]
+CMD ["nginx", "-g", "daemon off;"]
diff --git a/rair-front/nginx/nginx.conf.ssl b/rair-front/nginx/nginx.conf.ssl
@@ -58,7 +58,7 @@ server {
     }
 
     location /socket.io {
-      proxy_pass http://rair-stream:5002;
+      proxy_pass http://rair-node:5000;
       client_max_body_size 200000M;
     }
 }

diff --git a/rair-front/src/App.tsx b/rair-front/src/App.tsx
@@ -97,6 +97,7 @@ import ErrorFallback from './views/ErrorFallback/ErrorFallback';
 
 import 'bootstrap/dist/css/bootstrap.min.css';
 import './App.css';
+import { rFetch } from './utils/rFetch';
 /* Track a page view */
 // const analytics = getInformationGoogleAnalytics();
 // analytics.page();
@@ -133,6 +134,7 @@ function App() {
   const [tabIndexItems, setTabIndexItems] = useState(0);
   const [tokenNumber, setTokenNumber] = useState<number | undefined>(undefined);
   const navigate = useNavigate();
+  const [notificationCount, setNotificationCount] = useState<number>(0);
 
   // Redux
   const { primaryColor, textColor, backgroundImage, backgroundImageEffect } =
@@ -194,6 +196,19 @@ function App() {
     }
   }, [dispatch, logoutUser]);
 
+  const getNotificationsCount = useCallback( async () => {
+    if (currentUserAddress) {
+      const result = await rFetch(`/api/notifications?onlyUnread=true`);
+      if (result.success && result.totalCount > 0) {
+        setNotificationCount(result.totalCount);
+      }
+    }
+  }, [currentUserAddress]);
+
+  useEffect(() => {
+    getNotificationsCount();
+  }, [getNotificationsCount])
+
   // gtag
 
   useEffect(() => {
@@ -367,6 +382,8 @@ function App() {
                 selectedChain={correctBlockchain(realChain)}
                 setTabIndexItems={setTabIndexItems}
                 isAboutPage={isAboutPage}
+                notificationCount={notificationCount}
+                getNotificationsCount={getNotificationsCount}
               />
             )
           )}

diff --git a/rair-front/src/components/Header/MainHeader.tsx b/rair-front/src/components/Header/MainHeader.tsx
@@ -37,6 +37,7 @@ import TalkSalesComponent from './HeaderItems/TalkToSalesComponent/TalkSalesComp
 
 //styles
 import './Header.css';
+import { rFetch } from '../../utils/rFetch';
 
 const MainHeader: React.FC<IMainHeader> = ({
   goHome,
@@ -72,6 +73,8 @@ const MainHeader: React.FC<IMainHeader> = ({
   console.info(iconColor, 'iconColor')
 
   const hotdropsVar = import.meta.env.VITE_TESTNET;
+  const [realDataNotification, setRealDataNotification] = useState([]);
+  const [notificationCount, setNotificationCount] = useState<number>(0);
 
   const [textSearch, setTextSearch] = useState<string>('');
   const [adminPanel, setAdminPanel] = useState<boolean>(false);
@@ -124,7 +127,34 @@ const MainHeader: React.FC<IMainHeader> = ({
     setTextSearch('');
   };
 
-  console.info(secondaryButtonColor, 'secondaryButtonColor')
+  const getNotifications = useCallback(async (pageNum?: number) => {
+    if(currentUserAddress) {
+      // const result = await rFetch(`/api/notifications${itemsPerPage && pageNum ? `?itemsPerPage=${itemsPerPage}&pageNum=${pageNum}` : ''}`);
+      const result = await rFetch(`/api/notifications${`?pageNum=${Number(pageNum)}`}`);
+
+      if (result.success) {
+        setRealDataNotification(result.notifications);
+      }
+    }
+  }, [currentUserAddress]);
+
+  const getNotificationsCount = useCallback( async () => {
+    if(currentUserAddress) {
+      const result = await rFetch(`/api/notifications?onlyUnread=true`);
+      if (result.success && result.totalCount > 0) {
+        setNotificationCount(result.totalCount);
+      }
+    }
+  }, [currentUserAddress])
+
+  useEffect(() => {
+    getNotificationsCount();
+  }, [getNotificationsCount])
+
+
+  useEffect(() => {
+    getNotifications(0);
+  }, [currentUserAddress])
 
   const Highlight = (props) => {
     const { filter, str } = props;
@@ -210,7 +240,7 @@ const MainHeader: React.FC<IMainHeader> = ({
               backgroundColor: primaryColor
             }}
             type="text"
-            placeholder="Search the rairverse..."
+            placeholder="Search..."
             onChange={handleChangeText}
             value={textSearch}
             onClick={() => setIsComponentVisible(true)}
@@ -412,7 +442,7 @@ const MainHeader: React.FC<IMainHeader> = ({
             isSplashPage={isSplashPage}
           />
           <div className="social-media">
-            {currentUserAddress && <PopUpNotification />}
+            {currentUserAddress && <PopUpNotification setRealDataNotification={setRealDataNotification} notificationCount={notificationCount} getNotificationsCount={getNotificationsCount} getNotifications={getNotifications} realDataNotification={realDataNotification} />}
 
             <AdminPanel
               creatorViewsDisabled={creatorViewsDisabled}

diff --git a/rair-front/src/components/MockUpPage/FilteringBlock/modal/index.tsx b/rair-front/src/components/MockUpPage/FilteringBlock/modal/index.tsx
@@ -55,7 +55,9 @@ const Content = styled.div`
   min-width: 50px;
   max-height: 80%;
   max-width: 80%;
-  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
+  box-shadow:
+    0 3px 6px rgba(0, 0, 0, 0.16),
+    0 3px 6px rgba(0, 0, 0, 0.23);
   background-color: white;
   border-radius: 2px;
 `;

diff --git a/.../src/components/MockUpPage/NftList/LikeButton/favoritesReducer/actions/actionFavorites.ts b/.../src/components/MockUpPage/NftList/LikeButton/favoritesReducer/actions/actionFavorites.ts
@@ -5,33 +5,33 @@ import * as types from './../actionTypes/types';
 const addItemFavoriteStart = () =>
   ({
     type: types.ADD_ITEM_FAVORITES_START
-  } as const);
+  }) as const;
 
 const addItemFavoriteEnd = () =>
   ({
     type: types.ADD_ITEM_FAVORITES_END
-  } as const);
+  }) as const;
 
 const removeItemFavoriteEnd = () =>
   ({
     type: types.REMOVE_ITEM_FAVORITES_END
-  } as const);
+  }) as const;
 
 const getCurrentItemSuccess = (item: TTokenData | null) =>
   ({
     type: types.GET_CURRENT_ITEM_SUCCESS,
     item
-  } as const);
+  }) as const;
 
 const getCurrentItemFalse = () =>
   ({
     type: types.GET_CURRENT_ITEM_FALSE
-  } as const);
+  }) as const;
 
 const errorFavorites = () =>
   ({
     type: types.ERROR_FAVORITES
-  } as const);
+  }) as const;
 
 export {
   addItemFavoriteEnd,

diff --git a/rair-front/src/components/MockUpPage/NftList/NftItemForCollectionView.tsx b/rair-front/src/components/MockUpPage/NftList/NftItemForCollectionView.tsx
@@ -3,17 +3,13 @@ import ReactPlayer from 'react-player';
 import { Provider, useSelector, useStore } from 'react-redux';
 import { useNavigate, useParams } from 'react-router-dom';
 import axios, { AxiosError } from 'axios';
-import { BigNumber, constants, utils } from 'ethers';
+import { BigNumber } from 'ethers';
 import { formatEther } from 'ethers/lib/utils';
 
-import {
-  IOffersResponseType,
-  TUserResponse
-} from '../../../axios.responseTypes';
+import { IOffersResponseType } from '../../../axios.responseTypes';
 import { RootState } from '../../../ducks';
 import { ColorStoreType } from '../../../ducks/colors/colorStore.types';
 import { ContractsInitialType } from '../../../ducks/contracts/contracts.types';
-import { UserType } from '../../../ducks/users/users.types';
 import useIPFSImageLink from '../../../hooks/useIPFSImageLink';
 import useSwal from '../../../hooks/useSwal';
 import useWindowDimensions from '../../../hooks/useWindowDimensions';
@@ -61,7 +57,6 @@ const NftItemForCollectionViewComponent: React.FC<
   const navigate = useNavigate();
   const store = useStore();
 
-  const [userInfoMinted, setUserInfoMinted] = useState<UserType | null>(null);
   const [isFileUrl, setIsFileUrl] = useState<string | undefined>();
   const ipfsLink = useIPFSImageLink(metadata?.image);
   const [tokenInfo, setTokenInfo] = useState<any>(null);
@@ -199,20 +194,6 @@ const NftItemForCollectionViewComponent: React.FC<
     }
   }, [navigate, tokenInfo, contract, blockchain, product, index, item]);
 
-  const getInfoFromUser = useCallback(async () => {
-    // find user
-    if (
-      item &&
-      utils.isAddress(item.ownerAddress) &&
-      item.ownerAddress !== constants.AddressZero
-    ) {
-      const result = await axios
-        .get<TUserResponse>(`/api/users/${item.ownerAddress}`)
-        .then((res) => res.data);
-      setUserInfoMinted(result.user);
-    }
-  }, [item]);
-
   const initialTokenData = useCallback(() => {
     if (item && resaleFlag) {
       if (item.contract?.diamond) {
@@ -313,10 +294,6 @@ const NftItemForCollectionViewComponent: React.FC<
     getParticularOffer();
   }, [getParticularOffer]);
 
-  useEffect(() => {
-    getInfoFromUser();
-  }, [getInfoFromUser]);
-
   useEffect(() => {
     checkUrl();
   }, [checkUrl]);
@@ -517,25 +494,25 @@ const NftItemForCollectionViewComponent: React.FC<
                       maxHeight: '40px'
                     }}>
                     <div>
-                      {item?.isMinted && userInfoMinted ? (
+                      {item?.isMinted && item.ownerData ? (
                         <div className="collection-block-user-creator">
                           <img
                             src={
-                              userInfoMinted.avatar
-                                ? userInfoMinted.avatar
+                              item.ownerData?.avatar
+                                ? item.ownerData?.avatar
                                 : defaultImage
                             }
                             alt="User Avatar"
                           />
                           <h5 style={{ wordBreak: 'break-all' }}>
-                            {userInfoMinted.nickName
-                              ? userInfoMinted.nickName.length > 16
-                                ? userInfoMinted.nickName.slice(0, 5) +
+                            {item.ownerData?.nickName
+                              ? item.ownerData?.nickName.length > 16
+                                ? item.ownerData?.nickName.slice(0, 5) +
                                   '...' +
-                                  userInfoMinted.nickName.slice(
-                                    userInfoMinted.nickName.length - 4
+                                  item.ownerData?.nickName.slice(
+                                    item.ownerData?.nickName.length - 4
                                   )
-                                : userInfoMinted.nickName
+                                : item.ownerData?.nickName
                               : userName?.slice(0, 5) +
                                 '....' +
                                 userName?.slice(userName.length - 4)}
@@ -578,10 +555,10 @@ const NftItemForCollectionViewComponent: React.FC<
                       )}
                     </div>
                     {item && !resaleFlag && item.isMinted && !resalePrice && (
-            <div className="nft-item-collection-sold-out">
-              <div className="sold-out-box">Sold out</div>
-            </div>
-          )}
+                      <div className="nft-item-collection-sold-out">
+                        <div className="sold-out-box">Sold out</div>
+                      </div>
+                    )}
                     <div
                       className="collection-block-price"
                       style={{ alignItems: 'flex-end' }}>

diff --git a/rair-front/src/components/MockUpPage/PaginationBox/PaginationBox.tsx b/rair-front/src/components/MockUpPage/PaginationBox/PaginationBox.tsx
@@ -11,12 +11,16 @@ const PaginationBox: React.FC<IPaginationBox> = ({
   changePage,
   currentPage,
   totalPageForPagination,
-  whatPage
+  whatPage,
+  itemsPerPageNotifications
 }) => {
   const itemsPerPage = useSelector<RootState, number>(
     (store) => store.nftDataStore.itemsPerPage
   );
 
+  console.info(totalPageForPagination, 'totalPageForPagination');
+  console.info(itemsPerPageNotifications, 'itemsPerPageNotifications')
+
   const { primaryColor, primaryButtonColor } = useSelector<
     RootState,
     ColorStoreType
@@ -26,6 +30,8 @@ const PaginationBox: React.FC<IPaginationBox> = ({
   const [totalPage, setTotalPages] = useState<number>();
   const [totalPageVideo, setTotalPagesVideo] = useState<number>();
 
+  console.info(totalPage, 'totalPage')
+
   // const hotdropsVar = import.meta.env.VITE_TESTNET;
 
   const pagesArray: number[] = [];
@@ -37,6 +43,10 @@ const PaginationBox: React.FC<IPaginationBox> = ({
     for (let i = 0; i < totalPageVideo; i++) {
       pagesArray.push(i + 1);
     }
+  } else if(whatPage && whatPage === 'notifications' && totalPage) {
+    for (let i = 0; i < totalPage; i++) {
+      pagesArray.push(i + 1);
+    }
   }
 
   const getPagesCount = (totalCount: number, itemsPerPage: number) => {
@@ -56,7 +66,10 @@ const PaginationBox: React.FC<IPaginationBox> = ({
     } else if (totalPageForPagination && whatPage === 'video') {
       setTotalPagesVideo(getPagesCount(totalPageForPagination, itemsPerPage));
     }
-  }, [setTotalPages, totalPageForPagination, itemsPerPage, whatPage]);
+    else if(totalPageForPagination && whatPage === 'notifications' && itemsPerPageNotifications){
+        setTotalPages(getPagesCount(totalPageForPagination, itemsPerPageNotifications));
+    }
+  }, [setTotalPages, totalPageForPagination, itemsPerPage, whatPage, itemsPerPageNotifications]);
 
   if (totalPageForPagination === 0) {
     return null;

diff --git a/rair-front/src/components/MockUpPage/SearchPanel.tsx b/rair-front/src/components/MockUpPage/SearchPanel.tsx
@@ -226,7 +226,7 @@ const SearchPanel: React.FC<ISearchPanel> = ({ tabIndex, setTabIndex }) => {
               primaryColor === '#dedede' ? 'default' : 'dark'
             }`}
             className="category-button-nft category-button">
-            {hotdropsVar === 'true' ? 'Collectible' : 'NFT'}
+              MARKET
           </Tab>
           <Tab
             onClick={() => {