taler-typescript-core

commit ca9b999eb421c84ab1d067519186cacf7804cfa0
parent e612b2cc2fb469d3b19d842fb62ac7fc58ea8784
Author: Martin Schanzenbach <schanzen@gnunet.org>
Date:   Fri,  7 Nov 2025 22:43:33 +0100

mailbox UX

Diffstat:
M
packages/taler-wallet-webextension/src/wallet/Mailbox.tsx
 | 
53
+++++++++++++++++++++++++++++++++++++++--------------

1 file changed, 39 insertions(+), 14 deletions(-)
diff --git a/packages/taler-wallet-webextension/src/wallet/Mailbox.tsx b/packages/taler-wallet-webextension/src/wallet/Mailbox.tsx
@@ -182,7 +182,6 @@ function MailboxMessageLayout(props: MessageProps): VNode {
     }
     return new Date(t.t_s * 1000).toLocaleString();
   }
-  console.log(uri);
   return (
     <Paper style={{ padding: 8 }}>
       <p>
@@ -271,32 +270,58 @@ export function MessagesView({
   onInitializeMailbox: () => Promise<void>;
   onTalerUri: (url: string) => void;
 }): VNode {
+  const [showing, setShowing] = useState<boolean>();
   const { i18n } = useTranslationContext();
   async function copy(): Promise<void> {
     if (mailboxUrl) {
       navigator.clipboard.writeText(mailboxUrl);
     }
   }
+  async function toggle(): Promise<void> {
+    setShowing((s) => !s);
+  }
   return (
     <Fragment>
       <section>
         <p>{error && <Alert severity="error">{error}</Alert>}</p>
         {mailboxUrl ? (
-        <Centered style={{ margin: 10 }}>
-          <p>
-            <SmallText style={{ marginTop: 5 }}>
-              <LightText>
-                <i18n.Translate>Mailbox</i18n.Translate>: { mailboxUrl }
-              </LightText>
+        <p>
+          <Alert severity="info">
+            <i18n.Translate>
+              You may copy your mailbox URI from below and register it at <a href="https://taldir.gnunet.org">the Taler Directory</a> with your alias(es) to make it easier for others to find you.
+            </i18n.Translate>
+          {(showing) ? (
+            <div>
+              <SmallText style={{ marginTop: 5 }}>
+                <LightText>
+                  { mailboxUrl }
+                </LightText>
+              </SmallText>
               <Button onClick={copy as SafeHandler<void>}>
-                <i18n.Translate>copy</i18n.Translate>
+                <i18n.Translate>copy uri</i18n.Translate>
               </Button>
-            </SmallText>
-          </p>
-          <Button variant="contained" onClick={() => { return onFetchMessages(mailbox) }}>
-            <i18n.Translate>Fetch messages</i18n.Translate>
-          </Button>
-        </Centered>
+              <Button onClick={toggle as SafeHandler<void>}>
+                <i18n.Translate>hide uri</i18n.Translate>
+              </Button>
+            </div>
+          ) : (
+            <div>
+              <Button onClick={copy as SafeHandler<void>}>
+                <i18n.Translate>copy uri</i18n.Translate>
+              </Button>
+               <Button onClick={toggle as SafeHandler<void>}>
+                <i18n.Translate>show uri</i18n.Translate>
+              </Button>
+            </div>
+          )}
+          </Alert>
+          <br/>
+          <Centered style={{ margin: 10 }}>
+            <Button variant="contained" onClick={() => { return onFetchMessages(mailbox) }}>
+              <i18n.Translate>Fetch messages</i18n.Translate>
+            </Button>
+          </Centered>
+        </p>
         ) : (
         <Centered style={{ margin: 10 }}>
           <p>