Merge pull request #1040 from Benjtalkshow/fix-open-wallet

Open wallet at identity choos
lfglabs-dev · Feb 15, 2025 · df2b281 · df2b281
2 parents 9f72c06 + 2b66a79
commit df2b281
Show file tree

Hide file tree

Showing 8 changed files with 331 additions and 2,589 deletions.
diff --git a/components/UI/confirmationTx.tsx b/components/UI/confirmationTx.tsx
@@ -2,7 +2,9 @@ import React, { FunctionComponent } from "react";
 import modalStyles from "../../styles/components/modalMessage.module.css";
 import Button from "./button";
 import verifiedLottie from "../../public/visuals/verifiedLottie.json";
-import Lottie from "lottie-react";
+import dynamic from "next/dynamic";
+const Lottie = dynamic(() => import("lottie-react"), { ssr: false });
+
 
 type ConfirmationTxProps = {
   closeModal: () => void;

diff --git a/components/UI/isSendingTx.tsx b/components/UI/isSendingTx.tsx
@@ -2,9 +2,10 @@
 import React, { FunctionComponent } from "react";
 import modalStyles from "../../styles/components/modalMessage.module.css";
 import sendingLottie from "../../public/visuals/sendingLottie.json";
-import Lottie from "lottie-react";
 import Button from "./button";
+import dynamic from "next/dynamic";
 
+const Lottie = dynamic(() => import("lottie-react"), { ssr: false });
 const IsSendingTx: FunctionComponent = () => {
   return (
     <div className={modalStyles.menu}>

diff --git a/components/UI/modalMessage.tsx b/components/UI/modalMessage.tsx
@@ -2,7 +2,9 @@ import React from "react";
 import styles from "../../styles/components/modalMessage.module.css";
 import { FunctionComponent, ReactNode } from "react";
 import { Modal } from "@mui/material";
-import Lottie from "lottie-react";
+import dynamic from "next/dynamic";
+
+const Lottie = dynamic(() => import("lottie-react"), { ssr: false });
 
 type ModalMessageProps = {
   title: string;

diff --git a/components/UI/registerConfirmationModal.tsx b/components/UI/registerConfirmationModal.tsx
@@ -1,8 +1,10 @@
 import React, { FunctionComponent } from "react";
-import Lottie from "lottie-react";
 import ModalMessage from "../UI/modalMessage";
 import verifiedLottie from "../../public/visuals/verifiedLottie.json";
 import Button from "./button";
+import dynamic from "next/dynamic";
+
+const Lottie = dynamic(() => import("lottie-react"), { ssr: false });
 
 type RegisterConfirmationModalProps = {
   txHash?: string;

diff --git a/components/UI/screens/successScreen.tsx b/components/UI/screens/successScreen.tsx
@@ -1,7 +1,9 @@
 import React, { FunctionComponent } from "react";
 import Button from "../button";
-import Lottie from "lottie-react";
 import verifiedLottie from "../../../public/visuals/verifiedLottie.json";
+import dynamic from "next/dynamic";
+
+const Lottie = dynamic(() => import("lottie-react"), { ssr: false });
 
 type SuccessScreenProps = {
   buttonText: string;

diff --git a/components/UI/txConfirmationModal.tsx b/components/UI/txConfirmationModal.tsx
@@ -1,8 +1,10 @@
 import React, { FunctionComponent } from "react";
-import Lottie from "lottie-react";
 import ModalMessage from "../UI/modalMessage";
 import verifiedLottie from "../../public/visuals/verifiedLottie.json";
 import Button from "./button";
+import dynamic from "next/dynamic";
+
+const Lottie = dynamic(() => import("lottie-react"), { ssr: false });
 
 type TxConfirmationModalProps = {
   txHash?: string;

diff --git a/components/identities/availableIdentities.tsx b/components/identities/availableIdentities.tsx
@@ -148,8 +148,7 @@ const AvailableIdentities = ({ tokenId }: { tokenId: string }) => {
     if (address) {
       // Our Indexer
       fetch(
-        `${
-          process.env.NEXT_PUBLIC_SERVER_LINK
+        `${process.env.NEXT_PUBLIC_SERVER_LINK
         }/addr_to_full_ids?addr=${hexToDecimal(address)}`
       )
         .then((response) => response.json())
@@ -167,6 +166,14 @@ const AvailableIdentities = ({ tokenId }: { tokenId: string }) => {
     localStorage.setItem("SID-lastUsedConnector", connector.id);
   };
 
+  const handleIdentityClick = useCallback((e: React.MouseEvent, domainId: string) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (domainId !== tokenId) {
+      router.push(`/identities/${domainId}`, undefined, { shallow: true });
+    }
+  }, [router, tokenId]);
+
   return (
     <>
       <div className="min-h-[88vh]">
@@ -182,19 +189,17 @@ const AvailableIdentities = ({ tokenId }: { tokenId: string }) => {
               {ownedIdentities.length !== 1 && (
                 <div
                   className={`
-                         ${"border w-[100%] md:w-auto h-[319px] xl:h-auto"} ${
-                    styles.sideNav
-                  } relative flex flex-col items-center justify-between sm:px-[24px]  md:pt-[24px] m-auto shadow-sm rounded-2xl `}
+                         ${"border w-[100%] md:w-auto h-[319px] xl:h-auto"} ${styles.sideNav
+                    } relative flex flex-col items-center justify-between sm:px-[24px]  md:pt-[24px] m-auto shadow-sm rounded-2xl `}
                 >
                   <div className="h-full md:min-h-[80%] w-full overflow-y-auto hide-scrollbar flex flex-col gap-[2px] ">
                     {ownedIdentities.map((domain, index) => (
                       <button
-                        className={`${
-                          domain.id === router.query.tokenId ||
-                          domain.id === tokenId
+                        className={`${domain.id === router.query.tokenId ||
+                            domain.id === tokenId
                             ? "text-[#402D28]"
                             : " text-[#CDCCCC] hover:text-[#402D28]"
-                        } font-medium text-lg sm:text-md lg:text-lg leading-5 cursor-pointer border-[#4545451A] border-b-[1px] md:border-none md:py-0 py-6 md:my-3 block w-full text-center xl:text-left`}
+                          } font-medium text-lg sm:text-md lg:text-lg leading-5 cursor-pointer border-[#4545451A] border-b-[1px] md:border-none md:py-0 py-6 md:my-3 block w-full text-center xl:text-left`}
                         key={index}
                         onClick={() => router.push(`/identities/${domain.id}`)}
                       >
@@ -204,11 +209,11 @@ const AvailableIdentities = ({ tokenId }: { tokenId: string }) => {
                   </div>
                   <button
                     className="w-full justify-center text-center items-center font-quickZap font-normal min-h-[40px] py-5 flex gap-2 bg-white rounded-b-2xl"
-                    onClick={
-                      address
-                        ? () => mint()
-                        : () => setShowWalletConnectModal(true)
-                    }
+                    onClick={(e) => {
+                      e.preventDefault();
+                      e.stopPropagation();
+                      address ? mint() : setShowWalletConnectModal(true);
+                    }}
                   >
                     <FaPlus />
                     ADD IDENTITIES