chore: upgrade react-kit version (#1086)

Co-authored-by: Ludovic Levalleux <[email protected]>

package.json

@@ -46,7 +46,7 @@
   "dependencies": {
     "@apollo/client": "^3.8.1",
     "@bosonprotocol/chat-sdk": "^1.3.1-alpha.9",
-    "@bosonprotocol/react-kit": "^0.32.0-alpha.1",
+    "@bosonprotocol/react-kit": "^0.32.0",
     "@davatar/react": "^1.10.4",
     "@ethersproject/address": "^5.6.1",
     "@ethersproject/units": "^5.7.0",

src/CoreComponentsUpdaters.tsx

@@ -1,14 +1,51 @@
-import { CommitWidgetReduxUpdaters, hooks } from "@bosonprotocol/react-kit";
-import { useProvider } from "lib/utils/hooks/connection/connection";
+import {
+  CommitWidgetReduxUpdaters,
+  ConfigProvider,
+  hooks
+} from "@bosonprotocol/react-kit";
+import { useConfigContext } from "components/config/ConfigContext";
+import { CONFIG } from "lib/config";
+import {
+  useAccount,
+  useChainId,
+  useProvider,
+  useSigner
+} from "lib/utils/hooks/connection/connection";
 import React from "react";
 
 export const CoreComponentsUpdaters: React.FC = () => {
   const provider = useProvider();
   const isWindowVisible = hooks.useIsWindowVisible();
+  const { config } = useConfigContext();
+  const connectedChainId = useChainId();
+  const { account } = useAccount();
+  const signer = useSigner();
   return (
-    <CommitWidgetReduxUpdaters
-      isWindowVisible={isWindowVisible}
-      provider={provider}
-    />
+    <ConfigProvider
+      {...{
+        ...CONFIG,
+        envName: config.envName,
+        configId: config.envConfig.configId,
+        withWeb3React: false,
+        withCustomReduxContext: false,
+        defaultCurrencySymbol: CONFIG.defaultCurrency.symbol,
+        defaultCurrencyTicker: CONFIG.defaultCurrency.ticker,
+        licenseTemplate: CONFIG.rNFTLicenseTemplate,
+        minimumDisputeResolutionPeriodDays: CONFIG.minimumDisputePeriodInDays,
+        walletConnectProjectId: CONFIG.walletConnect.projectId,
+        ipfsProjectId: CONFIG.infuraProjectId,
+        ipfsProjectSecret: CONFIG.infuraProjectSecret,
+        withExternalConnectionProps: true,
+        externalConnectedChainId: connectedChainId,
+        externalConnectedAccount: account,
+        externalConnectedSigner: signer
+      }}
+    >
+      <CommitWidgetReduxUpdaters
+        isWindowVisible={isWindowVisible}
+        provider={provider}
+        withWeb3React={false}
+      />
+    </ConfigProvider>
   );
 };

src/components/detail/DetailWidget/BasicCommitDetailWidget.tsx

@@ -38,7 +38,9 @@ export const BasicCommitDetailWidget: React.FC<
         contactSellerForExchangeUrl: "",
         sellerCurationListBetweenCommas:
           curationLists?.sellerCurationList?.join(",") || "",
-        withReduxProvider: false
+        withReduxProvider: false,
+        withCustomReduxContext: false,
+        withWeb3React: false
       }}
       selectedVariant={selectedVariant}
       showPriceAsterisk={isPreview}

src/components/detail/DetailWidget/CommitDetailWidget.tsx

@@ -462,7 +462,9 @@ export const CommitDetailWidget: React.FC<CommitDetailWidgetProps> = ({
         externalConnectedChainId: connectedChainId,
         externalConnectedAccount: account,
         externalConnectedSigner: signer,
-        withReduxProvider: false
+        withReduxProvider: false,
+        withWeb3React: false,
+        withCustomReduxContext: false
       }}
       selectedVariant={selectedVariant}
       showPriceAsterisk={isPreview}

src/components/detail/DetailWidget/ExchangeDetailWidget.tsx

@@ -180,7 +180,10 @@ export const ExchangeDetailWidget: React.FC<ExchangeDetailWidgetProps> = ({
         withExternalConnectionProps: true,
         externalConnectedChainId: connectedChainId,
         externalConnectedAccount: address,
-        externalConnectedSigner: signer
+        externalConnectedSigner: signer,
+        withWeb3React: false,
+        withCustomReduxContext: false,
+        withReduxProvider: false
       }}
       showBosonLogo={isCustomStoreFront}
       showPriceAsterisk={false}

src/components/header/walletModal/index.tsx

@@ -1,4 +1,4 @@
-import { MagicLoginButton } from "@bosonprotocol/react-kit";
+import { bosonButtonThemes, MagicLoginButton } from "@bosonprotocol/react-kit";
 import { useWeb3React } from "@web3-react/core";
 import { LinkWithQuery } from "components/customNavigation/LinkWithQuery";
 import { AutoColumn } from "components/ui/column";
@@ -97,7 +97,8 @@ export default function WalletModal() {
           </OptionGrid>
           <MagicLoginButton
             buttonProps={{
-              style: {
+              theme: {
+                ...bosonButtonThemes({ withBosonStyle: false })["primary"],
                 color: magicLoginTextColor
               }
             }}

src/components/header/web3Provider/index.tsx

@@ -27,9 +27,7 @@ export default function Web3Provider({ children }: { children: ReactNode }) {
 
 /** A component to run hooks under the Web3ReactProvider context. */
 function Updater() {
-  const { account } = useWeb3React();
-
-  const { connector } = useWeb3React();
+  const { account, connector } = useWeb3React();
 
   const previousAccount = usePrevious(account);
   const [, addConnectedWallet] = useConnectedWallets();