Base Service Functions¶
Following functions are provided in the WidgetBaseService that can be used for widget development. Actual implementation of these functions are injected from the client framework. These are exposed through CloudHomeWidgetBaseDirective
which is extended by each widget entry component. Several base framework utility services are provided to support various widget functional requirements.
widgetFrameworkUtilsService¶
Consists of a set of methods that can be used to access a generic set of framework functions for various purposes.
navigate¶
Trigger navigate action (to some other page) from a widget
Parameters:
- url [string] - URL of the page to navigate
- context [any] - any contextual information to be passed when navigating to the page
Example:
this.widgetFrameworkUtilsService.navigate('page/ViewDocuments/DocumentActivities', {});
this.widgetFrameworkUtilsService.navigate('page/ViewDocuments/DocumentActivities?$filter=DocId eq 10', {});
translate$¶
Get the translated value for a translatable label
Parameters:
- key [string] - Property name of the translatable (In Marble client file or default translations JSON file)
Returns:
- Observable
- translation value
Example:
translatedReportedHoursLabel$: Observable<string> = this.widgetFrameworkUtilsService.translate$('ReportedHours').pipe(take(1));
translationsLoadingState$¶
Get the loading state of the translations
Returns:
- Observable
- loading state ('initial' | 'loading' | 'loaded' | 'error')
Example:
translationsLoadingState$: Observable<TranslationsLoadingState | null> = this.widgetFrameworkUtilsService.translationsLoadingState$();
setCopilotPrompt¶
Used to pass a prompt from a widget to the copilot.
Parameters:
- widgetId [string] - ID of the widget
- prompt [string] - prompt to be shown in the copilot chat
- description [string] - prompt description
- openPanel [boolean] - (deprecated) whether to open the copilot panel or not (true by default)
- context [Array
] - (optional) context params to be passed to the copilot, CopilotPromptParam is an id/value pair
Example:
this.widgetFrameworkUtilsService.setCopilotPrompt(fwWidget2Metadata.id, `Please show me guidelines to ${type} an Order`, `Guidelines to ${type} an Order`, true, [{id: 'isDemo', value: true}]);
copilotAvailable¶
Used to enable widgets to check whether the copilot is available or not
Returns:
- Observable
- copilot availability status
Example:
// TS
showCopilotButtons$: Observable<boolean> = this.widgetFrameworkUtilsService.copilotAvailable();
// HTML
<button *ngIf="showCopilotButtons$ | async" graniteButton (click)="getAIHelp()">
<granite-icon>help-ai</granite-icon>
</button>
getTeamsAudioCall¶
Start a Teams audio call with a contact person
Parameters:
- email [string] - Email address of the contact
Example:
this.widgetFrameworkUtilsService.getTeamsAudioCall('alain.prost@mmail.com');
getTeamsVideoCall¶
Start a Teams video call with a contact person
Parameters:
- email [string] - Email address of the contact
Example:
this.widgetFrameworkUtilsService.getTeamsVideoCall('alain.prost@mmail.com');
startTeamsChat¶
Start a Teams chat with a contact person
Parameters:
- email [string] - Email address of the contact
Example:
this.widgetFrameworkUtilsService.startTeamsChat('alain.prost@mmail.com');
showToastMessage¶
Show a toast message in IFS Cloud
Parameters:
- type [MessageType] - Type of toast message (Error | Warning | Info | Success)
- message [string] - Message to be shown in the toast
- title [string] - (optional) Title of the toast message
- details [string] - (optional) Additional details for the toast message
Example:
this.widgetFrameworkUtilsService.showToastMessage(MessageType.Error, 'Error occured while loading Widget data!', 'Failed Loading Widget Data');
showMessageBox¶
Show a message box in IFS Cloud
Parameters:
- message [string] - Message to be shown in the message box
- type [MessageBoxType] - (optional) Type of the message box (Error | Warning | Information | Question | Generic | Server),
- title [string] - (optional) Title of the message box
- standardActions [MessageBoxActions] - (optional) Standard message box actions (Ok | OkCancel | YesNo | YesNoCancel)
- customActions [Array
] - (optional) Set of custom action button names - customIcon [string] - (optional) Custom icon
- preselected [any] - (optional) Pre-selected action button
- wide [boolean] - (optional) Is a wide message box
Returns:
- Observable
- User Response for the message box action
Example:
this.widgetFrameworkUtilsService.showMessageBox('Error occured while loading Widget data!', MessageBoxType.Error, 'Failed Loading Widget Data', MessageBoxActions.Ok);
- odataFunction(fn: string, options?: any): Observable
- odataAction(fn: string, params: any): Observable
- getApplicationContext(): Observable
- translate$(key: string): Observable
- translationsLoadingState$(): Observable
- getConfig$(): Observable
- getRequest(url: string): Observable
| null> - postRequest(url: string, data: any, etag?: string): Observable
| null> - patchRequest(url: string, data: any, etag: string): Observable
| null> - deleteRequest(url: string, data: any, etag: string): Observable
| null> - navigate(url: string, context: any): Promise
- download(url: string, context?: any): void
- upload(url: string, data: File | string, etag?: string, id?: number): Observable
For crud actions, odata functions, actions and translations require the corresponding client and projection to be added to the metadata.ts. A widget can be mapped to only one projection and one client.
For testing the widgets with these services locally, the below service in TestGround can be mocked. Refer custom-widget-base.service.ts
Writing your own injectable services¶
If the above base services are not sufficient for your implementation, you can write your own abstract service and inject the actual implementation from the client application. Refer fnd-sample-widget-1-context-provider.service
in fnd-sample-widget-1
sample library.