diff --git a/src/components/CustomAvatar.tsx b/src/components/CustomAvatar.tsx index 63bc8d3..d3ccf4c 100644 --- a/src/components/CustomAvatar.tsx +++ b/src/components/CustomAvatar.tsx @@ -1,23 +1,23 @@ -'use client'; +"use client"; -import BoringAvatar from 'boring-avatars'; -import type { AvatarComponent } from '@rainbow-me/rainbowkit'; +import BoringAvatar from "boring-avatars"; +import type { AvatarComponent } from "@rainbow-me/rainbowkit"; export const CustomAvatar: AvatarComponent = ({ address, ensImage, size }) => { - return ensImage ? ( - user - ) : ( - - ); + return ensImage ? ( + user + ) : ( + + ); }; diff --git a/src/components/IqLoginProvider.tsx b/src/components/IqLoginProvider.tsx index 26ca5f7..a4e2ea3 100644 --- a/src/components/IqLoginProvider.tsx +++ b/src/components/IqLoginProvider.tsx @@ -1,96 +1,96 @@ -'use client'; +"use client"; import { - getDefaultConfig, - getDefaultWallets, - RainbowKitProvider -} from '@rainbow-me/rainbowkit'; -import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; -import type React from 'react'; -import { cookieToInitialState, WagmiProvider } from 'wagmi'; -import { polygon } from 'wagmi/chains'; -import { iqTestnet } from '../lib/data/iqTestnet'; -import { iqWikiTheme } from '../lib/data/rainbowKitTheme'; + getDefaultConfig, + getDefaultWallets, + RainbowKitProvider, +} from "@rainbow-me/rainbowkit"; +import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; +import type React from "react"; +import { cookieToInitialState, WagmiProvider } from "wagmi"; +import { polygon } from "wagmi/chains"; +import { iqTestnet } from "../lib/data/iqTestnet"; +import { iqWikiTheme } from "../lib/data/rainbowKitTheme"; import { - rainbowWeb3AuthConnector, - createWeb3AuthInstance -} from '../lib/integrations/web3-auth-connector'; -import { structuralSharing } from '@wagmi/core/query'; -import { Web3AuthProvider } from './Web3AuthProvider'; + rainbowWeb3AuthConnector, + createWeb3AuthInstance, +} from "../lib/integrations/web3-auth-connector"; +import { structuralSharing } from "@wagmi/core/query"; +import { Web3AuthProvider } from "./Web3AuthProvider"; if (!process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID) { - throw new Error('NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID is not set'); + throw new Error("NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID is not set"); } if (!process.env.NEXT_PUBLIC_IS_PRODUCTION) { - console.log('NEXT_PUBLIC_IS_PRODUCTION is not set'); + console.log("NEXT_PUBLIC_IS_PRODUCTION is not set"); } const chain = - process.env.NEXT_PUBLIC_IS_PRODUCTION === 'true' ? polygon : iqTestnet; + process.env.NEXT_PUBLIC_IS_PRODUCTION === "true" ? polygon : iqTestnet; const web3AuthInstance = createWeb3AuthInstance(chain); export const defaultConfig = getDefaultConfig({ - appName: 'IQ.Wiki AI Editor', - projectId: process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID, - chains: [chain], - wallets: [ - ...getDefaultWallets({ - appName: 'IQ.Wiki AI Editor', - projectId: process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID - }).wallets, - { - groupName: 'More', - wallets: [() => rainbowWeb3AuthConnector({ web3AuthInstance })] - } - ], - multiInjectedProviderDiscovery: false, - ssr: true + appName: "IQ.Wiki AI Editor", + projectId: process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID, + chains: [chain], + wallets: [ + ...getDefaultWallets({ + appName: "IQ.Wiki AI Editor", + projectId: process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID, + }).wallets, + { + groupName: "More", + wallets: [() => rainbowWeb3AuthConnector({ web3AuthInstance })], + }, + ], + multiInjectedProviderDiscovery: false, + ssr: true, }); function makeQueryClient() { - return new QueryClient({ - defaultOptions: { - queries: { - // With SSR, we usually want to set some default staleTime - // above 0 to avoid refetching immediately on the client - staleTime: 60 * 1000, - structuralSharing - } - } - }); + return new QueryClient({ + defaultOptions: { + queries: { + // With SSR, we usually want to set some default staleTime + // above 0 to avoid refetching immediately on the client + staleTime: 60 * 1000, + structuralSharing, + }, + }, + }); } let browserQueryClient: QueryClient | undefined = undefined; function getQueryClient() { - if (typeof window === 'undefined') { - // Server: always make a new query client - return makeQueryClient(); - } - // Browser: make a new query client if we don't already have one - // This is very important so we don't re-make a new client if React - // suspends during the initial render. This may not be needed if we - // have a suspense boundary BELOW the creation of the query client - if (!browserQueryClient) browserQueryClient = makeQueryClient(); - return browserQueryClient; + if (typeof window === "undefined") { + // Server: always make a new query client + return makeQueryClient(); + } + // Browser: make a new query client if we don't already have one + // This is very important so we don't re-make a new client if React + // suspends during the initial render. This may not be needed if we + // have a suspense boundary BELOW the creation of the query client + if (!browserQueryClient) browserQueryClient = makeQueryClient(); + return browserQueryClient; } export function IqLoginProvider({ - children, - cookie + children, + cookie, }: Readonly & { cookie?: string }) { - const queryClient = getQueryClient(); - const initialStates = cookieToInitialState(defaultConfig, cookie); + const queryClient = getQueryClient(); + const initialStates = cookieToInitialState(defaultConfig, cookie); - return ( - - - - - {children} - - - - - ); + return ( + + + + + {children} + + + + + ); } diff --git a/src/components/Login.tsx b/src/components/Login.tsx index 5454875..180ded8 100644 --- a/src/components/Login.tsx +++ b/src/components/Login.tsx @@ -1,33 +1,33 @@ -'use client'; +"use client"; -import { ConnectButton } from '@rainbow-me/rainbowkit'; -import { SignTokenButton } from './SignTokenButton'; +import { ConnectButton } from "@rainbow-me/rainbowkit"; +import { SignTokenButton } from "./SignTokenButton"; interface LoginProps { - title: string; - description: string; - handleRedirect?: () => void; + title: string; + description: string; + handleRedirect?: () => void; } export const Login = ({ title, description, handleRedirect }: LoginProps) => { - return ( -
-
-

{title}

-

- {description} -

-
-
-

Step 1: Connect your wallet

- -
-
-

Step 2: Authenticate your wallet

- handleRedirect?.()} /> -
-
-
-
- ); + return ( +
+
+

{title}

+

+ {description} +

+
+
+

Step 1: Connect your wallet

+ +
+
+

Step 2: Authenticate your wallet

+ handleRedirect?.()} /> +
+
+
+
+ ); }; diff --git a/src/components/SignTokenButton.tsx b/src/components/SignTokenButton.tsx index 45b6d4a..17068bf 100644 --- a/src/components/SignTokenButton.tsx +++ b/src/components/SignTokenButton.tsx @@ -1,48 +1,48 @@ -'use client'; +"use client"; -import { useAccount, useDisconnect } from 'wagmi'; -import { useEffect } from 'react'; -import { useAuth } from '../lib/hooks/useAuth'; +import { useAccount, useDisconnect } from "wagmi"; +import { useEffect } from "react"; +import { useAuth } from "../lib/hooks/useAuth"; interface SignTokenButtonProps { - handleRedirect: () => void; - handleTokenPass?: (token: string) => Promise; + handleRedirect: () => void; + handleTokenPass?: (token: string) => Promise; } export const SignTokenButton = ({ - handleRedirect, - handleTokenPass + handleRedirect, + handleTokenPass, }: SignTokenButtonProps) => { - const { isConnected } = useAccount(); - const { token, signToken, loading, error } = useAuth(); + const { isConnected } = useAccount(); + const { token, signToken, loading, error } = useAuth(); - useEffect(() => { - const handleEffect = async () => { - if (token && isConnected) { - await handleTokenPass?.(token); - handleRedirect(); - } - }; - handleEffect(); - }, [handleRedirect, handleTokenPass, isConnected, token]); + useEffect(() => { + const handleEffect = async () => { + if (token && isConnected) { + await handleTokenPass?.(token); + handleRedirect(); + } + }; + handleEffect(); + }, [handleRedirect, handleTokenPass, isConnected, token]); - return token && isConnected ? ( -

- {error - ? 'Something went wrong. Please try again.' - : loading - ? 'You should get a signature request from your wallet, Approve it to continue.' - : 'You are logged in 🚀'} -

- ) : ( - - ); + return token && isConnected ? ( +

+ {error + ? "Something went wrong. Please try again." + : loading + ? "You should get a signature request from your wallet, Approve it to continue." + : "You are logged in 🚀"} +

+ ) : ( + + ); }; diff --git a/src/components/Web3AuthProvider.tsx b/src/components/Web3AuthProvider.tsx index 750be61..9834c12 100644 --- a/src/components/Web3AuthProvider.tsx +++ b/src/components/Web3AuthProvider.tsx @@ -1,40 +1,40 @@ -'use client'; +"use client"; -import type { UserInfo } from '@web3auth/base'; -import type { Web3Auth } from '@web3auth/modal'; -import { createContext, useContext, useEffect, useState } from 'react'; +import type { UserInfo } from "@web3auth/base"; +import type { Web3Auth } from "@web3auth/modal"; +import { createContext, useContext, useEffect, useState } from "react"; const Web3AuthContext = createContext<{ - web3Auth: Web3Auth | null; - user: Partial | null; + web3Auth: Web3Auth | null; + user: Partial | null; }>({ web3Auth: null, user: null }); export function Web3AuthProvider({ - children, - web3AuthInstance + children, + web3AuthInstance, }: { - children: React.ReactNode; - web3AuthInstance: Web3Auth; + children: React.ReactNode; + web3AuthInstance: Web3Auth; }) { - const [user, setUser] = useState | null>(null); + const [user, setUser] = useState | null>(null); - useEffect(() => { - web3AuthInstance.on('connected', async () => { - setUser(await web3AuthInstance.getUserInfo()); - }); + useEffect(() => { + web3AuthInstance.on("connected", async () => { + setUser(await web3AuthInstance.getUserInfo()); + }); - web3AuthInstance.on('disconnected', () => { - setUser(null); - }); - }, [web3AuthInstance]); + web3AuthInstance.on("disconnected", () => { + setUser(null); + }); + }, [web3AuthInstance]); - return ( - - {children} - - ); + return ( + + {children} + + ); } export function useWeb3Auth() { - return useContext(Web3AuthContext); + return useContext(Web3AuthContext); }