From c25a4b2312e81ad2cb4ca67c608173c2c2c5d5e4 Mon Sep 17 00:00:00 2001
From: Jean Ribeiro <contact@jeanribeiro.dev>
Date: Sat, 31 Dec 2022 11:57:27 -0300
Subject: [PATCH] enhancement: wraps manage voting power popup in a form

---
 .../popups/ManageVotingPowerPopup.svelte      | 50 ++++++++++---------
 1 file changed, 26 insertions(+), 24 deletions(-)

diff --git a/packages/shared/components/popups/ManageVotingPowerPopup.svelte b/packages/shared/components/popups/ManageVotingPowerPopup.svelte
index 470af50f47f..b50fae43e8e 100644
--- a/packages/shared/components/popups/ManageVotingPowerPopup.svelte
+++ b/packages/shared/components/popups/ManageVotingPowerPopup.svelte
@@ -1,6 +1,6 @@
 <script lang="typescript">
-    import { TextType } from 'shared/components/enums'
     import { Button, Text, TextHint, AssetAmountInput } from 'shared/components'
+    import { HTMLButtonType, TextType } from 'shared/components/enums'
     import { selectedAccount } from '@core/account'
     import { handleError } from '@core/error/handlers/handleError'
     import { setVotingPower } from '@contexts/governance/actions'
@@ -21,7 +21,7 @@
         closePopup()
     }
 
-    async function onConfirmClick(): Promise<void> {
+    async function onSubmit(): Promise<void> {
         try {
             await assetAmountInput?.validate()
             await checkActiveProfileAuth(async () => {
@@ -35,25 +35,27 @@
     }
 </script>
 
-<Text type={TextType.h4} classes="mb-3">{localize('popups.manageVotingPower.title')}</Text>
-<Text type={TextType.p} secondary classes="mb-5">{localize('popups.manageVotingPower.body')}</Text>
-<div class="space-y-4 mb-6">
-    <AssetAmountInput
-        bind:this={assetAmountInput}
-        bind:rawAmount
-        {asset}
-        containsSlider
-        disableAssetSelection
-        disabled={isTransferring}
-        {votingPower}
-    />
-    <TextHint info text={localize('popups.manageVotingPower.hint')} />
-</div>
-<div class="flex flex-row flex-nowrap w-full space-x-4">
-    <Button outline classes="w-full" disabled={isTransferring} onClick={onCancelClick}>
-        {localize('actions.cancel')}
-    </Button>
-    <Button classes="w-full" disabled={isTransferring} onClick={onConfirmClick} isBusy={isTransferring}>
-        {localize('actions.confirm')}
-    </Button>
-</div>
+<form id="manage-voting-power" on:submit|preventDefault={onSubmit}>
+    <Text type={TextType.h4} classes="mb-3">{localize('popups.manageVotingPower.title')}</Text>
+    <Text type={TextType.p} secondary classes="mb-5">{localize('popups.manageVotingPower.body')}</Text>
+    <div class="space-y-4 mb-6">
+        <AssetAmountInput
+            bind:this={assetAmountInput}
+            bind:rawAmount
+            {asset}
+            containsSlider
+            disableAssetSelection
+            disabled={isTransferring}
+            {votingPower}
+        />
+        <TextHint info text={localize('popups.manageVotingPower.hint')} />
+    </div>
+    <div class="flex flex-row flex-nowrap w-full space-x-4">
+        <Button outline classes="w-full" disabled={isTransferring} onClick={onCancelClick}>
+            {localize('actions.cancel')}
+        </Button>
+        <Button type={HTMLButtonType.Submit} disabled={isTransferring} isBusy={isTransferring} classes="w-full">
+            {localize('actions.confirm')}
+        </Button>
+    </div>
+</form>