Infsoft.WPE.App.Base 1.0.0-next18

Workplace Experience (WPE) App Base Library

This library contains attributes and interfaces required to implement dynamic apps.

SUMMARY: Your app should implement IAppExtensions and annotate components with the below attributes, any annotated component must implement AppComponent or AppJsComponent and can use it's method to resolve services registered in the IAppExtensions.RegisterServices method. Additionally you must define all used routes (that require authentication).

NOTE: Version 1.0 of this library contains breaking changes and should only be used for WPE 3.0

Attributes

The following attributes allow marking of Blazor components as specific components, which can be dynamically rendered in infsoft's Workplace Experience application.

• App Fullscreen content of module (navbar not visible)
• NavEntry Entry to be rendered in the app's navbar
• PoI Content to be rendered for a singular POI
• Tile Content to be rendered as tile

Notable changes to pre 1.0:

• No mobile attribute present or necessary, use media-queries instead.
• Reduced number of attribute entrypoints
• Interface changes to comply with new architecture of application

Interfaces

Some of the above mentioned attributes require the component to implement a specific interface. This is required to pass parameters to the component dynamically.

• IPoIParameters Any PoI component receives the unique identifier of the PoI it was opened for, as well as any properties the PoI might specify
• ISubscriptionParameter Any app or tile receives the subscription it should be rendered for (this is optional, if your tile does not require any subscription specific data)
• INameParameter Allows apps, tiles and navEntries to define their name, it's used for the page title, tile name and nav entry name respectively.
• IPoIButton Allows apps to define buttons shown on a PoI detail page (additionally to the PoI components).

Defining Route mappings

This section is only relevant for the web application, native apps will ignore the mappings.

The application utilizes a Backend for Frontend (BFF) pattern, as such all requests that require authentication/authorization on the backend, must be proxied by the web backend. To achieve this dynamically, each app must implement GetRouteMappings of the IAppExtensions interface. Every request made by your app, will be filtered according to your mappings and whenever a request is made towards a defined baseUrl, it is replaced with the web app's base url and a dynamically generated hash. Then the request is made towards the web backend, which utilizes the application cookie to authorize the request and proxy it to your original URL and then returning the backend's response.

Dependency Injection

Services can be registered with the container for Dependency Injection. Simply follow the below guidelines.

Service registration

Every developed module might require the registration of services for dependency injection. To allow this, an extension point is provided by implementing the corresponding IAppExtensions interface. Every service, that is registered with the RegisterServices method, will be registered in a custom scope unique to the module. This allows for quick dynamic assembly loading after startup.

Service injection

To inject your services, two possiblities exist:

1. In normal .cs files, you can use constructor injection as you would anywhere else
2. In razor components, you have to inherit from the provided AppComponent or AppJsComponent and use the provided method to set your service instances. Services, that are provided globally (by infsoft), e.g. the JavaScript runtime, can be injected with the @inject directive. Sample:

    @using Infsoft.WPE.App.Modules.Base
    @inherits AppComponent
    @inject IJSRuntime JSRuntime
   
    @code {
        private ISampleService SampleService;
   
        protected override void OnInitialized()
        {
            base.OnInitialized();
            SampleService = GetService<ISampleService>();
        }
    }
   

JavaScript Modules

One caveat of separating the assemblies in different contexts, is that you cannot directly inject IJSRuntime into your code wrapper for the JavaScript code. You can only use IJSRuntime by injecting it in the razor classes and then passing it along to your module class as a method parameter.

Therefore, if you do not have JS code shared between multiple razor classes, you can simply inherit from AppJsComponent. This class provides you with InvokeVoidAsync and InvokeAsync methods, which will automatically load your module scoped JavaScript.