From d2ea22574a311c62c15c15a02d4f2d56a7b7a4c0 Mon Sep 17 00:00:00 2001
From: broody <broody@gmail.com>
Date: Thu, 11 Apr 2024 06:33:42 -1000
Subject: [PATCH] Starknet example use useExplorer

---
 .../src/components/DojoSpawnAndMove.tsx                  | 9 +++++++--
 .../src/components/StarknetProvider.tsx                  | 6 +++---
 .../starknet-react-next/src/components/TransferEth.tsx   | 5 +++--
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/examples/starknet-react-next/src/components/DojoSpawnAndMove.tsx b/examples/starknet-react-next/src/components/DojoSpawnAndMove.tsx
index 92fe85a8b..4b7686955 100644
--- a/examples/starknet-react-next/src/components/DojoSpawnAndMove.tsx
+++ b/examples/starknet-react-next/src/components/DojoSpawnAndMove.tsx
@@ -1,4 +1,8 @@
-import { useAccount, useContractWrite } from "@starknet-react/core";
+import {
+  useAccount,
+  useContractWrite,
+  useExplorer,
+} from "@starknet-react/core";
 import { useEffect, useState } from "react";
 
 const worldAddress =
@@ -8,6 +12,7 @@ const actionsAddress =
 
 export function DojoSpawnAndMove() {
   const { account } = useAccount();
+  const explorer = useExplorer();
   const [txnHash, setTxnHash] = useState<string>();
   const { writeAsync: spawn } = useContractWrite({
     calls: [
@@ -60,7 +65,7 @@ export function DojoSpawnAndMove() {
           <p>
             Transaction hash:{" "}
             <a
-              href={`https://sepolia.starkscan.io/tx/${txnHash}`}
+              href={explorer.transaction(txnHash)}
               target="_blank"
               rel="noreferrer"
             >
diff --git a/examples/starknet-react-next/src/components/StarknetProvider.tsx b/examples/starknet-react-next/src/components/StarknetProvider.tsx
index 73e764715..63531b6f5 100644
--- a/examples/starknet-react-next/src/components/StarknetProvider.tsx
+++ b/examples/starknet-react-next/src/components/StarknetProvider.tsx
@@ -1,5 +1,5 @@
 import { sepolia } from "@starknet-react/chains";
-import { Connector, StarknetConfig } from "@starknet-react/core";
+import { Connector, StarknetConfig, starkscan } from "@starknet-react/core";
 import { PropsWithChildren } from "react";
 import CartridgeConnector from "@cartridge/connector";
 import { RpcProvider } from "starknet";
@@ -10,6 +10,7 @@ export function StarknetProvider({ children }: PropsWithChildren) {
       autoConnect
       chains={[sepolia]}
       connectors={connectors}
+      explorer={starkscan}
       provider={(_chain) =>
         new RpcProvider({
           nodeUrl: process.env.NEXT_PUBLIC_RPC_SEPOLIA,
@@ -20,8 +21,7 @@ export function StarknetProvider({ children }: PropsWithChildren) {
     </StarknetConfig>
   );
 }
-console.log(process.env.NEXT_PUBLIC_VERCEL_ENV);
-console.log(process.env.NEXT_PUBLIC_VERCEL_BRANCH_URL);
+
 const url =
   process.env.NEXT_PUBLIC_VERCEL_ENV === "preview"
     ? `https://keychain-git-${process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_REF}.preview.cartridge.gg`
diff --git a/examples/starknet-react-next/src/components/TransferEth.tsx b/examples/starknet-react-next/src/components/TransferEth.tsx
index 730e5223b..504621183 100644
--- a/examples/starknet-react-next/src/components/TransferEth.tsx
+++ b/examples/starknet-react-next/src/components/TransferEth.tsx
@@ -1,4 +1,4 @@
-import { useAccount } from "@starknet-react/core";
+import { useAccount, useExplorer } from "@starknet-react/core";
 import { useCallback, useState } from "react";
 import { constants } from "starknet";
 
@@ -10,6 +10,7 @@ export const TransferEth = () => {
     constants.StarknetChainId.SN_SEPOLIA,
   );
   const { account } = useAccount();
+  const explorer = useExplorer();
   const [txnHash, setTxnHash] = useState<string>();
 
   const executePointOne = useCallback(async () => {
@@ -135,7 +136,7 @@ export const TransferEth = () => {
         <p>
           Transaction hash:{" "}
           <a
-            href={`https://sepolia.starkscan.io/tx/${txnHash}`}
+            href={explorer.transaction(txnHash)}
             target="_blank"
             rel="noreferrer"
           >