Merge remote-tracking branch 'origin/main' into configure-eslint-ci

CODEOWNERS

@@ -0,0 +1,3 @@
+# Default owners for everything in the repo
+
+* @FrancoAguzzi @heronlancellot @eduramme

components/01-atoms/ConfirmSwapModal.tsx

@@ -1,5 +1,3 @@
-import { Dialog, Transition } from "@headlessui/react";
-import { Fragment, useContext, useEffect, useState } from "react";
 import {
   NftCard,
   NftCardActionType,
@@ -8,11 +6,10 @@ import {
   TransactionResultModal,
 } from ".";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
-import { makeSwap } from "@/lib/client/blockchain-data";
 import { SWAPLACE_SMART_CONTRACT_ADDRESS } from "@/lib/client/constants";
+import { Dialog, Transition } from "@headlessui/react";
+import { Fragment, useContext, useEffect, useState } from "react";
 import { useNetwork, useWalletClient } from "wagmi";
-import { getTimestamp } from "@/lib/client/utils";
-import { signTransaction } from "viem/actions";
 import toast from "react-hot-toast";
 
 interface ConfirmSwapModalProps {
@@ -33,7 +30,7 @@ export enum TransactionResult {
 
 export const ConfirmSwapModal = ({ open, onClose }: ConfirmSwapModalProps) => {
   const { authenticatedUserAddress } = useAuthenticatedUser();
-  const { nftInputUser, nftAuthUser, validatedAddressToSwap, destinyChain } =
+  const { nftInputUser, nftAuthUser, validatedAddressToSwap } =
     useContext(SwapContext);
 
   const [createOfferStatus, setCreateOfferStatus] = useState(
@@ -61,7 +58,7 @@ export const ConfirmSwapModal = ({ open, onClose }: ConfirmSwapModalProps) => {
       chain && SWAPLACE_SMART_CONTRACT_ADDRESS[chain?.id];
 
     if (swaplaceContractForCurrentChain && walletClient) {
-      const farFarInTheFuture = getTimestamp(chain.id);
+      // const farFarInTheFuture = getTimestamp(chain.id);
 
       setCreateOfferStatus(CreateOfferStatus.WAITING_WALLET_APPROVAL);
       walletClient

components/01-atoms/SearchBar.tsx

@@ -1,20 +1,22 @@
-import cc from "classcat";
-import { useContext, useEffect, useState } from "react";
+/* eslint-disable react-hooks/exhaustive-deps */
+/* eslint-disable import/no-named-as-default-member */
+/* eslint-disable import/no-named-as-default */
 import {
   MagnifyingGlassIcon,
   SelectAuthedUserChain,
   SelectDestinyChain,
   SwapContext,
 } from ".";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
+import { useContext, useEffect, useState } from "react";
 import { ENS } from "web3-eth-ens";
+import cc from "classcat";
 import Web3 from "web3";
 
 export const SearchBar = () => {
   const {
     setInputAddress,
     inputAddress,
-    validatedAddressToSwap,
     validateAddressToSwap,
     userJustValidatedInput,
   } = useContext(SwapContext);

components/01-atoms/SelectDestinyChain.tsx

@@ -1,7 +1,7 @@
-import { Dialog, Transition } from "@headlessui/react";
-import { Fragment, useContext, useState } from "react";
 import { EthereumIcon, PolygonIcon, SwapContext } from ".";
 import { ChainInfo, SupportedNetworks } from "@/lib/client/constants";
+import { Dialog, Transition } from "@headlessui/react";
+import { Fragment, useContext, useState } from "react";
 import cc from "classcat";
 
 export const SelectDestinyChain = () => {

components/01-atoms/SwapContext.tsx

@@ -1,7 +1,11 @@
-import React, { Dispatch, useEffect, useState } from "react";
-import toast from "react-hot-toast";
+/* eslint-disable react-hooks/exhaustive-deps */
+/* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable unused-imports/no-unused-vars */
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import { ADDRESS_ZERO, NFT, SupportedNetworks } from "@/lib/client/constants";
 import { EthereumAddress } from "@/lib/shared/types";
+import React, { Dispatch, useEffect, useState } from "react";
+import toast from "react-hot-toast";
 
 interface SwapContextProps {
   inputAddress: string;

components/01-atoms/TransactionResultModal.tsx

@@ -1,9 +1,9 @@
-import { Dialog, Transition } from "@headlessui/react";
 import { TransactionResult } from ".";
-import { Fragment, useState } from "react";
 import LoadingIndicator from "./LoadingIndicator";
-import { CheckmarkIcon } from "react-hot-toast";
 import { DangerIcon } from "./icons/DangerIcon";
+import { Dialog, Transition } from "@headlessui/react";
+import { CheckmarkIcon } from "react-hot-toast";
+import { Fragment, useState } from "react";
 
 interface TransactionResultModalProps {
   onClose: () => void;
@@ -14,12 +14,12 @@ export const TransactionResultModal = ({
   transactionResult,
   onClose,
 }: TransactionResultModalProps) => {
+  const [open, setOpen] = useState(true);
+
   if (!transactionResult) {
     return null;
   }
 
-  const [open, setOpen] = useState(true);
-
   const closeModal = () => {
     setOpen(false);
     onClose();

components/02-molecules/CardHome.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import { ConnectWallet, SwaplaceIcon } from "@/components/01-atoms";
+import React from "react";
 
 export const CardHome = () => {
   return (

components/02-molecules/NftCard.tsx

@@ -1,8 +1,9 @@
-import { NFT } from "@/lib/client/constants";
-import React, { useContext, useEffect, useState } from "react";
+/* eslint-disable react-hooks/exhaustive-deps */
 import { SwapContext } from "../01-atoms";
+import { NFT } from "@/lib/client/constants";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
 import { EthereumAddress } from "@/lib/shared/types";
+import React, { useContext, useEffect, useState } from "react";
 import cc from "classcat";
 import toast from "react-hot-toast";
 
@@ -33,12 +34,38 @@ export const NftCard = ({
   withSelectionValidation = true,
   onClickAction = NftCardActionType.SELECT_NFT_FOR_SWAP,
 }: INftCard) => {
-  if (!nftData || !nftData.id || !nftData.contract || !ownerAddress)
-    return null;
-
   const { authenticatedUserAddress } = useAuthenticatedUser();
   const { setNftAuthUser, setNftInputUser, nftAuthUser, nftInputUser } =
     useContext(SwapContext);
+  const [couldntLoadNftImage, setCouldntLoadNftImage] = useState(false);
+  const [currentNftIsSelected, setCurrentNftIsSelected] = useState(false);
+
+  useEffect(() => {
+    setCouldntLoadNftImage(false);
+  }, [nftData]);
+
+  useEffect(() => {
+    const currentNftIsFromAuthedUser = ownerAddress
+      ? authenticatedUserAddress?.equals(new EthereumAddress(ownerAddress))
+      : null;
+
+    if (currentNftIsFromAuthedUser) {
+      if (nftAuthUser.length) {
+        setCurrentNftIsSelected(nftAuthUser[0].id === nftData.id);
+      } else {
+        setCurrentNftIsSelected(false);
+      }
+    } else {
+      if (nftInputUser.length) {
+        setCurrentNftIsSelected(nftInputUser[0].id === nftData.id);
+      } else {
+        setCurrentNftIsSelected(false);
+      }
+    }
+  }, [authenticatedUserAddress, ownerAddress, nftAuthUser, nftInputUser]);
+
+  if (!nftData || !nftData.id || !nftData.contract || !ownerAddress)
+    return null;
 
   const setNftAsActiveOne = () => {
     if (onClickAction === NftCardActionType.SELECT_NFT_FOR_SWAP) {
@@ -65,36 +92,10 @@ export const NftCard = ({
     }
   };
 
-  const [currentNftIsSelected, setCurrentNftIsSelected] = useState(false);
-  useEffect(() => {
-    const currentNftIsFromAuthedUser = authenticatedUserAddress?.equals(
-      new EthereumAddress(ownerAddress)
-    );
-
-    if (currentNftIsFromAuthedUser) {
-      if (nftAuthUser.length) {
-        setCurrentNftIsSelected(nftAuthUser[0].id === nftData.id);
-      } else {
-        setCurrentNftIsSelected(false);
-      }
-    } else {
-      if (nftInputUser.length) {
-        setCurrentNftIsSelected(nftInputUser[0].id === nftData.id);
-      } else {
-        setCurrentNftIsSelected(false);
-      }
-    }
-  }, [authenticatedUserAddress, ownerAddress, nftAuthUser, nftInputUser]);
-
-  const [couldntLoadNftImage, setCouldntLoadNftImage] = useState(false);
   const handleImageLoadError = () => {
     setCouldntLoadNftImage(true);
   };
 
-  useEffect(() => {
-    setCouldntLoadNftImage(false);
-  }, [nftData]);
-
   const ButtonLayout = (children: React.ReactNode) => {
     return (
       <button

components/02-molecules/NftsList.tsx

@@ -1,5 +1,6 @@
-import { NFT } from "@/lib/client/constants";
+/* eslint-disable react/jsx-key */
 import { NftCard } from "../01-atoms";
+import { NFT } from "@/lib/client/constants";
 
 interface INftsList {
   nftsList: NFT[];

components/02-molecules/OfferSummary.tsx

@@ -1,9 +1,9 @@
-import { useContext } from "react";
-import { EthereumIcon, NftCard, PolygonIcon, SwapContext } from "../01-atoms";
-import { useEnsName, useNetwork } from "wagmi";
+import { NftCard, SwapContext } from "../01-atoms";
 import { EthereumAddress } from "@/lib/shared/types";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
-import { ChainInfo, SupportedNetworks } from "@/lib/client/constants";
+import { ChainInfo } from "@/lib/client/constants";
+import { useEnsName, useNetwork } from "wagmi";
+import { useContext } from "react";
 
 interface IOfferSummary {
   forAuthedUser: boolean;

components/02-molecules/SwapStation.tsx

@@ -1,10 +1,10 @@
-import { useContext, useEffect, useState } from "react";
 import { OfferSummary } from "@/components/02-molecules";
 import {
   ConfirmSwapModal,
   PaperPlane,
   SwapContext,
 } from "@/components/01-atoms";
+import { useContext, useEffect, useState } from "react";
 import cc from "classcat";
 import toast from "react-hot-toast";
 

components/02-molecules/TheHeader.tsx

@@ -1,8 +1,8 @@
-import React, { useEffect, useState } from "react";
 import { ConnectWallet, SwaplaceIcon } from "@/components/01-atoms";
-import cc from "classcat";
 import { useScreenSize } from "@/lib/client/hooks/useScreenSize";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
+import React, { useEffect, useState } from "react";
+import cc from "classcat";
 
 export const TheHeader = () => {
   const { isDesktop } = useScreenSize();

components/03-organisms/NftsShelf.tsx

@@ -1,15 +1,12 @@
-import { useContext, useEffect, useState } from "react";
-import {
-  NFT,
-  ChainInfo,
-  NFTsQueryStatus,
-  ADDRESS_ZERO,
-} from "@/lib/client/constants";
-import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
+/* eslint-disable react-hooks/exhaustive-deps */
 import { NftsList } from "../02-molecules";
-import { getNftsFrom } from "@/lib/client/blockchain-data";
 import { SwapContext, SwapIcon } from "../01-atoms";
+import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
+
+import { NFT, ChainInfo, NFTsQueryStatus } from "@/lib/client/constants";
+import { getNftsFrom } from "@/lib/client/blockchain-data";
 import { EthereumAddress } from "@/lib/shared/types";
+import { useContext, useEffect, useState } from "react";
 import { useNetwork } from "wagmi";
 
 /**

components/03-organisms/SwappingShelfs.tsx

@@ -1,9 +1,10 @@
-import cc from "classcat";
-import { useContext, useEffect, useState } from "react";
+/* eslint-disable react-hooks/exhaustive-deps */
 import { NftsShelf } from "@/components/02-molecules";
 import { SwapContext, SwappingShelfID, Tab } from "@/components/01-atoms/";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
+import { useContext, useEffect, useState } from "react";
 import { useNetwork } from "wagmi";
+import cc from "classcat";
 
 export const SwappingShelfs = () => {
   const { chain } = useNetwork();

components/04-templates/Layout.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import { useAuthedAccess } from "@/lib/client/hooks/useAuthedAccess";
 import { useRouter } from "next/router";
 import { useEffect } from "react";

lib/client/blockchain-data.ts

@@ -1,8 +1,6 @@
-import { ethers } from "ethers";
-import { Dispatch, SetStateAction } from "react";
-import { NFT, NFTsQueryStatus, getRpcHttpUrlForNetwork } from "./constants";
-import { publicClient } from "../wallet/wallet-config";
 import { getTimestamp } from "./utils";
+import { NFT, NFTsQueryStatus, getRpcHttpUrlForNetwork } from "./constants";
+import { Dispatch, SetStateAction } from "react";
 
 export const getNftsFrom = async (
   address: string,

lib/client/constants.ts

@@ -1,3 +1,4 @@
+/* eslint-disable prefer-const */
 export const ADDRESS_ZERO = "0x0000000000000000000000000000000000000000";
 
 export const WIDE_SCREEN_SIZE = 1279;

lib/client/hooks/useAuthedAccess.tsx

@@ -1,6 +1,7 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import { useAuthenticatedUser } from "./useAuthenticatedUser";
 import { useRouter } from "next/router";
 import { useEffect } from "react";
-import { useAuthenticatedUser } from "./useAuthenticatedUser";
 import toast from "react-hot-toast";
 
 export const useAuthedAccess = () => {

lib/client/hooks/useAuthenticatedUser.tsx

@@ -1,14 +1,9 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import { ADDRESS_ZERO, getRpcHttpUrlForNetwork } from "../constants";
 import { EthereumAddress } from "../../shared/types";
 import { signOut, useSession } from "next-auth/react";
-import { Dispatch, SetStateAction, use, useEffect, useState } from "react";
-import {
-  useAccount,
-  useDisconnect,
-  useEnsName,
-  useNetwork,
-  useWalletClient,
-} from "wagmi";
-import { ADDRESS_ZERO, getRpcHttpUrlForNetwork } from "../constants";
+import { useEffect, useState } from "react";
+import { useAccount, useDisconnect, useEnsName, useNetwork } from "wagmi";
 
 interface AuthenticatedUserHook {
   loadingEnsName: boolean;

lib/client/hooks/useScreenSize.tsx

@@ -1,9 +1,9 @@
-import { useState, useEffect } from "react";
 import {
   DESKTOP_SCREEN_SIZE,
   TABLET_SCREEN_SIZE,
   WIDE_SCREEN_SIZE,
 } from "../constants";
+import { useState, useEffect } from "react";
 
 export const useScreenSize = () => {
   const [isMobile, setIsMobile] = useState(false);

lib/client/utils.ts

@@ -19,4 +19,6 @@ export const getTimestamp = async (chainId: number) => {
   const blockDetails = await provider.getBlock({ blockNumber: block });
 
   const timestamp = blockDetails.timestamp;
+
+  return timestamp;
 };

lib/wallet/wallet-config.ts

@@ -1,3 +1,4 @@
+import { getRpcHttpUrlForNetwork } from "../client/constants";
 import { polygonMumbai, sepolia } from "@wagmi/core/chains";
 import { configureChains, createConfig } from "wagmi";
 import {
@@ -10,7 +11,6 @@ import {
 } from "@rainbow-me/rainbowkit/wallets";
 import { connectorsForWallets } from "@rainbow-me/rainbowkit";
 import { jsonRpcProvider } from "wagmi/providers/jsonRpc";
-import { getRpcHttpUrlForNetwork } from "../client/constants";
 
 export const { chains, webSocketPublicClient, publicClient } = configureChains(
   [sepolia, polygonMumbai],