From 8005dd2dc2c9036fcbe61a4b9f87d8c1e6a8c85b Mon Sep 17 00:00:00 2001
From: Rohan Mukherjee <roerohan@gmail.com>
Date: Sat, 19 Feb 2022 22:10:36 +0530
Subject: [PATCH] feat(loading): added custom component that can be displayed
 in place of default loading UI (#23)

* feat(loading): added custom component that can be displayed in place of loading UI

* ci: fixed test job name [skip ci]
---
 .github/workflows/test.yml | 2 +-
 README.md                  | 1 +
 src/lib/VncScreen.tsx      | 7 +++----
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index 36f8dfa..ac503bf 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -4,7 +4,7 @@ on:
     branches:
       - main
 jobs:
-  lint:
+  test:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
diff --git a/README.md b/README.md
index 14284a8..6b76375 100644
--- a/README.md
+++ b/README.md
@@ -148,6 +148,7 @@ interface Props {
   autoConnect?: number; // defaults to true
   retryDuration?: number; // in milliseconds
   debug?: boolean; // show logs in the console
+  loadingUI?: React.ReactNode; // custom component that is displayed when loading
   onConnect?: (rfb?: RFB) => void;
   onDisconnect?: (rfb?: RFB) => void;
   onCredentialsRequired?: (rfb?: RFB) => void;
diff --git a/src/lib/VncScreen.tsx b/src/lib/VncScreen.tsx
index ad21058..6ee2a33 100644
--- a/src/lib/VncScreen.tsx
+++ b/src/lib/VncScreen.tsx
@@ -24,6 +24,7 @@ export interface Props {
     autoConnect?: boolean;
     retryDuration?: number;
     debug?: boolean;
+    loadingUI?: React.ReactNode;
     onConnect?: (rfb?: RFB) => void;
     onDisconnect?: (rfb?: RFB) => void;
     onCredentialsRequired?: (rfb?: RFB) => void;
@@ -60,6 +61,7 @@ const VncScreen: React.ForwardRefRenderFunction<VncScreenHandle, Props> = (props
         autoConnect = true,
         retryDuration = 3000,
         debug = false,
+        loadingUI,
         onConnect,
         onDisconnect,
         onCredentialsRequired,
@@ -109,7 +111,6 @@ const VncScreen: React.ForwardRefRenderFunction<VncScreenHandle, Props> = (props
         }
 
         const connected = getConnected();
-        console.log('onDisconnect: connected', connected);
         if (connected) {
             logger.info(`Unexpectedly disconnected from remote VNC, retrying in ${retryDuration / 1000} seconds.`);
 
@@ -169,7 +170,6 @@ const VncScreen: React.ForwardRefRenderFunction<VncScreenHandle, Props> = (props
 
     const connect = () => {
         try {
-            console.log('connected', connected);
             if (connected && !!rfb) {
                 disconnect();
             }
@@ -202,7 +202,6 @@ const VncScreen: React.ForwardRefRenderFunction<VncScreenHandle, Props> = (props
 
             _rfb.addEventListener('desktopname', _onDesktopName);
 
-            console.log('Setting connected to true again');
             setConnected(true);
         } catch (err) {
             logger.error(err);
@@ -257,7 +256,7 @@ const VncScreen: React.ForwardRefRenderFunction<VncScreenHandle, Props> = (props
                 onMouseEnter={handleMouseEnter}
                 onMouseLeave={handleMouseLeave}
             />
-            {loading && <div className="text-white loading">Loading...</div>}
+            {loading && (loadingUI ?? <div className="text-white loading">Loading...</div>)}
         </>
     );
 }