From 2b5e6c4e0643dd063e04c18f3598f0ab5d17a597 Mon Sep 17 00:00:00 2001
From: Aniket-Engg <aniketengg.225@gmail.com>
Date: Thu, 27 Apr 2023 12:10:13 +0530
Subject: [PATCH] tooltip and block buttons

---
 .../src/app/components/SubmitButton.tsx       | 48 +++++++++++--------
 apps/etherscan/src/app/views/VerifyView.tsx   |  4 +-
 2 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/apps/etherscan/src/app/components/SubmitButton.tsx b/apps/etherscan/src/app/components/SubmitButton.tsx
index 007fff399c..ed7ff51877 100644
--- a/apps/etherscan/src/app/components/SubmitButton.tsx
+++ b/apps/etherscan/src/app/components/SubmitButton.tsx
@@ -1,4 +1,5 @@
 import React from "react"
+import { CustomTooltip } from '@remix-ui/helper'
 
 interface Props {
   text: string
@@ -14,26 +15,33 @@ export const SubmitButton: React.FC<Props> = ({
   disable = true
 }) => {
   return (
-    <button
-      data-id={dataId}
-      style={{ padding: "0.25rem 0.4rem", marginRight: "0.5em" }}
-      type="submit"
-      className="btn btn-primary"
-      disabled={disable}
+    <CustomTooltip
+      tooltipText={disable ? "Fill the fields with valid values" : "Click to proceed"}
+      tooltipId='etherscan-submit-button'
+      placement='bottom'
     >
-      {!isSubmitting && text}
-
-      {isSubmitting && (
-        <div>
-          <span
-            className="spinner-border spinner-border-sm"
-            role="status"
-            aria-hidden="true"
-            style={{ marginRight: "0.3em" }}
-          />
-          Verifying... Please wait
-        </div>
-      )}
-    </button>
+      <div>
+        <button
+          data-id={dataId}
+          style={{ padding: "0.25rem 0.4rem", marginRight: "0.5em", pointerEvents: 'none' }}
+          type="submit"
+          className="btn btn-primary btn-block text-decoration-none"
+          disabled={disable}
+        >
+          {!isSubmitting && text}
+          {isSubmitting && (
+            <div>
+              <span
+                className="spinner-border spinner-border-sm"
+                role="status"
+                aria-hidden="true"
+                style={{ marginRight: "0.3em" }}
+              />
+              Verifying... Please wait
+            </div>
+          )}
+        </button>
+      </div>
+    </CustomTooltip>
   )
 }
diff --git a/apps/etherscan/src/app/views/VerifyView.tsx b/apps/etherscan/src/app/views/VerifyView.tsx
index 1ead43f0e7..31947b107f 100644
--- a/apps/etherscan/src/app/views/VerifyView.tsx
+++ b/apps/etherscan/src/app/views/VerifyView.tsx
@@ -189,7 +189,7 @@ export const VerifyView: React.FC<Props> = ({
               ? true 
               : false}
             />
-            <br/><br/>
+            <br/>
             <CustomTooltip
               tooltipText='Generate the required TS scripts to verify a contract on Etherscan'
               tooltipId='etherscan-generate-scripts'
@@ -198,7 +198,7 @@ export const VerifyView: React.FC<Props> = ({
               <button
                 type="button"
                 style={{ padding: "0.25rem 0.4rem", marginRight: "0.5em", marginBottom: "0.5em"}}
-                className="btn btn-secondary"
+                className="btn btn-secondary btn-block"
                 onClick={async () => {
                   if (!await client.call('fileManager', 'exists' as any, 'scripts/etherscan/receiptStatus.ts')) {
                     await client.call('fileManager', 'writeFile', 'scripts/etherscan/receiptStatus.ts', receiptGuidScript)