diff --git a/samples/sample-floating-window-plugin/package-lock.json b/samples/sample-floating-window-plugin/package-lock.json index 7536b381..be5518c5 100644 --- a/samples/sample-floating-window-plugin/package-lock.json +++ b/samples/sample-floating-window-plugin/package-lock.json @@ -5406,7 +5406,6 @@ "version": "2.3.2", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", - "dev": true, "hasInstallScript": true, "optional": true, "os": [ @@ -13231,7 +13230,6 @@ "version": "2.3.2", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", - "dev": true, "optional": true }, "function-bind": { diff --git a/samples/sample-generic-content-sidekick-plugin/src/components/sample-generic-content-sidekick-plugin-item/component.tsx b/samples/sample-generic-content-sidekick-plugin/src/components/sample-generic-content-sidekick-plugin-item/component.tsx index ff5df8eb..13116b02 100644 --- a/samples/sample-generic-content-sidekick-plugin/src/components/sample-generic-content-sidekick-plugin-item/component.tsx +++ b/samples/sample-generic-content-sidekick-plugin/src/components/sample-generic-content-sidekick-plugin-item/component.tsx @@ -12,6 +12,20 @@ import * as ReactDOM from 'react-dom/client'; import { SampleGenericContentSidekickPluginProps } from './types'; import { GenericContentSidekickExample } from '../generic-content-sidekick-example/component'; +function BatteryIcon() { + return ( + + + + ); +} + function SampleGenericContentSidekickPlugin( { pluginUuid: uuid }: SampleGenericContentSidekickPluginProps, ): React.ReactNode { @@ -29,7 +43,9 @@ function SampleGenericContentSidekickPlugin( name: 'Generic Content 1', section: 'Section 1', dataTest: 'section-1-generic-content-sidekick-abc', - buttonIcon: 'video', + buttonIcon: { + svgContent: , + }, open: false, contentFunction: (element: HTMLElement) => { const root = ReactDOM.createRoot(element); diff --git a/scripts/bump-version.sh b/scripts/bump-version.sh index 4c30a555..4460e047 100755 --- a/scripts/bump-version.sh +++ b/scripts/bump-version.sh @@ -31,7 +31,9 @@ sed -i "s/\"version\": \"$CURRENT_VERSION\"/\"version\": \"$NEW_VERSION\"/" pack npm install # Publishes to npm -npm publish +npm publish --tag tmp +npm dist-tag add bigbluebutton-html-plugin-sdk@$NEW_VERSION latest +npm dist-tag rm bigbluebutton-html-plugin-sdk tmp echo "Sleeping 120 seconds to allow npm replicate internally" sleep 120 diff --git a/src/extensible-areas/actions-bar-item/component.ts b/src/extensible-areas/actions-bar-item/component.ts index 41184646..1b418622 100644 --- a/src/extensible-areas/actions-bar-item/component.ts +++ b/src/extensible-areas/actions-bar-item/component.ts @@ -9,8 +9,8 @@ import { SelectOption, ToggleGroupOption, ActionsBarToggleGroupProps, - ActionsBarIconType, } from './types'; +import { PluginIconType } from '../common/icon'; // ActionsBar Extensible Area @@ -34,18 +34,20 @@ class ActionsBarItem implements ActionsBarInterface { this.dataTest = dataTest; } - setItemId(id: string):void { + setItemId(id: string): void { this.id = `ActionsBar${this.type}_${id}`; } } export class ActionsBarButton extends ActionsBarItem { - icon: ActionsBarIconType; + icon: PluginIconType; tooltip: string; onClick: () => void; + color: string; + /** * Returns object to be used in the setter for action bar. In this case, * a button. @@ -56,11 +58,13 @@ export class ActionsBarButton extends ActionsBarItem { * @param dataTest - string attribute to be used for testing * @param onClick - function to be called when clicking the button * @param position - position that this button will be displayed, see {@link ActionsBarPosition} + * @param color - button color variant, defaults to 'primary' * * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5) */ constructor({ - id, icon, tooltip = '', dataTest = '', onClick = () => {}, position = ActionsBarPosition.RIGHT, + id, icon, tooltip = '', dataTest = '', onClick = () => { }, position = ActionsBarPosition.RIGHT, + color = 'primary', }: ActionsBarButtonProps) { super({ id, type: ActionsBarItemType.BUTTON, position, dataTest, @@ -69,11 +73,12 @@ export class ActionsBarButton extends ActionsBarItem { this.tooltip = tooltip; this.dataTest = dataTest; this.onClick = onClick; + this.color = color; } } export class ActionsBarSeparator extends ActionsBarItem { - icon: string; + icon: PluginIconType; /** * Returns object to be used in the setter for action bar. In this case, @@ -129,7 +134,7 @@ export class ActionsBarSelector extends ActionsBarItem { options = [], defaultOption = options[0], dataTest = '', - onChange = () => {}, + onChange = () => { }, position = ActionsBarPosition.RIGHT, width = 140, }: ActionsBarSelectorProps) { @@ -179,7 +184,7 @@ export class ActionsBarToggleGroup extends ActionsBarItem { options = [], defaultOption = options[0], dataTest = '', - onChange = () => {}, + onChange = () => { }, position = ActionsBarPosition.RIGHT, }: ActionsBarToggleGroupProps) { super({ diff --git a/src/extensible-areas/actions-bar-item/types.ts b/src/extensible-areas/actions-bar-item/types.ts index 6c8746f9..e37244eb 100644 --- a/src/extensible-areas/actions-bar-item/types.ts +++ b/src/extensible-areas/actions-bar-item/types.ts @@ -1,6 +1,7 @@ import { ChangeEvent, MouseEvent } from 'react'; import { PluginProvidedUiItemDescriptor } from '../base'; import { ActionsBarItemType, ActionsBarPosition } from './enums'; +import { PluginIconType } from '../common/icon'; /** * Interface for the generic Actions bar item. (`position` is mandatory) @@ -16,31 +17,19 @@ export interface ActionsBarItemProps { dataTest?: string; } -export interface ActionsBarButtonIconSvg { - svgContent: React.SVGProps; -} - -export interface ActionsBarButtonIconName { - /** - * Default icon name defined by BBB (see options there). - */ - iconName: string; -} - -export type ActionsBarIconType = ActionsBarButtonIconSvg | ActionsBarButtonIconName - export interface ActionsBarButtonProps { id?: string; - icon: ActionsBarIconType; + icon: PluginIconType; tooltip: string; position: ActionsBarPosition; dataTest?: string; onClick: () => void; + color?: string; } export interface ActionsBarSeparatorProps { position: ActionsBarPosition; - icon?: string; + icon?: PluginIconType; dataTest?: string; } diff --git a/src/extensible-areas/audio-settings-dropdown-item/component.ts b/src/extensible-areas/audio-settings-dropdown-item/component.ts index 93c754cb..4fee0cd5 100644 --- a/src/extensible-areas/audio-settings-dropdown-item/component.ts +++ b/src/extensible-areas/audio-settings-dropdown-item/component.ts @@ -2,6 +2,7 @@ import { AudioSettingsDropdownItemType } from './enums'; import { AudioSettingsDropdownInterface, AudioSettingsDropdownOptionProps, } from './types'; +import { PluginIconType } from '../common/icon'; // AudioSettingsDropdown Extensible Area @@ -12,7 +13,7 @@ export class AudioSettingsDropdownOption implements AudioSettingsDropdownInterfa label: string; - icon: string; + icon: PluginIconType; dataTest: string; diff --git a/src/extensible-areas/audio-settings-dropdown-item/types.ts b/src/extensible-areas/audio-settings-dropdown-item/types.ts index 4e7b63dd..5df12e87 100644 --- a/src/extensible-areas/audio-settings-dropdown-item/types.ts +++ b/src/extensible-areas/audio-settings-dropdown-item/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; /** * Audio Settings Dropdown Item - The general Audio settings extensible area @@ -7,13 +8,13 @@ import { PluginProvidedUiItemDescriptor } from '../base'; * To make this dropdown appear, the user needs to enter with audio, either listen only * or microphone. This will make a small downward arrow appear (chevron). */ -export interface AudioSettingsDropdownInterface extends PluginProvidedUiItemDescriptor{ +export interface AudioSettingsDropdownInterface extends PluginProvidedUiItemDescriptor { } export interface AudioSettingsDropdownOptionProps { id?: string; label: string; - icon: string; + icon: PluginIconType; dataTest?: string; onClick: () => void; } diff --git a/src/extensible-areas/camera-settings-dropdown-item/component.ts b/src/extensible-areas/camera-settings-dropdown-item/component.ts index 1ccf6600..00a18f8d 100644 --- a/src/extensible-areas/camera-settings-dropdown-item/component.ts +++ b/src/extensible-areas/camera-settings-dropdown-item/component.ts @@ -2,6 +2,7 @@ import { CameraSettingsDropdownItemType } from './enums'; import { CameraSettingsDropdownInterface, CameraSettingsDropdownOptionProps, } from './types'; +import { PluginIconType } from '../common/icon'; // CameraSettingsDropdown Extensible Area @@ -12,7 +13,7 @@ export class CameraSettingsDropdownOption implements CameraSettingsDropdownInter label: string; - icon: string; + icon: PluginIconType; dataTest: string = ''; @@ -30,7 +31,7 @@ export class CameraSettingsDropdownOption implements CameraSettingsDropdownInter * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - id, label = '', icon = '', dataTest = '', onClick = () => {}, + id, label = '', icon = '', dataTest = '', onClick = () => { }, }: CameraSettingsDropdownOptionProps) { if (id) { this.id = id; diff --git a/src/extensible-areas/camera-settings-dropdown-item/types.ts b/src/extensible-areas/camera-settings-dropdown-item/types.ts index 9d0be49d..5f79bf61 100644 --- a/src/extensible-areas/camera-settings-dropdown-item/types.ts +++ b/src/extensible-areas/camera-settings-dropdown-item/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; /** * Camera Settings Dropdown Item - The general Camera settings extensible area @@ -7,13 +8,13 @@ import { PluginProvidedUiItemDescriptor } from '../base'; * To make this dropdown appear, the user needs to enter with webcam. * This will make a small downward arrow appear in the camera icon (the chevron). */ -export interface CameraSettingsDropdownInterface extends PluginProvidedUiItemDescriptor{ +export interface CameraSettingsDropdownInterface extends PluginProvidedUiItemDescriptor { } export interface CameraSettingsDropdownOptionProps { id?: string; label: string; - icon: string; + icon: PluginIconType; dataTest?: string; onClick: () => void; } diff --git a/src/extensible-areas/common/icon/index.ts b/src/extensible-areas/common/icon/index.ts new file mode 100644 index 00000000..fcb073fe --- /dev/null +++ b/src/extensible-areas/common/icon/index.ts @@ -0,0 +1 @@ +export * from './types'; diff --git a/src/extensible-areas/common/icon/types.ts b/src/extensible-areas/common/icon/types.ts new file mode 100644 index 00000000..f6a1b887 --- /dev/null +++ b/src/extensible-areas/common/icon/types.ts @@ -0,0 +1,11 @@ +import * as React from 'react'; + +export interface PluginIconName { + iconName: string; +} + +export interface PluginIconSvgContent { + svgContent: React.SVGProps; +} + +export type PluginIconType = string | PluginIconName | PluginIconSvgContent; diff --git a/src/extensible-areas/common/index.ts b/src/extensible-areas/common/index.ts new file mode 100644 index 00000000..af77d84e --- /dev/null +++ b/src/extensible-areas/common/index.ts @@ -0,0 +1 @@ +export * from './icon'; diff --git a/src/extensible-areas/generic-content-item/component.ts b/src/extensible-areas/generic-content-item/component.ts index 9e0413dd..6b60df51 100644 --- a/src/extensible-areas/generic-content-item/component.ts +++ b/src/extensible-areas/generic-content-item/component.ts @@ -1,6 +1,7 @@ import * as ReactDOM from 'react-dom/client'; import { GenericContentType } from './enums'; import { GenericContentInterface, GenericContentMainAreaProps, GenericContentSidekickAreaProps } from './types'; +import { PluginIconType } from '../common/icon'; // GenericContent Extensible Area @@ -48,7 +49,7 @@ export class GenericContentSidekickArea implements GenericContentInterface { section: string = ''; - buttonIcon: string = ''; + buttonIcon: PluginIconType = ''; open: boolean = false; diff --git a/src/extensible-areas/generic-content-item/types.ts b/src/extensible-areas/generic-content-item/types.ts index 55d026a5..cea811ff 100644 --- a/src/extensible-areas/generic-content-item/types.ts +++ b/src/extensible-areas/generic-content-item/types.ts @@ -1,5 +1,6 @@ import * as ReactDOM from 'react-dom/client'; import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; export interface GenericContentInterface extends PluginProvidedUiItemDescriptor { } @@ -15,7 +16,7 @@ export interface GenericContentSidekickAreaProps { contentFunction: (element: HTMLElement) => ReactDOM.Root; name: string; section: string; - buttonIcon: string; + buttonIcon: PluginIconType; open: boolean; dataTest?: string; } diff --git a/src/extensible-areas/index.ts b/src/extensible-areas/index.ts index a576715b..04039c73 100644 --- a/src/extensible-areas/index.ts +++ b/src/extensible-areas/index.ts @@ -1,3 +1,4 @@ +export * from './common/icon'; export * from './presentation-toolbar-item'; export * from './user-list-dropdown-item'; export * from './media-area-item'; diff --git a/src/extensible-areas/media-area-item/component.ts b/src/extensible-areas/media-area-item/component.ts index ad310460..85edf75f 100644 --- a/src/extensible-areas/media-area-item/component.ts +++ b/src/extensible-areas/media-area-item/component.ts @@ -1,7 +1,8 @@ import { MediaAreaItemType } from './enums'; import { - MediaAreaInterface, MediaAreaOptionProps, MediaAreaIconType, + MediaAreaInterface, MediaAreaOptionProps, } from './types'; +import { PluginIconType } from '../common/icon'; // MediaArea Extensible Area @@ -12,7 +13,7 @@ export class MediaAreaOption implements MediaAreaInterface { label: string; - icon: MediaAreaIconType; + icon: PluginIconType; tooltip: string; diff --git a/src/extensible-areas/media-area-item/types.ts b/src/extensible-areas/media-area-item/types.ts index dab6c2fd..b7921acb 100644 --- a/src/extensible-areas/media-area-item/types.ts +++ b/src/extensible-areas/media-area-item/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; /** * Interface for a generic item for the media area. @@ -17,12 +18,10 @@ export interface MediaAreaButtonIconName { iconName: string; } -export type MediaAreaIconType = MediaAreaButtonIconSvg | MediaAreaButtonIconName - export interface MediaAreaOptionProps { id?: string; label: string; - icon: MediaAreaIconType; + icon: PluginIconType; tooltip: string; dataTest?: string; allowed: boolean; diff --git a/src/extensible-areas/nav-bar-item/component.ts b/src/extensible-areas/nav-bar-item/component.ts index 29c03dfc..29b5ae3c 100644 --- a/src/extensible-areas/nav-bar-item/component.ts +++ b/src/extensible-areas/nav-bar-item/component.ts @@ -3,6 +3,7 @@ import { NavBarInterface, NavBarButtonProps, NavBarInfoProps, } from './types'; +import { PluginIconType } from '../common/icon'; // NavBar Extensible Area @@ -13,7 +14,7 @@ export class NavBarButton implements NavBarInterface { label: string; - icon: string; + icon: PluginIconType; tooltip: string; @@ -45,7 +46,7 @@ export class NavBarButton implements NavBarInterface { * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - id, label = '', icon = '', tooltip = '', disabled = true, dataTest = '', onClick = () => {}, + id, label = '', icon = '', tooltip = '', disabled = true, dataTest = '', onClick = () => { }, position = NavBarItemPosition.RIGHT, hasSeparator = true, }: NavBarButtonProps) { if (id) { diff --git a/src/extensible-areas/nav-bar-item/types.ts b/src/extensible-areas/nav-bar-item/types.ts index 737042f2..42a9614c 100644 --- a/src/extensible-areas/nav-bar-item/types.ts +++ b/src/extensible-areas/nav-bar-item/types.ts @@ -1,7 +1,8 @@ import { PluginProvidedUiItemDescriptor } from '../base'; import { NavBarItemPosition } from './enums'; +import { PluginIconType } from '../common/icon'; -export interface NavBarInterface extends PluginProvidedUiItemDescriptor{ +export interface NavBarInterface extends PluginProvidedUiItemDescriptor { position: NavBarItemPosition; hasSeparator: boolean; } @@ -9,7 +10,7 @@ export interface NavBarInterface extends PluginProvidedUiItemDescriptor{ export interface NavBarButtonProps { id?: string; label: string; - icon: string; + icon: PluginIconType; tooltip: string; disabled: boolean; hasSeparator: boolean; diff --git a/src/extensible-areas/options-dropdown-item/component.ts b/src/extensible-areas/options-dropdown-item/component.ts index 08fe90c6..92762629 100644 --- a/src/extensible-areas/options-dropdown-item/component.ts +++ b/src/extensible-areas/options-dropdown-item/component.ts @@ -2,6 +2,7 @@ import { OptionsDropdownItemType } from './enums'; import { OptionsDropdownInterface, OptionsDropdownOptionProps, } from './types'; +import { PluginIconType } from '../common/icon'; // OptionsDropdown Extensible Area @@ -12,7 +13,7 @@ export class OptionsDropdownOption implements OptionsDropdownInterface { label: string; - icon: string; + icon: PluginIconType; dataTest: string; @@ -30,7 +31,7 @@ export class OptionsDropdownOption implements OptionsDropdownInterface { * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - id, label = '', icon = '', dataTest = '', onClick = () => {}, + id, label = '', icon = '', dataTest = '', onClick = () => { }, }: OptionsDropdownOptionProps) { if (id) { this.id = id; diff --git a/src/extensible-areas/options-dropdown-item/types.ts b/src/extensible-areas/options-dropdown-item/types.ts index c08bd3df..154e5077 100644 --- a/src/extensible-areas/options-dropdown-item/types.ts +++ b/src/extensible-areas/options-dropdown-item/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; /** * Options Dropdown Item - The general options dropdown extensible area item @@ -7,13 +8,13 @@ import { PluginProvidedUiItemDescriptor } from '../base'; * This dropdown is related to the options menu on the top right corner of the UI * (the 3 dots) */ -export interface OptionsDropdownInterface extends PluginProvidedUiItemDescriptor{ +export interface OptionsDropdownInterface extends PluginProvidedUiItemDescriptor { } export interface OptionsDropdownOptionProps { id?: string; label: string; - icon: string; + icon: PluginIconType; onClick: () => void; dataTest?: string; } diff --git a/src/extensible-areas/presentation-dropdown-item/component.ts b/src/extensible-areas/presentation-dropdown-item/component.ts index 9ed50230..c16a3e6c 100644 --- a/src/extensible-areas/presentation-dropdown-item/component.ts +++ b/src/extensible-areas/presentation-dropdown-item/component.ts @@ -2,6 +2,7 @@ import { PresentationDropdownItemType } from './enums'; import { PresentationDropdownInterface, PresentationDropdownOptionProps, } from './types'; +import { PluginIconType } from '../common/icon'; // PresentationDropdown Extensible Area @@ -12,7 +13,7 @@ export class PresentationDropdownOption implements PresentationDropdownInterface label: string; - icon: string; + icon: PluginIconType; dataTest: string; @@ -31,7 +32,7 @@ export class PresentationDropdownOption implements PresentationDropdownInterface * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - id, label = '', icon = '', dataTest = '', onClick = () => {}, + id, label = '', icon = '', dataTest = '', onClick = () => { }, }: PresentationDropdownOptionProps) { if (id) { this.id = id; diff --git a/src/extensible-areas/presentation-dropdown-item/types.ts b/src/extensible-areas/presentation-dropdown-item/types.ts index a5363a3c..8fa4b9e2 100644 --- a/src/extensible-areas/presentation-dropdown-item/types.ts +++ b/src/extensible-areas/presentation-dropdown-item/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; /** * Presentation Dropdown Item - The general presentation dropdown extensible area item @@ -7,13 +8,13 @@ import { PluginProvidedUiItemDescriptor } from '../base'; * This dropdown is located when clicking the three dots on the top left corner * of the presentation area. */ -export interface PresentationDropdownInterface extends PluginProvidedUiItemDescriptor{ +export interface PresentationDropdownInterface extends PluginProvidedUiItemDescriptor { } export interface PresentationDropdownOptionProps { id?: string; label: string; - icon: string; + icon: PluginIconType; onClick: () => void; dataTest?: string; } diff --git a/src/extensible-areas/screenshare-helper-item/component.ts b/src/extensible-areas/screenshare-helper-item/component.ts index 93bc9f3f..09d264c3 100644 --- a/src/extensible-areas/screenshare-helper-item/component.ts +++ b/src/extensible-areas/screenshare-helper-item/component.ts @@ -4,6 +4,7 @@ import { ScreenshareHelperButtonInterface, ScreenshareHelperButtonOnclickCallback, } from './types'; +import { PluginIconType } from '../common/icon'; // ScreenshareHelper Extensible Area @@ -14,7 +15,7 @@ export class ScreenshareHelperButton implements ScreenshareHelperButtonInterface label: string; - icon: string; + icon: PluginIconType; tooltip: string; @@ -44,7 +45,7 @@ export class ScreenshareHelperButton implements ScreenshareHelperButtonInterface * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - id, label = '', icon = '', tooltip = '', disabled = true, dataTest = '', onClick = () => {}, + id, label = '', icon = '', tooltip = '', disabled = true, dataTest = '', onClick = () => { }, position = ScreenshareHelperItemPosition.TOP_RIGHT, }: ScreenshareHelperButtonProps) { if (id) { diff --git a/src/extensible-areas/screenshare-helper-item/types.ts b/src/extensible-areas/screenshare-helper-item/types.ts index 6448c37f..60a29d88 100644 --- a/src/extensible-areas/screenshare-helper-item/types.ts +++ b/src/extensible-areas/screenshare-helper-item/types.ts @@ -1,7 +1,8 @@ import { PluginProvidedUiItemDescriptor } from '../base'; import { ScreenshareHelperItemPosition } from './enums'; +import { PluginIconType } from '../common/icon'; -export interface ScreenshareHelperInterface extends PluginProvidedUiItemDescriptor{ +export interface ScreenshareHelperInterface extends PluginProvidedUiItemDescriptor { position: ScreenshareHelperItemPosition; } @@ -9,10 +10,10 @@ export interface ScreenshareHelperButtonOnclickCallback { browserClickEvent: React.MouseEvent; } -export interface ScreenshareHelperButtonInterface extends ScreenshareHelperInterface{ +export interface ScreenshareHelperButtonInterface extends ScreenshareHelperInterface { label: string; - icon: string; + icon: PluginIconType; tooltip: string; @@ -26,7 +27,7 @@ export interface ScreenshareHelperButtonInterface extends ScreenshareHelperInter export interface ScreenshareHelperButtonProps { id?: string; label?: string; - icon: string; + icon: PluginIconType; tooltip: string; disabled: boolean; hasSeparator: boolean; diff --git a/src/extensible-areas/user-camera-dropdown-item/component.ts b/src/extensible-areas/user-camera-dropdown-item/component.ts index 500ead9e..c487c0d1 100644 --- a/src/extensible-areas/user-camera-dropdown-item/component.ts +++ b/src/extensible-areas/user-camera-dropdown-item/component.ts @@ -5,6 +5,7 @@ import { UserCameraDropdownInterface, UserCameraDropdownOptionProps, UserCameraDropdownSeparatorProps, } from './types'; +import { PluginIconType } from '../common/icon'; // UserCameraDropdown Extensible Area @@ -15,7 +16,7 @@ export class UserCameraDropdownOption implements UserCameraDropdownInterface { label: string; - icon: string; + icon: PluginIconType; dataTest: string; @@ -35,7 +36,7 @@ export class UserCameraDropdownOption implements UserCameraDropdownInterface { * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5) */ constructor({ - id, label = '', icon = '', dataTest = '', onClick = () => {}, + id, label = '', icon = '', dataTest = '', onClick = () => { }, displayFunction = () => true, }: UserCameraDropdownOptionProps) { if (id) { diff --git a/src/extensible-areas/user-camera-dropdown-item/types.ts b/src/extensible-areas/user-camera-dropdown-item/types.ts index 61184b3e..ab94af66 100644 --- a/src/extensible-areas/user-camera-dropdown-item/types.ts +++ b/src/extensible-areas/user-camera-dropdown-item/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; export interface UserCameraDropdownCallbackFunctionsArguments { streamId: string; @@ -6,7 +7,7 @@ export interface UserCameraDropdownCallbackFunctionsArguments { } export interface OnclickFunctionCallbackArguments - extends UserCameraDropdownCallbackFunctionsArguments{ + extends UserCameraDropdownCallbackFunctionsArguments { browserClickEvent: React.MouseEvent; } @@ -16,7 +17,7 @@ export interface OnclickFunctionCallbackArguments * @remarks * This dropdown is located on the bottom left corner of the user webcam area */ -export interface UserCameraDropdownInterface extends PluginProvidedUiItemDescriptor{ +export interface UserCameraDropdownInterface extends PluginProvidedUiItemDescriptor { displayFunction?: (args: UserCameraDropdownCallbackFunctionsArguments) => boolean; } @@ -28,7 +29,7 @@ export interface UserCameraDropdownSeparatorProps { export interface UserCameraDropdownOptionProps { id?: string; label: string; - icon: string; + icon: PluginIconType; onClick: (args: OnclickFunctionCallbackArguments) => void; displayFunction?: (args: UserCameraDropdownCallbackFunctionsArguments) => boolean; dataTest?: string; diff --git a/src/extensible-areas/user-camera-helper-item/component.ts b/src/extensible-areas/user-camera-helper-item/component.ts index a5c9cbcf..41150919 100644 --- a/src/extensible-areas/user-camera-helper-item/component.ts +++ b/src/extensible-areas/user-camera-helper-item/component.ts @@ -5,6 +5,7 @@ import { UserCameraHelperButtonOnclickCallback, UserCameraHelperCallbackFunctionArguments, } from './types'; +import { PluginIconType } from '../common/icon'; // UserCameraHelper Extensible Area @@ -17,7 +18,7 @@ export class UserCameraHelperButton implements UserCameraHelperButtonInterface { displayFunction?: (args: UserCameraHelperCallbackFunctionArguments) => boolean; - icon: string; + icon: PluginIconType; tooltip: string; @@ -47,7 +48,7 @@ export class UserCameraHelperButton implements UserCameraHelperButtonInterface { * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - id, label = '', icon = '', tooltip = '', disabled = true, dataTest = '', onClick = () => {}, + id, label = '', icon = '', tooltip = '', disabled = true, dataTest = '', onClick = () => { }, position = UserCameraHelperItemPosition.TOP_RIGHT, displayFunction, }: UserCameraHelperButtonProps) { if (id) { diff --git a/src/extensible-areas/user-camera-helper-item/types.ts b/src/extensible-areas/user-camera-helper-item/types.ts index 6474d741..03da32ad 100644 --- a/src/extensible-areas/user-camera-helper-item/types.ts +++ b/src/extensible-areas/user-camera-helper-item/types.ts @@ -1,7 +1,8 @@ import { PluginProvidedUiItemDescriptor } from '../base'; import { UserCameraHelperItemPosition } from './enums'; +import { PluginIconType } from '../common/icon'; -export interface UserCameraHelperInterface extends PluginProvidedUiItemDescriptor{ +export interface UserCameraHelperInterface extends PluginProvidedUiItemDescriptor { position: UserCameraHelperItemPosition; } @@ -16,10 +17,10 @@ export interface UserCameraHelperCallbackFunctionArguments { userId: string; } -export interface UserCameraHelperButtonInterface extends UserCameraHelperInterface{ +export interface UserCameraHelperButtonInterface extends UserCameraHelperInterface { label: string; - icon: string; + icon: PluginIconType; tooltip: string; @@ -35,7 +36,7 @@ export interface UserCameraHelperButtonInterface extends UserCameraHelperInterfa export interface UserCameraHelperButtonProps { id?: string; label?: string; - icon: string; + icon: PluginIconType; tooltip: string; disabled: boolean; displayFunction?: (args: UserCameraHelperCallbackFunctionArguments) => boolean; diff --git a/src/extensible-areas/user-list-dropdown-item/component.ts b/src/extensible-areas/user-list-dropdown-item/component.ts index 3dd4255f..5c6be5ab 100644 --- a/src/extensible-areas/user-list-dropdown-item/component.ts +++ b/src/extensible-areas/user-list-dropdown-item/component.ts @@ -7,6 +7,7 @@ import { UserListDropdownGenericContentInformationProps, } from './types'; import { UserListDropdownItemType, UserListDropdownSeparatorPosition } from './enums'; +import { PluginIconType } from '../common/icon'; // UserListDropdown Extensible Area @@ -19,7 +20,7 @@ export class UserListDropdownOption implements UserListDropdownInterface { label: string; - icon: string; + icon: PluginIconType; tooltip: string; @@ -45,7 +46,7 @@ export class UserListDropdownOption implements UserListDropdownInterface { * @returns Object that will be interpreted by the core of Bigbluebutton (HTML5). */ constructor({ - label = '', icon = '', tooltip = '', allowed = true, dataTest = '', onClick = () => {}, + label = '', icon = '', tooltip = '', allowed = true, dataTest = '', onClick = () => { }, userId = '', }: UserListDropdownOptionProps) { this.userId = userId; @@ -105,9 +106,9 @@ export class UserListDropdownFixedContentInformation implements UserListDropdown label: string; - icon: string; + icon: PluginIconType; - iconRight: string; + iconRight: PluginIconType; textColor: string; @@ -154,8 +155,7 @@ export class UserListDropdownFixedContentInformation implements UserListDropdown }; } -export class UserListDropdownGenericContentInformation -implements UserListDropdownInterface { +export class UserListDropdownGenericContentInformation implements UserListDropdownInterface { id: string = ''; userId: string; @@ -211,7 +211,7 @@ export class UserListDropdownTitleAction implements UserListDropdownInterface { type: UserListDropdownItemType; - icon: string; + icon: PluginIconType; tooltip: string; diff --git a/src/extensible-areas/user-list-dropdown-item/types.ts b/src/extensible-areas/user-list-dropdown-item/types.ts index e8ded734..18f9eb69 100644 --- a/src/extensible-areas/user-list-dropdown-item/types.ts +++ b/src/extensible-areas/user-list-dropdown-item/types.ts @@ -1,5 +1,6 @@ import { PluginProvidedUiItemDescriptor } from '../base'; import { UserListDropdownSeparatorPosition } from './enums'; +import { PluginIconType } from '../common/icon'; /** * User List Dropdown Item - The general user list dropdown extensible area item @@ -8,13 +9,13 @@ import { UserListDropdownSeparatorPosition } from './enums'; * This dropdown is located on the bottom left corner of the user webcam area. * Mandatory to have the `userId` */ -export interface UserListDropdownInterface extends PluginProvidedUiItemDescriptor{ +export interface UserListDropdownInterface extends PluginProvidedUiItemDescriptor { userId: string; } export interface UserListDropdownOptionProps { label: string; - icon: string; + icon: PluginIconType; tooltip: string; allowed: boolean; userId: string; @@ -39,8 +40,8 @@ export interface UserListDropdownGenericContentInformationProps { export interface UserListDropdownFixedContentInformationProps { id?: string; label: string; - icon?: string; - iconRight?: string; + icon?: PluginIconType; + iconRight?: PluginIconType; allowed: boolean; userId: string; textColor: string; @@ -54,7 +55,7 @@ export interface UserListDropdownTitleActionOnClickArguments { export interface UserListDropdownTitleActionProps { id?: string; tooltip: string; - icon: string; + icon: PluginIconType; userId: string; onClick: (args: UserListDropdownTitleActionOnClickArguments) => void; dataTest?: string; diff --git a/src/extensible-areas/user-list-item-additional-information/component.ts b/src/extensible-areas/user-list-item-additional-information/component.ts index c831aad3..b3e61a01 100644 --- a/src/extensible-areas/user-list-item-additional-information/component.ts +++ b/src/extensible-areas/user-list-item-additional-information/component.ts @@ -3,6 +3,7 @@ import { UserListItemAdditionalInformationInterface, UserListItemIconProps, UserListItemLabelProps, } from './types'; +import { PluginIconType } from '../common/icon'; // UserListItemAdditionalInformation Extensible Area @@ -13,7 +14,7 @@ export class UserListItemIcon implements UserListItemAdditionalInformationInterf userId: string; - icon: string; + icon: PluginIconType; dataTest: string; @@ -53,7 +54,7 @@ export class UserListItemLabel implements UserListItemAdditionalInformationInter userId: string; - icon: string; + icon: PluginIconType; label: string; diff --git a/src/extensible-areas/user-list-item-additional-information/types.ts b/src/extensible-areas/user-list-item-additional-information/types.ts index 73b4ca8b..0ab5275b 100644 --- a/src/extensible-areas/user-list-item-additional-information/types.ts +++ b/src/extensible-areas/user-list-item-additional-information/types.ts @@ -1,4 +1,5 @@ import { PluginProvidedUiItemDescriptor } from '../base'; +import { PluginIconType } from '../common/icon'; /** * User List Item Additional Information - The general user list item additional information item @@ -14,14 +15,14 @@ export interface UserListItemAdditionalInformationInterface extends PluginProvid export interface UserListItemIconProps { id?: string; userId: string; - icon: string; + icon: PluginIconType; dataTest?: string; } export interface UserListItemLabelProps { id?: string; userId: string; - icon: string; + icon: PluginIconType; label: string; dataTest?: string; } diff --git a/src/ui-commands/notification/types.ts b/src/ui-commands/notification/types.ts index 6bb25427..b2a572a3 100644 --- a/src/ui-commands/notification/types.ts +++ b/src/ui-commands/notification/types.ts @@ -1,4 +1,5 @@ import { NotificationTypeUiCommand } from './enums'; +import { PluginIconType } from '../../extensible-areas/common/icon'; export interface SendNotificationCommandArgumentsOptions { helpLabel?: string, @@ -8,7 +9,7 @@ export interface SendNotificationCommandArgumentsOptions { export interface SendNotificationCommandArguments { message: string; - icon: string; + icon: PluginIconType; type: NotificationTypeUiCommand; options?: SendNotificationCommandArgumentsOptions; content?: string;