From a47aae782468ceab3ec9dbb89ed67b068a4dc425 Mon Sep 17 00:00:00 2001
From: httpiga <36515569+httpiga@users.noreply.github.com>
Date: Wed, 14 Dec 2022 01:13:46 +0100
Subject: [PATCH 1/3] Show jar total amount in jar details, UTXOs tab

---
 .../jar_details/JarDetailsOverlay.tsx           | 17 ++++++++++++++---
 src/i18n/locales/en/translation.json            |  1 +
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/jar_details/JarDetailsOverlay.tsx b/src/components/jar_details/JarDetailsOverlay.tsx
index fc1214bd3..7716958ef 100644
--- a/src/components/jar_details/JarDetailsOverlay.tsx
+++ b/src/components/jar_details/JarDetailsOverlay.tsx
@@ -352,9 +352,20 @@ const JarDetailsOverlay = (props: JarDetailsOverlayProps) => {
                 {selectedTab === TABS.UTXOS ? (
                   <>
                     <div className={styles.utxoListTitleBar}>
-                      <div className="d-flex justify-content-center align-items-center gap-2">
-                        {refreshButton()}
-                        {utxoListTitle()}
+                      <div className="d-flex justify-content-between align-items-center w-100 flex-sm-row flex-column">
+                        <div className="d-flex justify-content-center align-items-center gap-2">
+                          {refreshButton()}
+                          {utxoListTitle()}
+                        </div>
+                        <div>
+                          <Trans i18nKey="jar_details.total_label">
+                            <Balance
+                              valueString={jar.account_balance}
+                              convertToUnit={settings.unit}
+                              showBalance={settings.showBalance}
+                            />
+                          </Trans>
+                        </div>
                       </div>
                       <div className={styles.operationsContainer}>
                         {utxos.length > 0 && (
diff --git a/src/i18n/locales/en/translation.json b/src/i18n/locales/en/translation.json
index 07c95f217..ac71f7f33 100644
--- a/src/i18n/locales/en/translation.json
+++ b/src/i18n/locales/en/translation.json
@@ -554,6 +554,7 @@
   "jar_details": {
     "title_tab_utxos": "UTXOs",
     "title_tab_jar_details": "Details",
+    "total_label": "<0></0> total",
     "utxo_list": {
       "title_zero": "No UTXOs in Jar {{ jar }}",
       "title_one": "{{ count }} UTXO in Jar {{ jar }}",

From 6b16338f38b52ce4a76fe9c7a84649d729c52add Mon Sep 17 00:00:00 2001
From: theborakompanioni <theborakompanioni+github@gmail.com>
Date: Wed, 14 Dec 2022 13:14:38 +0100
Subject: [PATCH 2/3] review: move label to utxo_list namespace

---
 src/components/jar_details/JarDetailsOverlay.tsx | 2 +-
 src/i18n/locales/en/translation.json             | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/jar_details/JarDetailsOverlay.tsx b/src/components/jar_details/JarDetailsOverlay.tsx
index 7716958ef..b6bdac919 100644
--- a/src/components/jar_details/JarDetailsOverlay.tsx
+++ b/src/components/jar_details/JarDetailsOverlay.tsx
@@ -358,7 +358,7 @@ const JarDetailsOverlay = (props: JarDetailsOverlayProps) => {
                           {utxoListTitle()}
                         </div>
                         <div>
-                          <Trans i18nKey="jar_details.total_label">
+                          <Trans i18nKey="jar_details.utxo_list.text_balance_sum_total">
                             <Balance
                               valueString={jar.account_balance}
                               convertToUnit={settings.unit}
diff --git a/src/i18n/locales/en/translation.json b/src/i18n/locales/en/translation.json
index ac71f7f33..c5f15a788 100644
--- a/src/i18n/locales/en/translation.json
+++ b/src/i18n/locales/en/translation.json
@@ -554,11 +554,11 @@
   "jar_details": {
     "title_tab_utxos": "UTXOs",
     "title_tab_jar_details": "Details",
-    "total_label": "<0></0> total",
     "utxo_list": {
       "title_zero": "No UTXOs in Jar {{ jar }}",
       "title_one": "{{ count }} UTXO in Jar {{ jar }}",
       "title_other": "{{ count }} UTXOs in Jar {{ jar }}",
+      "text_balance_sum_total": "<0></0> total",
       "text_balance_sum_selected": "<0></0> selected",
       "button_freeze": "Freeze",
       "button_unfreeze": "Unfreeze",

From e7e58a2de714d6f9cbca100408a2375f489fca86 Mon Sep 17 00:00:00 2001
From: theborakompanioni <theborakompanioni+github@gmail.com>
Date: Wed, 14 Dec 2022 13:30:16 +0100
Subject: [PATCH 3/3] review: center every component in utxo list title div

---
 .../jar_details/JarDetailsOverlay.module.css  | 20 -------------------
 .../jar_details/JarDetailsOverlay.tsx         | 12 ++++++-----
 2 files changed, 7 insertions(+), 25 deletions(-)

diff --git a/src/components/jar_details/JarDetailsOverlay.module.css b/src/components/jar_details/JarDetailsOverlay.module.css
index a1982dd77..353a6cede 100644
--- a/src/components/jar_details/JarDetailsOverlay.module.css
+++ b/src/components/jar_details/JarDetailsOverlay.module.css
@@ -75,26 +75,6 @@
   background-color: var(--bs-gray-800);
 }
 
-.overlayContainer .tabContainer .utxoListTitleBar .operationsContainer {
-  display: flex;
-  width: 100%;
-  justify-content: space-between;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 0.5rem;
-}
-
-.selectedUtxosSumContainer {
-  align-self: end;
-}
-
-@media only screen and (min-width: 576px) {
-  .overlayContainer .tabContainer .utxoListTitleBar .operationsContainer {
-    flex-direction: row;
-    align-items: center;
-  }
-}
-
 .overlayContainer .tabContainer .utxoListTitleBar .freezeUnfreezeButtonsContainer {
   display: flex;
   flex-direction: row;
diff --git a/src/components/jar_details/JarDetailsOverlay.tsx b/src/components/jar_details/JarDetailsOverlay.tsx
index b6bdac919..853e5715c 100644
--- a/src/components/jar_details/JarDetailsOverlay.tsx
+++ b/src/components/jar_details/JarDetailsOverlay.tsx
@@ -367,15 +367,17 @@ const JarDetailsOverlay = (props: JarDetailsOverlayProps) => {
                           </Trans>
                         </div>
                       </div>
-                      <div className={styles.operationsContainer}>
+                      <div className="d-flex justify-content-between align-items-center w-100 flex-sm-row flex-column gap-2">
                         {utxos.length > 0 && (
-                          <div className={styles.freezeUnfreezeButtonsContainer}>
-                            {freezeUnfreezeButton({ freeze: true })}
-                            {freezeUnfreezeButton({ freeze: false })}
+                          <div className="order-1 order-sm-0">
+                            <div className={styles.freezeUnfreezeButtonsContainer}>
+                              {freezeUnfreezeButton({ freeze: true })}
+                              {freezeUnfreezeButton({ freeze: false })}
+                            </div>
                           </div>
                         )}
                         {selectedUtxosBalance > 0 && (
-                          <div className={styles.selectedUtxosSumContainer}>
+                          <div className="order-0 order-sm-1">
                             <Trans i18nKey="jar_details.utxo_list.text_balance_sum_selected">
                               <Balance
                                 valueString={String(selectedUtxosBalance)}