Add stealth invoice icon and ES translation

frontend/src/components/Dialogs/Profile.tsx

@@ -31,6 +31,7 @@ import PasswordIcon from "@mui/icons-material/Password";
 import ContentCopy from "@mui/icons-material/ContentCopy";
 import PersonAddAltIcon from "@mui/icons-material/PersonAddAlt";
 import EmojiEventsIcon from "@mui/icons-material/EmojiEvents";
+import { UserNinjaIcon, BitcoinIcon } from "../Icons";
 
 import { getCookie } from "../../utils/cookies";
 import { copyToClipboard } from "../../utils/clipboard";
@@ -210,29 +211,42 @@ const ProfileDialog = ({
 
           <Divider/>
 
-          <Grid container>
-            <Tooltip placement="top" enterTouchDelay={0} title={t("stealth_invoice_explaination")}>
-              <Grid item>
-                <FormControlLabel
-                  labelPlacement="start"
-                  label={`${t("Use stealth invoices")}`}
-                  control={
-                    <Switch
-                      checked={stealthInvoices}
-                      onChange={() => handleSetStealthInvoice(!stealthInvoices)
-                      }
-                    />
-                  }
-                />
-              </Grid>
-            </Tooltip>
-          </Grid>
+          <ListItem>
+            <ListItemIcon>
+              <UserNinjaIcon/>
+            </ListItemIcon>
 
-          <Grid container>
-            <Grid item>
+            <ListItemText>
+              <Tooltip placement="top" enterTouchDelay={0} title={t("Stealth lightning invoices do not contain details about the trade except an order reference. Enable this setting if you don't want to disclose details to a custodial lightning wallet.")}>
+                <Grid item>
+                  <FormControlLabel
+                    labelPlacement="end"
+                    label={t("Use stealth invoices")}
+                    control={
+                      <Switch
+                        checked={stealthInvoices}
+                        onChange={() => handleSetStealthInvoice(!stealthInvoices)
+                        }
+                      />
+                    }
+                  />
+                </Grid>
+              </Tooltip>
+            </ListItemText>
+          </ListItem>
+
+          <ListItem>
+            <ListItemIcon>
+              <BitcoinIcon/>
+            </ListItemIcon>
+
+            <ListItemText>
               <FormControlLabel
-                labelPlacement="start"
-                label={`${t("Rewards and compensations")}`}
+                labelPlacement="end"
+                label={
+                  <div style={{display:'flex', alignItems:'center'}}>
+                    {t("Rewards and compensations")}
+                  </div>}
                 control={
                   <Switch
                     checked={showRewards}
@@ -240,8 +254,8 @@ const ProfileDialog = ({
                   />
                 }
               />
-            </Grid>
-          </Grid>
+            </ListItemText>
+          </ListItem>
 
           {showRewards && (
             <>

frontend/src/components/Icons/UserNinja.tsx

@@ -0,0 +1,11 @@
+import React, { Component } from "react";
+import { SvgIcon } from "@mui/material"
+
+export default function UserNinjaIcon(props) {
+    return (
+      <SvgIcon {...props} x="0px" y="0px" viewBox="0 0 512 512"> 
+        <path d="M64 192c27.25 0 51.75-11.5 69.25-29.75c15 54 64 93.75 122.8 93.75c70.75 0 127.1-57.25 127.1-128s-57.25-128-127.1-128c-50.38 0-93.63 29.38-114.5 71.75C124.1 47.75 96 32 64 32c0 33.37 17.12 62.75 43.13 80C81.13 129.3 64 158.6 64 192zM208 96h95.1C321.7 96 336 110.3 336 128h-160C176 110.3 190.3 96 208 96zM337.8 306.9L256 416L174.2 306.9C93.36 321.6 32 392.2 32 477.3c0 19.14 15.52 34.67 34.66 34.67H445.3c19.14 0 34.66-15.52 34.66-34.67C480 392.2 418.6 321.6 337.8 306.9z"/>
+      </SvgIcon>
+    );
+  }
+

frontend/src/components/Icons/index.ts

@@ -13,6 +13,7 @@ export { default as SellSatsCheckedIcon } from "./SellSatsChecked";
 export { default as SellSatsIcon } from "./SellSats";
 export { default as SendReceiveIcon } from "./SendReceive";
 export { default as ExportIcon } from "./Export";
+export { default as UserNinjaIcon } from "./UserNinja";
 
 // Some Flags missing on react-flags
 export { default as BasqueCountryFlag } from "./BasqueCountryFlag";

frontend/static/locales/en.json

@@ -228,7 +228,7 @@
     "RoboSats in Reddit":"RoboSats in Reddit",
     "Current onchain payout fee":"Current onchain payout fee",
     "Use stealth invoices":"Use stealth invoices",
-    "stealth_invoice_explaination":"Stealth invoices do not contain details about the trade except a payment reference. Enable this setting if you don't want to disclose details to a custodial lightning wallet.",
+    "Stealth lightning invoices do not contain details about the trade except an order reference. Enable this setting if you don't want to disclose details to a custodial lightning wallet.":"Stealth lightning invoices do not contain details about the trade except an order reference. Enable this setting if you don't want to disclose details to a custodial lightning wallet.",
 
     "ORDER PAGE - OrderPage.js": "Order details page",
     "Order Box":"Order Box",

frontend/static/locales/es.json

@@ -226,6 +226,8 @@
     "Join RoboSats' Subreddit":"Únete al subreddit de RoboSats",
     "RoboSats in Reddit":"RoboSats en Reddit",
     "Current onchain payout fee":"Coste actual de recibir onchain",
+    "Use stealth invoices":"Facturas sigilosas",
+    "Stealth lightning invoices do not contain details about the trade except an order reference. Enable this setting if you don't want to disclose details to a custodial lightning wallet.":"Las facturas sigilosas no contienen información sobre tu orden excepto una referencia a la misma. Activalas para no desvelar información a tu proveedor de wallet custodial.",
 
 
     "ORDER PAGE - OrderPage.js": "Order details page",