fix: disable credential creation button temporarily

WebOfTrust · Jan 10, 2024 · 83e0e3c · 83e0e3c
1 parent 3601816
commit 83e0e3c
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 21 deletions.
diff --git a/example-web/my-app/src/App.js b/example-web/my-app/src/App.js
@@ -41,9 +41,9 @@ function App() {
           <Button variant="contained" onClick={handleRequestIdentifier}>
             Authenticate with AID
           </Button>
-          <Button variant="contained" onClick={handleRequestCredential}>
+          {/* <Button variant="contained" onClick={handleRequestCredential}>
             Authenticate with Credential
-          </Button>
+          </Button> */}
         </div>
         {storageToken ? null : (
           <Button

diff --git a/src/pages/dialog/Dialog.tsx b/src/pages/dialog/Dialog.tsx
@@ -27,10 +27,6 @@ export default function Dialog({
     });
   };
 
-  const handleClick = () => {
-    setAppState();
-    setShowPopupPrompt(true);
-  };
   useEffect(() => {
     if (!signins?.length) {
       setAppState();
@@ -39,19 +35,30 @@ export default function Dialog({
   }, []);
 
   return (
-    <div className="absolute top-10 right-10 min-w-[300px] max-h-[540px] overflow-auto rounded text-center p-3 bg-white">
+    <div className="absolute top-10 right-10 w-[320px] max-h-[540px] overflow-auto rounded text-center p-3 bg-white">
       <header className="items-center justify-center">
         <div className="flex flex-row gap-x-2 mb-2">
           <img src={logo} className="h-8" alt="logo" />
           <p className="text-2xl font-bold text-green">Sign in with KERI</p>
         </div>
 
         {showPopupPrompt ? (
-          <PopupPrompt message="Select the KERI icon in your browser to proceed" />
+          <PopupPrompt
+            message={
+              <p className="text-sm text-white">
+                Open{" "}
+                <span className="inline-block">
+                  <img src={logo} className="h-4" alt="logo" />
+                </span>{" "}
+                to proceed
+              </p>
+            }
+          />
         ) : null}
         {!signins?.length && isConnected ? (
-          <p className=" text-sm text-green font-bold">
-            {tab?.url} is requesting an ID
+          <p className="mt-2 text-sm text-green max-w-[280px] font-bold">
+            <span className="">{tab?.url}</span> is requesting an{" "}
+            {eventType === "init-req-identifier" ? "ID" : "credential"}
           </p>
         ) : null}
 
@@ -60,15 +67,16 @@ export default function Dialog({
             {signins?.map((signin) => (
               <SigninItem signin={signin} />
             ))}
-            <button
-              onClick={handleClick}
-              className="text-green font-bold text-sm cursor-pointer"
-            >
-              Select another{" "}
+            <div className="text-green font-bold text-sm cursor-pointer">
+              Open{" "}
+              <span className="inline-block">
+                <img src={logo} className="h-4" alt="logo" />
+              </span>{" "}
+              to select other{" "}
               {eventType === "init-req-identifier"
                 ? "identifier"
-                : "credential"}
-            </button>
+                : "credential"}{" "}
+            </div>
           </>
         ) : null}
       </header>

diff --git a/src/pages/dialog/popupPrompt.tsx b/src/pages/dialog/popupPrompt.tsx
@@ -1,13 +1,13 @@
 interface IPopupPrompt {
-  message: string;
+  message: JSX.Element;
 }
 
 export const PopupPrompt = ({ message }: IPopupPrompt): JSX.Element => {
   return (
-    <div className="flex max-w-[280px] flex-row border  p-2 bg-gray-dark rounded">
-      <p className="text-sm text-white">{message}</p>
+    <div className="flex justify-center max-w-[280px] flex-row border  p-2 bg-gray-dark rounded">
+      {message}
       <svg
-        className="ml-2 h-6 w-6 rounded border-green animate-bounce"
+        className="ml-2 h-4 w-4 rounded border-green animate-bounce"
         xmlns="http://www.w3.org/2000/svg"
         viewBox="0 0 197.091 197.091"
       >