diff --git a/package-lock.json b/package-lock.json index 2155bb5..6aeb98c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "0.1.0", "dependencies": { "@rainbow-me/rainbowkit": "^0.6.0", - "@relaycc/receiver": "^0.1.61", + "@relaycc/receiver": "^0.1.63", "encoding": "^0.1.13", "ethers": "^5.7.1", "framer-motion": "^7.3.5", @@ -3803,15 +3803,18 @@ "peer": true }, "node_modules/@relaycc/receiver": { - "version": "0.1.61", - "resolved": "https://registry.npmjs.org/@relaycc/receiver/-/receiver-0.1.61.tgz", - "integrity": "sha512-NfsalGxh1FP20uwo8I2dovW3YdOF4PCGkgt8FrGXc6m4jkSnlMkS4mgsWUq5Dt7kGqPAjJ5U/Rwp4j8v8iTPfA==", + "version": "0.1.63", + "resolved": "https://registry.npmjs.org/@relaycc/receiver/-/receiver-0.1.63.tgz", + "integrity": "sha512-oeVxr744Tj856AG0R7GB8dy3uPD2A56PNIc9TDrUBHAOaska/Wje1cOhoDE7yxM380+XxFJt4mhuK735hDbelw==", "dependencies": { "@ethersproject/abstract-signer": "^5.7.0", "@ethersproject/address": "^5.7.0", "@ethersproject/providers": "^5.7.0", "@headlessui/react": "^1.7.3", - "@relaycc/xmtp-js": "0.1.2", + "@motionone/dom": "^10.14.2", + "@relaycc/xmtp-js": "^0.1.3", + "@tanstack/react-query": "^4.10.3", + "encoding": "^0.1.13", "framer-motion": "^4.1.17", "gql": "^1.1.2", "graphql-request": "^5.0.0", @@ -3823,6 +3826,54 @@ "react-dom": "^16 || ^17 || ^18" } }, + "node_modules/@relaycc/receiver/node_modules/@motionone/dom": { + "version": "10.14.2", + "resolved": "https://registry.npmjs.org/@motionone/dom/-/dom-10.14.2.tgz", + "integrity": "sha512-GbGtvTSelXfT4TeQUQ3Y31PllAu0Uvghqr68FSPAJsh1hjbuYPaiPJWpP6+t/t50cHtvUbl4m2SgnGKJ0NCgWA==", + "dependencies": { + "@motionone/animation": "^10.14.0", + "@motionone/generators": "^10.14.0", + "@motionone/types": "^10.14.0", + "@motionone/utils": "^10.14.0", + "hey-listen": "^1.0.8", + "tslib": "^2.3.1" + } + }, + "node_modules/@relaycc/receiver/node_modules/@tanstack/query-core": { + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.12.0.tgz", + "integrity": "sha512-KEiFPNLMFByhNL2s6RBFL6Z5cNdwwQzFpW/II3GY+rEuQ343ZEoVyQ48zlUXXkEkbamQFIFg2onM8Pxf0Yo01A==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + } + }, + "node_modules/@relaycc/receiver/node_modules/@tanstack/react-query": { + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.12.0.tgz", + "integrity": "sha512-prchV1q+CJ0ZVo8Rts2cOF3azDfQizZZySmH6XXsXRcPTbir0sgb9fp0vY/5l5ZkSYjTvWt/OL8WQhAhYMSvrA==", + "dependencies": { + "@tanstack/query-core": "4.12.0", + "use-sync-external-store": "^1.2.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-native": "*" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + }, + "react-native": { + "optional": true + } + } + }, "node_modules/@relaycc/receiver/node_modules/framer-motion": { "version": "4.1.17", "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-4.1.17.tgz", @@ -3871,9 +3922,9 @@ } }, "node_modules/@relaycc/xmtp-js": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/@relaycc/xmtp-js/-/xmtp-js-0.1.2.tgz", - "integrity": "sha512-3vEumfkhJzCLzaKGJHMfEq6rPYgiuec4qdwLRr2SvLY1qtsP941soT3rQkyBpFPmn42ZrFevrff+phhSeRLdYg==", + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/@relaycc/xmtp-js/-/xmtp-js-0.1.3.tgz", + "integrity": "sha512-4NzPqg76CRl1i8vLv861bPmejguM52bvoPkUizQqvMLm/nIj49X6UiZyFEf1kfItIeNQCpJ3UjXrn2Wxh73z2w==", "dependencies": { "@noble/secp256k1": "^1.5.2", "@stardazed/streams-polyfill": "^2.4.0", @@ -5832,6 +5883,17 @@ "node": ">=6.14.2" } }, + "node_modules/busboy": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/busboy/-/busboy-1.6.0.tgz", + "integrity": "sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==", + "dependencies": { + "streamsearch": "^1.1.0" + }, + "engines": { + "node": ">=10.16.0" + } + }, "node_modules/bytes": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", @@ -13547,6 +13609,14 @@ "readable-stream": "^3.5.0" } }, + "node_modules/streamsearch": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz", + "integrity": "sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==", + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/strict-uri-encode": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz", @@ -14088,9 +14158,12 @@ } }, "node_modules/undici": { - "version": "5.10.0", - "resolved": "https://registry.npmjs.org/undici/-/undici-5.10.0.tgz", - "integrity": "sha512-c8HsD3IbwmjjbLvoZuRI26TZic+TSEe8FPMLLOkN1AfYRhdjnKBU6yL+IwcSCbdZiX4e5t0lfMDLDCqj4Sq70g==", + "version": "5.11.0", + "resolved": "https://registry.npmjs.org/undici/-/undici-5.11.0.tgz", + "integrity": "sha512-oWjWJHzFet0Ow4YZBkyiJwiK5vWqEYoH7BINzJAJOLedZ++JpAlCbUktW2GQ2DS2FpKmxD/JMtWUUWl1BtghGw==", + "dependencies": { + "busboy": "^1.6.0" + }, "engines": { "node": ">=12.18" } @@ -17289,15 +17362,18 @@ "peer": true }, "@relaycc/receiver": { - "version": "0.1.61", - "resolved": "https://registry.npmjs.org/@relaycc/receiver/-/receiver-0.1.61.tgz", - "integrity": "sha512-NfsalGxh1FP20uwo8I2dovW3YdOF4PCGkgt8FrGXc6m4jkSnlMkS4mgsWUq5Dt7kGqPAjJ5U/Rwp4j8v8iTPfA==", + "version": "0.1.63", + "resolved": "https://registry.npmjs.org/@relaycc/receiver/-/receiver-0.1.63.tgz", + "integrity": "sha512-oeVxr744Tj856AG0R7GB8dy3uPD2A56PNIc9TDrUBHAOaska/Wje1cOhoDE7yxM380+XxFJt4mhuK735hDbelw==", "requires": { "@ethersproject/abstract-signer": "^5.7.0", "@ethersproject/address": "^5.7.0", "@ethersproject/providers": "^5.7.0", "@headlessui/react": "^1.7.3", - "@relaycc/xmtp-js": "0.1.2", + "@motionone/dom": "^10.14.2", + "@relaycc/xmtp-js": "^0.1.3", + "@tanstack/react-query": "^4.10.3", + "encoding": "^0.1.13", "framer-motion": "^4.1.17", "gql": "^1.1.2", "graphql-request": "^5.0.0", @@ -17305,6 +17381,33 @@ "zustand": "^4.1.1" }, "dependencies": { + "@motionone/dom": { + "version": "10.14.2", + "resolved": "https://registry.npmjs.org/@motionone/dom/-/dom-10.14.2.tgz", + "integrity": "sha512-GbGtvTSelXfT4TeQUQ3Y31PllAu0Uvghqr68FSPAJsh1hjbuYPaiPJWpP6+t/t50cHtvUbl4m2SgnGKJ0NCgWA==", + "requires": { + "@motionone/animation": "^10.14.0", + "@motionone/generators": "^10.14.0", + "@motionone/types": "^10.14.0", + "@motionone/utils": "^10.14.0", + "hey-listen": "^1.0.8", + "tslib": "^2.3.1" + } + }, + "@tanstack/query-core": { + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.12.0.tgz", + "integrity": "sha512-KEiFPNLMFByhNL2s6RBFL6Z5cNdwwQzFpW/II3GY+rEuQ343ZEoVyQ48zlUXXkEkbamQFIFg2onM8Pxf0Yo01A==" + }, + "@tanstack/react-query": { + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.12.0.tgz", + "integrity": "sha512-prchV1q+CJ0ZVo8Rts2cOF3azDfQizZZySmH6XXsXRcPTbir0sgb9fp0vY/5l5ZkSYjTvWt/OL8WQhAhYMSvrA==", + "requires": { + "@tanstack/query-core": "4.12.0", + "use-sync-external-store": "^1.2.0" + } + }, "framer-motion": { "version": "4.1.17", "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-4.1.17.tgz", @@ -17349,9 +17452,9 @@ } }, "@relaycc/xmtp-js": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/@relaycc/xmtp-js/-/xmtp-js-0.1.2.tgz", - "integrity": "sha512-3vEumfkhJzCLzaKGJHMfEq6rPYgiuec4qdwLRr2SvLY1qtsP941soT3rQkyBpFPmn42ZrFevrff+phhSeRLdYg==", + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/@relaycc/xmtp-js/-/xmtp-js-0.1.3.tgz", + "integrity": "sha512-4NzPqg76CRl1i8vLv861bPmejguM52bvoPkUizQqvMLm/nIj49X6UiZyFEf1kfItIeNQCpJ3UjXrn2Wxh73z2w==", "requires": { "@noble/secp256k1": "^1.5.2", "@stardazed/streams-polyfill": "^2.4.0", @@ -18884,6 +18987,14 @@ "node-gyp-build": "^4.3.0" } }, + "busboy": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/busboy/-/busboy-1.6.0.tgz", + "integrity": "sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==", + "requires": { + "streamsearch": "^1.1.0" + } + }, "bytes": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", @@ -24918,6 +25029,11 @@ "readable-stream": "^3.5.0" } }, + "streamsearch": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz", + "integrity": "sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==" + }, "strict-uri-encode": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz", @@ -25346,9 +25462,12 @@ } }, "undici": { - "version": "5.10.0", - "resolved": "https://registry.npmjs.org/undici/-/undici-5.10.0.tgz", - "integrity": "sha512-c8HsD3IbwmjjbLvoZuRI26TZic+TSEe8FPMLLOkN1AfYRhdjnKBU6yL+IwcSCbdZiX4e5t0lfMDLDCqj4Sq70g==" + "version": "5.11.0", + "resolved": "https://registry.npmjs.org/undici/-/undici-5.11.0.tgz", + "integrity": "sha512-oWjWJHzFet0Ow4YZBkyiJwiK5vWqEYoH7BINzJAJOLedZ++JpAlCbUktW2GQ2DS2FpKmxD/JMtWUUWl1BtghGw==", + "requires": { + "busboy": "^1.6.0" + } }, "unicode-canonical-property-names-ecmascript": { "version": "2.0.0", diff --git a/package.json b/package.json index 71c5fda..e2d8539 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ }, "dependencies": { "@rainbow-me/rainbowkit": "^0.6.0", - "@relaycc/receiver": "^0.1.61", + "@relaycc/receiver": "^0.1.63", "encoding": "^0.1.13", "ethers": "^5.7.1", "framer-motion": "^7.3.5", diff --git a/src/components/cards/ContactCard.tsx b/src/components/cards/ContactCard.tsx index 35afd16..35edd89 100644 --- a/src/components/cards/ContactCard.tsx +++ b/src/components/cards/ContactCard.tsx @@ -25,10 +25,10 @@ export const ContactCard: FunctionComponent<{ }); const pfp = (() => { - if (ensAvatar.avatar === undefined) { + if (ensAvatar.data === null || ensAvatar.data === undefined) { return ( + PFP ); } })(); @@ -59,8 +63,8 @@ export const ContactCard: FunctionComponent<{ > {typeof display === "string" ? display - : isEnsName(ensName.name) - ? ensName.name + : isEnsName(ensName.data) + ? ensName.data : address.slice(0, 6) + "..." + address.slice(-4)} diff --git a/src/components/pages/Conversations.tsx b/src/components/pages/Conversations.tsx index a2bb371..5f21caf 100644 --- a/src/components/pages/Conversations.tsx +++ b/src/components/pages/Conversations.tsx @@ -1,34 +1,81 @@ -import { FunctionComponent, useEffect } from "react"; +import { FunctionComponent, useEffect, useMemo } from "react"; import { ContactCard, Page, LoadingCard, ConnectCard } from "components"; import { Intercom, Window, useLaunch } from "@relaycc/receiver"; import { motion } from "framer-motion"; import { - useRelay, - useSetWallet, - byMostRecentMessage, - pickPeerAddress, + useWallet, + useConversations, + usePinnedAddresses, + useConversationsPreviews, + useClient, } from "@relaycc/receiver"; +import { Message } from "@relaycc/xmtp-js"; import { useSigner } from "wagmi"; import { NavBarConversations } from "../NavBarConversations"; +import { useDevShortcut } from "hooks/useDevShortcut"; -export const Conversations: FunctionComponent = () => { - const { data: signer } = useSigner(); - const dispatch = useRelay((state) => state.dispatch); - const conversations = useRelay((state) => state.channels.conversationList); - const client = useRelay((state) => state.client); - const setWallet = useSetWallet(); +export interface Conversation { + peerAddress: string; + messages: Message[]; +} + +export const Conversations = () => { + const pinnedAddresses = usePinnedAddresses(); + const conversations = useConversations(); + const pinnedPreviews = useConversationsPreviews(pinnedAddresses.data || []); + const listedPreviews = useConversationsPreviews( + conversations.data ? conversations.data.map((c) => c.peerAddress) : [] + ); + const pinnedIsLoading = + pinnedAddresses.isLoading || + Boolean(pinnedPreviews.find((pq) => pq.isLoading)); + const isLoading = + conversations.isLoading || + Boolean(listedPreviews.find((lq) => lq.isLoading)); + + const conversationsProps: Conversation[] = useMemo(() => { + const dataToProcess = (() => { + if (isLoading === false) { + return listedPreviews; + } else if (pinnedIsLoading === false) { + return pinnedPreviews; + } else { + return []; + } + })(); - useEffect(() => { - if (signer) { - setWallet(signer); - } - }, [signer, setWallet]); + return dataToProcess + .filter((cp) => cp.data && cp.data.messages.length > 0) + .map((cp) => cp.data) + .sort((a, b) => { + if (a === undefined) return 1; + if (b === undefined) return -1; + if (a.messages[0] === undefined) return 1; + if (b.messages[0] === undefined) return -1; + if (a.messages[0].sent === undefined) return 1; + if (b.messages[0].sent === undefined) return 1; + return a.messages[0].sent.getTime() < b.messages[0].sent.getTime() + ? 1 + : -1; + }) as Conversation[]; + }, [isLoading, pinnedIsLoading, pinnedPreviews, listedPreviews]); + + return ( + + ); +}; - useEffect(() => { - if (client !== null) { - dispatch({ id: "load conversation list" }); - } - }, [dispatch, client]); +export const ConversationsView: FunctionComponent<{ + isLoading: boolean; + isLoadingMore: boolean; + conversations: Conversation[]; +}> = ({ isLoading, isLoadingMore, conversations }) => { + const { data: signer } = useSigner(); + const [, { data: client }] = useClient(); return ( }> @@ -47,7 +94,7 @@ export const Conversations: FunctionComponent = () => { ); } else { - if (client === null) { + if (client === null || client === undefined) { return ( <> @@ -61,7 +108,7 @@ export const Conversations: FunctionComponent = () => { ); } else { - if (conversations === undefined) { + if (isLoading) { return seeds.map((seed) => { return ( { ); }); } else { - return byMostRecentMessage(conversations) - .map((m) => m) - .reverse() - .map((m, i) => { - return ( - - - - ); - }); + return conversations.map((m, i) => { + return ( + + + + ); + }); } } } diff --git a/src/components/pages/Page.tsx b/src/components/pages/Page.tsx index 8fdd216..70abb68 100644 --- a/src/components/pages/Page.tsx +++ b/src/components/pages/Page.tsx @@ -1,4 +1,4 @@ -import { Intercom, useSetWallet, Window } from "@relaycc/receiver"; +import { Intercom, useWallet, Window } from "@relaycc/receiver"; import React, { FunctionComponent, ReactNode, useEffect } from "react"; import { NavBar } from "../NavBar"; import { useSigner } from "wagmi"; @@ -8,7 +8,7 @@ export const Page: FunctionComponent<{ navBar?: ReactNode; }> = ({ children, navBar }) => { const { data: signer } = useSigner(); - const setWallet = useSetWallet(); + const [, setWallet] = useWallet(); useEffect(() => { setWallet(signer || null); diff --git a/src/components/pages/Profile.tsx b/src/components/pages/Profile.tsx index 1b5e44a..d4c2750 100644 --- a/src/components/pages/Profile.tsx +++ b/src/components/pages/Profile.tsx @@ -9,39 +9,39 @@ import { getMostFollowedProfile, getFirstProfile, isLensName, + useLensProfile, useLaunch, getLensterUrl, useEnsAddress, - useLensAddress, } from "@relaycc/receiver"; export const Profile = ({ handle }: { handle?: string | null }) => { const launch = useLaunch(); const ensAddress = useEnsAddress({ - handle: isEnsName(handle) ? handle : null, + handle, }); - const lensAddress = useLensAddress({ - handle: isLensName(handle) ? handle : null, + const lensProfile = useLensProfile({ + handle, }); const address = isEthAddress(handle) ? handle - : isEthAddress(ensAddress.address) - ? ensAddress.address - : isEthAddress(lensAddress.address) - ? lensAddress.address + : isEthAddress(ensAddress.data) + ? ensAddress.data + : isEthAddress(lensProfile.data?.ownedBy) + ? lensProfile.data?.ownedBy : undefined; const lensProfiles = useLensProfiles({ - address: isEthAddress(address) ? address : null, + handle, }); const ensName = useEnsName({ handle: isEthAddress(address) ? address : null, }); - const lensProfile = - lensProfiles.profiles === undefined + const preferredLensProfile = + lensProfiles.data?.profiles === undefined ? undefined - : getDefaultProfile(lensProfiles.profiles) || - getMostFollowedProfile(lensProfiles.profiles) || - getFirstProfile(lensProfiles.profiles); + : getDefaultProfile(lensProfiles.data) || + getMostFollowedProfile(lensProfiles.data) || + getFirstProfile(lensProfiles.data); const openInNewTab = (url: string) => { return () => { @@ -93,7 +93,7 @@ export const Profile = ({ handle }: { handle?: string | null }) => { @@ -104,8 +104,8 @@ export const Profile = ({ handle }: { handle?: string | null }) => { logo="/ENS.svg" logoAlt="ENS Logo" onClickLinkOut={ - isEnsName(ensName.name) - ? openInNewTab("https://app.ens.domains/name/" + ensName.name) + isEnsName(ensName.data) + ? openInNewTab("https://app.ens.domains/name/" + ensName.data) : undefined } onClickLogo={openInNewTab("https://ens.domains")} @@ -118,7 +118,11 @@ export const Profile = ({ handle }: { handle?: string | null }) => { } @@ -128,9 +132,9 @@ export const Profile = ({ handle }: { handle?: string | null }) => { logo="/lens.svg" logoAlt="Lens Logo" onClickLinkOut={ - lensProfile === undefined + preferredLensProfile === undefined ? undefined - : openInNewTab(getLensterUrl(lensProfile)) + : openInNewTab(getLensterUrl(preferredLensProfile)) } onClickSendMessage={onClickSendMessage()} onClickLogo={openInNewTab("https://lens.xyz")} @@ -204,7 +208,7 @@ export const Profile = ({ handle }: { handle?: string | null }) => { logo="/lenster.svg" logoAlt="Lenster Logo" onClickLinkOut={ - isEthAddress(lensAddress.address) + isEthAddress(lensProfile.data?.ownedBy) ? openInNewTab("https://lenster.xyz/u/" + handle) : undefined } @@ -222,7 +226,7 @@ export const Profile = ({ handle }: { handle?: string | null }) => { logo="/lenstube.svg" logoAlt="Lenstube Logo" onClickLinkOut={ - isEthAddress(lensAddress.address) + isEthAddress(lensProfile.data?.ownedBy) ? openInNewTab("https://lenstube.xyz/" + handle) : undefined } @@ -358,8 +362,8 @@ export const Profile = ({ handle }: { handle?: string | null }) => { logo="/101.svg" logoAlt="101 Logo" onClickLinkOut={ - isEnsName(ensName.name) - ? openInNewTab("https://101.xyz/u/" + ensName.name) + isEnsName(ensName.data) + ? openInNewTab("https://101.xyz/u/" + ensName.data) : undefined } onClickSendMessage={onClickSendMessage()} @@ -508,8 +512,8 @@ export const Profile = ({ handle }: { handle?: string | null }) => { logo="/nimi.png" logoAlt="Nimi Logo" onClickLinkOut={ - isEnsName(ensName.name) - ? openInNewTab(`https://${ensName.name}.limo`) + isEnsName(ensName.data) + ? openInNewTab(`https://${ensName.data}.limo`) : undefined } onClickSendMessage={onClickSendMessage()} diff --git a/src/hooks/useDevShortcut.ts b/src/hooks/useDevShortcut.ts new file mode 100644 index 0000000..b137f21 --- /dev/null +++ b/src/hooks/useDevShortcut.ts @@ -0,0 +1,45 @@ +import { Wallet } from "ethers"; +import { useLaunch, useClient, useWallet } from "@relaycc/receiver"; +import { useEffect } from "react"; + +const wallet = + process.env.NODE_ENV === "development" && + typeof process.env.NEXT_PUBLIC_TEST_PK === "string" + ? new Wallet(process.env.NEXT_PUBLIC_TEST_PK) + : undefined; + +const launchTarget = process.env.NEXT_PUBLIC_LAUNCH_TARGET || undefined; + +let launchedOnce = false; + +export const useDevShortcut = () => { + const [recWallet, setWallet] = useWallet(); + const [signIn, client] = useClient(); + const launch = useLaunch(); + + useEffect(() => { + if (wallet !== undefined && wallet !== null) { + console.log("Setting wallet in dev shortcut"); + setWallet(wallet); + } + }, [setWallet]); + + useEffect(() => { + if ( + launchedOnce === false && + client.data !== null && + client.data !== undefined + ) { + console.log("Launching in dev shortcut"); + launchedOnce = true; + launch(); + } + }, [client, launch]); + + useEffect(() => { + if (recWallet !== undefined && recWallet !== null) { + console.log("Signing in in dev shortcut"); + signIn(); + } + }, [recWallet, signIn]); +}; diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 505654a..d6c8fff 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -2,12 +2,12 @@ import "styles/globals.css"; import type { AppProps } from "next/app"; import { alchemyProvider } from "wagmi/providers/alchemy"; import { publicProvider } from "wagmi/providers/public"; -import { useSetWallet } from "@relaycc/receiver"; import { WagmiConfig, configureChains, createClient, chain } from "wagmi"; import { RainbowKitProvider, getDefaultWallets } from "@rainbow-me/rainbowkit"; // TODO(achilles@relay.cc) For some reason rainbowkit css import wasn't working, // remove this hack soon. import "../styles/rainbowkit.css"; +import { Receiver } from "@relaycc/receiver"; const alchemyKey = "kmMb00nhQ0SWModX6lJLjXy_pVtiQnjx"; @@ -45,7 +45,9 @@ function MyApp({ Component, pageProps }: AppProps) { return ( - + + + );