add connection modal

src/View/Modals/connectionModal.tsx

@@ -0,0 +1,21 @@
+import * as React from "bloatless-react";
+
+import ConnectionViewModel from "../../ViewModel/connectionViewModel";
+import { translations } from "../translations";
+
+export function ConnectionModal(connectionViewModel: ConnectionViewModel) {
+  return (
+    <div
+      class="modal"
+      toggle:open={connectionViewModel.isShowingConnectionModal}
+    >
+      <div>
+        <main></main>
+        <button on:click={connectionViewModel.hideConnectionModal}>
+          {translations.general.closeButton}
+          <span class="icon">close</span>
+        </button>
+      </div>
+    </div>
+  );
+}

src/View/homePage.tsx

@@ -40,6 +40,7 @@ export function HomePage(
         <button
           class="flex justify-center"
           aria-label={translations.homePage.manageConnectionsAudioLabel}
+          on:click={connectionViewModel.showConnectionModal}
         >
           <span class="icon">build</span>
         </button>