Merge pull request #1366 from FlowFuse/1328-Configurable-PWA-Icon

Customizable PWA icon support
FlowFuse · Oct 10, 2024 · 5ed9c0d · 5ed9c0d
2 parents 02852fc + 91045f3
commit 5ed9c0d
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 4 deletions.
diff --git a/nodes/config/ui_base.js b/nodes/config/ui_base.js
@@ -139,6 +139,28 @@ module.exports = function (RED) {
                 res.sendFile(path.join(__dirname, '../../dist/index.html'))
             })
 
+            uiShared.app.get('/dashboard/manifest.webmanifest', (req, res) => {
+                const hasAppIcon = (config.appIcon && config.appIcon.trim() !== '')
+                const manifest = {
+                    name: 'Node-RED Dashboard 2.0',
+                    short_name: 'Dashboard',
+                    start_url: './',
+                    display: 'standalone',
+                    background_color: '#ffffff',
+                    lang: 'en',
+                    scope: './',
+                    description: 'Node-RED Dashboard 2.0',
+                    theme_color: '#ffffff',
+                    icons: [
+                        { src: hasAppIcon ? config.appIcon : 'pwa-64x64.png', sizes: '64x64', type: 'image/png' },
+                        { src: hasAppIcon ? config.appIcon : 'pwa-192x192.png', sizes: '192x192', type: 'image/png' },
+                        { src: hasAppIcon ? config.appIcon : 'pwa-512x512.png', sizes: '512x512', type: 'image/png' },
+                        { src: hasAppIcon ? config.appIcon : 'pwa-512x512.png', sizes: '512x512', type: 'image/png', purpose: 'maskable' }
+                    ]
+                }
+                return res.json(manifest)
+            })
+
             uiShared.app.get(config.path + '/*', uiShared.httpMiddleware, (req, res) => {
                 res.sendFile(path.join(__dirname, '../../dist/index.html'))
             })

diff --git a/vite.config.js b/vite.config.js
@@ -1,9 +1,6 @@
 import vue from '@vitejs/plugin-vue'
 import { defineConfig } from 'vite'
 import { VitePWA } from 'vite-plugin-pwa'
-
-import manifest from './manifest.json'
-
 /**
  * Vite is used to build the UI for the dashboard,
  * is is not used for the nodes themselves.
@@ -24,7 +21,7 @@ export default defineConfig({
             registerType: 'autoUpdate',
             injectRegister: false,
 
-            manifest,
+            manifest: false,
 
             injectManifest: {
                 maximumFileSizeToCacheInBytes: 3000000,