diff --git a/components/Banner.tsx b/components/Banner.tsx index e0206311..c1761edd 100644 --- a/components/Banner.tsx +++ b/components/Banner.tsx @@ -1,18 +1,17 @@ import { Cross1Icon } from "@radix-ui/react-icons"; -import { useAppDispatch, useAppState } from "../context/state"; +import { useState } from "react"; type props = { children: React.ReactNode; }; const Banner = ({ children }: props) => { - const state = useAppState(); - const dispatch = useAppDispatch(); + const [hasBanner, setHasBanner] = useState(true); - return state.hasBanner ? ( + return hasBanner ? (
{children}
-
diff --git a/components/Layout.tsx b/components/Layout.tsx index 9b42ab3b..c28ae6da 100644 --- a/components/Layout.tsx +++ b/components/Layout.tsx @@ -1,15 +1,13 @@ -import { LocalStorage, NetworkType } from "@airgap/beacon-sdk"; +import { NetworkType } from "@airgap/beacon-sdk"; import { ArrowRightIcon } from "@radix-ui/react-icons"; import { validateAddress, ValidationResult } from "@taquito/utils"; import { AppProps } from "next/app"; import { usePathname } from "next/navigation"; -import router, { useRouter } from "next/router"; +import { useRouter } from "next/router"; import { useEffect, useState } from "react"; -import P2PClient from "../context/P2PClient"; import { PREFERED_NETWORK } from "../context/config"; -import { init, useAppDispatch, useAppState } from "../context/state"; +import { useAppDispatch, useAppState } from "../context/state"; import { useTezosToolkit } from "../context/tezos-toolkit"; -import { useWallet } from "../context/wallet"; import { contractStorage } from "../types/Proposal0_3_1"; import { fetchContract } from "../utils/fetchContract"; import Banner from "./Banner"; @@ -27,7 +25,6 @@ export default function Layout({ const state = useAppState(); const dispatch = useAppDispatch(); const { tezos } = useTezosToolkit(); - const { wallet } = useWallet(); const [data, setData] = useState(); const [hasSidebar, setHasSidebar] = useState(false); @@ -149,28 +146,6 @@ export default function Layout({ tezos, state.contracts, ]); - useEffect(() => { - (async () => { - const p2pClient = new P2PClient({ - name: "TzSafe", - storage: new LocalStorage("P2P"), - }); - - await p2pClient.init(); - await p2pClient.connect(p2pClient.handleMessages); - - // Connect stored peers - Object.entries(state.connectedDapps).forEach(async ([address, dapps]) => { - Object.values(dapps).forEach(data => { - p2pClient - .addPeer(data) - .catch(_ => console.log("Failed to connect to peer", data)); - }); - }); - - dispatch!({ type: "p2pConnect", payload: p2pClient }); - })(); - }, [wallet]); useEffect(() => { setHasSidebar(false); diff --git a/components/LoginModal.tsx b/components/LoginModal.tsx index 84878c04..2988a576 100644 --- a/components/LoginModal.tsx +++ b/components/LoginModal.tsx @@ -1,10 +1,11 @@ import { useEffect, useMemo, useState } from "react"; import { Event } from "../context/P2PClient"; -import { useAppDispatch, useAppState } from "../context/state"; +import { useDapps, useP2PClient } from "../context/dapps"; +import { useAppState } from "../context/state"; import { useWallet } from "../context/wallet"; import { decodeData } from "../pages/[walletAddress]/beacon"; +import { P2pData } from "../types/app"; import { signers } from "../versioned/apis"; -import { p2pData } from "../versioned/interface"; import { hasTzip27Support } from "../versioned/util"; import Select from "./Select"; import Spinner from "./Spinner"; @@ -20,9 +21,10 @@ enum State { const LoginModal = ({ data, onEnd }: { data: string; onEnd: () => void }) => { const state = useAppState(); - const dispatch = useAppDispatch(); + const p2pClient = useP2PClient(); + const { addDapp } = useDapps(); - const [parsedData, setParsedData] = useState(); + const [parsedData, setParsedData] = useState(); const [error, setError] = useState(); const { userAddress, wallet, connectWallet } = useWallet(); @@ -52,14 +54,12 @@ const LoginModal = ({ data, onEnd }: { data: string; onEnd: () => void }) => { const [currentState, setCurrentState] = useState(() => State.LOADING); useEffect(() => { - if (!state.p2pClient) return; - try { const decoded = decodeData(data); setParsedData(decoded); - state.p2pClient!.on(Event.PERMISSION_REQUEST, () => { + p2pClient.on(Event.PERMISSION_REQUEST, () => { if (!userAddress) { setCurrentState(State.LOGIN); } else if ( @@ -73,12 +73,12 @@ const LoginModal = ({ data, onEnd }: { data: string; onEnd: () => void }) => { } }); - state.p2pClient!.addPeer(decoded); + p2pClient.addPeer(decoded); } catch (e) { setError((e as Error).message); setCurrentState(State.ERROR); } - }, [data, state.p2pClient]); + }, [data, p2pClient]); useEffect(() => { if (currentState === State.LOGIN && !!userAddress) { @@ -118,7 +118,7 @@ const LoginModal = ({ data, onEnd }: { data: string; onEnd: () => void }) => {