feat(FEC-13362): add events for kava (#35)

### Description of the Changes

add new event for kava- when downloading an item.

Solves FEC-13362

src/components/download-item/download-item.tsx

@@ -4,8 +4,13 @@ import {Icon as CommonIcon} from '@playkit-js/common/dist/icon';
 import {DownloadPluginManager} from '../../download-plugin-manager';
 import {ComponentChildren} from 'preact';
 import {useEffect, useRef} from 'preact/hooks';
-const {withEventManager} = KalturaPlayer.ui.Event;
+
+import {ui} from '@playkit-js/kaltura-player-js';
+import {DownloadEvent} from '../../event';
 const {withText} = KalturaPlayer.ui.preacti18n;
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+//@ts-ignore
+const {withPlayer} = ui.Components;
 
 interface DownloadItemProps {
   downloadPluginManager: DownloadPluginManager;
@@ -19,6 +24,7 @@ interface DownloadItemProps {
   downloadUrl: string;
   iconFileType: ComponentChildren;
   isDefault?: boolean;
+  player: KalturaPlayerTypes.Player;
 }
 
 export const DownloadItem = withText({
@@ -27,7 +33,7 @@ export const DownloadItem = withText({
   downloadFailedLabel: 'download.download_has_failed',
   downloadButtonLabel: 'download.download_button_label'
 })(
-  withEventManager(
+  withPlayer(
     ({
       key,
       downloadLabel,
@@ -39,7 +45,8 @@ export const DownloadItem = withText({
       description,
       downloadUrl,
       iconFileType,
-      isDefault
+      isDefault,
+      player
     }: DownloadItemProps) => {
       const downloadItemRef = useRef<HTMLDivElement>(null);
 
@@ -55,6 +62,7 @@ export const DownloadItem = withText({
             if (downloadUrl) {
               downloadPluginManager.downloadFile(downloadUrl, fileName);
               downloadPluginManager.notifyDownloadStarted(downloadLabel!, downloadStartedLabel!);
+              player.dispatchEvent(new KalturaPlayer.core.FakeEvent(DownloadEvent.DOWNLOAD_ITEM_CLICKED));
             } else {
               downloadPluginManager.notifyDownloadFailed(downloadLabel!, downloadFailedLabel!);
             }

src/components/download-overlay/download-overlay.tsx

@@ -2,7 +2,7 @@ import {Button, ButtonType, ButtonSize, A11yWrapper, OnClickEvent} from '@playki
 import {DownloadPluginManager} from '../../download-plugin-manager';
 import {createRef} from 'preact';
 import {useState, useEffect} from 'preact/hooks';
-import {EventType, DownloadMetadata} from '../../types';
+import {DownloadMetadata} from '../../types';
 
 const {withEventManager} = KalturaPlayer.ui.Event;
 const {PLAYER_SIZE} = KalturaPlayer.ui.components;
@@ -14,6 +14,7 @@ import * as styles from './download-overlay.scss';
 import {SourcesList} from '../sources-list';
 import {CaptionsList} from '../captions-list';
 import {AttachmentsList} from '../attachments-list';
+import {DownloadInternalEvent} from '../../event';
 
 interface DownloadOverlayProps {
   downloadPluginManager: DownloadPluginManager;
@@ -67,11 +68,11 @@ const DownloadOverlay = withText({
         const closeButtonRef = createRef<HTMLButtonElement>();
         const downloadConfig = downloadPluginManager.downloadPlugin.config;
         useEffect(() => {
-          eventManager?.listen(downloadPluginManager, EventType.SHOW_OVERLAY, () => {
+          eventManager?.listen(downloadPluginManager, DownloadInternalEvent.SHOW_OVERLAY, () => {
             setIsVisible(true);
           });
 
-          eventManager?.listen(downloadPluginManager, EventType.HIDE_OVERLAY, () => {
+          eventManager?.listen(downloadPluginManager, DownloadInternalEvent.HIDE_OVERLAY, () => {
             setIsVisible(false);
           });
         }, []);

src/download-plugin-manager.tsx

@@ -4,7 +4,8 @@ import {ToastSeverity} from '@playkit-js/common';
 import {Download} from './download';
 import {DOWNLOAD, ERROR} from './icons';
 import {DownloadService} from './services';
-import {EventType, DownloadMetadata} from './types';
+import {DownloadMetadata} from './types';
+import {DownloadInternalEvent} from './event';
 
 class DownloadPluginManager extends KalturaPlayer.core.FakeEventTarget {
   private _showOverlay = false;
@@ -67,13 +68,13 @@ class DownloadPluginManager extends KalturaPlayer.core.FakeEventTarget {
         this.downloadPlugin.player.pause();
         this.playOnClose = true;
       }
-      this.dispatchEvent(new KalturaPlayer.core.FakeEvent(EventType.SHOW_OVERLAY, {byKeyboard: this.downloadPlugin.triggeredByKeyboard}));
+      this.dispatchEvent(new KalturaPlayer.core.FakeEvent(DownloadInternalEvent.SHOW_OVERLAY, {byKeyboard: this.downloadPlugin.triggeredByKeyboard}));
     } else {
       if (this.playOnClose) {
         this.downloadPlugin.player.play();
         this.playOnClose = false;
       }
-      this.dispatchEvent(new KalturaPlayer.core.FakeEvent(EventType.HIDE_OVERLAY));
+      this.dispatchEvent(new KalturaPlayer.core.FakeEvent(DownloadInternalEvent.HIDE_OVERLAY));
     }
   }
 

src/event/download-event.d.ts

@@ -0,0 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+export namespace DownloadEvent {
+  const DOWNLOAD_ITEM_CLICKED: string;
+}

src/event/download-event.js

@@ -0,0 +1,5 @@
+const DownloadEvent = {
+  DOWNLOAD_ITEM_CLICKED: 'download_item_clicked'
+};
+
+export {DownloadEvent};

src/types/event-type.ts → src/event/download-internal-event.ts

@@ -1,4 +1,4 @@
-export enum EventType {
+export enum DownloadInternalEvent {
   SHOW_OVERLAY = 'show_overlay',
   HIDE_OVERLAY = 'hide_overlay'
 }

src/event/index.ts

@@ -0,0 +1,5 @@
+import {DownloadInternalEvent} from './download-internal-event';
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import {DownloadEvent} from './download-event';
+export {DownloadInternalEvent, DownloadEvent};

src/types/index.ts

@@ -1,5 +1,4 @@
 import {DownloadConfig} from './download-config';
-import {EventType} from './event-type';
 import {DownloadMetadata} from './download-metadata';
 
-export {DownloadConfig, DownloadMetadata, EventType};
+export {DownloadConfig, DownloadMetadata};

types/index.js

@@ -0,0 +1 @@
+export {DownloadEvent} from '../src/event/download-event';