diff --git a/.changeset/brave-parrots-camp.md b/.changeset/brave-parrots-camp.md new file mode 100644 index 00000000..9d474021 --- /dev/null +++ b/.changeset/brave-parrots-camp.md @@ -0,0 +1,9 @@ +--- +"@xmtp/react-sdk": minor +--- + +* Upgrade JS SDK to v11 +* Upgrade all standards-track content types +* Replace `ethers` with `viem` +* Update read receipt processor for updated content type +* Update client signer type diff --git a/examples/react-quickstart/package.json b/examples/react-quickstart/package.json index 6bc00bc9..6b3ffdd4 100644 --- a/examples/react-quickstart/package.json +++ b/examples/react-quickstart/package.json @@ -17,14 +17,14 @@ }, "dependencies": { "@heroicons/react": "^2.0.18", - "@rainbow-me/rainbowkit": "^0.12.16", - "@xmtp/content-type-remote-attachment": "^1.0.7", + "@rainbow-me/rainbowkit": "^1.0.11", + "@xmtp/content-type-remote-attachment": "^1.1.2", "@xmtp/react-components": "workspace:*", "@xmtp/react-sdk": "workspace:*", - "ethers": "5.7.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "wagmi": "^0.12.18" + "viem": "^1.12.2", + "wagmi": "^1.4.2" }, "devDependencies": { "@types/react": "^18.2.20", diff --git a/examples/react-quickstart/src/components/App.tsx b/examples/react-quickstart/src/components/App.tsx index 0e9499c0..fcef5e41 100644 --- a/examples/react-quickstart/src/components/App.tsx +++ b/examples/react-quickstart/src/components/App.tsx @@ -1,18 +1,18 @@ import "./App.css"; -import { useSigner } from "wagmi"; import { useEffect } from "react"; import { useClient } from "@xmtp/react-sdk"; import { ContentRouter } from "./ContentRouter"; +import { useWallet } from "../hooks/useWallet"; const App = () => { - const { data: signer } = useSigner(); + const { address } = useWallet(); const { disconnect } = useClient(); // disconnect XMTP client when the wallet changes useEffect(() => { void disconnect(); // eslint-disable-next-line react-hooks/exhaustive-deps - }, [signer]); + }, [address]); return (
diff --git a/examples/react-quickstart/src/components/XMTPConnect.tsx b/examples/react-quickstart/src/components/XMTPConnect.tsx index 2a5f6107..cc57c200 100644 --- a/examples/react-quickstart/src/components/XMTPConnect.tsx +++ b/examples/react-quickstart/src/components/XMTPConnect.tsx @@ -1,22 +1,22 @@ import { LinkIcon, ExclamationTriangleIcon } from "@heroicons/react/24/outline"; import { useClient } from "@xmtp/react-sdk"; import { useCallback } from "react"; +import { useWalletClient } from "wagmi"; import { Notification } from "./Notification"; -import { useWallet } from "../hooks/useWallet"; type XMTPConnectButtonProps = { label: string; }; const XMTPConnectButton: React.FC = ({ label }) => { - const { signer } = useWallet(); const { initialize } = useClient(); + const { data: walletClient } = useWalletClient(); const handleConnect = useCallback(() => { void initialize({ - signer, + signer: walletClient, }); - }, [initialize, signer]); + }, [initialize, walletClient]); return (