Merge pull request #148 from NetSepio/solana-login

fix :Switch Network modal

components/AppContext.tsx

@@ -39,18 +39,18 @@ const WalletContextProvider: FC<{ children: ReactNode }> = ({ children }) => {
 
 
   const wallets = [
-    // TODO IdentityConnectWallet and BloctoWallet to use Network enum from @aptos-labs/ts-sdk
-    // new IdentityConnectWallet("57fa42a9-29c6-4f1e-939c-4eefa36d9ff5", {
-    //   networkName: NetworkName.Testnet,
-    // }),
-    // Blocto supports Testnet/Mainnet for now.
-    // new BloctoWallet({
-    //   network: NetworkName.Testnet,
-    //   bloctoAppId: "6d85f56e-5f2e-46cd-b5f2-5cf9695b4d46",
-    // }),
-    // new FaceWallet(face!),
-    // new FewchaWallet(),
-    // new FlipperWallet(),
+      // TODO IdentityConnectWallet and BloctoWallet to use Network enum from @aptos-labs/ts-sdk
+      // new IdentityConnectWallet("57fa42a9-29c6-4f1e-939c-4eefa36d9ff5", {
+      //   networkName: NetworkName.Testnet,
+      // }),
+      // Blocto supports Testnet/Mainnet for now.
+      // new BloctoWallet({
+      //   network: NetworkName.Testnet,
+      //   bloctoAppId: "6d85f56e-5f2e-46cd-b5f2-5cf9695b4d46",
+      // }),
+      // new FaceWallet(face!),
+      // new FewchaWallet(),
+      // new FlipperWallet(),
     new MartianWallet(),
     // new MSafeWalletAdapter(),
     // new NightlyWallet(),
@@ -82,7 +82,9 @@ const WalletContextProvider: FC<{ children: ReactNode }> = ({ children }) => {
 export const AppContext: FC<{ children: ReactNode }> = ({ children }) => {
   const network = WalletAdapterNetwork.Devnet;
   const endpoint = useMemo(() => clusterApiUrl(network), [network]);
-  const wallets = useMemo(() => [new PhantomWalletAdapter()], [network]);
+  const wallets = useMemo(() => [
+    new PhantomWalletAdapter({ appIdentity: { name: "Erebrus" }, chains: ["solana"] })
+  ], []);
   return (
     <AutoConnectProvider>
       <AlertProvider>

components/Login/ChainSelector.tsx

@@ -10,10 +10,11 @@ interface ChainOption {
 }
 
 const chainOptions: ChainOption[] = [
+  { name: "Solana", symbol: "sol", icon: "solanaicon" },
   { name: "Aptos", symbol: "apt", icon: "aptosicon" },
   { name: "Manta", symbol: "evm", icon: "mantaicon" },
   { name: "Peaq", symbol: "peaq", icon: "peaqicon" },
-  { name: "Solana", symbol: "sol", icon: "solanaicon" },
+
   { name: "Sui", symbol: "sui", icon: "suiicon" },
   { name: "Google", symbol: "google", icon: "googleicon" },
 ];

components/Navbar.js

@@ -45,7 +45,7 @@ const Navbar = ({ isHome }) => {
   const [link, setlink] = useState("");
   const { isSignedIn, setIsSignedIn } = useContext(AuthContext);
   const [avatarUrl, setAvatarUrl] = useState("");
-  const [chainsym, setchainsym] = useState("apt");
+  const [chainsym, setchainsym] = useState("sol");
   const [hidefilter, setHideFilter] = useState(false);
   const [showExplorerDropdown, setShowExplorerDropdown] = useState(false);
 
@@ -120,10 +120,10 @@ const Navbar = ({ isHome }) => {
 
   const handleChainChange = (newChainSym) => {
     setchainsym(newChainSym);
+    Cookies.set("Chain_symbol", newChainSym);
     // Add any other logic you need when the chain changes
   };
 
-
 
   const handleClick = () => {
     setHideFilter(!hidefilter);
@@ -138,13 +138,11 @@ const Navbar = ({ isHome }) => {
   const token = Cookies.get("erebrus_token");
 
   useEffect(() => {
-    if (solAccount) {
-      // Update the cookie with the new address
+    if (chainsym === "sol" && solAccount) {
       Cookies.set("erebrus_wallet", solAccount);
-
       OnSignMessageSol();
     }
-  }, [solAccount]);
+  }, [solAccount, chainsym]);
 
   useEffect(() => {
     const erebrus_wallet = Cookies.get("erebrus_wallet");
@@ -177,7 +175,7 @@ const Navbar = ({ isHome }) => {
 
     // Update the cookie with the new symbol
     if (getchainsym == null) {
-      Cookies.set("Chain_symbol", "apt");
+      Cookies.set("Chain_symbol", "sol");
     }
   }, []);
 
@@ -289,7 +287,6 @@ const Navbar = ({ isHome }) => {
 
   const [selectedOption, setSelectedOption] = useState("Aptos"); // Set default to 'Chain 1'
   const [selectedLogo, setSelectedLogo] = useState("aptosicon");
-
 
 
   const handleProfileClick = () => {
@@ -610,7 +607,14 @@ const Navbar = ({ isHome }) => {
                   </button>
                 )}
                 {chainsym === "evm" && (
-                  <button>
+                  <button onClick={() => {
+                    // Logic to connect to MetaMask
+                    if (window.ethereum) {
+                      window.ethereum.request({ method: 'eth_requestAccounts' });
+                    } else {
+                      alert('MetaMask is not installed!');
+                    }
+                  }}>
                     <w3m-button />
                   </button>
                 )}

package.json

@@ -47,7 +47,7 @@
     "@thirdweb-dev/sdk": "^3.6.9",
     "@tp-lab/aptos-wallet-adapter": "^1.0.1",
     "@trustwallet/aptos-wallet-adapter": "^0.1.6",
-    "@wagmi/core": "^2.10.5",
+    "@wagmi/core": "^2.13.8",
     "@web3-react/core": "^8.2.3",
     "@web3-react/injected-connector": "^6.0.7",
     "@web3modal/wagmi": "^4.1.11",

pages/_app.js

@@ -19,10 +19,11 @@ import {Peaq} from "../components/peaq.ts"
 import '../styles/globals.css';
 import Banner from "../components/Banner.tsx" 
 import Link from 'next/link';
+import { metaMask } from "wagmi/connectors";
+
 
 
 
-const activeChainId = ChainId.Mumbai;
 const erebrus_wallet = Cookies.get("erebrus_wallet");
 const queryClient = new QueryClient();
 const projectId = process.env.NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID;
@@ -68,13 +69,18 @@ const config = defaultWagmiConfig({
   chains,
   projectId,
   metadata,
+  connectors: [
+    metaMask({ chains })
+  ],
 });
 
 createWeb3Modal({
   wagmiConfig: config,
   projectId,
   enableAnalytics: true,
   enableOnramp: true,
+  defaultChain: chains[0],
+  allowUnsupportedChain: true
 });
 
 export default function App({ Component, pageProps }) {
@@ -84,7 +90,7 @@ export default function App({ Component, pageProps }) {
   return (
 
     <AppContext>
-      <ThirdwebProvider desiredChainId={chains}>
+      <ThirdwebProvider >
         <AuthProvider>
           <WagmiProvider config={config}>
             <QueryClientProvider client={queryClient}>