web: New connection fixes

web/components/pageComponents/ConnectionsPage/ExistingConnections/index.module.css

@@ -17,3 +17,11 @@
 .err {
   @apply text-center;
 }
+
+.newConnection {
+  @apply flex items-center px-4;
+
+  svg {
+    @apply mr-2;
+  }
+}

web/components/pageComponents/ConnectionsPage/ExistingConnections/index.tsx

@@ -5,6 +5,7 @@ import {
   StoredConnectionsDocument,
   useRemoveConnectionMutation,
 } from "@gen/graphql-types";
+import { AiOutlinePlus } from "@react-icons/all-files/ai/AiOutlinePlus";
 import { useState } from "react";
 import Item from "./Item";
 import css from "./index.module.css";
@@ -52,8 +53,11 @@ export default function ExistingConnections(props: Props) {
             " connection?
           </p>
         </DeleteModal>
-        <Button onClick={() => props.setShowForm(true)}>
-          Add new connection
+        <Button
+          onClick={() => props.setShowForm(true)}
+          className={css.newConnection}
+        >
+          <AiOutlinePlus /> New connection
         </Button>
       </div>
     </div>

web/components/pageComponents/ConnectionsPage/NewConnection/index.tsx

@@ -17,6 +17,8 @@ export default function NewConnection(props: Props) {
   const { onSubmit, state, setState, error, clearState } = useConfig();
   const canSubmit =
     state.name && (state.connectionUrl || (state.host && state.username));
+  const isDocker = location.origin === "http://localhost:3000";
+  console.log(location);
 
   const onCancel = props.canGoBack
     ? () => {
@@ -51,7 +53,7 @@ export default function NewConnection(props: Props) {
             label="Host"
             value={state.host}
             onChangeString={h => setState({ host: h })}
-            placeholder="127.0.0.1"
+            placeholder={isDocker ? "host.docker.internal" : "127.0.0.1"}
             horizontal
           />
           <FormInput

web/lib/errors/helpers.ts

@@ -31,6 +31,8 @@ export function improveErrorMsg(message: string): string {
   switch (message) {
     case "":
       return "Error message empty";
+    case "Server does not support secure connnection":
+      return "Server does not support secure connection. See advanced settings to disable SSL.";
     default:
       return message;
   }