From 6196d1ab96b2cf0e5f1fe3d761cf85c1889448cf Mon Sep 17 00:00:00 2001
From: Oliver Winks <oliver@paperplane.software>
Date: Tue, 5 Jul 2022 17:40:52 +0100
Subject: [PATCH] fixed port number issue

---
 local/package.json                                       | 2 +-
 local/packages/main/flows/udp/udpSink.ts                 | 9 +++++++--
 local/packages/main/remoteWs.ts                          | 5 ++++-
 local/packages/renderer/src/components/ClientTable.vue   | 2 +-
 .../packages/renderer/src/components/ClientTableCell.vue | 2 ++
 5 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/local/package.json b/local/package.json
index b3fb7a0..aa431e4 100644
--- a/local/package.json
+++ b/local/package.json
@@ -1,6 +1,6 @@
 {
   "name": "local",
-  "version": "2.1.1",
+  "version": "2.1.2",
   "main": "dist/main/index.cjs",
   "author": "草鞋没号 <308487730@qq.com>",
   "license": "MIT",
diff --git a/local/packages/main/flows/udp/udpSink.ts b/local/packages/main/flows/udp/udpSink.ts
index 1b3ddb8..cfe3a39 100644
--- a/local/packages/main/flows/udp/udpSink.ts
+++ b/local/packages/main/flows/udp/udpSink.ts
@@ -4,7 +4,12 @@ import { observerToUdp } from "../../rxadapters/rxUdp";
 import { useUdpSocket } from "./useUdpSocket";
 
 const sendingSockets: dgram.Socket[] = [];
-let nextPort = 5000;
+let nextPort = 5001;
+
+export function incPort() {
+  console.log("Hellllooo?");
+  nextPort = nextPort + 1;
+}
 
 export interface UdpSinkOptions {
   name: string;
@@ -50,7 +55,7 @@ export function udpSink(options: UdpSinkOptions): Promise<UdpSink> {
 
   // create a new observer from the socket to observe the source
   const toAddress = options.toAddress ?? "127.0.0.1";
-  const toPort = options.toPort ?? existingSocket ? nextPort : ++nextPort;
+  const toPort = options.toPort ?? nextPort;
   return socket
     .then((socket) => observerToUdp(toAddress, toPort, socket, options.sender, options.debug))
     .then((observer) => {
diff --git a/local/packages/main/remoteWs.ts b/local/packages/main/remoteWs.ts
index 78494fb..5daee9a 100644
--- a/local/packages/main/remoteWs.ts
+++ b/local/packages/main/remoteWs.ts
@@ -8,6 +8,7 @@ import { match } from "ts-pattern";
 import { sources, sinks, connections, connectSink } from "./flows/index";
 import { udpSource, udpSink } from "./flows/udp";
 import { wsSource, wsSink } from "./flows/ws";
+import { incPort } from "./flows/udp/udpSink";
 
 ///////////////////////////////////////////////////////////////////////////////////////////////////
 // Types
@@ -126,6 +127,8 @@ export function newRemoteWs(
 
                 // send message to remote
                 .then((_) => {
+                  incPort();
+
                   /* TODO: Implement this! */
                 })
 
@@ -142,7 +145,7 @@ export function newRemoteWs(
                 sinks.splice(i, 1);
 
                 console.log(`🔌 unsubscribing all flows from ${msg.from}`);
-                const j = connections.findIndex((conn) => conn.from === msg.from);
+                const j = connections.findIndex((conn) => conn.to.endsWith(msg.from));
 
                 if (j >= 0) {
                   connections[j].subscription.unsubscribe();
diff --git a/local/packages/renderer/src/components/ClientTable.vue b/local/packages/renderer/src/components/ClientTable.vue
index 45d90d0..4cfd80c 100644
--- a/local/packages/renderer/src/components/ClientTable.vue
+++ b/local/packages/renderer/src/components/ClientTable.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import type { Ref } from "vue";
+import { Ref, watchEffect } from "vue";
 import type { ClientRole, ClientSummary, ClientSummaryMap } from "../../../../../shared/clients";
 
 import { ipcRenderer } from "electron";
diff --git a/local/packages/renderer/src/components/ClientTableCell.vue b/local/packages/renderer/src/components/ClientTableCell.vue
index 4ec8a7e..3ba2013 100644
--- a/local/packages/renderer/src/components/ClientTableCell.vue
+++ b/local/packages/renderer/src/components/ClientTableCell.vue
@@ -1,5 +1,7 @@
 <script lang="ts" setup>
+import { ref, Ref } from "vue";
 import { MinusIcon, PlusIcon } from "@heroicons/vue/solid";
+import { remoteState } from "../remote";
 
 const props = defineProps({
   sender: {