@bosonprotocol/react-kit 0.29.0-alpha.2 → 0.29.0-alpha.20

package/src/components/cta/dispute/RaiseDisputeButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   exchangeId: BigNumberish;
@@ -16,33 +17,35 @@ type SuccessPayload = {
 export type IRaiseDisputeButton = AdditionalProps &
   CtaButtonProps<SuccessPayload>;
 
-export const RaiseDisputeButton = ({
-  variant = "secondaryFill",
-  exchangeId,
-  ...restProps
-}: IRaiseDisputeButton) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
+export const RaiseDisputeButton = withQueryClientProvider(
+  ({
+    variant = "secondaryFill",
+    exchangeId,
+    ...restProps
+  }: IRaiseDisputeButton) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
 
-  const actions = [
-    {
-      writeContractFn: () => coreSdk.raiseDispute(exchangeId),
-      signMetaTxFn: async () =>
-        coreSdk.signMetaTxRaiseDispute({
-          nonce: Date.now(),
-          exchangeId
-        })
-    }
-  ];
+    const actions = [
+      {
+        writeContractFn: () => coreSdk.raiseDispute(exchangeId),
+        signMetaTxFn: async () =>
+          coreSdk.signMetaTxRaiseDispute({
+            nonce: Date.now(),
+            exchangeId
+          })
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Raise"
-      successPayload={{ exchangeId }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Raise"
+        successPayload={{ exchangeId }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);

package/src/components/cta/dispute/RefuseDisputeButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   exchangeId: BigNumberish;
@@ -16,28 +17,30 @@ type SuccessPayload = {
 export type IRefuseDisputeButton = AdditionalProps &
   CtaButtonProps<SuccessPayload>;
 
-export const RefuseDisputeButton = ({
-  exchangeId,
-  variant = "secondaryFill",
-  ...restProps
-}: IRefuseDisputeButton) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
-  const actions = [
-    {
-      writeContractFn: () => coreSdk.refuseEscalatedDispute(exchangeId)
-      // TODO: ADD signMetaTxFn - has not been implemented in coreSDK yet.
-    }
-  ];
+export const RefuseDisputeButton = withQueryClientProvider(
+  ({
+    exchangeId,
+    variant = "secondaryFill",
+    ...restProps
+  }: IRefuseDisputeButton) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
+    const actions = [
+      {
+        writeContractFn: () => coreSdk.refuseEscalatedDispute(exchangeId)
+        // TODO: ADD signMetaTxFn - has not been implemented in coreSDK yet.
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Refuse"
-      successPayload={{ exchangeId }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Refuse"
+        successPayload={{ exchangeId }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);

package/src/components/cta/dispute/RemoveFeesDisputeResolverButton.tsx

@@ -8,6 +8,7 @@ import { CtaButtonProps } from "../common/types";
 import { Loading } from "../../Loading";
 import { CreateSellerArgs, TransactionResponse } from "@bosonprotocol/common";
 import { ButtonSize } from "../../ui/buttonSize";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 export type IRemoveFeesDisputeResolver = {
   exchangeId: BigNumberish;
   createSellerArgs: CreateSellerArgs;
@@ -18,76 +19,78 @@ export type IRemoveFeesDisputeResolver = {
   exchangeId: BigNumberish;
 }>;
 
-export const RemoveFeesDisputeResolver = ({
-  exchangeId,
-  disabled = false,
-  showLoading = false,
-  extraInfo,
-  onSuccess,
-  onError,
-  onPendingSignature,
-  onPendingTransaction,
-  waitBlocks = 1,
-  children,
-  size = ButtonSize.Large,
-  variant = "primaryFill",
-  createSellerArgs,
-  buyerPercent,
-  disputeResolverId,
-  feeTokenAddresses,
-  ...coreSdkConfig
-}: IRemoveFeesDisputeResolver) => {
-  const coreSdk = useCoreSdk(coreSdkConfig.coreSdkConfig);
-  const [isLoading, setIsLoading] = useState<boolean>(false);
+export const RemoveFeesDisputeResolver = withQueryClientProvider(
+  ({
+    exchangeId,
+    disabled = false,
+    showLoading = false,
+    extraInfo,
+    onSuccess,
+    onError,
+    onPendingSignature,
+    onPendingTransaction,
+    waitBlocks = 1,
+    children,
+    size = ButtonSize.Large,
+    variant = "primaryFill",
+    createSellerArgs,
+    buyerPercent,
+    disputeResolverId,
+    feeTokenAddresses,
+    ...coreSdkConfig
+  }: IRemoveFeesDisputeResolver) => {
+    const coreSdk = useCoreSdk(coreSdkConfig.coreSdkConfig);
+    const [isLoading, setIsLoading] = useState<boolean>(false);
 
-  return (
-    <Button
-      variant={variant}
-      size={size}
-      disabled={disabled}
-      onClick={async (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        e.stopPropagation();
-        if (!isLoading) {
-          let txResponse: TransactionResponse | undefined = undefined;
-          try {
-            setIsLoading(true);
-            onPendingSignature?.();
+    return (
+      <Button
+        variant={variant}
+        size={size}
+        disabled={disabled}
+        onClick={async (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
+          e.stopPropagation();
+          if (!isLoading) {
+            let txResponse: TransactionResponse | undefined = undefined;
+            try {
+              setIsLoading(true);
+              onPendingSignature?.();
 
-            txResponse = await coreSdk.removeFeesFromDisputeResolver(
-              disputeResolverId,
-              feeTokenAddresses
-            );
+              txResponse = await coreSdk.removeFeesFromDisputeResolver(
+                disputeResolverId,
+                feeTokenAddresses
+              );
 
-            onPendingTransaction?.(txResponse.hash);
-            const receipt = await txResponse.wait(waitBlocks);
+              onPendingTransaction?.(txResponse.hash);
+              const receipt = await txResponse.wait(waitBlocks);
 
-            onSuccess?.(receipt as providers.TransactionReceipt, {
-              exchangeId
-            });
-          } catch (error) {
-            onError?.(error as Error, {
-              txResponse: txResponse as providers.TransactionResponse
-            });
-          } finally {
-            setIsLoading(false);
+              onSuccess?.(receipt as providers.TransactionReceipt, {
+                exchangeId
+              });
+            } catch (error) {
+              onError?.(error as Error, {
+                txResponse: txResponse as providers.TransactionResponse
+              });
+            } finally {
+              setIsLoading(false);
+            }
           }
-        }
-      }}
-    >
-      <ButtonTextWrapper>
-        {children || "Remove Fees"}
-        {extraInfo && ((!isLoading && showLoading) || !showLoading) ? (
-          <ExtraInfo>{extraInfo}</ExtraInfo>
-        ) : (
-          <>
-            {isLoading && showLoading && (
-              <LoadingWrapper>
-                <Loading />
-              </LoadingWrapper>
-            )}
-          </>
-        )}
-      </ButtonTextWrapper>
-    </Button>
-  );
-};
+        }}
+      >
+        <ButtonTextWrapper>
+          {children || "Remove Fees"}
+          {extraInfo && ((!isLoading && showLoading) || !showLoading) ? (
+            <ExtraInfo>{extraInfo}</ExtraInfo>
+          ) : (
+            <>
+              {isLoading && showLoading && (
+                <LoadingWrapper>
+                  <Loading />
+                </LoadingWrapper>
+              )}
+            </>
+          )}
+        </ButtonTextWrapper>
+      </Button>
+    );
+  }
+);

package/src/components/cta/dispute/ResolveDisputeButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish, utils } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   exchangeId: BigNumberish;
@@ -21,44 +22,46 @@ type SuccessPayload = {
 export type IResolveDisputeButton = AdditionalProps &
   CtaButtonProps<SuccessPayload>;
 
-export const ResolveDisputeButton = ({
-  exchangeId,
-  proposal,
-  variant = "primaryFill",
-  ...restProps
-}: IResolveDisputeButton) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
-  const signature = utils.splitSignature(proposal.signature);
+export const ResolveDisputeButton = withQueryClientProvider(
+  ({
+    exchangeId,
+    proposal,
+    variant = "primaryFill",
+    ...restProps
+  }: IResolveDisputeButton) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
+    const signature = utils.splitSignature(proposal.signature);
 
-  const actions = [
-    {
-      writeContractFn: () =>
-        coreSdk.resolveDispute({
-          exchangeId: exchangeId,
-          buyerPercentBasisPoints: proposal.percentageAmount,
-          sigR: signature.r,
-          sigS: signature.s,
-          sigV: signature.v
-        }),
-      signMetaTxFn: async () =>
-        coreSdk.signMetaTxResolveDispute({
-          exchangeId,
-          buyerPercent: proposal.percentageAmount,
-          counterpartySig: signature,
-          nonce: Date.now()
-        })
-    }
-  ];
+    const actions = [
+      {
+        writeContractFn: () =>
+          coreSdk.resolveDispute({
+            exchangeId: exchangeId,
+            buyerPercentBasisPoints: proposal.percentageAmount,
+            sigR: signature.r,
+            sigS: signature.s,
+            sigV: signature.v
+          }),
+        signMetaTxFn: async () =>
+          coreSdk.signMetaTxResolveDispute({
+            exchangeId,
+            buyerPercent: proposal.percentageAmount,
+            counterpartySig: signature,
+            nonce: Date.now()
+          })
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Resolve"
-      successPayload={{ exchangeId }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Resolve"
+        successPayload={{ exchangeId }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);

package/src/components/cta/dispute/RetractDisputeButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   exchangeId: BigNumberish;
@@ -16,33 +17,35 @@ type SuccessPayload = {
 export type IRetractDisputeButton = AdditionalProps &
   CtaButtonProps<SuccessPayload>;
 
-export const RetractDisputeButton = ({
-  exchangeId,
-  variant = "primaryFill",
-  ...restProps
-}: IRetractDisputeButton) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
+export const RetractDisputeButton = withQueryClientProvider(
+  ({
+    exchangeId,
+    variant = "primaryFill",
+    ...restProps
+  }: IRetractDisputeButton) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
 
-  const actions = [
-    {
-      writeContractFn: () => coreSdk.retractDispute(exchangeId),
-      signMetaTxFn: async () =>
-        coreSdk.signMetaTxRetractDispute({
-          nonce: Date.now(),
-          exchangeId
-        })
-    }
-  ];
+    const actions = [
+      {
+        writeContractFn: () => coreSdk.retractDispute(exchangeId),
+        signMetaTxFn: async () =>
+          coreSdk.signMetaTxRetractDispute({
+            nonce: Date.now(),
+            exchangeId
+          })
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Retract"
-      successPayload={{ exchangeId }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Retract"
+        successPayload={{ exchangeId }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);

package/src/components/cta/exchange/BatchCompleteButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   /**
@@ -18,33 +19,31 @@ type SuccessPayload = {
 
 type Props = AdditionalProps & CtaButtonProps<SuccessPayload>;
 
-export const BatchCompleteButton = ({
-  exchangeIds,
-  variant = "primaryFill",
-  ...restProps
-}: Props) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
+export const BatchCompleteButton = withQueryClientProvider(
+  ({ exchangeIds, variant = "primaryFill", ...restProps }: Props) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
 
-  const actions = [
-    {
-      writeContractFn: () => coreSdk.completeExchangeBatch(exchangeIds),
-      signMetaTxFn: () =>
-        coreSdk.signMetaTxCompleteExchangeBatch({
-          nonce: Date.now(),
-          exchangeIds
-        })
-    }
-  ];
+    const actions = [
+      {
+        writeContractFn: () => coreSdk.completeExchangeBatch(exchangeIds),
+        signMetaTxFn: () =>
+          coreSdk.signMetaTxCompleteExchangeBatch({
+            nonce: Date.now(),
+            exchangeIds
+          })
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Batch Complete"
-      successPayload={{ exchangeIds }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Batch Complete"
+        successPayload={{ exchangeIds }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);

package/src/components/cta/exchange/CancelButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   exchangeId: BigNumberish;
@@ -15,33 +16,31 @@ type SuccessPayload = {
 
 export type ICancelButton = AdditionalProps & CtaButtonProps<SuccessPayload>;
 
-export const CancelButton = ({
-  variant = "secondaryFill",
-  exchangeId,
-  ...restProps
-}: ICancelButton) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
+export const CancelButton = withQueryClientProvider(
+  ({ variant = "secondaryFill", exchangeId, ...restProps }: ICancelButton) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
 
-  const actions = [
-    {
-      writeContractFn: () => coreSdk.cancelVoucher(exchangeId),
-      signMetaTxFn: () =>
-        coreSdk.signMetaTxCancelVoucher({
-          nonce: Date.now(),
-          exchangeId
-        })
-    }
-  ];
+    const actions = [
+      {
+        writeContractFn: () => coreSdk.cancelVoucher(exchangeId),
+        signMetaTxFn: () =>
+          coreSdk.signMetaTxCancelVoucher({
+            nonce: Date.now(),
+            exchangeId
+          })
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Cancel"
-      successPayload={{ exchangeId }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Cancel"
+        successPayload={{ exchangeId }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);

package/src/components/cta/exchange/CompleteButton.tsx

@@ -4,6 +4,7 @@ import { BigNumberish } from "ethers";
 import { CtaButtonProps } from "../common/types";
 import { CtaButton } from "../common/CtaButton";
 import { useCoreSdkOverrides } from "../../../hooks/core-sdk/useCoreSdkOverrides";
+import { withQueryClientProvider } from "../../queryClient/withQueryClientProvider";
 
 type AdditionalProps = {
   exchangeId: BigNumberish;
@@ -15,33 +16,31 @@ type SuccessPayload = {
 
 type Props = AdditionalProps & CtaButtonProps<SuccessPayload>;
 
-export const CompleteButton = ({
-  exchangeId,
-  variant = "primaryFill",
-  ...restProps
-}: Props) => {
-  const coreSdk = useCoreSdkOverrides({
-    coreSdkConfig: restProps.coreSdkConfig
-  });
+export const CompleteButton = withQueryClientProvider(
+  ({ exchangeId, variant = "primaryFill", ...restProps }: Props) => {
+    const coreSdk = useCoreSdkOverrides({
+      coreSdkConfig: restProps.coreSdkConfig
+    });
 
-  const actions = [
-    {
-      writeContractFn: () => coreSdk.completeExchange(exchangeId),
-      signMetaTxFn: () =>
-        coreSdk.signMetaTxCompleteExchange({
-          nonce: Date.now(),
-          exchangeId
-        })
-    }
-  ];
+    const actions = [
+      {
+        writeContractFn: () => coreSdk.completeExchange(exchangeId),
+        signMetaTxFn: () =>
+          coreSdk.signMetaTxCompleteExchange({
+            nonce: Date.now(),
+            exchangeId
+          })
+      }
+    ];
 
-  return (
-    <CtaButton
-      variant={variant}
-      defaultLabel="Complete"
-      successPayload={{ exchangeId }}
-      actions={actions}
-      {...restProps}
-    />
-  );
-};
+    return (
+      <CtaButton
+        variant={variant}
+        defaultLabel="Complete"
+        successPayload={{ exchangeId }}
+        actions={actions}
+        {...restProps}
+      />
+    );
+  }
+);