Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update for controller 0.5.0 (without starknet-react v3) #282

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
},
"dependencies": {
"@apollo/client": "^3.7.11",
"@cartridge/connector": "^0.3.44",
"@cartridge/connector": "0.5.0-alpha.1",
"@dojoengine/create-burner": "^1.0.0-alpha.9",
"@fontsource/vt323": "^4.5.10",
"@scure/starknet": "^1.0.0",
Expand Down
10 changes: 5 additions & 5 deletions ui/src/app/components/onboarding/Sections/WalletSection.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { Button } from "@/app/components/buttons/Button";
import { CompleteIcon } from "@/app/components/icons/Icons";
import { displayAddress, padAddress, copyToClipboard } from "@/app/lib/utils";
import { useConnect, useDisconnect } from "@starknet-react/core";
import useNetworkAccount from "@/app/hooks/useNetworkAccount";
import useUIStore from "@/app/hooks/useUIStore";
import { getWalletConnectors } from "@/app/lib/connectors";
import { copyToClipboard, displayAddress, padAddress } from "@/app/lib/utils";
import { useConnect, useDisconnect } from "@starknet-react/core";

interface WalletSectionProps {
step: number;
Expand All @@ -18,7 +18,7 @@ const WalletSection = ({ step }: WalletSectionProps) => {
const isController = useUIStore((state) => state.isController);

const walletConnectors = getWalletConnectors(connectors);
const cartridgeConnector = connectors.find(
const controllerConnector = connectors.find(
(connector) => connector.id === "controller"
);

Expand Down Expand Up @@ -58,7 +58,7 @@ const WalletSection = ({ step }: WalletSectionProps) => {
<Button
onClick={() => {
disconnect();
connect({ connector: cartridgeConnector });
connect({ connector: controllerConnector });
}}
>
Login with Cartridge Controller
Comment on lines 60 to 64
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Refactor duplicated connection logic

The connection handling logic is duplicated between mobile and desktop versions. Consider extracting this into a reusable function to improve maintainability.

+  const handleConnect = (connector: any) => {
+    disconnect();
+    connect({ connector });
+  };
+
   // In desktop version
   <Button
     onClick={() => {
-      disconnect();
-      connect({ connector: controllerConnector });
+      handleConnect(controllerConnector);
     }}
   >

   // In mobile version
   <Button
     onClick={() => {
-      disconnect();
-      connect({ connector: controllerConnector });
+      handleConnect(controllerConnector);
     }}
   >

Also applies to: 82-86

Expand All @@ -80,7 +80,7 @@ const WalletSection = ({ step }: WalletSectionProps) => {
<Button
onClick={() => {
disconnect();
connect({ connector: cartridgeConnector });
connect({ connector: controllerConnector });
}}
>
Login with Cartridge Controller
Expand Down
6 changes: 4 additions & 2 deletions ui/src/app/components/profile/ProfileDialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import useUIStore from "@/app/hooks/useUIStore";
import { checkCartridgeConnector } from "@/app/lib/connectors";
import { copyToClipboard, displayAddress, padAddress } from "@/app/lib/utils";
import { NullAdventurer } from "@/app/types";
import CartridgeConnector from "@cartridge/connector";
import ControllerConnector from "@cartridge/connector/controller";
import { useConnect, useDisconnect } from "@starknet-react/core";
import { useState } from "react";
import { MdClose } from "react-icons/md";
Expand Down Expand Up @@ -118,7 +118,9 @@ export const ProfileDialog = ({
</div>
<Button
onClick={() =>
(connector as unknown as CartridgeConnector).openMenu()
(
connector as unknown as ControllerConnector
).controller.openSettings()
Comment on lines +121 to +123
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Improve type safety by avoiding unsafe type casting.

The current implementation uses an unsafe type cast with unknown. Consider using a type-safe approach:

-                    (
-                      connector as unknown as ControllerConnector
-                    ).controller.openSettings()
+                    (connector as ControllerConnector).controller.openSettings()

Better yet, consider updating the connector's type definition:

interface ConnectHookState {
  connector: ControllerConnector | undefined;
  // ... other properties
}

}
>
Change Settings
Expand Down
10 changes: 3 additions & 7 deletions ui/src/app/lib/connectors.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import ControllerConnector from "@cartridge/connector/controller";
import { Connector } from "@starknet-react/core";
import CartridgeConnector from "@cartridge/connector";
import { shortString } from "starknet";
// import { WebWalletConnector } from "starknetkit/webwallet";

export const checkArcadeConnector = (connector?: Connector) => {
Expand Down Expand Up @@ -49,13 +48,13 @@ export const providerInterfaceCamel = (provider: string) => {
// url: argentWebWalletUrl(),
// });

export const cartridgeConnector = (
export const controllerConnector = (
gameAddress: string,
lordsAddress: string,
ethAddress: string,
rpcUrl: string
) =>
new CartridgeConnector({
new ControllerConnector({
policies: [
{
target: gameAddress,
Expand Down Expand Up @@ -102,9 +101,6 @@ export const cartridgeConnector = (
method: "approve",
},
],
paymaster: {
caller: shortString.encodeShortString("ANY_CALLER"),
},
rpc: rpcUrl,
theme: "loot-survivor",
}) as never as Connector;
4 changes: 2 additions & 2 deletions ui/src/app/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ import {
import { useSyscalls } from "@/app/lib/utils/syscalls";
import { Menu, ZeroUpgrade } from "@/app/types";
import { useQuery } from "@apollo/client";
import CartridgeConnector from "@cartridge/connector";
import ControllerConnector from "@cartridge/connector/controller";
import { sepolia } from "@starknet-react/chains";
import { useConnect, useContract, useProvider } from "@starknet-react/core";
import { useCallback, useEffect, useMemo, useState } from "react";
Expand Down Expand Up @@ -276,7 +276,7 @@ function Home() {
useEffect(() => {
const init = async () => {
const username = await (
connector as unknown as CartridgeConnector
connector as unknown as ControllerConnector
).username();
setUsername(username || "");
setControllerDelegate("");
Expand Down
15 changes: 7 additions & 8 deletions ui/src/app/provider.tsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,15 @@
"use client";
import React from "react";
import { controllerConnector } from "@/app/lib/connectors";
import { Chain, mainnet, sepolia } from "@starknet-react/chains";
import {
jsonRpcProvider,
StarknetConfig,
starkscan,
jsonRpcProvider,
useInjectedConnectors,
} from "@starknet-react/core";
import { mainnet, sepolia } from "@starknet-react/chains";
import { Chain } from "@starknet-react/chains";
import { networkConfig } from "./lib/networkConfig";
import React from "react";
import { Network } from "./hooks/useUIStore";
import { useInjectedConnectors } from "@starknet-react/core";
import { cartridgeConnector } from "@/app/lib/connectors";
import { networkConfig } from "./lib/networkConfig";

export function StarknetProvider({
children,
Expand Down Expand Up @@ -38,7 +37,7 @@ export function StarknetProvider({
chains={[network === "mainnet" ? mainnet : sepolia]}
connectors={[
...connectors,
cartridgeConnector(
controllerConnector(
networkConfig[network!].gameAddress,
networkConfig[network!].lordsAddress,
networkConfig[network!].ethAddress,
Expand Down
Loading
Loading