You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by mt...@apache.org on 2022/03/12 01:25:57 UTC

[nifi] branch main updated: NIFI-8899 - Add NiFi Registry version information to the Registry under an "about" button. (#5743)

This is an automated email from the ASF dual-hosted git repository.

mtien pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/nifi.git


The following commit(s) were added to refs/heads/main by this push:
     new d424537  NIFI-8899 - Add NiFi Registry version information to the Registry under an "about" button. (#5743)
d424537 is described below

commit d424537c53e8b9a79cc91260d63220738616d685
Author: David Young <48...@users.noreply.github.com>
AuthorDate: Fri Mar 11 20:25:47 2022 -0500

    NIFI-8899 - Add NiFi Registry version information to the Registry under an "about" button. (#5743)
    
    * NIFI-8899 - Add NiFi Registry version information to the Registry under an "about" button.
    
    Add a new endpoint to the registry API that serves up the project version.
    Add a new "about" button to the Registry layout that shows a dialog with
    version information.
    
    * NIFI-8899 - Change where the version information is retrieved from
    
    Change from pulling the version information from the POM itself, set by having maven filter the properties file at build time, to getting it from the `NiFiRegistryApiApplication` class's `getImplementationVersion` method.
    
    * NIFI-8899 - Remove unused dependency
    
    Left in an extra import
    
    * NIFI-8899 - Rebase and update npm dependencies
    
    Rebased on top of main, merged new dependencies
    Updated and locking Sass to 1.49.7
    
    * NIFI-8899 - Update typescript
    
    Updated typescript to something more modern. (latest)
    
    * NIFI-8899 - Change Version to RegistryVersion
    
    Changed plain 'Version' to be more explicit about whose version: Registry
    Changed the url endpoint from 'version' to 'about' to make it more clear it's
      not a versioned resource but information about the registry itself
    
    * NIFI-8899 - Reflect new API in UI, look-and-feel, build-and-run script
    
    API changes are now reflected in the UI
    Bring the look-and-feel more inline with the Nifi about page.
      It's not perfect, but it looks much better than before.
    Update the build-and-run script for the registry to not actually run the
      registry if the build didn't complete
    
    * NIFI-8899 - Fix spacing, documentation
    
    Removed unused import
    Fixed param name in javadoc
    Fixed spacing in HTML
    
    * NIFI-8899 - Change to dialogService, fix styling
    
    Changed close button to use raised accent styling
    Moved dialog showing into nf-registry.api.js
    Changed click call to show dialog using the api method
    Showing the dialog now makes the api call before rendering.
    
    * NIFI-8899 - Fixed styling, refactored the about dialog codepath
    
    Changed close button to use raised primary style
    Changed click call to use nf-regisry.js to call the api method
      Removed the extra call to show the dialog.
    Removed some comments and outdated references
    
    Merged #5743 into main.
---
 nifi-registry/build-and-run.sh                     |  9 ++--
 .../org/apache/nifi/registry/RegistryAbout.java    | 49 +++++++++++++++++
 .../registry/web/NiFiRegistryResourceConfig.java   |  2 +
 .../registry/web/api/RegistryAboutResource.java    | 63 ++++++++++++++++++++++
 .../src/main/package-lock.json                     | 15 +++---
 .../nifi-registry-web-ui/src/main/package.json     |  5 +-
 .../dialogs/about/nf-registry-explorer-about.html  | 36 +++++++++++++
 .../dialogs/about/nf-registry-explorer-about.ts    | 36 +++++++++++++
 .../src/main/webapp/nf-registry.html               |  3 ++
 .../src/main/webapp/nf-registry.js                 |  6 +++
 .../src/main/webapp/nf-registry.module.js          |  5 +-
 .../src/main/webapp/services/nf-registry.api.js    | 22 +++++++-
 .../explorer/dialogs/_aboutElements.scss           | 23 ++++++++
 .../src/main/webapp/theming/nf-registry.scss       |  1 +
 14 files changed, 258 insertions(+), 17 deletions(-)

diff --git a/nifi-registry/build-and-run.sh b/nifi-registry/build-and-run.sh
index 168e330..3579f2e 100755
--- a/nifi-registry/build-and-run.sh
+++ b/nifi-registry/build-and-run.sh
@@ -23,11 +23,10 @@ SKIP_UI=$1
 ./${REGISTRY_SCRIPT} stop
 
 if [ "$SKIP_UI" == "skipUi" ]; then
-  mvn clean install -Pcontrib-check --projects \!nifi-registry-web-ui
+  CMND="mvn clean install -Pcontrib-check --projects \!nifi-registry-web-ui"
 else
-  mvn clean install -Pcontrib-check
+  CMND="mvn clean install -Pcontrib-check"
 fi
 
-./${REGISTRY_SCRIPT} start
-
-tail -n 500 -f ${REGISTRY_DIR}/logs/nifi-registry-app.log
+# Don't actually start the registry if the build didn't succeed. 
+${CMND} && ./${REGISTRY_SCRIPT} start && tail -n 500 -f ${REGISTRY_DIR}/logs/nifi-registry-app.log
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-data-model/src/main/java/org/apache/nifi/registry/RegistryAbout.java b/nifi-registry/nifi-registry-core/nifi-registry-data-model/src/main/java/org/apache/nifi/registry/RegistryAbout.java
new file mode 100644
index 0000000..b71812c
--- /dev/null
+++ b/nifi-registry/nifi-registry-core/nifi-registry-data-model/src/main/java/org/apache/nifi/registry/RegistryAbout.java
@@ -0,0 +1,49 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package org.apache.nifi.registry;
+
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+
+import javax.xml.bind.annotation.XmlRootElement;
+
+
+@XmlRootElement
+@ApiModel
+public class RegistryAbout {
+    private String registryAboutVersion;
+
+    /**
+     * Container for the version string of this Registry.
+     *
+     * @param registryAboutVersion the version string for this Registry
+     */
+    public RegistryAbout(String registryAboutVersion) {
+        this.registryAboutVersion = registryAboutVersion;
+    }
+
+    /**
+     * @return the version string of this NiFi Registry. This value is read only
+     */
+    @ApiModelProperty(
+            value = "The version string for this Nifi Registry",
+            readOnly = true
+    )
+    public String getRegistryAboutVersion() {
+        return registryAboutVersion;
+    }
+}
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/NiFiRegistryResourceConfig.java b/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/NiFiRegistryResourceConfig.java
index d033ef2..81e2504 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/NiFiRegistryResourceConfig.java
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/NiFiRegistryResourceConfig.java
@@ -28,6 +28,7 @@ import org.apache.nifi.registry.web.api.ExtensionResource;
 import org.apache.nifi.registry.web.api.FlowResource;
 import org.apache.nifi.registry.web.api.ItemResource;
 import org.apache.nifi.registry.web.api.TenantResource;
+import org.apache.nifi.registry.web.api.RegistryAboutResource;
 import org.glassfish.jersey.media.multipart.MultiPartFeature;
 import org.glassfish.jersey.server.ResourceConfig;
 import org.glassfish.jersey.server.ServerProperties;
@@ -70,6 +71,7 @@ public class NiFiRegistryResourceConfig extends ResourceConfig {
         register(ItemResource.class);
         register(TenantResource.class);
         register(ConfigResource.class);
+        register(RegistryAboutResource.class);
 
         // register multipart feature
         register(MultiPartFeature.class);
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/api/RegistryAboutResource.java b/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/api/RegistryAboutResource.java
new file mode 100644
index 0000000..81f5698
--- /dev/null
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-api/src/main/java/org/apache/nifi/registry/web/api/RegistryAboutResource.java
@@ -0,0 +1,63 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package org.apache.nifi.registry.web.api;
+
+import io.swagger.annotations.Api;
+import io.swagger.annotations.ApiOperation;
+import io.swagger.annotations.Authorization;
+import org.apache.nifi.registry.NiFiRegistryApiApplication;
+import org.apache.nifi.registry.RegistryAbout;
+import org.apache.nifi.registry.event.EventService;
+import org.apache.nifi.registry.web.service.ServiceFacade;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Component;
+
+import javax.ws.rs.GET;
+import javax.ws.rs.Path;
+import javax.ws.rs.Produces;
+import javax.ws.rs.core.MediaType;
+import javax.ws.rs.core.Response;
+
+@Component
+@Path("/about")
+@Api(
+        value = "about",
+        description = "Retrieves the version information for this NiFi Registry.",
+        authorizations = { @Authorization("Authorization") }
+)
+public class RegistryAboutResource extends ApplicationResource {
+
+    @Autowired
+    public RegistryAboutResource(
+            final ServiceFacade serviceFacade,
+            final EventService eventService) {
+        super(serviceFacade, eventService);
+    }
+
+    @GET
+    @Produces(MediaType.APPLICATION_JSON)
+    @ApiOperation(
+            value = "Get version",
+            notes = "Gets the NiFi Registry version.",
+            response = RegistryAbout.class
+    )
+    public Response getVersion() {
+        final String implVersion = NiFiRegistryApiApplication.class.getPackage().getImplementationVersion();
+        final RegistryAbout version = new RegistryAbout(implVersion);
+        return Response.status(Response.Status.OK).entity(version).build();
+    }
+}
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package-lock.json b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package-lock.json
index ca27472..11d4ff5 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package-lock.json
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package-lock.json
@@ -20,6 +20,7 @@
         "reset-css": "4.0.1",
         "moment": "2.22.1",
         "angular2-jwt": "0.2.3",
+        "sass": "1.49.7",
         "querystring": "0.2.0",
         "font-awesome": "4.7.0",
         "@nifi-fds/core": "0.3.0",
@@ -59,7 +60,7 @@
         "css-loader": "5.2.7",
         "license-webpack-plugin": "2.1.1",
         "karma-cli": "2.0.0",
-        "typescript": "3.5.3",
+        "typescript": "4.5.5",
         "@babel/preset-env": "7.4.4",
         "stylelint": "14.2.0",
         "eslint-plugin-jasmine": "4.1.3",
@@ -5905,9 +5906,9 @@
       }
     },
     "node_modules/typescript": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.5.3.tgz",
-      "integrity": "sha512-ACzBtm/PhXBDId6a6sDJfroT2pOWt/oOnk4/dElG5G33ZL776N3Y6/6bKZJBFpd+b05F3Ct9qDjMeJmRWtE2/g==",
+      "version": "4.5.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.5.5.tgz",
+      "integrity": "sha512-TCTIul70LyWe6IJWT8QSYeA54WQe8EjQFU4wY52Fasj5UKx88LNYKCgBEHcOMOrFF1rKGbD8v/xcNWVUq9SymA==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
@@ -26727,9 +26728,9 @@
       }
     },
     "typescript": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.5.3.tgz",
-      "integrity": "sha512-ACzBtm/PhXBDId6a6sDJfroT2pOWt/oOnk4/dElG5G33ZL776N3Y6/6bKZJBFpd+b05F3Ct9qDjMeJmRWtE2/g==",
+      "version": "4.5.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.5.5.tgz",
+      "integrity": "sha512-TCTIul70LyWe6IJWT8QSYeA54WQe8EjQFU4wY52Fasj5UKx88LNYKCgBEHcOMOrFF1rKGbD8v/xcNWVUq9SymA==",
       "dev": true
     },
     "ua-parser-js": {
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package.json b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package.json
index 35815ab..e83c36a 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package.json
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/package.json
@@ -64,6 +64,7 @@
         "reset-css": "4.0.1",
         "roboto-fontface": "0.10.0",
         "rxjs": "6.6.7",
+        "sass": "1.49.7",
         "superagent": "3.8.3",
         "tslib": "1.8.0",
         "zone.js": "0.11.4"
@@ -102,7 +103,7 @@
         "license-webpack-plugin": "2.1.1",
         "lint-staged": "12.2.2",
         "mini-css-extract-plugin": "0.12.0",
-        "npm-force-resolutions": "0.0.10",
+        "npm-force-resolutions": "^0.0.10",
         "null-loader": "3.0.0",
         "optimize-css-assets-webpack-plugin": "6.0.1",
         "sass": "1.32.0",
@@ -112,7 +113,7 @@
         "stylelint-config-standard-scss": "3.0.0",
         "terser-webpack-plugin": "1.4.5",
         "ts-loader": "6.0.4",
-        "typescript": "3.5.3",
+        "typescript": "4.5.5",
         "url-loader": "1.1.2",
         "webpack": "4.46.0",
         "webpack-cli": "4.9.1",
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.html b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.html
new file mode 100644
index 0000000..9880368
--- /dev/null
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.html
@@ -0,0 +1,36 @@
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h2 mat-dialog-title>About Nifi Registry</h2>
+<div id="nf-registry-about-dialog" class="pad-sm mat-typography">
+    <div id="nf-registry-about-pic-container">
+        <div id="nf-registry-about-pic"></div>
+    </div>
+    <div id="nf-registry-about-version-info">
+        <p>Registry Version: {{ data.registryAboutVersion }}</p>
+    </div>
+    <div id="nf-registry-about-description">
+        <p>
+            Registry — a subproject of Apache NiFi — is a complementary application that provides
+            a central location for storage and management of shared resources across one or more
+            instances of NiFi and/or MiNiFi.
+        </p>
+    </div>
+</div>
+<mat-dialog-actions align="end">
+    <button mat-raised-button color="fds-primary" mat-dialog-close>Close</button>
+</mat-dialog-actions>
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.ts b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.ts
new file mode 100644
index 0000000..4fe9465
--- /dev/null
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.ts
@@ -0,0 +1,36 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Inject } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog'
+
+export interface DialogData {
+    registryAboutVersion: string
+}
+
+@Component({
+    selector: 'nifi-registry-explorer-about-dialog',
+    templateUrl: './nf-registry-explorer-about.html'
+})
+export class NfRegistryExplorerAbout {
+    /**
+     * NfRegistryExplorerAbout constructor.
+     *
+     * @param data - The data to be injected into the dialog
+     */
+    constructor(@Inject(MAT_DIALOG_DATA) public data: DialogData) { }
+}
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.html b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.html
index 97f2ac0..4878b73 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.html
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.html
@@ -79,6 +79,9 @@ limitations under the License.
             <div id="nifi-registry-documentation" *ngIf="nfRegistryService.perspective !== 'login'" class="pad-right-sm">
                 <a matTooltip="Help" href="{{nfRegistryService.documentation.link}}" target="_blank"><i class="fa fa-question-circle help-icon" aria-hidden="true"></i></a>
             </div>
+            <button matTooltip="About" mat-ripple (click)="showAboutDialog()" mat-icon-button>
+                <i class="fa fa-info help-icon" aria-hidden="true"></i>
+            </button>
             <button matTooltip="Settings" mat-ripple *ngIf="nfRegistryService.currentUser.resourcePermissions.anyTopLevelResource.canRead && nfRegistryService.perspective === 'explorer'" mat-icon-button
                     routerLink="administration/workflow">
                 <i class="fa fa-wrench" aria-hidden="true"></i>
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.js b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.js
index a79cb62..2d71308 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.js
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.js
@@ -99,6 +99,12 @@ NfRegistry.prototype = {
         } else {
             self.router.navigateByUrl('login');
         }
+    },
+    /**
+     * Show the NiFi Registry About dialog window.
+     */
+    showAboutDialog: function () {
+        this.nfRegistryApi.showRegistryAboutDialog();
     }
 };
 
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.module.js b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.module.js
index 2f9a4bd..d5e0976 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.module.js
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/nf-registry.module.js
@@ -55,6 +55,7 @@ import {
 import NfRegistryImportVersionedFlow from './components/explorer/grid-list/dialogs/import-versioned-flow/nf-registry-import-versioned-flow';
 import NfRegistryImportNewFlow from './components/explorer/grid-list/dialogs/import-new-flow/nf-registry-import-new-flow';
 import NfRegistryExportVersionedFlow from './components/explorer/grid-list/dialogs/export-versioned-flow/nf-registry-export-versioned-flow';
+import { NfRegistryExplorerAbout } from './components/explorer/dialogs/about/nf-registry-explorer-about';
 
 function NfRegistryModule() {
 }
@@ -74,6 +75,7 @@ NfRegistryModule.annotations = [
         declarations: [
             NfRegistry,
             NfRegistryExplorer,
+            NfRegistryExplorerAbout,
             NfRegistryAdministration,
             NfRegistryUsersAdministration,
             NfRegistryManageUser,
@@ -108,7 +110,8 @@ NfRegistryModule.annotations = [
             NfUserLoginComponent,
             NfRegistryExportVersionedFlow,
             NfRegistryImportVersionedFlow,
-            NfRegistryImportNewFlow
+            NfRegistryImportNewFlow,
+            NfRegistryExplorerAbout
         ],
         providers: [
             NfRegistryService,
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/services/nf-registry.api.js b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/services/nf-registry.api.js
index 974679b..bb04339 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/services/nf-registry.api.js
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/services/nf-registry.api.js
@@ -20,6 +20,7 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { FdsDialogService } from '@nifi-fds/core';
 import { of } from 'rxjs';
 import { map, catchError, take, switchMap } from 'rxjs/operators';
+import { NfRegistryExplorerAbout } from '../components/explorer/dialogs/about/nf-registry-explorer-about';
 
 var MILLIS_PER_SECOND = 1000;
 var headers = new Headers({'Content-Type': 'application/json'});
@@ -28,7 +29,8 @@ var config = {
     urls: {
         currentUser: '../nifi-registry-api/access',
         kerberos: '../nifi-registry-api/access/token/kerberos',
-        oidc: '../nifi-registry-api/access/oidc/exchange'
+        oidc: '../nifi-registry-api/access/oidc/exchange',
+        about: '../nifi-registry-api/about'
     }
 };
 
@@ -985,8 +987,24 @@ NfRegistryApi.prototype = {
                 return of({});
             })
         );
+    },
+    /**
+     * Show the NiFi Registry About dialog.
+     *
+     * @returns {*}
+     */
+    showRegistryAboutDialog: function () {
+        this.http.get(config.urls.about).pipe(
+            map((response) => response),
+            catchError(() => of({}))
+        ).subscribe((versionInfo) => {
+            this.dialogService.open(NfRegistryExplorerAbout, {
+                width: '550px',
+                height: '440px',
+                data: versionInfo
+            });
+        });
     }
-
 };
 
 NfRegistryApi.parameters = [
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/components/explorer/dialogs/_aboutElements.scss b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/components/explorer/dialogs/_aboutElements.scss
new file mode 100644
index 0000000..bba6704
--- /dev/null
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/components/explorer/dialogs/_aboutElements.scss
@@ -0,0 +1,23 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+#nf-registry-about-pic {
+    position: relative;
+    background: url('assets/images/registry-logo-web-app.svg') #fff no-repeat center center;
+    height: 150px;
+    margin-bottom: 30px;
+}
diff --git a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/nf-registry.scss b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/nf-registry.scss
index dc570e5..3e011e9 100644
--- a/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/nf-registry.scss
+++ b/nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/theming/nf-registry.scss
@@ -31,6 +31,7 @@ $mat-font-url: 'node_modules/@covalent/core/common/styles/font/';
 @import 'components/administration/workflow/structureElements';
 @import 'components/explorer/grid-list/structureElements';
 @import 'components/explorer/dialogs/structureElements';
+@import 'components/explorer/dialogs/aboutElements';
 
 @include covalent-material-icons;