From 3958fb29b4a9c7c01382677d35655b21aefd7376 Mon Sep 17 00:00:00 2001
From: WolverinDEV <git@did.science>
Date: Fri, 22 Jan 2021 14:45:23 +0100
Subject: [PATCH] Adjusted the connect modal to be optionally popoutable

---
 shared/js/ui/modal/connect/Controller.ts  | 10 +++++-----
 shared/js/ui/modal/connect/Definitions.ts |  2 +-
 shared/js/ui/modal/connect/Renderer.tsx   | 19 +++++++++----------
 3 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/shared/js/ui/modal/connect/Controller.ts b/shared/js/ui/modal/connect/Controller.ts
index aafc49a4..ed5c8a82 100644
--- a/shared/js/ui/modal/connect/Controller.ts
+++ b/shared/js/ui/modal/connect/Controller.ts
@@ -4,7 +4,6 @@ import {
     ConnectUiVariables,
 } from "tc-shared/ui/modal/connect/Definitions";
 import {spawnReactModal} from "tc-shared/ui/react-elements/Modal";
-import {ConnectModal} from "tc-shared/ui/modal/connect/Renderer";
 import {LogCategory, logError, logWarn} from "tc-shared/log";
 import {
     availableConnectProfiles,
@@ -21,8 +20,9 @@ import {parseServerAddress} from "tc-shared/tree/Server";
 import {spawnSettingsModal} from "tc-shared/ui/modal/ModalSettings";
 import * as ipRegex from "ip-regex";
 import {UiVariableProvider} from "tc-shared/ui/utils/Variable";
-import {createLocalUiVariables} from "tc-shared/ui/utils/LocalVariable";
 import {createIpcUiVariableProvider} from "tc-shared/ui/utils/IpcVariable";
+import {spawnExternalModal} from "tc-shared/ui/react-elements/external-modal";
+import ConnectModal = require("tc-shared/ui/modal/connect/Renderer");
 
 const kRegexDomain = /^(localhost|((([a-zA-Z0-9_-]{0,63}\.){0,253})?[a-zA-Z0-9_-]{0,63}\.[a-zA-Z]{2,64}))$/i;
 
@@ -356,10 +356,10 @@ export function spawnConnectModalNew(options: ConnectModalOptions) {
         controller.setSelectedProfile(options.selectedProfile);
     }
 
-    const modal = spawnReactModal(ConnectModal, controller.uiEvents, variableProvider.generateConsumerDescription(), options.connectInANewTab || false);
+    const modal = spawnReactModal(ConnectModal, controller.uiEvents.generateIpcDescription(), variableProvider.generateConsumerDescription(), options.connectInANewTab || false);
+    //const modal = spawnExternalModal("modal-connect", [controller.uiEvents.generateIpcDescription(), variableProvider.generateConsumerDescription(), options.connectInANewTab || false]);
     modal.show();
-
-    modal.events.one("destroy", () => {
+    modal.getEvents().one("destroy", () => {
         controller.destroy();
     });
 
diff --git a/shared/js/ui/modal/connect/Definitions.ts b/shared/js/ui/modal/connect/Definitions.ts
index c969a454..41907faa 100644
--- a/shared/js/ui/modal/connect/Definitions.ts
+++ b/shared/js/ui/modal/connect/Definitions.ts
@@ -1,6 +1,6 @@
-import {kUnknownHistoryServerUniqueId} from "tc-shared/connectionlog/History";
 import {RemoteIconInfo} from "tc-shared/file/Icons";
 
+export const kUnknownHistoryServerUniqueId = "unknown";
 export type ConnectProfileEntry = {
     id: string,
     name: string,
diff --git a/shared/js/ui/modal/connect/Renderer.tsx b/shared/js/ui/modal/connect/Renderer.tsx
index 2083a711..0eac8c5e 100644
--- a/shared/js/ui/modal/connect/Renderer.tsx
+++ b/shared/js/ui/modal/connect/Renderer.tsx
@@ -1,16 +1,14 @@
 import {
     ConnectHistoryEntry,
-    ConnectUiEvents, ConnectUiVariables,
+    ConnectUiEvents, ConnectUiVariables, kUnknownHistoryServerUniqueId,
 } from "tc-shared/ui/modal/connect/Definitions";
 import * as React from "react";
 import {useContext} from "react";
-import {Registry} from "tc-shared/events";
-import {InternalModal} from "tc-shared/ui/react-elements/internal-modal/Controller";
-import {Translatable} from "tc-shared/ui/react-elements/i18n";
-import {ControlledFlatInputField, ControlledSelect, FlatInputField} from "tc-shared/ui/react-elements/InputField";
+import {IpcRegistryDescription, Registry} from "tc-shared/events";
 import {joinClassList, useTr} from "tc-shared/ui/react-elements/Helper";
+import {Translatable} from "tc-shared/ui/react-elements/i18n";
 import {Button} from "tc-shared/ui/react-elements/Button";
-import {kUnknownHistoryServerUniqueId} from "tc-shared/connectionlog/History";
+import {ControlledFlatInputField, ControlledSelect, FlatInputField} from "tc-shared/ui/react-elements/InputField";
 import {ClientIconRenderer} from "tc-shared/ui/react-elements/Icons";
 import {ClientIcon} from "svg-sprites/client-icons";
 import * as i18n from "../../../i18n/country";
@@ -385,16 +383,16 @@ const HistoryContainer = () => {
     )
 }
 
-export class ConnectModal extends AbstractModal {
+class ConnectModal extends AbstractModal {
     private readonly events: Registry<ConnectUiEvents>;
     private readonly variables: UiVariableConsumer<ConnectUiVariables>;
     private readonly connectNewTabByDefault: boolean;
 
-    constructor(events: Registry<ConnectUiEvents>, variables: IpcVariableDescriptor<ConnectUiVariables>, connectNewTabByDefault: boolean) {
+    constructor(events: IpcRegistryDescription<ConnectUiEvents>, variables: IpcVariableDescriptor<ConnectUiVariables>, connectNewTabByDefault: boolean) {
         super();
 
         this.variables = createIpcUiVariableConsumer(variables);
-        this.events = events;
+        this.events = Registry.fromIpcDescription(events);
         this.connectNewTabByDefault = connectNewTabByDefault;
     }
 
@@ -431,4 +429,5 @@ export class ConnectModal extends AbstractModal {
     verticalAlignment(): "top" | "center" | "bottom" {
         return "top";
     }
-}
\ No newline at end of file
+}
+export = ConnectModal;
\ No newline at end of file