fix favicon

config.yaml

@@ -23,9 +23,10 @@ plugins: /verdaccio/plugins
 web:
   enable: true
   title: apm - A Package Manager for ABAP
-  logo: /verdaccio/abappm/apm_banner_gray.png
+  logo: /verdaccio/abappm/apm_banner.png
+  logoDark: /verdaccio/abappm/apm_banner_gray.png
   favicon: /verdaccio/abappm/apm.ico
-  primary_color: '#a0a0a0'
+  primaryColor: '#c0c0c0'
   darkMode: true
   gravatar: true
   # by default packages are ordercer ascendant (asc|desc)
@@ -38,7 +39,8 @@ web:
   pkgManagers:
     - apm
   showInfo: false
-  # showSettings: true
+  showUplinks: false
+  showSettings: false
   # In combination with darkMode you can force specific theme
   # showThemeSwitch: true
   # showFooter: true
@@ -51,13 +53,14 @@ web:
   #  HTML tags injected before ends </head>
   metaScripts:
     - '<meta name="robots" content="noindex" />'
+    - '<meta name="description" content="apm - A Package Manager 📦, a Website 🌐, and a Registry 📑 for ABAP" />'
   #    - '<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>'
   #    - '<script type="text/javascript" src="https://browser.sentry-cdn.com/5.15.5/bundle.min.js"></script>'
   #  HTML tags injected first child at <body/>
   scriptsbodyBefore:
-    - '<div id="beta" style="color:white;background-color:blue;margin:auto;text-align:center;font-size:12px;"><strong>***BETA***</strong>  All published packages will be deleted before go-live!  <strong>***BETA***</strong></div>'
+    - '<div id="beta" style="color:white;background-color:blue;margin:auto;text-align:center;font-size:12px;"><strong>***PLAYGROUND***</strong>  Packages will be deleted every Sunday night!  <strong>***PLAYGROUND***</strong></div>'
   #  Public path for template manifest scripts (only manifest)
-  publicPath: https://registry.abappm.com/
+  publicPath: https://playground.abappm.com/
 
 auth:
   htpasswd:

packages/middleware/src/middlewares/web/render-web.ts

@@ -37,7 +37,15 @@ export function renderWebMiddleware(config, tokenMiddleware, pluginOptions) {
   // any match within the static is routed to the file system
   router.get('/-/static/*', function (req, res, next) {
     const filename = req.params[0];
-    const file = `${staticPath}/${filename}`;
+    let file = `${staticPath}/${filename}`;
+    if (filename === 'favicon.ico' && config?.web?.favicon) {
+      file = config?.web?.favicon;
+      if (isURLhasValidProtocol(file)) {
+        debug('redirect to favicon %s', file);
+        req.url = file;
+        return next();
+      }
+    }
     debug('render static file %o', file);
     res.sendFile(file, sendFileCallback(next));
   });

packages/middleware/src/middlewares/web/utils/renderHTML.ts

@@ -65,6 +65,7 @@ export default function renderHTML(
   const title = config?.web?.title ?? WEB_TITLE;
   const login = hasLogin(config);
   const scope = config?.web?.scope ?? '';
+  const favicon = resolveLogo(config?.web?.favicon, config?.url_prefix, requestOptions);
   const logo = resolveLogo(config?.web?.logo, config?.url_prefix, requestOptions);
   const logoDark = resolveLogo(config?.web?.logoDark, config?.url_prefix, requestOptions);
   const pkgManagers = config?.web?.pkgManagers ?? ['yarn', 'pnpm', 'npm'];
@@ -114,6 +115,7 @@ export default function renderHTML(
     version,
     logo,
     logoDark,
+    favicon,
     flags,
     login,
     pkgManagers,

packages/middleware/test/config/file-logo.yaml

@@ -15,6 +15,7 @@ web:
   primary_color: '#ffffff'
   logo: './test/config/dark-logo.png'
   logoDark: './test/config/dark-logo.png'
+  favicon: './test/config/favicon.ico'
   html_cache: false
 
 url_prefix: /prefix

packages/middleware/test/config/http-logo.yaml

@@ -0,0 +1,26 @@
+web:
+  title: verdaccio web
+  login: true
+  scope: '@scope'
+  pkgManagers:
+    - pnpm
+    - yarn
+  showInfo: true
+  showSettings: true
+  showSearch: true
+  showFooter: true
+  showThemeSwitch: true
+  showDownloadTarball: true
+  showRaw: true
+  primary_color: '#ffffff'
+  logo: https://raw.githubusercontent.com/verdaccio/verdaccio/master/assets/svg/logo-small.svg
+  logoDark: https://raw.githubusercontent.com/verdaccio/verdaccio/master/assets/svg/logo-blackwhite.svg
+  favicon: https://raw.githubusercontent.com/verdaccio/verdaccio/master/website/static/img/favicon/favicon.ico
+  html_cache: false
+
+url_prefix: /prefix
+
+log: { type: stdout, format: pretty, level: trace }
+
+flags:
+  changePassword: true

packages/middleware/test/config/no-logo.yaml

@@ -14,6 +14,7 @@ web:
   showRaw: true
   primary_color: '#ffffff'
   logo:
+  favicon:
   html_cache: false
 
 url_prefix: /prefix

packages/middleware/test/render.spec.ts

@@ -86,6 +86,21 @@ describe('test web server', () => {
         expect(__VERDACCIO_BASENAME_UI_OPTIONS.logoDark).toMatch('/prefix/-/static/dark-logo.png');
       });
 
+      test('should render favicon as file', async () => {
+        const {
+          window: { __VERDACCIO_BASENAME_UI_OPTIONS },
+        } = await render('file-logo.yaml');
+        expect(__VERDACCIO_BASENAME_UI_OPTIONS.favicon).toMatch('/prefix/-/static/favicon.ico');
+      });
+
+      test('should render logo and favicon as URL', async () => {
+        const {
+          window: { __VERDACCIO_BASENAME_UI_OPTIONS },
+        } = await render('http-logo.yaml');
+        expect(__VERDACCIO_BASENAME_UI_OPTIONS.logo).toMatch(/https:.*logo-small.svg/i);
+        expect(__VERDACCIO_BASENAME_UI_OPTIONS.favicon).toMatch(/https:.*favicon.ico/i);
+      });
+
       test('should not render logo as absolute file is wrong', async () => {
         const {
           window: { __VERDACCIO_BASENAME_UI_OPTIONS },
@@ -98,6 +113,7 @@ describe('test web server', () => {
           window: { __VERDACCIO_BASENAME_UI_OPTIONS },
         } = await render('no-logo.yaml');
         expect(__VERDACCIO_BASENAME_UI_OPTIONS.logo).toEqual('');
+        expect(__VERDACCIO_BASENAME_UI_OPTIONS.favicon).toEqual('');
       });
 
       test.todo('should default title');