From 29826db81b841104b49fc039cecfc95b441e8673 Mon Sep 17 00:00:00 2001
From: Thierry Goettelmann <thierry@byscripts.info>
Date: Tue, 11 Oct 2022 15:54:19 +0200
Subject: [PATCH] fix(lite): fix build errors (#6448)

---
 @xen-orchestra/lite/package.json              |   1 -
 .../lite/src/components/AppTooltips.vue       |   2 +-
 .../lite/src/components/CollectionTable.vue   |   3 +-
 .../lite/src/components/RemoteConsole.vue     |   3 +-
 .../src/components/infra/InfraPoolList.vue    |   7 +-
 .../lite/src/components/pool/PoolHeader.vue   |   4 +-
 .../lite/src/stores/tooltip.store.ts          |   7 +-
 @xen-orchestra/lite/src/types/novnc.d.ts      | 345 ++++++++++++++++++
 yarn.lock                                     |   5 -
 9 files changed, 362 insertions(+), 15 deletions(-)
 create mode 100644 @xen-orchestra/lite/src/types/novnc.d.ts

diff --git a/@xen-orchestra/lite/package.json b/@xen-orchestra/lite/package.json
index 4a177b611..62326203c 100644
--- a/@xen-orchestra/lite/package.json
+++ b/@xen-orchestra/lite/package.json
@@ -42,7 +42,6 @@
     "@rushstack/eslint-patch": "^1.1.0",
     "@trivago/prettier-plugin-sort-imports": "^3.2.0",
     "@types/node": "^16.11.41",
-    "@types/novnc__novnc": "^1.3.0",
     "@vitejs/plugin-vue": "^2.3.3",
     "@vue/eslint-config-prettier": "^7.0.0",
     "@vue/eslint-config-typescript": "^11.0.0",
diff --git a/@xen-orchestra/lite/src/components/AppTooltips.vue b/@xen-orchestra/lite/src/components/AppTooltips.vue
index 6059ce2aa..f19761de3 100644
--- a/@xen-orchestra/lite/src/components/AppTooltips.vue
+++ b/@xen-orchestra/lite/src/components/AppTooltips.vue
@@ -1,7 +1,7 @@
 <template>
   <AppTooltip
     v-for="tooltip in tooltips"
-    :key="tooltip.target"
+    :key="tooltip.key"
     :options="tooltip.options"
     :target="tooltip.target"
   />
diff --git a/@xen-orchestra/lite/src/components/CollectionTable.vue b/@xen-orchestra/lite/src/components/CollectionTable.vue
index 58a1ee302..77001d911 100644
--- a/@xen-orchestra/lite/src/components/CollectionTable.vue
+++ b/@xen-orchestra/lite/src/components/CollectionTable.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="filter-and-sort">
     <CollectionFilter
-      v-if="availableFilters"
+      v-if="availableFilters !== undefined"
       :active-filters="filters"
       :available-filters="availableFilters"
       @add-filter="addFilter"
@@ -9,6 +9,7 @@
     />
 
     <CollectionSorter
+      v-if="availableSorts !== undefined"
       :active-sorts="sorts"
       :available-sorts="availableSorts"
       @add-sort="addSort"
diff --git a/@xen-orchestra/lite/src/components/RemoteConsole.vue b/@xen-orchestra/lite/src/components/RemoteConsole.vue
index b403ec0c4..350399ccb 100644
--- a/@xen-orchestra/lite/src/components/RemoteConsole.vue
+++ b/@xen-orchestra/lite/src/components/RemoteConsole.vue
@@ -20,7 +20,7 @@ watchEffect(() => {
     return;
   }
 
-  if (vncClient) {
+  if (vncClient !== undefined) {
     vncClient.disconnect();
     vncClient = undefined;
   }
@@ -38,6 +38,7 @@ watchEffect(() => {
 
 onBeforeUnmount(() => {
   vncClient?.disconnect();
+  vncClient = undefined;
 });
 </script>
 
diff --git a/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue b/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue
index e39fda36d..3b8be261b 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue
@@ -1,13 +1,16 @@
 <template>
   <ul class="infra-pool-list">
-    <InfraLoadingItem v-if="!isReady" :icon="faBuilding" />
+    <InfraLoadingItem
+      v-if="!isReady || pool === undefined"
+      :icon="faBuilding"
+    />
     <li v-else class="infra-pool-item">
       <InfraItemLabel
         :icon="faBuilding"
         :route="{ name: 'pool.dashboard', params: { uuid: pool.uuid } }"
         active
       >
-        {{ pool.name_label || '(Pool)' }}
+        {{ pool.name_label || "(Pool)" }}
       </InfraItemLabel>
 
       <InfraHostList />
diff --git a/@xen-orchestra/lite/src/components/pool/PoolHeader.vue b/@xen-orchestra/lite/src/components/pool/PoolHeader.vue
index 2f578354d..346405f9b 100644
--- a/@xen-orchestra/lite/src/components/pool/PoolHeader.vue
+++ b/@xen-orchestra/lite/src/components/pool/PoolHeader.vue
@@ -11,7 +11,5 @@ import TitleBar from "@/components/TitleBar.vue";
 import { usePoolStore } from "@/stores/pool.store";
 
 const poolStore = usePoolStore();
-const name = computed(() =>
-  poolStore.isReady ? poolStore.pool.name_label : "..."
-);
+const name = computed(() => poolStore.pool?.name_label ?? "...");
 </script>
diff --git a/@xen-orchestra/lite/src/stores/tooltip.store.ts b/@xen-orchestra/lite/src/stores/tooltip.store.ts
index 1a3df7da5..e183de8c6 100644
--- a/@xen-orchestra/lite/src/stores/tooltip.store.ts
+++ b/@xen-orchestra/lite/src/stores/tooltip.store.ts
@@ -1,3 +1,4 @@
+import { uniqueId } from "lodash-es";
 import { defineStore } from "pinia";
 import type { Options } from "placement.js";
 import { type EffectScope, computed, effectScope, ref } from "vue";
@@ -17,6 +18,7 @@ export const useTooltipStore = defineStore("tooltip", () => {
   const targetsScopes = new WeakMap<HTMLElement, EffectScope>();
   const targets = ref(new Set<HTMLElement>());
   const targetsOptions = ref(new Map<HTMLElement, TooltipOptions>());
+  const targetsIds = ref(new Map<HTMLElement, string>());
 
   const register = (
     target: HTMLElement,
@@ -27,6 +29,7 @@ export const useTooltipStore = defineStore("tooltip", () => {
 
     targetsScopes.set(target, scope);
     targetsOptions.value.set(target, options);
+    targetsIds.value.set(target, uniqueId("tooltip-"));
 
     scope.run(() => {
       useEventListener(target, events.on, () => {
@@ -55,6 +58,7 @@ export const useTooltipStore = defineStore("tooltip", () => {
     targetsOptions.value.delete(target);
     targetsScopes.get(target)?.stop();
     targetsScopes.delete(target);
+    targetsIds.value.delete(target);
   };
 
   return {
@@ -65,7 +69,8 @@ export const useTooltipStore = defineStore("tooltip", () => {
       return Array.from(targets.value.values()).map((target) => {
         return {
           target,
-          options: targetsOptions.value.get(target),
+          options: targetsOptions.value.get(target)!,
+          key: targetsIds.value.get(target)!,
         };
       });
     }),
diff --git a/@xen-orchestra/lite/src/types/novnc.d.ts b/@xen-orchestra/lite/src/types/novnc.d.ts
new file mode 100644
index 000000000..378e83e28
--- /dev/null
+++ b/@xen-orchestra/lite/src/types/novnc.d.ts
@@ -0,0 +1,345 @@
+// Type definitions for @novnc/novnc 1.3
+// Project: https://github.com/novnc/noVNC
+// Definitions by: Jake Jarvis <https://github.com/jakejarvis>
+//                 Maksim Ovcharik <https://github.com/ovcharik>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+
+declare module "@novnc/novnc/core/rfb" {
+  /**
+   * An `object` specifying the credentials to provide to the server when authenticating.
+   */
+  interface NoVncCredentials {
+    /** The user that authenticates */
+    username: string;
+    /** Password for the user */
+    password: string;
+    /** Target machine or session */
+    target: string;
+  }
+
+  /**
+   * An `object` specifying extra details about how the connection should be made.
+   */
+  interface NoVncOptions {
+    /**
+     * A `boolean` indicating if the remote server should be shared or if any other connected
+     * clients should be disconnected. Enabled by default.
+     */
+    shared?: boolean;
+    /**
+     * An `object` specifying the credentials to provide to the server when authenticating.
+     */
+    credentials?: NoVncCredentials;
+    /**
+     * A `string` specifying the ID to provide to any VNC repeater encountered.
+     */
+    repeaterID?: string;
+    /**
+     * An `Array` of `string`s specifying the sub-protocols to use in the WebSocket connection.
+     * Empty by default.
+     */
+    wsProtocols?: string[];
+  }
+
+  interface NoVncEvents {
+    /**
+     * The `connect` event is fired after all the handshaking with the server is completed and the
+     * connection is fully established. After this event the `NoVncClient` object is ready to
+     * receive graphics updates and to send input.
+     */
+    connect: CustomEvent<Record<string, never>>;
+
+    /**
+     * The `disconnect` event is fired when the connection has been terminated. The `detail`
+     * property is an `object` that contains the property `clean`. `clean` is a `boolean` indicating
+     * if the termination was clean or not. In the event of an unexpected termination or an error
+     * `clean` will be set to false.
+     */
+    disconnect: CustomEvent<{ clean: boolean }>;
+
+    /**
+     * The `credentialsrequired` event is fired when the server requests more credentials than were
+     * specified to {@link NoVncClient}. The `detail` property is an `object` containing the
+     * property `types` which is an `Array` of `string` listing the credentials that are required.
+     */
+    credentialsrequired: CustomEvent<{ types: Array<keyof NoVncCredentials> }>;
+
+    /**
+     * The `securityfailure` event is fired when the handshaking process with the server fails
+     * during the security negotiation step. The `detail` property is an `object` containing the
+     * following properties:
+     *
+     * | Property | Type        | Description
+     * | -------- | ----------- | -----------
+     * | `status` | `number`    | The failure status code
+     * | `reason` | `string`    | The **optional** reason for the failure
+     *
+     * The property `status` corresponds to the
+     * [SecurityResult](https://github.com/rfbproto/rfbproto/blob/master/rfbproto.rst#securityresult)
+     * status code in cases of failure. A status of zero will not be sent in this event since that
+     * indicates a successful security handshaking process. The optional property `reason` is
+     * provided by the server and thus the language of the string is not known. However most servers
+     * will probably send English strings. The server can choose to not send a reason and in these
+     * cases the `reason` property will be omitted.
+     */
+    securityfailure: CustomEvent<{ status: number; reason?: string }>;
+
+    /**
+     * The `clipboard` event is fired when the server has sent clipboard data. The `detail` property
+     * is an `object` containing the property `text` which is a `string` with the clipboard data.
+     */
+    clipboard: CustomEvent<{ text: string }>;
+
+    /**
+     * The `bell` event is fired when the server has requested an audible bell.
+     */
+    bell: CustomEvent<Record<string, never>>;
+
+    /**
+     * The `desktopname` event is fired when the name of the remote desktop changes. The `detail`
+     * property is an `object` with the property `name` which is a `string` specifying the new name.
+     */
+    desktopname: CustomEvent<{ name: string }>;
+
+    /**
+     * The `capabilities` event is fired whenever an entry is added or removed from `capabilities`.
+     * The `detail` property is an `object` with the property `capabilities` containing the new
+     * value of `capabilities`.
+     */
+    capabilities: CustomEvent<{ capabilities: NoVncClient["capabilities"] }>;
+  }
+
+  type NoVncEventType = keyof NoVncEvents;
+  type NoVncEvent = NoVncEvents[NoVncEventType];
+
+  class NoVncEventTarget extends EventTarget {
+    protected _listeners: Map<NoVncEventType, (event: Event) => void>;
+
+    addEventListener<T extends NoVncEventType>(
+      type: T,
+      listener: (event: NoVncEvents[T]) => void
+    ): void;
+    addEventListener(
+      type: string,
+      listener: (event: CustomEvent) => void
+    ): void;
+
+    removeEventListener<T extends NoVncEventType>(
+      type: T,
+      listener: (event: NoVncEvents[T]) => void
+    ): void;
+    removeEventListener(
+      type: string,
+      listener: (event: CustomEvent) => void
+    ): void;
+
+    dispatchEvent(event: NoVncEvent | CustomEvent): boolean;
+  }
+
+  /**
+   * The `NoVncClient` object represents a single connection to a VNC server. It communicates using
+   * a WebSocket that must provide a standard NoVncClient protocol stream.
+   */
+  export default class NoVncClient extends NoVncEventTarget {
+    readonly _target: Element;
+    readonly _url: string | null;
+
+    /**
+     * Returns a new `NoVncClient` object and initiates a new connection to a specified VNC server.
+     *
+     * @param target - A block {@link HTMLElement} that specifies where the `NoVncClient` object
+     * should attach itself. The existing contents of the `HTMLElement` will be untouched, but new
+     * elements will be added during the lifetime of the `NoVncClient` object.
+     * @param url - A `string`, {@link WebSocket}, or {@link RTCDataChannel} specifying the VNC server to connect
+     * to. This must be a valid WebSocket URL.
+     * @param options - An {@link NoVncOptions} specifying extra details about how the connection
+     * should be made.
+     */
+    constructor(
+      target: Element,
+      url: string | WebSocket | RTCDataChannel,
+      options?: NoVncOptions
+    );
+
+    /**
+     * Is a `boolean` indicating if any events (e.g. key presses or mouse movement) should be
+     * prevented from being sent to the server. Disabled by default.
+     */
+    viewOnly: boolean;
+
+    /**
+     * Is a `boolean` indicating if keyboard focus should automatically be moved to the remote
+     * session when a `mousedown` or `touchstart` event is received. Enabled by default.
+     */
+    focusOnClick: boolean;
+
+    /**
+     * Is a `boolean` indicating if the remote session should be clipped to its container. When
+     * disabled scrollbars will be shown to handle the resulting overflow. Disabled by default.
+     */
+    clipViewport: boolean;
+
+    /**
+     * Is a `boolean` indicating if mouse events should control the relative position of a clipped
+     * remote session. Only relevant if `clipViewport` is enabled. Disabled by default.
+     */
+    dragViewport: boolean;
+
+    /**
+     * Is a `boolean` indicating if the remote session should be scaled locally so it fits its
+     * container. When disabled it will be centered if the remote session is smaller than its
+     * container, or handled according to `clipViewport` if it is larger. Disabled by default.
+     */
+    scaleViewport: boolean;
+
+    /**
+     * Is a `boolean` indicating if a request to resize the remote session should be sent whenever
+     * the container changes dimensions. Disabled by default.
+     */
+    resizeSession: boolean;
+
+    /**
+     * Is a `boolean` indicating whether a dot cursor should be shown instead of a zero-sized or
+     * fully-transparent cursor if the server sets such invisible cursor. Disabled by default.
+     */
+    showDotCursor: boolean;
+
+    /**
+     * Is a valid CSS [background](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
+     * style value indicating which background style should be applied to the element containing the
+     * remote session screen. The default value is `rgb(40, 40, 40)` (solid gray color).
+     */
+    background: string;
+
+    /**
+     * Is an `int` in range `[0-9]` controlling the desired JPEG quality. Value `0` implies low
+     * quality and `9` implies high quality. Default value is `6`.
+     */
+    qualityLevel: number;
+
+    /**
+     * Is an `int` in range `[0-9]` controlling the desired compression level. Value `0` means no
+     * compression. Level 1 uses a minimum of CPU resources and achieves weak compression ratios,
+     * while level 9 offers best compression but is slow in terms of CPU consumption on the server
+     * side. Use high levels with very slow network connections. Default value is `2`.
+     */
+    compressionLevel: number;
+
+    /**
+     * Is an `object` indicating which optional extensions are available on the server. Some methods
+     * may only be called if the corresponding capability is set. The following capabilities are
+     * defined:
+     *
+     * | name     | type      | description
+     * | -------- | --------- | -----------
+     * | `power`  | `boolean` | Machine power control is available
+     */
+    readonly capabilities: {
+      /** Machine power control is available */
+      power: boolean;
+    };
+
+    /**
+     * Disconnect from the server.
+     */
+    disconnect(): void;
+
+    /**
+     * Send credentials to server. Should be called after the
+     * {@link NoVncEventType.credentialsrequired} event has fired.
+     *
+     * @param credentials An {@link NoVncCredentials} specifying the credentials to provide to the
+     * server when authenticating.
+     */
+    sendCredentials(credentials: NoVncCredentials): void;
+
+    /**
+     * Send a key event to the server.
+     *
+     * @param keysym A `number` specifying the NoVncClient keysym to send. Can be `0` if a valid
+     * **`code`** is specified.
+     * @param code A `string` specifying the physical key to send. Valid values are those that can
+     * be specified to {@link KeyboardEvent.code}. If the physical key cannot be determined then
+     * `null` shall be specified.
+     * @param down A `boolean` specifying if a press or a release event should be sent. If omitted
+     * then both a press and release event are sent.
+     */
+    sendKey(keysym: number, code: string | null, down?: boolean): void;
+
+    /**
+     * Send the key sequence *left Control*, *left Alt*, *Delete*. This is a convenience wrapper
+     * around {@link sendKey}.
+     */
+    sendCtrlAltDel(): void;
+
+    /**
+     * Sets the keyboard focus on the remote session. Keyboard events will be sent to the remote
+     * server after this point.
+     *
+     * @param options A {@link FocusOptions} providing options to control how the focus will be
+     * performed. Please see {@link HTMLElement.focus} for available options.
+     */
+    focus(options?: FocusOptions): void;
+
+    /**
+     * Remove keyboard focus on the remote session. Keyboard events will no longer be sent to the
+     * remote server after this point.
+     */
+    blur(): void;
+
+    /**
+     * Request to shut down the remote machine. The capability `power` must be set for this method
+     * to have any effect.
+     */
+    machineShutdown(): void;
+
+    /**
+     * Request a clean reboot of the remote machine. The capability `power` must be set for this
+     * method to have any effect.
+     */
+    machineReboot(): void;
+
+    /**
+     * Request a forced reset of the remote machine. The capability `power` must be set for this
+     * method to have any effect.
+     */
+    machineReset(): void;
+
+    /**
+     * Send clipboard data to the remote server.
+     *
+     * @param text A `string` specifying the clipboard data to send.
+     */
+    clipboardPasteFrom(text: string): void;
+  }
+}
+
+declare module "@novnc/novnc/core/util/browser" {
+  let isTouchDevice: boolean;
+  let dragThreshold: number;
+
+  const supportsCursorURIs: boolean;
+  const hasScrollbarGutter: boolean;
+
+  function isMac(): boolean;
+  function isWindows(): boolean;
+  function isIOS(): boolean;
+  function isSafari(): boolean;
+  function isFirefox(): boolean;
+}
+
+declare module "@novnc/novnc/core/input/util" {
+  interface KeyboardEventBase {
+    char?: string;
+    charCode?: number;
+    code: string;
+    key: string;
+    keyCode?: number;
+    location?: number;
+    type?: string;
+  }
+
+  function getKeycode(event: KeyboardEventBase): string;
+  function getKey(event: KeyboardEventBase): string;
+  function getKeysym(event: KeyboardEventBase): number;
+}
diff --git a/yarn.lock b/yarn.lock
index ca7431846..c2344a42d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3159,11 +3159,6 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-16.11.45.tgz#155b13a33c665ef2b136f7f245fa525da419e810"
   integrity sha512-3rKg/L5x0rofKuuUt5zlXzOnKyIHXmIu5R8A0TuNDMF2062/AOIDBciFIjToLEJ/9F9DzkHNot+BpNsMI1OLdQ==
 
-"@types/novnc__novnc@^1.3.0":
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/@types/novnc__novnc/-/novnc__novnc-1.3.0.tgz#12e9892d7cdb8f79a8974b20fdaf22b143c7957f"
-  integrity sha512-IiNumU7H5ezJhJlhFEUk8ouQ4z+DOX6Ldvlh2MwQ+fsN03FMLHJyAIBLVMaC+1pC43BMAqmTNMTK85sFlq0ADw==
-
 "@types/parse-json@^4.0.0":
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"