From 04094dfa2565d45ea68676a77b3901bef94a0979 Mon Sep 17 00:00:00 2001
From: Norton Andreev <norton@nortonandreev.com>
Date: Sat, 21 Dec 2024 16:56:22 +0200
Subject: [PATCH] web-wallet: Prioritize Public Account in the interface

Resolves #3259
---
 web-wallet/CHANGELOG.md                       |  4 +
 .../lib/components/Allocate/Allocate.svelte   | 28 +++----
 .../src/lib/components/Balance/Balance.svelte | 16 ++--
 .../lib/components/__tests__/Balance.spec.js  |  8 +-
 .../__snapshots__/Balance.spec.js.snap        | 64 +++++++--------
 .../__snapshots__/layout.spec.js.snap         | 80 +++++++++----------
 .../__tests__/__snapshots__/page.spec.js.snap | 16 ++--
 .../(app)/dashboard/receive/+page.svelte      | 12 +--
 .../__tests__/__snapshots__/page.spec.js.snap | 38 ++++-----
 .../dashboard/receive/__tests__/page.spec.js  | 16 ++--
 .../routes/(app)/dashboard/send/+page.svelte  |  2 +-
 .../__tests__/__snapshots__/page.spec.js.snap |  2 +-
 .../dashboard/send/__tests__/page.spec.js     | 10 +--
 13 files changed, 150 insertions(+), 146 deletions(-)

diff --git a/web-wallet/CHANGELOG.md b/web-wallet/CHANGELOG.md
index d0205b62fd..8428c17f4b 100644
--- a/web-wallet/CHANGELOG.md
+++ b/web-wallet/CHANGELOG.md
@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Update Transactions list design [#1922]
+- Prioritize Public Account in the interface and transaction flows [#3259]
 
 ### Removed
 
@@ -23,6 +24,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Fix wrong error shown in the login screen [#3226] [#3097]
 - Fix wallet not waiting for the Wasm to load at startup [#3238]
+- Fix Public address icon in Receive flow [#3259]
+- Fix Public account icon hover text (Balance component) [#3259]
 
 ## [0.10.1] - 2024-12-18
 
@@ -474,6 +477,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 [#3226]: https://github.com/dusk-network/rusk/issues/3226
 [#3238]: https://github.com/dusk-network/rusk/issues/3238
 [#3245]: https://github.com/dusk-network/rusk/issues/3245
+[#3259]: https://github.com/dusk-network/rusk/issues/3259
 
 <!-- VERSIONS -->
 
diff --git a/web-wallet/src/lib/components/Allocate/Allocate.svelte b/web-wallet/src/lib/components/Allocate/Allocate.svelte
index bc675af24a..f70b120dde 100644
--- a/web-wallet/src/lib/components/Allocate/Allocate.svelte
+++ b/web-wallet/src/lib/components/Allocate/Allocate.svelte
@@ -157,16 +157,16 @@
       <div in:fade|global class="operation__allocate">
         <p>
           Edit the value to change the allocation of your Dusk between your
-          shielded and public accounts.
+          public and shielded accounts.
         </p>
 
         <fieldset class="operation__fieldset">
-          <p class="operation__label">Shielded</p>
+          <p class="operation__label">Public</p>
 
           <div class="operation__address-wrapper">
-            <Icon path={mdiShieldLock} />
+            <Icon path={mdiShieldLockOpenOutline} />
             {middleEllipsis(
-              shieldedAddress,
+              unshieldedAddress,
               calculateAdaptiveCharCount(screenWidth, 320, 640, 5, 20)
             )}
           </div>
@@ -174,14 +174,15 @@
           <div class="operation__input-wrapper">
             <Textbox
               className="operation__input-field"
-              value={shieldedNumber}
+              value={unshieldedNumber}
               required
               type="number"
-              step="0.000000001"
               max={luxToDusk(totalBalance)}
               min="0"
+              step="0.000000001"
+              id="unshielded-amount"
               on:input={handleBalanceChange}
-              name="shielded-amount"
+              name="unshielded-amount"
             />
             <Icon
               data-tooltip-id="main-tooltip"
@@ -192,12 +193,12 @@
 
           <hr class="glyph" />
 
-          <p class="operation__label">Public</p>
+          <p class="operation__label">Shielded</p>
 
           <div class="operation__address-wrapper">
-            <Icon path={mdiShieldLockOpenOutline} />
+            <Icon path={mdiShieldLock} />
             {middleEllipsis(
-              unshieldedAddress,
+              shieldedAddress,
               calculateAdaptiveCharCount(screenWidth, 320, 640, 5, 20)
             )}
           </div>
@@ -205,15 +206,14 @@
           <div class="operation__input-wrapper">
             <Textbox
               className="operation__input-field"
-              value={unshieldedNumber}
+              value={shieldedNumber}
               required
               type="number"
+              step="0.000000001"
               max={luxToDusk(totalBalance)}
               min="0"
-              step="0.000000001"
-              id="unshielded-amount"
               on:input={handleBalanceChange}
-              name="unshielded-amount"
+              name="shielded-amount"
             />
             <Icon
               data-tooltip-id="main-tooltip"
diff --git a/web-wallet/src/lib/components/Balance/Balance.svelte b/web-wallet/src/lib/components/Balance/Balance.svelte
index 4d60d374c4..e9a037ada3 100644
--- a/web-wallet/src/lib/components/Balance/Balance.svelte
+++ b/web-wallet/src/lib/components/Balance/Balance.svelte
@@ -72,13 +72,13 @@
     <div class="dusk-balance__account">
       <span class="dusk-balance__percentage"
         ><Icon
-          path={mdiShieldLock}
+          path={mdiShieldLockOpenOutline}
           data-tooltip-id="main-tooltip"
-          data-tooltip-text="Shielded"
-        />{numberFormatter(shieldedPercentage)}%</span
+          data-tooltip-text="Public"
+        />{numberFormatter(unshieldedPercentage)}%</span
       >
       <span class="dusk-balance__value"
-        >{duskFormatter(luxToDusk(shieldedAmount))}<Icon
+        >{duskFormatter(luxToDusk(unshieldedAmount))}<Icon
           data-tooltip-id="main-tooltip"
           data-tooltip-text="DUSK"
           path={logo}
@@ -88,13 +88,13 @@
     <div class="dusk-balance__account">
       <span class="dusk-balance__percentage"
         ><Icon
-          path={mdiShieldLockOpenOutline}
+          path={mdiShieldLock}
           data-tooltip-id="main-tooltip"
-          data-tooltip-text="Unshielded"
-        />{numberFormatter(unshieldedPercentage)}%</span
+          data-tooltip-text="Shielded"
+        />{numberFormatter(shieldedPercentage)}%</span
       >
       <span class="dusk-balance__value"
-        >{duskFormatter(luxToDusk(unshieldedAmount))}<Icon
+        >{duskFormatter(luxToDusk(shieldedAmount))}<Icon
           data-tooltip-id="main-tooltip"
           data-tooltip-text="DUSK"
           path={logo}
diff --git a/web-wallet/src/lib/components/__tests__/Balance.spec.js b/web-wallet/src/lib/components/__tests__/Balance.spec.js
index 84b6393df6..783f7d3a36 100644
--- a/web-wallet/src/lib/components/__tests__/Balance.spec.js
+++ b/web-wallet/src/lib/components/__tests__/Balance.spec.js
@@ -49,19 +49,19 @@ describe("Balance", () => {
   it("should display the right percentage values", async () => {
     const { container } = render(Balance, baseOptions);
 
-    // Check if shielded percentage displays as 33.33%
+    // Check if public percentage displays as 66.67%
     expect(
       container.querySelector(
         ".dusk-balance__account:first-child .dusk-balance__percentage"
       )?.textContent
-    ).toContain("33.33%");
+    ).toContain("66.67%");
 
-    // Check if unshielded percentage displays as 66.67%
+    // Check if shielded percentage displays as 33.33%
     expect(
       container.querySelector(
         ".dusk-balance__account:last-child .dusk-balance__percentage"
       )?.textContent
-    ).toContain("66.67%");
+    ).toContain("33.33%");
   });
 
   it("should display the right percentage values when balance is zero", async () => {
diff --git a/web-wallet/src/lib/components/__tests__/__snapshots__/Balance.spec.js.snap b/web-wallet/src/lib/components/__tests__/__snapshots__/Balance.spec.js.snap
index d1621be11d..7375459094 100644
--- a/web-wallet/src/lib/components/__tests__/__snapshots__/Balance.spec.js.snap
+++ b/web-wallet/src/lib/components/__tests__/__snapshots__/Balance.spec.js.snap
@@ -50,23 +50,23 @@ exports[`Balance > renders the Balance component 1`] = `
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Shielded"
+            data-tooltip-text="Public"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
             />
           </svg>
           
-          33.33
+          66.67
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0.001000000
+          0.002000000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -91,23 +91,23 @@ exports[`Balance > renders the Balance component 1`] = `
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Unshielded"
+            data-tooltip-text="Shielded"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
             />
           </svg>
           
-          66.67
+          33.33
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0.002000000
+          0.001000000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -179,23 +179,23 @@ exports[`Balance > should not display the fiat value if the fiat price is \`unde
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Shielded"
+            data-tooltip-text="Public"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
             />
           </svg>
           
-          33.33
+          66.67
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0.001000000
+          0.002000000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -220,23 +220,23 @@ exports[`Balance > should not display the fiat value if the fiat price is \`unde
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Unshielded"
+            data-tooltip-text="Shielded"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
             />
           </svg>
           
-          66.67
+          33.33
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0.002000000
+          0.001000000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -308,23 +308,23 @@ exports[`Balance > should update the Balance component when the props change 1`]
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Shielded"
+            data-tooltip-text="Public"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
             />
           </svg>
           
-          33.33
+          66.67
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0.001000000
+          0.002000000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -349,23 +349,23 @@ exports[`Balance > should update the Balance component when the props change 1`]
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Unshielded"
+            data-tooltip-text="Shielded"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
             />
           </svg>
           
-          66.67
+          33.33
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0.002000000
+          0.001000000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -437,23 +437,23 @@ exports[`Balance > should update the Balance component when the props change 2`]
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Shielded"
+            data-tooltip-text="Public"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
             />
           </svg>
           
-          16,67
+          83,33
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0,000500000
+          0,002500000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
@@ -478,23 +478,23 @@ exports[`Balance > should update the Balance component when the props change 2`]
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
-            data-tooltip-text="Unshielded"
+            data-tooltip-text="Shielded"
             role="graphics-symbol"
             viewBox="0 0 24 24"
           >
             <path
-              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
             />
           </svg>
           
-          83,33
+          16,67
           %
         </span>
          
         <span
           class="dusk-balance__value"
         >
-          0,002500000
+          0,000500000
           <svg
             class="dusk-icon dusk-icon--size--default"
             data-tooltip-id="main-tooltip"
diff --git a/web-wallet/src/routes/(app)/dashboard/__tests__/__snapshots__/layout.spec.js.snap b/web-wallet/src/routes/(app)/dashboard/__tests__/__snapshots__/layout.spec.js.snap
index 0d8d626a0a..c8d5556c7d 100644
--- a/web-wallet/src/routes/(app)/dashboard/__tests__/__snapshots__/layout.spec.js.snap
+++ b/web-wallet/src/routes/(app)/dashboard/__tests__/__snapshots__/layout.spec.js.snap
@@ -81,23 +81,23 @@ exports[`Dashboard Layout > should render the dashboard layout 1`] = `
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
-                  data-tooltip-text="Shielded"
+                  data-tooltip-text="Public"
                   role="graphics-symbol"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+                    d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
                   />
                 </svg>
                 
-                66.67
+                33.33
                 %
               </span>
                
               <span
                 class="dusk-balance__value"
               >
-                2,345.000000000
+                1,172.500000000
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
@@ -122,23 +122,23 @@ exports[`Dashboard Layout > should render the dashboard layout 1`] = `
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
-                  data-tooltip-text="Unshielded"
+                  data-tooltip-text="Shielded"
                   role="graphics-symbol"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+                    d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
                   />
                 </svg>
                 
-                33.33
+                66.67
                 %
               </span>
                
               <span
                 class="dusk-balance__value"
               >
-                1,172.500000000
+                2,345.000000000
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
@@ -307,23 +307,23 @@ exports[`Dashboard Layout > should render the dashboard layout and show a throbb
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
-                data-tooltip-text="Shielded"
+                data-tooltip-text="Public"
                 role="graphics-symbol"
                 viewBox="0 0 24 24"
               >
                 <path
-                  d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+                  d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
                 />
               </svg>
               
-              66.67
+              33.33
               %
             </span>
              
             <span
               class="dusk-balance__value"
             >
-              2,345.000000000
+              1,172.500000000
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
@@ -348,23 +348,23 @@ exports[`Dashboard Layout > should render the dashboard layout and show a throbb
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
-                data-tooltip-text="Unshielded"
+                data-tooltip-text="Shielded"
                 role="graphics-symbol"
                 viewBox="0 0 24 24"
               >
                 <path
-                  d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+                  d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
                 />
               </svg>
               
-              33.33
+              66.67
               %
             </span>
              
             <span
               class="dusk-balance__value"
             >
-              1,172.500000000
+              2,345.000000000
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
@@ -533,23 +533,23 @@ exports[`Dashboard Layout > should render the dashboard layout in the error stat
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
-                  data-tooltip-text="Shielded"
+                  data-tooltip-text="Public"
                   role="graphics-symbol"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+                    d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
                   />
                 </svg>
                 
-                66.67
+                33.33
                 %
               </span>
                
               <span
                 class="dusk-balance__value"
               >
-                2,345.000000000
+                1,172.500000000
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
@@ -574,23 +574,23 @@ exports[`Dashboard Layout > should render the dashboard layout in the error stat
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
-                  data-tooltip-text="Unshielded"
+                  data-tooltip-text="Shielded"
                   role="graphics-symbol"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+                    d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
                   />
                 </svg>
                 
-                33.33
+                66.67
                 %
               </span>
                
               <span
                 class="dusk-balance__value"
               >
-                1,172.500000000
+                2,345.000000000
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
@@ -780,23 +780,23 @@ exports[`Dashboard Layout > should render the dashboard layout in the sync state
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
-                data-tooltip-text="Shielded"
+                data-tooltip-text="Public"
                 role="graphics-symbol"
                 viewBox="0 0 24 24"
               >
                 <path
-                  d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+                  d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
                 />
               </svg>
               
-              66.67
+              33.33
               %
             </span>
              
             <span
               class="dusk-balance__value"
             >
-              2,345.000000000
+              1,172.500000000
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
@@ -821,23 +821,23 @@ exports[`Dashboard Layout > should render the dashboard layout in the sync state
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
-                data-tooltip-text="Unshielded"
+                data-tooltip-text="Shielded"
                 role="graphics-symbol"
                 viewBox="0 0 24 24"
               >
                 <path
-                  d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+                  d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
                 />
               </svg>
               
-              33.33
+              66.67
               %
             </span>
              
             <span
               class="dusk-balance__value"
             >
-              1,172.500000000
+              2,345.000000000
               <svg
                 class="dusk-icon dusk-icon--size--default"
                 data-tooltip-id="main-tooltip"
@@ -1014,23 +1014,23 @@ exports[`Dashboard Layout > should render the dashboard layout in the sync state
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
-                  data-tooltip-text="Shielded"
+                  data-tooltip-text="Public"
                   role="graphics-symbol"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+                    d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
                   />
                 </svg>
                 
-                66.67
+                33.33
                 %
               </span>
                
               <span
                 class="dusk-balance__value"
               >
-                2,345.000000000
+                1,172.500000000
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
@@ -1055,23 +1055,23 @@ exports[`Dashboard Layout > should render the dashboard layout in the sync state
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
-                  data-tooltip-text="Unshielded"
+                  data-tooltip-text="Shielded"
                   role="graphics-symbol"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+                    d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
                   />
                 </svg>
                 
-                33.33
+                66.67
                 %
               </span>
                
               <span
                 class="dusk-balance__value"
               >
-                1,172.500000000
+                2,345.000000000
                 <svg
                   class="dusk-icon dusk-icon--size--default"
                   data-tooltip-id="main-tooltip"
diff --git a/web-wallet/src/routes/(app)/dashboard/allocate/__tests__/__snapshots__/page.spec.js.snap b/web-wallet/src/routes/(app)/dashboard/allocate/__tests__/__snapshots__/page.spec.js.snap
index 7e1b291405..2c1db17d55 100644
--- a/web-wallet/src/routes/(app)/dashboard/allocate/__tests__/__snapshots__/page.spec.js.snap
+++ b/web-wallet/src/routes/(app)/dashboard/allocate/__tests__/__snapshots__/page.spec.js.snap
@@ -56,7 +56,7 @@ exports[`Allocate > should render the allocation page 1`] = `
         >
           <p>
             Edit the value to change the allocation of your Dusk between your
-          shielded and public accounts.
+          public and shielded accounts.
           </p>
            
           <fieldset
@@ -65,7 +65,7 @@ exports[`Allocate > should render the allocation page 1`] = `
             <p
               class="operation__label svelte-eoztn2"
             >
-              Shielded
+              Public
             </p>
              
             <div
@@ -77,7 +77,7 @@ exports[`Allocate > should render the allocation page 1`] = `
                 viewBox="0 0 24 24"
               >
                 <path
-                  d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+                  d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
                 />
               </svg>
               
@@ -90,9 +90,10 @@ exports[`Allocate > should render the allocation page 1`] = `
             >
               <input
                 class="dusk-textbox dusk-textbox-number operation__input-field"
+                id="unshielded-amount"
                 max="0"
                 min="0"
-                name="shielded-amount"
+                name="unshielded-amount"
                 required=""
                 step="0.000000001"
                 type="number"
@@ -120,7 +121,7 @@ exports[`Allocate > should render the allocation page 1`] = `
             <p
               class="operation__label svelte-eoztn2"
             >
-              Public
+              Shielded
             </p>
              
             <div
@@ -132,7 +133,7 @@ exports[`Allocate > should render the allocation page 1`] = `
                 viewBox="0 0 24 24"
               >
                 <path
-                  d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
+                  d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
                 />
               </svg>
               
@@ -145,10 +146,9 @@ exports[`Allocate > should render the allocation page 1`] = `
             >
               <input
                 class="dusk-textbox dusk-textbox-number operation__input-field"
-                id="unshielded-amount"
                 max="0"
                 min="0"
-                name="unshielded-amount"
+                name="shielded-amount"
                 required=""
                 step="0.000000001"
                 type="number"
diff --git a/web-wallet/src/routes/(app)/dashboard/receive/+page.svelte b/web-wallet/src/routes/(app)/dashboard/receive/+page.svelte
index 271325d42c..ad73c39d28 100644
--- a/web-wallet/src/routes/(app)/dashboard/receive/+page.svelte
+++ b/web-wallet/src/routes/(app)/dashboard/receive/+page.svelte
@@ -4,7 +4,7 @@
   import {
     mdiArrowBottomLeftThin,
     mdiShieldLock,
-    mdiShieldLockOpen,
+    mdiShieldLockOpenOutline,
   } from "@mdi/js";
 
   import { walletStore } from "$lib/stores";
@@ -12,22 +12,22 @@
   import { ExclusiveChoice } from "$lib/dusk/components";
   import { IconHeadingCard } from "$lib/containers/Cards";
 
-  let addressToShow = "shielded";
+  let addressToShow = "public";
 
   const options = [
+    { disabled: false, label: "Public", value: "public" },
     { disabled: false, label: "Shielded", value: "shielded" },
-    { disabled: false, label: "Unshielded", value: "unshielded" },
   ];
 
-  /** @type {"address" | "account"} */
-  $: addressProp = addressToShow === "shielded" ? "address" : "account";
+  /** @type {"account" | "address"} */
+  $: addressProp = addressToShow === "public" ? "account" : "address";
   $: ({ currentProfile } = $walletStore);
   $: currentAddress = currentProfile
     ? currentProfile[addressProp].toString()
     : "";
   $: icons = [
     mdiArrowBottomLeftThin,
-    addressToShow === "shielded" ? mdiShieldLock : mdiShieldLockOpen,
+    addressToShow === "public" ? mdiShieldLockOpenOutline : mdiShieldLock,
   ];
 </script>
 
diff --git a/web-wallet/src/routes/(app)/dashboard/receive/__tests__/__snapshots__/page.spec.js.snap b/web-wallet/src/routes/(app)/dashboard/receive/__tests__/__snapshots__/page.spec.js.snap
index 6fd9292bbc..2ec3f1a382 100644
--- a/web-wallet/src/routes/(app)/dashboard/receive/__tests__/__snapshots__/page.spec.js.snap
+++ b/web-wallet/src/routes/(app)/dashboard/receive/__tests__/__snapshots__/page.spec.js.snap
@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Receive > should change the icon to "unshielded" and show the unshielded address when the user makes such choice 1`] = `
+exports[`Receive > should render the receive page with a choice to switch from public to shielded address 1`] = `
 <div
   class="dusk-card dusk-card--gap-medium"
 >
@@ -41,7 +41,7 @@ exports[`Receive > should change the icon to "unshielded" and show the unshielde
             viewBox="0 0 24 24"
           >
             <path
-              d="M12 1L3 5V11C3 16.5 6.8 21.7 12 23C17.2 21.7 21 16.5 21 11V5L12 1M16 15.8C16 16.4 15.4 17 14.7 17H9.2C8.6 17 8 16.4 8 15.7V12.2C8 11.6 8.6 11 9.2 11V8.5C9.2 7.1 10.6 6 12 6S14.8 7.1 14.8 8.5V9H13.5V8.5C13.5 7.7 12.8 7.2 12 7.2S10.5 7.7 10.5 8.5V11H14.8C15.4 11 16 11.6 16 12.3V15.8Z"
+              d="M21 11C21 16.5 17.2 21.7 12 23C6.8 21.7 3 16.5 3 11V5L12 1L21 5V11M12 21C15.8 20 19 15.5 19 11.2V6.3L12 3.2L5 6.3V11.2C5 15.5 8.2 20 12 21M14.8 11H10.5V8.5C10.5 7.7 11.2 7.2 12 7.2S13.5 7.7 13.5 8.5V9H14.8V8.5C14.8 7.1 13.4 6 12 6S9.2 7.1 9.2 8.5V11C8.6 11 8 11.6 8 12.2V15.7C8 16.4 8.6 17 9.2 17H14.7C15.4 17 16 16.4 16 15.8V12.3C16 11.6 15.4 11 14.8 11Z"
             />
           </svg>
           
@@ -59,31 +59,31 @@ exports[`Receive > should change the icon to "unshielded" and show the unshielde
     >
       <input
         class="dusk-exclusive-choice__radio"
-        id="some-generated-id-shielded"
+        id="some-generated-id-public"
         name="some-generated-id"
         type="radio"
-        value="shielded"
+        value="public"
       />
        
       <label
         class="dusk-exclusive-choice__label"
-        for="some-generated-id-shielded"
+        for="some-generated-id-public"
       >
-        Shielded
+        Public
       </label>
       <input
         class="dusk-exclusive-choice__radio"
-        id="some-generated-id-unshielded"
+        id="some-generated-id-shielded"
         name="some-generated-id"
         type="radio"
-        value="unshielded"
+        value="shielded"
       />
        
       <label
         class="dusk-exclusive-choice__label"
-        for="some-generated-id-unshielded"
+        for="some-generated-id-shielded"
       >
-        Unshielded
+        Shielded
       </label>
     </div>
      
@@ -168,7 +168,7 @@ exports[`Receive > should change the icon to "unshielded" and show the unshielde
 </div>
 `;
 
-exports[`Receive > should render the receive page with a double icon and a choice to switch from shielded to unshielded address 1`] = `
+exports[`Receive > should show the shielded address when the user makes such choice 1`] = `
 <div
   class="dusk-card dusk-card--gap-medium"
 >
@@ -227,31 +227,31 @@ exports[`Receive > should render the receive page with a double icon and a choic
     >
       <input
         class="dusk-exclusive-choice__radio"
-        id="some-generated-id-shielded"
+        id="some-generated-id-public"
         name="some-generated-id"
         type="radio"
-        value="shielded"
+        value="public"
       />
        
       <label
         class="dusk-exclusive-choice__label"
-        for="some-generated-id-shielded"
+        for="some-generated-id-public"
       >
-        Shielded
+        Public
       </label>
       <input
         class="dusk-exclusive-choice__radio"
-        id="some-generated-id-unshielded"
+        id="some-generated-id-shielded"
         name="some-generated-id"
         type="radio"
-        value="unshielded"
+        value="shielded"
       />
        
       <label
         class="dusk-exclusive-choice__label"
-        for="some-generated-id-unshielded"
+        for="some-generated-id-shielded"
       >
-        Unshielded
+        Shielded
       </label>
     </div>
      
diff --git a/web-wallet/src/routes/(app)/dashboard/receive/__tests__/page.spec.js b/web-wallet/src/routes/(app)/dashboard/receive/__tests__/page.spec.js
index 474bdf9544..c3117c5f4c 100644
--- a/web-wallet/src/routes/(app)/dashboard/receive/__tests__/page.spec.js
+++ b/web-wallet/src/routes/(app)/dashboard/receive/__tests__/page.spec.js
@@ -48,30 +48,30 @@ describe("Receive", () => {
     vi.useRealTimers();
   });
 
-  it("should render the receive page with a double icon and a choice to switch from shielded to unshielded address", async () => {
+  it("should render the receive page with a choice to switch from public to shielded address", async () => {
     const { container, getByRole, getByText } = render(Receive);
 
     await vi.runAllTimersAsync();
 
     expect(getByRole("radiogroup")).toBeInTheDocument();
-    expect(getByText(expectedAddress)).toBeInTheDocument();
-    expect(() => getByText(expectedAccount)).toThrow();
+    expect(getByText(expectedAccount)).toBeInTheDocument();
+    expect(() => getByText(expectedAddress)).toThrow();
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should change the icon to "unshielded" and show the unshielded address when the user makes such choice', async () => {
+  it("should show the shielded address when the user makes such choice", async () => {
     const { container, getByRole, getByText } = render(Receive);
 
     await vi.runAllTimersAsync();
 
-    expect(getByText(expectedAddress)).toBeInTheDocument();
-    expect(() => getByText(expectedAccount)).toThrow();
+    expect(getByText(expectedAccount)).toBeInTheDocument();
+    expect(() => getByText(expectedAddress)).toThrow();
 
     await fireEvent.click(getByRole("radio", { checked: false }));
     await vi.runAllTimersAsync();
 
-    expect(() => getByText(expectedAddress)).toThrow();
-    expect(getByText(expectedAccount)).toBeInTheDocument();
+    expect(() => getByText(expectedAccount)).toThrow();
+    expect(getByText(expectedAddress)).toBeInTheDocument();
     expect(container.firstChild).toMatchSnapshot();
   });
 });
diff --git a/web-wallet/src/routes/(app)/dashboard/send/+page.svelte b/web-wallet/src/routes/(app)/dashboard/send/+page.svelte
index 326da48175..0b975e1e5e 100644
--- a/web-wallet/src/routes/(app)/dashboard/send/+page.svelte
+++ b/web-wallet/src/routes/(app)/dashboard/send/+page.svelte
@@ -32,7 +32,7 @@
   const gasLimits = $gasStore;
 
   /** @type {"shielded" | "unshielded"} */
-  let spendableSource = "shielded";
+  let spendableSource = "unshielded";
 
   /**
    * @param {CustomEvent<{ type: "account" | "address" | undefined}>} event
diff --git a/web-wallet/src/routes/(app)/dashboard/send/__tests__/__snapshots__/page.spec.js.snap b/web-wallet/src/routes/(app)/dashboard/send/__tests__/__snapshots__/page.spec.js.snap
index 827cc6d0ea..308ced8b42 100644
--- a/web-wallet/src/routes/(app)/dashboard/send/__tests__/__snapshots__/page.spec.js.snap
+++ b/web-wallet/src/routes/(app)/dashboard/send/__tests__/__snapshots__/page.spec.js.snap
@@ -59,7 +59,7 @@ exports[`Send page > should render the send page 1`] = `
           class="contract-statuses__value svelte-1up3579"
         >
           <span>
-            50,000.000000000
+            1,172.500000000
           </span>
            
           <svg
diff --git a/web-wallet/src/routes/(app)/dashboard/send/__tests__/page.spec.js b/web-wallet/src/routes/(app)/dashboard/send/__tests__/page.spec.js
index dfb6e8d441..98c4913494 100644
--- a/web-wallet/src/routes/(app)/dashboard/send/__tests__/page.spec.js
+++ b/web-wallet/src/routes/(app)/dashboard/send/__tests__/page.spec.js
@@ -51,22 +51,22 @@ describe("Send page", () => {
 
     expect(
       container.querySelector(".contract-statuses__value")
-    ).toHaveTextContent(formattedShielded);
+    ).toHaveTextContent(formattedUnshielded);
 
     await fireEvent.input(addressTextbox, {
-      target: { value: currentProfile.account.toString() },
+      target: { value: currentProfile.address.toString() },
     });
 
     expect(
       container.querySelector(".contract-statuses__value")
-    ).toHaveTextContent(formattedUnshielded);
+    ).toHaveTextContent(formattedShielded);
 
     await fireEvent.input(addressTextbox, {
-      target: { value: currentProfile.address.toString() },
+      target: { value: currentProfile.account.toString() },
     });
 
     expect(
       container.querySelector(".contract-statuses__value")
-    ).toHaveTextContent(formattedShielded);
+    ).toHaveTextContent(formattedUnshielded);
   });
 });