feature: upgrade @multiversx/sdk-core and @multiversx/sdk-dapp to latest

package.json

@@ -1,17 +1,17 @@
 {
   "name": "data-dex",
-  "version": "1.18.2",
+  "version": "1.18.3",
   "description": "The Itheum Data DEX enables you to trade your data using web3 tech",
   "dependencies": {
     "@chakra-ui/icons": "2.1.1",
     "@chakra-ui/react": "2.8.2",
     "@emotion/react": "11.11.4",
     "@emotion/styled": "11.11.5",
     "@hookform/resolvers": "3.6.0",
-    "@itheum/sdk-mx-data-nft": "^3.8.0-alpha.12",
+    "@itheum/sdk-mx-data-nft": "3.8.0-alpha.12",
     "@itheum/sdk-mx-enterprise": "0.3.0",
-    "@multiversx/sdk-core": "13.9.0",
-    "@multiversx/sdk-dapp": "2.33.3",
+    "@multiversx/sdk-core": "13.14.2",
+    "@multiversx/sdk-dapp": "3.0.10",
     "@peerme/sdk": "0.2.1",
     "@sentry/react": "7.118.0",
     "@tanstack/match-sorter-utils": "8.15.1",

src/components/ClaimModal/ClaimModalMultiversX.tsx

@@ -23,7 +23,9 @@ import { formatNumberRoundFloor } from "libs/utils";
 
 const ClaimModal = ({ isOpen, onClose, title, tag1, value1, tag2, value2, claimType, mxClaimsContract }: any) => {
   const { address: mxAddress } = useGetAccountInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { colorMode } = useColorMode();
 
   const resetClaimState = () => {

src/components/Faucet/Faucet.tsx

@@ -9,7 +9,9 @@ import { CHAIN_TOKEN_SYMBOL, IS_DEVNET } from "libs/config";
 import { FaucetContract } from "libs/MultiversX/faucet";
 
 const Faucet = ({ tileBoxW, tileBoxH }: any) => {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { colorMode } = useColorMode();
   const { address: mxAddress } = useGetAccountInfo();
   const [isMxFaucetDisabled, setIsMxFaucetDisabled] = useState(false);

src/components/ListDataNFTModal.tsx

@@ -43,7 +43,9 @@ export type ListModalProps = {
 };
 
 export default function ListDataNFTModal({ isOpen, onClose, sellerFee, nftData, offer, marketContract, amount, setAmount, maxPerAddress }: ListModalProps) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { address } = useGetAccountInfo();
   const { hasPendingTransactions } = useGetPendingTransactions();
   const marketRequirements = useMarketStore((state) => state.marketRequirements);

src/components/MyListedDataLowerCard.tsx

@@ -45,7 +45,9 @@ type MyListedDataLowerCardProps = {
 };
 
 const MyListedDataLowerCard: FC<MyListedDataLowerCardProps> = ({ offer, nftMetadata }) => {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { colorMode } = useColorMode();
   const { hasPendingTransactions } = useGetPendingTransactions();
   const { tokenLogin, loginMethod } = useGetLoginInfo();

src/components/MyListedDataNFT.tsx

@@ -67,7 +67,9 @@ const MyListedDataNFT: FC<MyListedDataNFTProps> = (props) => {
     onUpdatePriceModalOpen,
     index,
   } = props;
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { hasPendingTransactions } = useGetPendingTransactions();
   const { address } = useGetAccountInfo();
   const ChainExplorer = CHAIN_TX_VIEWER[chainID as keyof typeof CHAIN_TX_VIEWER];

src/components/PreviewDataButton.tsx

@@ -18,7 +18,9 @@ type PreviewDataButtonPropType = {
 
 export default function PreviewDataButton(props: PreviewDataButtonPropType) {
   const { loginMethod } = useGetLoginInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [previewDataOnDevnetSession] = useLocalStorage(PREVIEW_DATA_ON_DEVNET_SESSION_KEY, null);
   const { colorMode } = useColorMode();
   const { previewDataURL, buttonSize = "sm", buttonWidth = "full", tokenName } = props;

src/components/ProcureDataNFTModal.tsx

@@ -44,7 +44,9 @@ export default function ProcureDataNFTModal({
   showCustomMintMsg,
   notifyPurchaseWasSuccess,
 }: ProcureAccessModalProps) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { address } = useGetAccountInfo();
   const toast = useToast();
   const { colorMode } = useColorMode();

src/components/ProfileCard.tsx

@@ -52,7 +52,9 @@ const ProfileCard = ({
   hasLoaded: boolean;
   setHasLoaded: any;
 }) => {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const ChainExplorer = CHAIN_TX_VIEWER[chainID as keyof typeof CHAIN_TX_VIEWER];
 
   const nftId = createNftId(collection, nonce);

src/components/Sections/AppFooter.tsx

@@ -11,7 +11,9 @@ const nonProdEnv = `env:${getSentryProfile()}`;
 
 export default function () {
   const { colorMode } = useColorMode();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const isPublicApi = getMvxRpcApi(chainID).includes("api.multiversx.com");
   const isPublicNetworkProvider = getNetworkProviderCodification(chainID).includes(".multiversx.com");
   const isApiNetworkProvider = getNetworkProvider(chainID) instanceof ApiNetworkProvider;

src/components/Sections/AppHeader.tsx

@@ -144,7 +144,9 @@ const exploreRouterMenu = [
 
 const AppHeader = ({ onShowConnectWalletModal, setMenuItem, handleLogout }: { onShowConnectWalletModal?: any; setMenuItem: any; handleLogout: any }) => {
   const { isOpen, onOpen, onClose } = useDisclosure();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { isLoggedIn: isMxLoggedIn, tokenLogin } = useGetLoginInfo();
   const { hasPendingTransactions } = useGetPendingTransactions();
   const { address: mxAddress } = useGetAccountInfo();
@@ -735,7 +737,9 @@ function shouldDisplayQuickMenuItem(quickMenuItem: any, isMxLoggedIn: boolean) {
 }
 
 function ItheumTokenBalanceBadge({ displayParams }: { displayParams: any }) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const itheumBalance = useAccountStore((state) => state.itheumBalance);
 
   return (

src/components/Sections/RecentDataNFTs.tsx

@@ -38,7 +38,9 @@ for (let i = 0; i < 10; i++) {
 
 const RecentDataNFTs = ({ headingText, headingSize }: { headingText: string; headingSize?: string }) => {
   const { isLoggedIn: isMxLoggedIn } = useGetLoginInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [loadedOffers, setLoadedOffers] = useState<boolean>(false);
   const [latestOffers, setLatestOffers] = useState<RecentDataNFTType[]>(latestOffersSkeleton);
   const { tokenLogin } = useGetLoginInfo();

src/components/Tables/ClaimsTxTable.tsx

@@ -11,7 +11,9 @@ import { DataTable } from "./Components/DataTable";
 import { ClaimsInTable, timeSince } from "./Components/tableUtils";
 
 export default function ClaimsTxTable(props: { address: string }) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [data, setData] = useState<ClaimsInTable[]>([]);
   const [loadingClaims, setLoadingClaims] = useState(-1);
   const toast = useToast();

src/components/Tables/InteractionTxTable.tsx

@@ -16,7 +16,9 @@ import { DataTable } from "./Components/DataTable";
 import { InteractionsInTable, timeSince } from "./Components/tableUtils";
 
 export default function InteractionTxTable(props: { address: string }) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [data, setData] = useState<InteractionsInTable[]>([]);
   const marketRequirements = useMarketStore((state) => state.marketRequirements);
   const [loadingInteractions, setLoadingInteractions] = useState(-1);

src/components/Tables/TokenTxTable.tsx

@@ -13,7 +13,9 @@ import { DataTable } from "./Components/DataTable";
 import { timeSince, TokenTableProps, TransactionInTable } from "./Components/tableUtils";
 
 export default function TokenTxTable(props: TokenTableProps) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [data, setData] = useState<TransactionInTable[]>([]);
   const [loadingData, setLoadingData] = useState<boolean>(true);
   const linkIconStyle = { display: "flex" };

src/components/UtilComps/AppSettings.tsx

@@ -11,7 +11,9 @@ const dataDexVersion = import.meta.env.VITE_APP_VERSION ? `v${import.meta.env.VI
 const nonProdEnv = `${getSentryProfile()}`;
 
 export default function () {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const isPublicApi = getMvxRpcApi(chainID).includes("api.multiversx.com");
   const isPublicNetworkProvider = getNetworkProviderCodification(chainID).includes(".multiversx.com");
   const isApiNetworkProvider = getNetworkProvider(chainID) instanceof ApiNetworkProvider;

src/components/UtilComps/ChainSupportedComponent.tsx

@@ -2,7 +2,9 @@ import { useGetNetworkConfig } from "@multiversx/sdk-dapp/hooks";
 import { notSupportedOnChain } from "libs/config";
 
 export default function ChainSupportedComponent({ feature, children }: { feature: any; children: any }) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
 
   if (notSupportedOnChain(feature, chainID)) {
     if (children.length && children.length > 1) {

src/components/UtilComps/ChainSupportedInput.tsx

@@ -4,7 +4,9 @@ import { IoConstructOutline } from "react-icons/io5";
 import { notSupportedOnChain } from "libs/config";
 
 export default function ChainSupportedInput({ feature, children }: { feature: any; children: any }) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
 
   if (notSupportedOnChain(feature, chainID)) {
     if (children.length && children.length > 1) {

src/components/UtilComps/DataNFTLiveUptime.tsx

@@ -14,7 +14,9 @@ export type DataNFTLiveUptimeProps = {
 };
 
 const DataNFTLiveUptime = (props: DataNFTLiveUptimeProps) => {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [liveUptimeCheckInProgress, setLiveUptimeCheckInProgress] = useState(true);
   const [liveUptimeOKMsg, setLiveUptimeOKMsg] = useState<null | string>(null);
   const [liveUptimeFAILMsg, setLiveUptimeFAILMsg] = useState<null | string>(null);

src/components/UtilComps/ExploreAppButton.tsx

@@ -20,7 +20,9 @@ export default function ExploreAppButton({
   customLabel?: string;
   customMargin?: number;
 }) {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { tokenLogin } = useGetLoginInfo();
 
   const shouldShowTheButton = () => {

src/components/UtilComps/UpperCardComponent.tsx

@@ -57,7 +57,9 @@ const UpperCardComponent: FC<UpperCardComponentProps> = ({
   const { colorMode } = useColorMode();
   // Multiversx API
   const { address } = useGetAccountInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { isLoggedIn: isMxLoggedIn } = useGetLoginInfo();
   const ChainExplorer = CHAIN_TX_VIEWER[chainID as keyof typeof CHAIN_TX_VIEWER];
   const navigate = useNavigate();

src/components/WalletDataNFTMX/AccessDatastreamModal.tsx

@@ -20,7 +20,9 @@ type DataStreamModalPropType = {
 
 export default function AccessDataStreamModal(props: DataStreamModalPropType) {
   const { isOpen, onClose, unlockAccessProgress, errorMessage } = props;
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { tokenLogin } = useGetLoginInfo();
 
   return (

src/components/WalletDataNFTMX/BurnDataNFTModal.tsx

@@ -23,7 +23,9 @@ type BurnDataNFTModalPropType = {
 
 export default function BurnDataNFTModal(props: BurnDataNFTModalPropType) {
   const { isOpen, onClose, selectedDataNft } = props;
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { colorMode } = useColorMode();
   const [burnNFTModalState, setBurnNFTModalState] = useState(1); // 1 and 2
   const [dataNftBurnAmountError, setDataNftBurnAmountError] = useState("");

src/components/WalletDataNFTMX/WalletDataNFTMX.tsx

@@ -62,7 +62,9 @@ import { isNFMeIDVaultClassDataNFT } from "libs/utils";
 import { IS_DEVNET } from "libs/MultiversX";
 
 export default function WalletDataNFTMX(item: any) {
-  const { chainID, network } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { loginMethod, tokenLogin } = useGetLoginInfo();
   const { colorMode } = useColorMode();
   const { address } = useGetAccountInfo();
@@ -99,10 +101,14 @@ export default function WalletDataNFTMX(item: any) {
 
     const [, sessionInfo] = signedTransactionsArray[0];
     try {
-      const txHash = sessionInfo.transactions[0].hash;
+      if (sessionInfo.transactions) {
+        const txHash = sessionInfo.transactions[0].hash;
 
-      if (webWalletListTxHash == "") {
-        setWebWalletListTxHash(txHash);
+        if (webWalletListTxHash == "") {
+          setWebWalletListTxHash(txHash);
+        }
+      } else {
+        console.log("ERR: WalletDataNFTMX hasSignedTransactions sessionInfo.transactions is undefined");
       }
     } catch (e) {
       sessionStorage.removeItem("web-wallet-tx");

src/pages/AdvertiseData/TradeData.tsx

@@ -11,7 +11,9 @@ import { TradeFormModal } from "./components/TradeFormModal";
 
 export const TradeData: React.FC = () => {
   const { address: mxAddress } = useGetAccountInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [dataCATAccount] = useState<Record<any, any>>(dataCATDemoUserData);
   const [isDrawerOpen, setIsDrawerOpen] = useState<boolean>(false);
   const [prefilledData, setPrefilledData] = useState<any>(null);

src/pages/AdvertiseData/components/TradeForm.tsx

@@ -105,7 +105,9 @@ export const TradeForm: React.FC<TradeFormProps> = (props) => {
   const { colorMode } = useColorMode();
   const toast = useToast();
   const { address: mxAddress } = useGetAccountInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const lockPeriod = useMintStore((state) => state.lockPeriodForBond);
   const dataNFTMarshalService: string = getApiDataMarshal(chainID);
   const bond = new BondContract(IS_DEVNET ? "devnet" : "mainnet");

src/pages/AdvertiseData/components/TradeFormModal.tsx

@@ -34,7 +34,9 @@ type TradeFormProps = {
 export const TradeFormModal: React.FC<TradeFormProps> = (props) => {
   const { isOpen, setIsOpen, dataToPrefill } = props;
   const { colorMode } = useColorMode();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [minRoyalties, setMinRoyalties] = useState<number>(-1);
   const [maxRoyalties, setMaxRoyalties] = useState<number>(-1);
   const [maxSupply, setMaxSupply] = useState<number>(-1);

src/pages/App/AppMultiversX.tsx

@@ -58,7 +58,9 @@ function App({ onShowConnectWalletModal }: { onShowConnectWalletModal: any }) {
   const [dataCatLinkedSession, setDataCatLinkedSession] = useLocalStorage("itm-datacat-linked", null);
   const { address: mxAddress } = useGetAccountInfo();
   const { isLoggedIn: isMxLoggedIn, loginMethod: mxLoginMethod } = useGetLoginInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [menuItem, setMenuItem] = useState(MENU.LANDING);
   const [rfKeys] = useState({
     tools: 0,

src/pages/App/Launcher.tsx

@@ -12,7 +12,9 @@ import AppMx from "./AppMultiversX";
 import ModalAuthPickerMx from "./ModalAuthPickerMultiversX";
 
 function Launcher() {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const [launchModeSession, setLaunchModeSession] = useLocalStorage("itm-launch-mode", null);
   const [launchMode, setLaunchMode] = useState(launchModeSession || "no-auth");
   const [redirectToRoute, setRedirectToRoute] = useState<null | string>(null);

src/pages/App/ModalAuthPickerMultiversX.tsx

@@ -40,7 +40,9 @@ let mvxGotConnected = false;
 
 function ModalAuthPickerMx({ resetLaunchMode, redirectToRoute }: { resetLaunchMode: any; redirectToRoute: null | string }) {
   const { address: mxAddress } = useGetAccountInfo();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { isOpen: isProgressModalOpen, onOpen: onProgressModalOpen, onClose: onProgressModalClose } = useDisclosure();
   const [, setWalletUsedSession] = useLocalStorage("itm-wallet-used", null);
   const { pathname } = useLocation();

src/pages/Bonding/Bonding.tsx

@@ -22,7 +22,9 @@ type CompensationNftsType = {
 };
 
 export const Bonding: React.FC = () => {
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { address } = useGetAccountInfo();
   const { hasPendingTransactions } = useGetPendingTransactions();
   const bondContractAdminDevnet = import.meta.env.VITE_ENV_BONDING_ADMIN_DEVNET;

src/pages/DataNFT/DataNFTDetails.tsx

@@ -87,7 +87,9 @@ interface DataNftVolume {
 export default function DataNFTDetails(props: DataNFTDetailsProps) {
   const toast = useToast();
   const navigate = useNavigate();
-  const { chainID } = useGetNetworkConfig();
+  const {
+    network: { chainId: chainID },
+  } = useGetNetworkConfig();
   const { tokenLogin, isLoggedIn: isMxLoggedIn } = useGetLoginInfo();
   const { colorMode } = useColorMode();
   const { tokenId: tokenIdParam, offerId: offerIdParam } = useParams();