From 0c441e771c21080947ca3e01d5c8c96336503d3c Mon Sep 17 00:00:00 2001
From: WolverinDEV <git@did.science>
Date: Sat, 26 Sep 2020 01:31:29 +0200
Subject: [PATCH] Updating empty/unset icons when connecting to the target
 server

---
 shared/js/file/LocalIcons.ts         | 46 +++++++++++++++++++++++++++-
 shared/js/ui/react-elements/Icon.tsx |  2 +-
 2 files changed, 46 insertions(+), 2 deletions(-)

diff --git a/shared/js/file/LocalIcons.ts b/shared/js/file/LocalIcons.ts
index 59b783d7..48b83f93 100644
--- a/shared/js/file/LocalIcons.ts
+++ b/shared/js/file/LocalIcons.ts
@@ -5,7 +5,7 @@ import {AbstractIconManager, RemoteIcon, RemoteIconState, setIconManager} from "
 import * as log from "tc-shared/log";
 import {LogCategory, logDebug, logError, logWarn} from "tc-shared/log";
 import {server_connections} from "tc-shared/ConnectionManager";
-import {ConnectionHandler} from "tc-shared/ConnectionHandler";
+import {ConnectionEvents, ConnectionHandler, ConnectionState} from "tc-shared/ConnectionHandler";
 import {FileTransferState, ResponseTransferTarget, TransferProvider, TransferTargetType} from "tc-shared/file/Transfer";
 import {tr} from "tc-shared/i18n/localize";
 import {CommandResult} from "tc-shared/connection/ServerConnectionDeclaration";
@@ -54,11 +54,51 @@ class LocalRemoteIcon extends RemoteIcon {
 export let localIconCache: ImageCache;
 class IconManager extends AbstractIconManager {
     private cachedIcons: {[key: string]: LocalRemoteIcon} = {};
+    private connectionStateChangeListener: {[key: string]: (handlerId: string, event: ConnectionEvents["notify_connection_state_changed"]) => void} = {};
 
     private static iconUniqueKey(iconId: number, serverUniqueId: string) : string {
         return "v2-" + serverUniqueId + "-" + iconId;
     }
 
+    constructor() {
+        super();
+
+        server_connections.events().on("notify_handler_created", event => {
+            this.connectionStateChangeListener[event.handlerId] = this.handleHandlerStateChange.bind(this, event.handlerId);
+            event.handler.events().on("notify_connection_state_changed", this.connectionStateChangeListener[event.handlerId] as any);
+        });
+
+        server_connections.events().on("notify_handler_deleted", event => {
+             if(this.connectionStateChangeListener[event.handlerId]) {
+                 event.handler.events().off("notify_connection_state_changed", this.connectionStateChangeListener[event.handlerId] as any);
+                 delete this.connectionStateChangeListener[event.handlerId];
+             }
+        });
+    }
+
+    private handleHandlerStateChange(handlerId: string, event: ConnectionEvents["notify_connection_state_changed"]) {
+        const connection = server_connections.findConnection(handlerId);
+        if(!connection) {
+            logWarn(LogCategory.CLIENT, tr("Received handler state changed event for invalid handler id %s"), handlerId);
+            return;
+        }
+
+        if(event.new_state !== ConnectionState.CONNECTED) {
+            return;
+        }
+
+        /* update all empty icons */
+        Object.values(this.cachedIcons).forEach((icon: LocalRemoteIcon) => {
+            if(icon.serverUniqueId !== connection.getCurrentServerUniqueId()) {
+                return;
+            }
+
+            if(icon.getState() === "empty") {
+                this.wrapIconDownload(icon, connection, IconManager.iconUniqueKey(icon.iconId, icon.serverUniqueId)).then(() => {});
+            }
+        });
+    }
+
     resolveIcon(iconId: number, serverUniqueId: string, handlerIdHint: string): RemoteIcon {
         /* just to ensure */
         iconId = iconId >>> 0;
@@ -146,6 +186,10 @@ class IconManager extends AbstractIconManager {
             handler = connections[0];
         }
 
+        await this.wrapIconDownload(icon, handler, iconUniqueId);
+    }
+
+    private async wrapIconDownload(icon: LocalRemoteIcon, handler: ConnectionHandler, iconUniqueId: string) {
         try {
             await this.downloadIcon(icon, handler, iconUniqueId);
         } catch (error) {
diff --git a/shared/js/ui/react-elements/Icon.tsx b/shared/js/ui/react-elements/Icon.tsx
index 799e4508..6d587bb5 100644
--- a/shared/js/ui/react-elements/Icon.tsx
+++ b/shared/js/ui/react-elements/Icon.tsx
@@ -35,7 +35,7 @@ export const RemoteIconRenderer = (props: { icon: RemoteIcon, className?: string
                 return <div key={"loaded"} className={"icon_em client-group_" + props.icon.iconId + " " + props.className} title={props.title} />;
             }
             return (
-                <div key={"icon"} className={"icon-container " + props.className} x-debug-version={2}>
+                <div key={"icon-" + props.icon.iconId} className={"icon-container " + props.className} x-debug-version={2}>
                     <img style={{ maxWidth: "100%", maxHeight: "100%" }} src={props.icon.getImageUrl()} alt={props.title || ("icon " + props.icon.iconId)} draggable={false} />
                 </div>
             );