About¶

Usage¶

The About Page is a part of an overarching concept to fulfil legal guidelines beside of providing additional information about the product (e.g. version).

Code¶

The component has 3 modes which can be selected using the licenseInfo parameter.

• api (preferred): License texts are lazy loaded separately for each component. Requires a service to provide license data. With the parameter licenseInfo.icon you can set a custom license file icon.
• text: Plain text input to dump all license texts
• iframe (avoid): Embedded page to display the licenses from another source.

Usage¶

import { SiAboutComponent } from '@siemens/element-ng/about';

@Component({
  imports: [SiAboutComponent,...]
})

Please use the appropriate input properties for the legal artifact links like Corporate Information or Acceptable Use Policy. This ensures the same order in all applications.

License via API¶

The API variant allows fast and neat navigation through the different license files. By clicking on the subsystems and components, the license details are loaded lazily via API and revealed when loaded.

Just set the licenseInfo.api parameter to the API endpoint which provides the license data.

License data format¶

The JSON based API supported by the about dialog is structured into three levels of endpoints:

1. Endpoint: /api/licenses/
2. MIME Type: application/json
3. Description: Top-level index listing all subsystems

4. Result:

   [
     { "name": "OS", "href": "/api/licenses/os/" },
     { "name": "Dummy", "href": "/api/licenses/Dummy/" }
   ]
   

5. Endpoint: /api/licenses/<subsystem>

6. MIME Type: application/json
7. Description: Subsystem-level index listing all components

8. Result:

   [{ "name": "boost 1.66", "href": "/api/licenses/os/boost_1.66.copyright" }]
   

9. Endpoint: /api/licenses/<subsystem>/<component>

10. MIME Type: text/plain
11. Description: Literal content of the component’s copyright or acknowledgement file
12. Result:

    Boost copyright text
    

License Text¶

Use the licenseInfo.text parameter to display the provided license text as plain text.

License introduction text and API¶

If your application requires showing a disclaimer in addition to the component licenses provided via API, you can combine the parameters licenseInfo.text and licenseInfo.api.

License Iframe¶

You can also use a URL in the licenseInfo.iframe parameter to show an embedded page containing license information.

Security considerations¶

The licenseInfo.iframe URL is marked as a trusted resource URL and is not sanitized by Angular. Only pass URLs from trusted sources.

SiAboutComponent API Documentation¶

Input Properties¶

Name	Type	Default	Description
aboutTitle ¶	string		Title shown above the about information.
acceptableUsePolicyLink ¶	Link		Link to Acceptable Use Policy .
appName ¶	string		Title of this application.
cookieNoticeLink ¶	Link		Link to Cookie Notice .
copyrightDetails ¶	CopyrightDetails		Copyright information to be displayed. Alternatively, you can use the SI_COPYRIGHT_DETAILS global inject.
icon ¶	string		Path to the application logo. Use for image
iconName ¶	string		Name of element icon. Use as alternative to image
imprintLink ¶	Link		Link to Corporate Information .
licenseInfo ¶	LicenseInfo		Define mode to display the licenses. See LicenseInfo
links ¶	Link[]	[]	Additional links listed in the about section.
logoAlt ¶	TranslatableString	$localize`:@@SI_ABOUT.LOGO_ALT:{{appName}} logo`	Alt text for the application logo. Supports {{appName}} placeholder for interpolation.
privacyLink ¶	Link		Link to Privacy Notice .
subheading ¶	string[]		Sub titles of the application. Shown as a list below the application name. (Optional)
termsLink ¶	Link		Link to Terms of Use .

Types Documentation¶