Skip to content

Commit a82b9ad

Browse files
frolicfrolic
committed
wip playing with porto again
1 parent d5def63 commit a82b9ad

10 files changed

Lines changed: 375 additions & 52 deletions

File tree

‎packages/entrykit/mprocs.yaml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
scrollback: 10000
22
procs:
33
client:
4-
shell: pnpm vite dev playground
4+
shell: pnpm vite dev playground --force
55
anvil:
66
shell: anvil --block-time 2 --load-state playground/anvil-state.json
77

‎packages/entrykit/playground/wagmiConfig.ts‎

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { chainId } from "./common";
55
import { garnet, pyrope } from "@latticexyz/common/chains";
66
import { wiresaw } from "@latticexyz/common/internal";
77
import { getDefaultConnectors } from "../src/getDefaultConnectors";
8-
import { idConnector } from "@latticexyz/id/internal";
8+
import { idConnector, porto, mode } from "@latticexyz/id/internal";
99

1010
const appConfig = {
1111
walletConnectProjectId: "3f1000f6d9e0139778ab719fddba894a",
@@ -84,31 +84,35 @@ const pyropeWithPaymaster = {
8484
};
8585

8686
const chains = [
87-
mainnet,
88-
garnetWithPaymaster,
87+
// mainnet,
88+
// garnetWithPaymaster,
8989
anvilWithPaymaster,
90-
redstoneWithPaymaster,
91-
pyropeWithPaymaster,
90+
// redstoneWithPaymaster,
91+
// pyropeWithPaymaster,
9292
] as const satisfies Chain[];
9393

9494
const transports = {
95-
[mainnet.id]: http(),
95+
// [mainnet.id]: http(),
9696
[anvilWithPaymaster.id]: http(),
97-
[garnetWithPaymaster.id]: wiresaw(),
98-
[redstoneWithPaymaster.id]: wiresaw(),
99-
[pyropeWithPaymaster.id]: http(),
97+
// [garnetWithPaymaster.id]: wiresaw(),
98+
// [redstoneWithPaymaster.id]: wiresaw(),
99+
// [pyropeWithPaymaster.id]: http(),
100100
} as const;
101101

102102
// TODO: remove once we bump viem to include https://github.com/wevm/viem/commit/b55ec5a6ee448367d3da844303a6f1a5bc71514a
103103
const pollingInterval = {
104-
[mainnet.id]: 2000,
104+
// [mainnet.id]: 2000,
105105
[anvilWithPaymaster.id]: 500,
106-
[garnetWithPaymaster.id]: 2000,
107-
[redstoneWithPaymaster.id]: 2000,
108-
[pyropeWithPaymaster.id]: 2000,
106+
// [garnetWithPaymaster.id]: 2000,
107+
// [redstoneWithPaymaster.id]: 2000,
108+
// [pyropeWithPaymaster.id]: 2000,
109109
} as const;
110110

111-
const connectors = [idConnector(), ...getDefaultConnectors(appConfig)];
111+
const connectors = [
112+
// idConnector(),
113+
porto({ mode }),
114+
...getDefaultConnectors(appConfig),
115+
];
112116

113117
export const wagmiConfig = createWagmiConfig({
114118
...appConfig,

‎packages/entrykit/src/ConnectWallet.tsx‎

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,15 @@ import { useModal } from "connectkit";
33
import { AppInfo } from "./AppInfo";
44
import { twMerge } from "tailwind-merge";
55
import { useEffect, useRef } from "react";
6-
import { useConnect, useConnectors } from "wagmi";
7-
import { isIdConnector, type IdConnector } from "@latticexyz/id/internal";
6+
import { Connector, useCapabilities, useConnect, useConnectors } from "wagmi";
7+
import { isIdConnector, PortoConnector, type IdConnector } from "@latticexyz/id/internal";
88

99
export function ConnectWallet() {
1010
const connectors = useConnectors();
11+
const porto = connectors.find((connector): connector is PortoConnector => connector.id === "xyz.ithaca.porto");
12+
const capabilities = useCapabilities();
13+
14+
console.log("capabilities", capabilities.status, capabilities.data, capabilities.error);
1115
const idConnector = connectors.find(isIdConnector);
1216

1317
// TODO: show error states?
@@ -21,7 +25,7 @@ export function ConnectWallet() {
2125
<AppInfo />
2226
</div>
2327
<div className="self-center flex flex-col gap-2 w-60">
24-
{idConnector ? <IdButtons connector={idConnector as never} /> : <WalletButton />}
28+
{porto ? <AccountButtons connector={porto} /> : <WalletButton />}
2529
</div>
2630
</div>
2731
);
@@ -53,38 +57,41 @@ function WalletButton() {
5357
);
5458
}
5559

56-
function IdButtons({ connector }: { connector: IdConnector }) {
60+
function AccountButtons({ connector }: { connector: PortoConnector }) {
5761
const { setOpen } = useModal();
5862
const { connect, isPending } = useConnect();
5963

64+
// TODO: fill in once we can look out accounts/capabilities
65+
const signIn = false;
66+
6067
// TODO: these buttons don't work :(
6168
// > A user activation is required to create a credential in a cross-origin iframe
6269

6370
const buttons = [
6471
<Button
6572
key="create"
66-
variant={connector.hasAccount ? "tertiary" : "secondary"}
73+
variant={signIn ? "tertiary" : "secondary"}
6774
className="self-auto flex justify-center"
6875
pending={isPending}
69-
onClick={() => connector.authCreate()}
70-
autoFocus={!connector.hasAccount}
76+
onClick={() => connect({ connector })}
77+
autoFocus={!signIn}
7178
>
7279
Create account
7380
</Button>,
7481
<Button
7582
key="signin"
76-
variant={connector.hasAccount ? "secondary" : "tertiary"}
83+
variant={signIn ? "secondary" : "tertiary"}
7784
className="self-auto flex justify-center"
7885
pending={isPending}
7986
// TODO: pass in credential ID to use
80-
onClick={() => connector.authSign()}
81-
autoFocus={connector.hasAccount}
87+
onClick={() => connect({ connector })}
88+
autoFocus={signIn}
8289
>
8390
Sign in
8491
</Button>,
8592
];
8693

87-
if (connector.hasAccount) {
94+
if (signIn) {
8895
buttons.reverse();
8996
}
9097

‎packages/id/package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,11 @@
3030
"test:ci": "pnpm run test"
3131
},
3232
"dependencies": {
33+
"@latticexyz/common": "workspace:*",
3334
"arktype": "2.0.0-beta.6",
3435
"debug": "^4.3.4",
3536
"ox": "^0.8.3",
37+
"porto": "^0.0.46",
3638
"viem": "2.30.6",
3739
"wagmi": "2.15.5",
3840
"zustand": "^5.0.6"

‎packages/id/src/exports/internal.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
11
export * from "../client/connector";
22
export * from "../client/connectRp";
33
export * from "../sync/sharedState";
4+
export * from "../porto/porto";
5+
export * from "../porto/mode";

‎packages/id/src/porto/connector.ts‎

Whitespace-only changes.

‎packages/id/src/porto/mode.ts‎

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
import { Mode, Account } from "porto";
2+
import { connectRp } from "../client/connectRp";
3+
import { createTimeout } from "../createTimeout";
4+
import { syncPort } from "../sync/syncPort";
5+
import { sharedState } from "../sync/sharedState";
6+
7+
const rp = connectRp();
8+
rp.port.then((port) => syncPort("rp", port));
9+
10+
async function createAccount() {
11+
const port = await rp.port;
12+
return await new Promise<Account.Account>((resolve, reject) => {
13+
function onPortMessage(event: MessageEvent) {
14+
if (event.data === "createResult") {
15+
console.log("got create result");
16+
resolve({} as never);
17+
}
18+
}
19+
port.addEventListener("message", onPortMessage);
20+
21+
const timeout = createTimeout(60_000);
22+
timeout.promise.finally(() => port.removeEventListener("message", onPortMessage));
23+
timeout.promise.catch(reject);
24+
25+
console.log("asking port to create account");
26+
port.postMessage("create");
27+
});
28+
}
29+
30+
export const mode = Mode.from({
31+
name: "rp",
32+
actions: {
33+
async createAccount() {
34+
console.log("mode.actions.createAccount()");
35+
const account = await createAccount();
36+
return { account };
37+
},
38+
39+
async loadAccounts() {
40+
console.log("mode.actions.loadAccounts()");
41+
42+
const accounts = sharedState.getState().accounts;
43+
44+
if (!accounts.length) {
45+
console.log("create account");
46+
await createAccount();
47+
throw new Error("failed");
48+
} else {
49+
console.log("TODO sign in");
50+
// sign in?
51+
}
52+
53+
return { accounts: [] };
54+
},
55+
56+
addFunds() {
57+
console.log("mode.actions.addFunds()");
58+
throw new Error("Not implemented.");
59+
},
60+
disconnect() {
61+
console.log("mode.actions.disconnect()");
62+
throw new Error("Not implemented.");
63+
},
64+
getAccountVersion() {
65+
console.log("mode.actions.getAccountVersion()");
66+
throw new Error("Not implemented.");
67+
},
68+
getCallsStatus() {
69+
console.log("mode.actions.getCallsStatus()");
70+
throw new Error("Not implemented.");
71+
},
72+
getCapabilities() {
73+
console.log("mode.actions.getCapabilities()");
74+
throw new Error("Not implemented.");
75+
},
76+
getKeys() {
77+
console.log("mode.actions.getKeys()");
78+
throw new Error("Not implemented.");
79+
},
80+
grantAdmin() {
81+
console.log("mode.actions.grantAdmin()");
82+
throw new Error("Not implemented.");
83+
},
84+
grantPermissions() {
85+
console.log("mode.actions.grantPermissions()");
86+
throw new Error("Not implemented.");
87+
},
88+
prepareCalls() {
89+
console.log("mode.actions.prepareCalls()");
90+
throw new Error("Not implemented.");
91+
},
92+
prepareUpgradeAccount() {
93+
console.log("mode.actions.prepareUpgradeAccount()");
94+
throw new Error("Not implemented.");
95+
},
96+
revokeAdmin() {
97+
console.log("mode.actions.revokeAdmin()");
98+
throw new Error("Not implemented.");
99+
},
100+
revokePermissions() {
101+
console.log("mode.actions.revokePermissions()");
102+
throw new Error("Not implemented.");
103+
},
104+
sendCalls() {
105+
console.log("mode.actions.sendCalls()");
106+
throw new Error("Not implemented.");
107+
},
108+
sendPreparedCalls() {
109+
console.log("mode.actions.sendPreparedCalls()");
110+
throw new Error("Not implemented.");
111+
},
112+
signPersonalMessage() {
113+
console.log("mode.actions.signPersonalMessage()");
114+
throw new Error("Not implemented.");
115+
},
116+
signTypedData() {
117+
console.log("mode.actions.signTypedData()");
118+
throw new Error("Not implemented.");
119+
},
120+
updateAccount() {
121+
console.log("mode.actions.updateAccount()");
122+
throw new Error("Not implemented.");
123+
},
124+
upgradeAccount() {
125+
console.log("mode.actions.upgradeAccount()");
126+
throw new Error("Not implemented.");
127+
},
128+
verifyEmail() {
129+
console.log("mode.actions.verifyEmail()");
130+
throw new Error("Not implemented.");
131+
},
132+
},
133+
});

‎packages/id/src/porto/porto.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { Porto } from "porto";
2+
import { porto } from "porto/wagmi";
3+
import { Connector } from "wagmi";
4+
// import { mode } from "./mode";
5+
// import { anvil } from "wagmi/chains";
6+
7+
// TODO: disable announce so we can do it ourselves with our own name/icon: https://github.com/ithacaxyz/porto/blob/fefb71a71b631fbcc4d50581c0708944c3e8e5df/src/core/internal/provider.ts#L1074-L1085
8+
9+
// export const porto = Porto.create({
10+
// mode,
11+
// chains: [anvil],
12+
// });
13+
14+
export { Porto, porto };
15+
16+
export type PortoConnector = Connector<ReturnType<typeof porto>>;

‎packages/id/src/rp/index.ts‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,14 @@ async function connectClient() {
4141

4242
port.addEventListener("message", async (event) => {
4343
if (event.data === "create") {
44-
await create();
45-
port.postMessage("createResult");
44+
try {
45+
await create();
46+
port.postMessage("createResult");
47+
} catch (error) {
48+
console.error("create failed", error);
49+
// TODO: error result
50+
port.postMessage("createResult");
51+
}
4652
}
4753
});
4854

0 commit comments

Comments
 (0)