use client from provider

src/App.tsx

@@ -1,16 +1,13 @@
-import { ConnectButton, useCurrentAccount } from "@mysten/dapp-kit";
 import {
-	CoinBalance,
-	CoinStruct,
-	SuiClient,
-	getFullnodeUrl,
-} from "@mysten/sui.js/client";
+	ConnectButton,
+	useCurrentAccount,
+	useSuiClient,
+} from "@mysten/dapp-kit";
+import { CoinBalance, CoinStruct } from "@mysten/sui.js/client";
 import { MIST_PER_SUI } from "@mysten/sui.js/utils";
 import { useEffect, useState } from "react";
 import GetSuiFromFaucetForm from "./components/GetSuiFromFaucetForm";
 
-const suiClient = new SuiClient({ url: getFullnodeUrl("devnet") });
-
 const balanceToSui = (balance: CoinBalance) => {
 	return Number.parseInt(balance.totalBalance) / Number(MIST_PER_SUI);
 };
@@ -20,6 +17,7 @@ const mistToSui = (amountInMist: string) => {
 };
 
 export default function App() {
+	const suiClient = useSuiClient();
 	const currentAccount = useCurrentAccount();
 	const [balance, setBalance] = useState("(loading...)");
 	const [coins, setCoins] = useState<CoinStruct[]>([]);
@@ -38,7 +36,7 @@ export default function App() {
 				setCoins(coins.data);
 			}
 		})();
-	}, [currentAccount]);
+	}, [suiClient, currentAccount]);
 
 	return (
 		<>