From 08f625f3e9a91807d4888f5fdaadc43219fb7649 Mon Sep 17 00:00:00 2001
From: evavirseda <evirseda@boxfish.studio>
Date: Mon, 6 May 2024 13:58:19 +0200
Subject: [PATCH] feat: reset withdrawal form after withdraw success (#41)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: reset form

* fix: reset form only if success

* fix: update amount range bakcground color for iota theme

* feat: reset same to initial values

---------

Co-authored-by: Begoña Alvarez <balvarez@boxfish.studio>
---
 src/components/inputs/amount-range.svelte   |  2 +-
 src/routes/sections/withdraw-section.svelte | 18 ++++++++++++++++--
 src/themes/iota-theme.scss                  |  2 +-
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/components/inputs/amount-range.svelte b/src/components/inputs/amount-range.svelte
index d1bb19a..cf1ef32 100644
--- a/src/components/inputs/amount-range.svelte
+++ b/src/components/inputs/amount-range.svelte
@@ -78,7 +78,7 @@
     /******** Chrome, Safari, Opera and Edge Chromium styles ********/
     /* slider track */
     &::-webkit-slider-runnable-track {
-      background-color: #061928;
+      @apply bg-background-secondary;
       border-radius: 0.5rem;
       height: 8px;
     }
diff --git a/src/routes/sections/withdraw-section.svelte b/src/routes/sections/withdraw-section.svelte
index 1d49569..f84aa2e 100644
--- a/src/routes/sections/withdraw-section.svelte
+++ b/src/routes/sections/withdraw-section.svelte
@@ -4,7 +4,11 @@
   import { getBech32AddressLengthFromChain, truncateText } from '$lib/common';
   import { InputType } from '$lib/common/enums';
   import { L2_NATIVE_GAS_TOKEN_DECIMALS } from '$lib/constants';
-  import { appConfiguration, nodeClient, selectedNetwork } from '$lib/evm-toolkit';
+  import {
+    appConfiguration,
+    nodeClient,
+    selectedNetwork,
+  } from '$lib/evm-toolkit';
   import type { INativeToken } from '$lib/native-token';
   import type { INFT } from '$lib/nft';
   import { NotificationType, showNotification } from '$lib/notification';
@@ -31,7 +35,9 @@
     $withdrawStateStore.availableBaseTokens /
     10 ** L2_NATIVE_GAS_TOKEN_DECIMALS
   ).toFixed(2);
-  $: isValidAddress = formInput.receiverAddress.length === getBech32AddressLengthFromChain($selectedNetwork.chainRef);
+  $: isValidAddress =
+    formInput.receiverAddress.length ===
+    getBech32AddressLengthFromChain($selectedNetwork.chainRef);
   $: canWithdraw =
     $withdrawStateStore?.availableBaseTokens > 0 &&
     formInput.baseTokensToSend > 0 &&
@@ -126,6 +132,7 @@
     }
 
     if (result.status) {
+      resetForm();
       showNotification({
         type: NotificationType.Success,
         message: `Withdraw request sent. BlockIndex: ${result.blockNumber}`,
@@ -213,6 +220,13 @@
       };
     });
   };
+
+  function resetForm(): void {
+    formInput.receiverAddress = '';
+    formInput.baseTokensToSend = storageDeposit;
+    formInput.nativeTokensToSend = {};
+    formInput.nftIDToSend = null;
+  }
 </script>
 
 <withdraw-component class="flex flex-col space-y-6 mt-6">
diff --git a/src/themes/iota-theme.scss b/src/themes/iota-theme.scss
index c22ddd9..353921c 100644
--- a/src/themes/iota-theme.scss
+++ b/src/themes/iota-theme.scss
@@ -3,7 +3,7 @@ html[data-theme="iota"] {
   --action-hover: #108cffe6;
   --action-disabled: #7587ab;
   --background-primary: #fff;
-  --background-secondary: #f2f9ff;
+  --background-secondary: #fcfeff;
   --background-tertiary: #e4ebfa;
   --background-tertiary-hover: #e4ebfae6;
   --color-error: #ff6755;