Interface ComponentContext<ComponentContextInputs>

The Component Context provides access to the component's inputs, the page's time range, to the LoggingDataClient and ResourceDataClient and to other application data.

interface ComponentContext<ComponentContextInputs> {
    appData: ComponentContextAppData;
    componentBaseUrl: string;
    destroyed: boolean;
    inputMap: Map<string, any>;
    inputs: ComponentContextInputs;
    mode: "view" | "edit";
    ontimerangechange: null | ((newTimeRange: LoggingDataTimeRange) => any);
    onvpnclientstatuschange: null | ((newStatus: null | VpnClientStatus) => any);
    timeRange: LoggingDataTimeRange;
    timeRangeIsAdjustable: boolean;
    vpnClientStatus: null | VpnClientStatus;
    createBackendComponentClient(): BackendComponentClient;
    createLoggingDataClient(): LoggingDataClient;
    createObjectStorageClient(): ObjectStorageClient;
    createResourceDataClient(): ResourceDataClient;
    createTooltip(target: HTMLElement, options: TooltipOptions): Tooltip;
    destroy(): void;
    getApiUrl(rel: string, params?: {
        [param: string]: string;
    }): string;
    navigateByUrl(url: string): void;
    openAlertDialog(options: AlertDialogOptions): Promise<undefined | true>;
    openConfirmDialog(options: ConfirmDialogOptions): Promise<undefined | boolean>;
    openFormDialog(options: FormDialogOptions): Promise<undefined | false | FormDialogResult>;
    sanitizeHtml(html: string, options?: {
        allowStyleAttr?: boolean;
    }): null | string;
    saveAsFile(data: string | Blob, fileName: string): void;
    setTimeRange(timeRange: LoggingDataTimeRange): void;
    showVpnStatusDetails(agentId: string): void;
    testVpnAccess(agentId: string): boolean;
    toggleVpn(agentId: string): void;
    translate(key: string, interpolateParams?: Object, options?: TranslateOptions): string;
    translate<T>(key: T[], interpolateParams?: Object, options?: TranslateOptions): Record<T, string>;
    translate<T>(key: string | T[], interpolateParams?: Object, options?: TranslateOptions): string | Record<T, string>;
}

Type Parameters

  • ComponentContextInputs extends object = {
        [key: string]: any;
    }

Properties

appData componentBaseUrl destroyed inputMap inputs mode ontimerangechange onvpnclientstatuschange timeRange timeRangeIsAdjustable vpnClientStatus

Methods

createBackendComponentClient createLoggingDataClient createObjectStorageClient createResourceDataClient createTooltip destroy getApiUrl navigateByUrl openAlertDialog openConfirmDialog openFormDialog sanitizeHtml saveAsFile setTimeRange showVpnStatusDetails testVpnAccess toggleVpn translate

Properties

appData

appData: ComponentContextAppData

Application data.

ExperimentalcomponentBaseUrl

componentBaseUrl: string

The component's base URL. This can be used to compose an absolute URL to a static component asset.

For example:

new URL('./static/image.png', context.componentBaseUrl).href;

destroyed

destroyed: boolean

True if destroy is called and has destroyed all clients.

inputMap

inputMap: Map<string, any>

Values for the inputs declared in the components manifest file as a Javascript Map.

inputs

inputs: ComponentContextInputs

Values for the inputs declared in the components manifest file

mode

mode: "view" | "edit"

'edit' when the component is used in the Studio, else 'view'.

ontimerangechange

ontimerangechange: null | ((newTimeRange: LoggingDataTimeRange) => any)

Called when the time range is changed

onvpnclientstatuschange

onvpnclientstatuschange: null | ((newStatus: null | VpnClientStatus) => any)

Called when the VPN client status changes

timeRange

timeRange: LoggingDataTimeRange

Snapshot of the current time range

timeRangeIsAdjustable

timeRangeIsAdjustable: boolean

If the time range is adjustable.

vpnClientStatus

vpnClientStatus: null | VpnClientStatus

Snapshot of the current VPN client status.

Methods

createBackendComponentClient

createLoggingDataClient

  • createLoggingDataClient(): LoggingDataClient

  • Creates a client to retrieve logging data.

    Every time this method is called, a new client is created.

    Returns LoggingDataClient

createObjectStorageClient

createResourceDataClient

createTooltip

  • createTooltip(target, options): Tooltip

  • Attaches a tooltip on the target element.

    Parameters

    • target: HTMLElement

      the target element

    • options: TooltipOptions

      configures the tooltip message and other (optional) properties

    Returns Tooltip

    returns the tooltip instance

destroy

  • destroy(): void

  • Destroy the clients associated to this context and destroy the context.

    Returns void

getApiUrl

  • getApiUrl(rel, params?): string

  • Get the endpoint for a resource, the rel.

    Parameters

    • rel: string

      The name of the resource, see the reference for all resource relations.

    • Optionalparams: {
          [param: string]: string;
      }

      Extra query parameters, see the reference for all the URL and query paramaters that can be used for a specific resource.

      • [param: string]: string

    Returns string

navigateByUrl

  • navigateByUrl(url): void

  • Use this method to navigate to a specific page in the portal, for example the VNC-viewer. Don't use this method to navigate to navigate outside the Portal.

    Parameters

    • url: string

      The URL to navigate to, don't include the host.

    Returns void

openAlertDialog

  • openAlertDialog(options): Promise<undefined | true>

  • Opens an alert dialog.

    Parameters

    Returns Promise<undefined | true>

openConfirmDialog

  • openConfirmDialog(options): Promise<undefined | boolean>

  • Opens a confirmation dialog.

    Parameters

    Returns Promise<undefined | boolean>

openFormDialog

sanitizeHtml

  • sanitizeHtml(html, options?): null | string

  • Helps preventing Cross Site Scripting Security bugs (XSS) by sanitizing the passed HTML, removing any potentially unsafe content.

    Parameters

    • html: string

      the HTML to sanitize

    • Optionaloptions: {
          allowStyleAttr?: boolean;
      }

      allowStyleAttr: if set to true, the style attribute will be allowed in the HTML. Defaults to false

      • OptionalallowStyleAttr?: boolean

    Returns null | string

saveAsFile

  • saveAsFile(data, fileName): void

  • Save a file.

    Parameters

    • data: string | Blob

      the file data to save

    • fileName: string

      the name of the file

    Returns void

setTimeRange

  • setTimeRange(timeRange): void

  • Set a new time range. Check timeRangeIsAdjustable to verify the time range is adjustable

    Parameters

    Returns void

showVpnStatusDetails

  • showVpnStatusDetails(agentId): void

  • Open a dialog with VPN status details for an agent.

    Parameters

    • agentId: string

      The agent to show VPN status info for

    Returns void

testVpnAccess

  • testVpnAccess(agentId): boolean

  • Tests whether the currently logged in user has VPN access to the Agent with the given {@code agentId}.

    Parameters

    • agentId: string

      the Agent ID

    Returns boolean

    true if the user has access, false otherwise

toggleVpn

  • toggleVpn(agentId): void

  • Connects or disconnects the VPN-client

    Parameters

    • agentId: string

      The public ID of the agent to connect to or disconnect from.

    Returns void

translate

  • translate(key, interpolateParams?, options?): string

  • Translate a key to the user's language.

    Parameters

    Returns string

  • translate<T>(key, interpolateParams?, options?): Record<T, string>

  • Type Parameters

    • T extends string

    Parameters

    Returns Record<T, string>

  • translate<T>(key, interpolateParams?, options?): string | Record<T, string>

  • Type Parameters

    • T extends string

    Parameters

    Returns string | Record<T, string>

Settings

Member Visibility

On This Page

Properties
Methods