From 417ec9fcd288bff407354facd74d13f592df870e Mon Sep 17 00:00:00 2001
From: Jan Prochazka <jan.prochazka@gmail.com>
Date: Sat, 13 Feb 2021 19:56:04 +0100
Subject: [PATCH] connection modal style

---
 packages/web/src/modals/ConnectionModal.js | 26 +++++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/packages/web/src/modals/ConnectionModal.js b/packages/web/src/modals/ConnectionModal.js
index 1f9e9fbfe..f42b4917d 100644
--- a/packages/web/src/modals/ConnectionModal.js
+++ b/packages/web/src/modals/ConnectionModal.js
@@ -135,7 +135,7 @@ function DriverFields({ extensions }) {
 
 function SshTunnelFields() {
   const { values, setFieldValue } = useForm();
-  const { useSshTunnel, sshMode, sshKeyfile } = values;
+  const { useSshTunnel, sshMode, sshPort, sshKeyfile } = values;
   const platformInfo = usePlatformInfo();
   const electron = getElectron();
 
@@ -143,6 +143,9 @@ function SshTunnelFields() {
     if (useSshTunnel && !sshMode) {
       setFieldValue('sshMode', 'userPassword');
     }
+    if (useSshTunnel && !sshPort) {
+      setFieldValue('sshPort', '22');
+    }
     if (useSshTunnel && sshMode == 'keyFile' && !sshKeyfile) {
       setFieldValue('sshKeyfile', platformInfo.defaultKeyFile);
     }
@@ -170,9 +173,26 @@ function SshTunnelFields() {
         {!!electron && <option value="keyFile">Key file</option>}
       </FormSelectField>
 
-      <FormTextField label="Login" name="sshLogin" disabled={!useSshTunnel} />
+      {sshMode != 'userPassword' && <FormTextField label="Login" name="sshLogin" disabled={!useSshTunnel} />}
 
-      {sshMode == 'userPassword' && <FormPasswordField label="Password" name="sshPassword" disabled={!useSshTunnel} />}
+      {sshMode == 'userPassword' && (
+        <FormRowLarge>
+          <FlexCol6
+            //@ts-ignore
+            marginRight={5}
+          >
+            <FormTextField label="Login" name="sshLogin" disabled={!useSshTunnel} templateProps={{ noMargin: true }} />
+          </FlexCol6>
+          <FlexCol6>
+            <FormPasswordField
+              label="Password"
+              name="sshPassword"
+              disabled={!useSshTunnel}
+              templateProps={{ noMargin: true }}
+            />
+          </FlexCol6>
+        </FormRowLarge>
+      )}
 
       {sshMode == 'keyFile' && (
         <FormRowLarge>