frontend: fix tx details behaviour

1. Focus trap to include dialog's header for tx detail
dialog. This way, the note input doesn't get auto focused.

Also added autofocus inside FOCUSABLE_SELECTOR (useEsc hook)

2. Changed translations: Send to Sent, and Receive to Received

Author: shonsirsha

frontends/web/src/components/dialog/dialog.tsx

@@ -165,7 +165,7 @@ export const Dialog = ({
       className={overlayClass}
     >
       <UseBackButton handler={closeHandler} />
-      <div className={modalClass}>
+      <div className={modalClass} ref={contentRef}>
         {title && (
           <div className={headerClass}>
             <h3 className={style.title}>{title}</h3>
@@ -177,7 +177,7 @@ export const Dialog = ({
             )}
           </div>
         )}
-        <div className={contentClass} ref={contentRef}>
+        <div className={contentClass}>
           <div className={style.content}>{children}</div>
         </div>
       </div>

frontends/web/src/components/transactions/components/tx-detail-dialog/tx-detail-dialog.tsx

@@ -87,7 +87,8 @@ export const TxDetailsDialog = ({
       title={t('transaction.details.title')}
       onClose={onClose}
       slim
-      medium>
+      medium
+    >
       {transactionInfo && (
         <div className={styles.container}>
           <TxDetailHeader

frontends/web/src/components/transactions/components/tx-detail-dialog/tx-detail-header.tsx

@@ -88,9 +88,9 @@ const StatusAndSign = ({
   const fromSignToText = () => {
     switch (type) {
     case 'send':
-      return t('generic.send');
+      return t('generic.sent');
     case 'receive':
-      return t('generic.receiveWithoutCoinCode');
+      return t('generic.received');
     case 'send_to_self':
       return t('transaction.details.sendToSelf');
     }

frontends/web/src/hooks/keyboard.ts

@@ -60,7 +60,8 @@ const FOCUSABLE_SELECTOR = `
   input:not(:disabled),
   select:not(:disabled),
   textarea:not(:disabled),
-  [tabindex]:not([tabindex="-1"]):not(:disabled)
+  [tabindex]:not([tabindex="-1"]):not(:disabled),
+  [autofocus]:not(:disabled)
 `;
 
 /**

frontends/web/src/locales/en/app.json

@@ -889,6 +889,7 @@
     "receiveWithoutCoinCode": "Receive",
     "receive_bitcoin": "Receive Bitcoin",
     "receive_crypto": "Receive crypto",
+    "received": "Received",
     "reset": "Reset",
     "resetToDefault": "Reset to default",
     "search": "Search…",
@@ -897,6 +898,7 @@
     "sell_bitcoin": "Sell Bitcoin",
     "sell_crypto": "Sell crypto",
     "send": "Send",
+    "sent": "Sent",
     "spend_bitcoin": "Spend bitcoin",
     "spend_crypto": "Spend crypto"
   },