Disable suggest if no account selected

fixes #201

components/Accounts.tsx

@@ -512,6 +512,7 @@ const ImportAccountDialog = () => {
           <Input
             name="secret"
             type="password"
+            autoComplete="new-password"
             value={value}
             onChange={(e) => setValue(e.target.value)}
           />

components/Transaction/ui.tsx

@@ -38,22 +38,22 @@ export const TxUI: FC<UIProps> = ({
     txFields,
   } = txState;
 
-  const transactionsOptions = transactionsData.map(tx => ({
+  const transactionsOptions = transactionsData.map((tx) => ({
     value: tx.TransactionType,
     label: tx.TransactionType,
   }));
 
-  const accountOptions: SelectOption[] = accounts.map(acc => ({
+  const accountOptions: SelectOption[] = accounts.map((acc) => ({
     label: acc.name,
     value: acc.address,
   }));
 
   const destAccountOptions: SelectOption[] = accounts
-    .map(acc => ({
+    .map((acc) => ({
       label: acc.name,
       value: acc.address,
     }))
-    .filter(acc => acc.value !== selectedAccount?.value);
+    .filter((acc) => acc.value !== selectedAccount?.value);
 
   const [feeLoading, setFeeLoading] = useState(false);
 
@@ -108,15 +108,15 @@ export const TxUI: FC<UIProps> = ({
   const specialFields = ["TransactionType", "Account", "Destination"];
 
   const otherFields = Object.keys(txFields).filter(
-    k => !specialFields.includes(k)
+    (k) => !specialFields.includes(k)
   ) as [keyof TxFields];
 
   const switchToJson = () =>
     setState({ editorSavedValue: null, viewType: "json" });
-  
+
   useEffect(() => {
     const defaultOption = transactionsOptions.find(
-      tt => tt.value === "Payment"
+      (tt) => tt.value === "Payment"
     );
     if (defaultOption) {
       handleChangeTxType(defaultOption);
@@ -204,7 +204,7 @@ export const TxUI: FC<UIProps> = ({
             />
           </Flex>
         )}
-        {otherFields.map(field => {
+        {otherFields.map((field) => {
           let _value = txFields[field];
 
           let value: string | undefined;
@@ -253,13 +253,39 @@ export const TxUI: FC<UIProps> = ({
                   />
                 ) : (
                   <Input
+                    type={isFee ? "number" : "text"}
                     value={value}
-                    onChange={e => {
-                      handleSetField(field, e.target.value);
+                    onChange={(e) => {
+                      if (isFee) {
+                        const val = e.target.value
+                          .replaceAll(".", "")
+                          .replaceAll(",", "");
+                        handleSetField(field, val);
+                      } else {
+                        handleSetField(field, e.target.value);
+                      }
                     }}
+                    onKeyPress={
+                      isFee
+                        ? (e) => {
+                            if (e.key === "." || e.key === ",") {
+                              e.preventDefault();
+                            }
+                          }
+                        : undefined
+                    }
                     css={{
                       width: "70%",
                       flex: "inherit",
+                      "-moz-appearance": "textfield",
+                      "&::-webkit-outer-spin-button": {
+                        "-webkit-appearance": "none",
+                        margin: 0,
+                      },
+                      "&::-webkit-inner-spin-button ": {
+                        "-webkit-appearance": "none",
+                        margin: 0,
+                      },
                     }}
                   />
                 )}
@@ -268,6 +294,8 @@ export const TxUI: FC<UIProps> = ({
                     size="xs"
                     variant="primary"
                     outline
+                    disabled={txState.txIsDisabled}
+                    isDisabled={txState.txIsDisabled}
                     isLoading={feeLoading}
                     css={{
                       position: "absolute",

pages/test/[[...slug]].tsx

@@ -32,14 +32,20 @@ const Test = () => {
   if (!showComponent) {
     return null;
   }
-  const hasScripts =
-    snap.files.filter((f) => f.name.endsWith(".js")).length > 0;
+  const hasScripts = Boolean(
+    snap.files.filter((f) => f.name.toLowerCase()?.endsWith(".js")).length
+  );
+
   return (
     <Container css={{ px: 0 }}>
       <Split
         direction="vertical"
         sizes={
-          getSplit("testVertical") || (hasScripts ? [50, 20, 30] : [50, 50])
+          hasScripts && getSplit("testVertical")?.length === 2
+            ? [50, 20, 30]
+            : hasScripts
+            ? [50, 20, 50]
+            : [50, 50]
         }
         gutterSize={4}
         gutterAlign="center"
@@ -95,7 +101,7 @@ const Test = () => {
             </Box>
           </Split>
         </Flex>
-        {hasScripts && (
+        {hasScripts ? (
           <Flex
             as="div"
             css={{
@@ -110,7 +116,7 @@ const Test = () => {
               clearLog={() => (state.scriptLogs = [])}
             />
           </Flex>
-        )}
+        ) : null}
         <Flex>
           <Split
             direction="horizontal"