[ACA-3317] Split About component into smaller components (#5708)

demo-shell/src/app/components/about/about.component.html

@@ -1,12 +1,11 @@
-<adf-about-github-link
-    [url]="url"
-    [version]="version">
-</adf-about-github-link>
+<adf-about-github-link [application]="application" [url]="url" [version]="version"></adf-about-github-link>
 
-<adf-about-product-version>
-</adf-about-product-version>
+<adf-about-server-settings></adf-about-server-settings>
+
+<adf-about-product-version> </adf-about-product-version>
 
 <adf-about-application-modules
     [dependencies]="dependencies"
-    [showExtensions]="showExtensions">
+    [showExtensions]="showExtensions"
+>
 </adf-about-application-modules>

demo-shell/src/app/components/about/about.component.ts

@@ -15,22 +15,32 @@
  * limitations under the License.
  */
 
-import { Component } from '@angular/core';
-import { name, version, commit, dependencies } from '../../../../../package.json';
+import { Component, OnInit } from '@angular/core';
+import {
+    name,
+    version,
+    commit,
+    dependencies
+} from '../../../../../package.json';
+import { AppConfigService } from '@alfresco/adf-core';
 
 @Component({
     selector: 'app-about-page',
     templateUrl: './about.component.html',
     styleUrls: ['about.component.scss']
 })
-export class AboutComponent {
-
+export class AboutComponent implements OnInit {
     url = `https://github.com/Alfresco/${name}/commits/${commit}`;
     version = version;
     dependencies = dependencies;
     showExtensions = true;
+    application = '';
 
-    constructor() {
+    constructor(private appConfigService: AppConfigService) {}
 
+    ngOnInit() {
+        this.application = this.appConfigService.get<string>(
+            'application.name'
+        );
     }
 }