feat: add DOCKER_REGISTRY_UI_TITLE and ENABLE_VERSION_NOTIFICATION (#369)

* feature: link title to main view

this way it is possible to go back to the main view, even if two layers deep, i.e. in the history view.

* feature: allow the customization of the title shown in the logo section

we already have REGISTRY_TITLE, but it is used as a reference to where the images come from: "Repositories of …". The UI however does not need to be used in a 1:1 context of the registry. Therefore, the project would benefit from this feature:

We therefore introduce "DOCKER_REGISTRY_UI_TITLE" as a new option, that optionally allows to change the title for more advanced customization and to enable more use cases for this software.

If it is not set, everything will stay the same as prior to this commit and the title will remain "Docker Registry UI"

Note, that the footer will always contain a reference to this project. I think it doesn't need to referenced twice, and makes room for some more customization.

* feature: allow to optionally disable the version check

Note: The default remains to have the version check enabled. It is though sometimes useful to disable it, in the context of customers or open source interests of your software not to bother with version updates to Docker Registry UI.

For example, if you use something like watchtower anyway, there is no need to bother with update notifications to anyone else other then the admin of the server.

* fix: wrongly named environment variable in error template

The environment variables named in the CATALOG_BRANCHING_CONFIGURATION error were wrong.

During that find, i found out that one needs to set both min and max to 0 to disable branching. I tried to make this clear in the README.md file.

* feat: update title and version notification options

Version check done every week instead of every days

---------

Co-authored-by: Joxit <joxit972@gmail.com>

README.md

@@ -115,12 +115,14 @@ Some env options are available for use this interface for **only one server** (w
 - `THEME_*`: See table in [Theme options](#theme-options) section (see [#283](https://github.com/Joxit/docker-registry-ui/pull/283)). Since 2.4.0
 - `TAGLIST_ORDER`: Set the default order for the taglist page, could be `num-asc;alpha-asc`, `num-desc;alpha-asc`, `num-asc;alpha-desc`, `num-desc;alpha-desc`, `alpha-asc;num-asc`, `alpha-asc;num-desc`, `alpha-desc;num-asc` or `alpha-desc;num-desc` (see [#307](https://github.com/Joxit/docker-registry-ui/pull/307)). (default: `alpha-asc;num-desc`). Since 2.5.0
 - `CATALOG_DEFAULT_EXPANDED`: Expand by default all repositories in catalog (see [#302](https://github.com/Joxit/docker-registry-ui/issues/302)). (default: `false`). Since 2.5.0
-- `CATALOG_MIN_BRANCHES`: Set the minimum repository/namespace to expand (e.g. `joxit/docker-registry-ui` `joxit/` is the repository/namespace). Can be 0 to disable branching. (see [#319](https://github.com/Joxit/docker-registry-ui/pull/319)). (default: `1`). Since 2.5.0
-- `CATALOG_MAX_BRANCHES`: Set the maximum repository/namespace to expand (e.g. `joxit/docker-registry-ui` `joxit/` is the repository/namespace). Can be 0 to disable branching. (see [#319](https://github.com/Joxit/docker-registry-ui/pull/319)). (default: `1`). Since 2.5.0
+- `CATALOG_MIN_BRANCHES`: Set the minimum repository/namespace to expand (e.g. `joxit/docker-registry-ui` `joxit/` is the repository/namespace). Branching can be disabled if min and max are set to 0. (see [#319](https://github.com/Joxit/docker-registry-ui/pull/319)). (default: `1`). Since 2.5.0
+- `CATALOG_MAX_BRANCHES`: Set the maximum repository/namespace to expand (e.g. `joxit/docker-registry-ui` `joxit/` is the repository/namespace). Branching can be disabled if min and max are set to 0. (see [#319](https://github.com/Joxit/docker-registry-ui/pull/319)). (default: `1`). Since 2.5.0
 - `TAGLIST_PAGE_SIZE`: Set the number of tags to display in one page. (default: `100`). Since 2.5.0
 - `REGISTRY_SECURED`: By default, the UI will check on every requests if your registry is secured or not (you will see `401` responses in your console). Set to `true` if your registry uses Basic Authentication and divide by two the number of call to your registry. (default `false`). Since 2.5.0
 - `SHOW_TAG_HISTORY`: Whether to show the tag history feature or not. Allows to simplify the user interface by hiding it form the tag list if set to `false`. (default: `true`).
 There are some examples with [docker-compose](https://docs.docker.com/compose/) and docker-registry-ui as proxy [here](https://github.com/Joxit/docker-registry-ui/tree/main/examples/ui-as-proxy/) or docker-registry-ui as standalone [here](https://github.com/Joxit/docker-registry-ui/tree/main/examples/ui-as-standalone/).
+- `DOCKER_REGISTRY_UI_TITLE`: Set a custom title displayed in the header bar. (default: `Docker Registry UI`).
+- `ENABLE_VERSION_NOTIFICATION`: Display notification when a new version of Docker Registry UI is available. This is a weekly check. (default: `true`).
 
 ### Theme options
 

bin/90-docker-registry-ui.sh

@@ -1,5 +1,6 @@
 #!/bin/sh
 
+sed -i "s~\${DOCKER_REGISTRY_UI_TITLE}~${DOCKER_REGISTRY_UI_TITLE}~" index.html
 sed -i "s~\${REGISTRY_URL}~${REGISTRY_URL}~" index.html
 sed -i "s~\${REGISTRY_TITLE}~${REGISTRY_TITLE}~" index.html
 sed -i "s~\${PULL_URL}~${PULL_URL}~" index.html
@@ -18,6 +19,7 @@ sed -i "s~\${CATALOG_MIN_BRANCHES}~${CATALOG_MIN_BRANCHES}~" index.html
 sed -i "s~\${CATALOG_MAX_BRANCHES}~${CATALOG_MAX_BRANCHES}~" index.html
 sed -i "s~\${TAGLIST_PAGE_SIZE}~${TAGLIST_PAGE_SIZE}~" index.html
 sed -i "s~\${REGISTRY_SECURED}~${REGISTRY_SECURED}~" index.html
+sed -i "s~\${ENABLE_VERSION_NOTIFICATION}~${ENABLE_VERSION_NOTIFICATION}~" index.html
 
 grep -o 'THEME[A-Z_]*' index.html | while read e; do
   sed -i "s~\${$e}~$(printenv $e)~" index.html

src/components/docker-registry-ui.riot

@@ -18,8 +18,12 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
   <header>
     <material-navbar>
       <span class="logo">
-        <span>Docker Registry UI</span>
-        <version-notification version="{ latest }" on-notify="{ notifySnackbar }"></version-notification>
+        <span><a href="{ router.home() }">{ props.dockerRegistryUiTitle.trim() || "Docker Registry UI" }</a></span>
+        <version-notification
+          if="{ falsy(props.enableVersionNotification) }"
+          version="{ latest }"
+          on-notify="{ notifySnackbar }"
+        ></version-notification>
       </span>
       <div class="menu">
         <search-bar on-search="{ onSearch }"></search-bar>
@@ -297,6 +301,13 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       flex-direction: row;
     }
 
+    material-navbar .nav-wrapper .logo a {
+      text-decoration: none;
+    }
+    material-navbar .nav-wrapper .logo a:hover {
+      text-decoration: underline;
+    }
+
     material-footer {
       color: var(--footer-neutral-text);
       background-color: var(--footer-background);

src/components/error-page.riot

@@ -63,7 +63,7 @@
     </template>
     <template if="{ props.code === 'CATALOG_BRANCHING_CONFIGURATION' }">
       <p>Wrong configuration for the branching feature: { props.message }</p>
-      <p>Configuration environment variables are : CATALOG_MIN_BRANCH and CATALOG_MAX_BRANCH</p>
+      <p>Configuration environment variables are : CATALOG_MIN_BRANCHES and CATALOG_MAX_BRANCHES</p>
     </template>
   </div>
   <script>

src/components/version-notification.riot

@@ -64,7 +64,7 @@
         const self = this;
 
         oReq.addEventListener('load', function () {
-          localStorage.setItem(EXPIRES, new Date().getTime() + ONE_DAY);
+          localStorage.setItem(EXPIRES, new Date().getTime() + ONE_DAY * 7);
           if (this.status === 200) {
             const latest = parseJSON(this.responseText);
             if (latest && self.tag_name !== latest.tag_name && !isNewestVersion(props.version, latest.tag_name)) {

src/index.html

@@ -35,6 +35,7 @@
   <body>
     <!-- build:keep production -->
     <docker-registry-ui
+      docker-registry-ui-title="${DOCKER_REGISTRY_UI_TITLE}"
       registry-url="${REGISTRY_URL}"
       name="${REGISTRY_TITLE}"
       pull-url="${PULL_URL}"
@@ -66,11 +67,13 @@
       theme-footer-neutral-text="${THEME_FOOTER_NEUTRAL_TEXT}"
       theme-footer-background="${THEME_FOOTER_BACKGROUND}"
       tags-per-page="${TAGLIST_PAGE_SIZE}"
+      enable-version-notification="${ENABLE_VERSION_NOTIFICATION}"
     >
     </docker-registry-ui>
     <!-- endbuild -->
     <!-- build:keep developement -->
     <docker-registry-ui
+      docker-registry-ui-title=""
       registry-url=""
       name="Development Registry"
       pull-url=""
@@ -100,6 +103,7 @@
       theme-footer-neutral-text=""
       theme-footer-background=""
       tags-per-page=""
+      enable-version-notification="true"
     >
     </docker-registry-ui>
     <!-- endbuild -->