Merge pull request #377 from shamoon/unified-infowidget-settings

Feature: Unified info widget settings

.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+    "files.exclude": {
+        "**/.next": true,
+        "**/node_modules": true
+    }
+}

README.md

@@ -1,12 +1,19 @@
 <p align="center">
-  <br>
   <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="images/homepage-dark.png">
-    <img src="images/homepage-light.png" width="65%">
+    <source media="(prefers-color-scheme: dark)" srcset="images/banner_light@2x.png">
+    <img src="images/banner_dark@2x.png" width="65%">
   </picture>
-  <br><br>
+</p>
+
+<p align="center">
+  A modern <em>(fully static, fast)</em>, secure <em>(fully proxied)</em>, highly customizable application dashboard with integrations for more than 25 services and translations for over 15 languages. Easily configured via YAML files (or discovery via docker labels).
+</p>
+
+<p align="center">
   <img src="images/1.png" />
-  <br>
+</p>
+
+<p align="center">
   <img src="images/2.png" width="19%" />
   <img src="images/3.png" width="19%" />
   <img src="images/4.png" width="19%" />
@@ -20,17 +27,18 @@
 </p>
 
 <p align="center">
-<a href="https://github.com/benphelps/homepage/actions/workflows/docker-publish.yml"><img src="https://github.com/benphelps/homepage/actions/workflows/docker-publish.yml/badge.svg" alt="Docker"></a>
-<a href="https://hosted.weblate.org/engage/homepage/"><img src="https://hosted.weblate.org/widgets/homepage/-/homepage/svg-badge.svg" alt="Weblate"></a>
+  <a href="https://github.com/benphelps/homepage/actions/workflows/docker-publish.yml"><img src="https://github.com/benphelps/homepage/actions/workflows/docker-publish.yml/badge.svg" alt="Docker"></a>
+  <a href="https://hosted.weblate.org/engage/homepage/"><img src="https://hosted.weblate.org/widgets/homepage/-/homepage/svg-badge.svg" alt="Weblate"></a>
 </p>
 
 ## Features
 
-- Fast! The entire site is statically generated at build time, so you can expect instant load times
+- **Fast!** The entire site is statically generated at build time, so you can expect instant load times
+- **Secure!** Every API request to backend services goes through a proxy server, so your API keys are never exposed to the frontend client.
 - Images built for AMD64 (x86_64), ARM64, ARMv7 and ARMv6
   - Supports all Raspberry Pi's, most SBCs & Apple Silicon
 - Full i18n support with automatic language detection
-  - Translations for Chinese, Dutch, French, German, Hebrew, Hungarian, Norwegian Bokmål, Polish, Portuguese, Russian, Spanish and Swedish
+  - Translantions for Catalan, Chinese, Dutch, Finnish, French, German, Hebrew, Hungarian, Norwegian Bokmål, Polish, Portuguese, Portuguese (Brazil), Romainian, Russian, Spanish, Swedish and Yue
   - Want to help translate? [Join the Weblate project](https://hosted.weblate.org/engage/homepage/)
 - Service & Web Bookmarks
 - Docker Integration
@@ -39,17 +47,17 @@
 - Service Integration
   - Sonarr, Radarr, Readarr, Prowlarr, Bazarr, Lidarr, Emby, Jellyfin, Tautulli (Plex)
   - Ombi, Overseerr, Jellyseerr, Jackett, NZBGet, SABnzbd, ruTorrent, Transmission, qBittorrent
-  - Portainer, Traefik, Speedtest Tracker, PiHole, AdGuard Home, Nginx Proxy Manager, Gotify, Syncthing Relay Server
+  - Portainer, Traefik, Speedtest Tracker, PiHole, AdGuard Home, Nginx Proxy Manager, Gotify, Syncthing Relay Server, Authentic, Proxmox
 - Information Providers
   - Coin Market Cap, Mastodon
 - Information & Utility Widgets
   - System Stats (Disk, CPU, Memory)
   - Weather via WeatherAPI.com or OpenWeatherMap
-    - Automatic location detection (with HTTPS), or manual location selection
   - Search Bar
 - Customizable
   - 21 theme colors with light and dark mode support
   - Background image support
+  - Column and Row layout options
 
 ## Support & Suggestions
 
@@ -140,26 +148,43 @@ Huge thanks to the all the contributors who have helped make this project what i
 
 - [aidenpwnz](https://github.com/benphelps/homepage/commits?author=aidenpwnz) - Nginx Proxy Manager, Search Bar Widget
 - [AlexFullmoon](https://github.com/benphelps/homepage/commits?author=AlexFullmoon) - OpenWeatherMap Widget
-- [AmadeusGraves](https://github.com/benphelps/homepage/commits?author=AmadeusGraves) - Spanish Translation
 - [andrii-kryvoviaz](https://github.com/benphelps/homepage/commits?author=andrii-kryvoviaz) - Background opacity option
-- [boerniee](https://github.com/benphelps/homepage/commits?author=boerniee) - German Translation
-- [comradekingu](https://github.com/benphelps/homepage/commits?author=comradekingu) - Norwegian Bokmål Translation
-- Daniel Varga - German & Hungarian Translation
-- [deffcolony](https://github.com/benphelps/homepage/commits?author=deffcolony) - Dutch Translation
-- [desolaris](https://github.com/benphelps/homepage/commits?author=desolaris) - Russian Translation
 - [DevPGSV](https://github.com/benphelps/homepage/commits?author=DevPGSV) - Syncthing Relay Server & Mastodon widgets
 - [ilusi0n](https://github.com/benphelps/homepage/commits?author=ilusi0n) - Jellyseerr Integration
 - [ItsJustMeChris](https://github.com/benphelps/homepage/commits?author=ItsJustMeChris) - Coin Market Cap Widget
-- [jackblk](https://github.com/benphelps/homepage/commits?author=jackblk) - Vietnamese Translation
-- [JazzFisch](https://github.com/benphelps/homepage/commits?author=JazzFisch) - Readarr, Bazarr, Lidarr, SABnzbd, Transmission & qBittorrent Integrations
-- [juanmanuelbc](https://github.com/benphelps/homepage/commits?author=juanmanuelbc) - Spanish and Catalan Translations
+- [JazzFisch](https://github.com/benphelps/homepage/commits?author=JazzFisch) - Readarr, Bazarr, Lidarr, SABnzbd, Transmission, qBittorrent, Proxmox Integrations & countless more improvements
+- [josways](https://github.com/benphelps/homepage/commits?author=josways) - Baidu search provider
+- [mauricio-kalil](https://github.com/benphelps/homepage/commits?author=mauricio-kalil) - Portuguese (Brazil)
 - [modem7](https://github.com/benphelps/homepage/commits?author=modem7) - Impvoed Docker Image
-- [nicedc](https://github.com/benphelps/homepage/commits?author=nicedc) - Chinese Translation
-- [Nonoss117](https://github.com/benphelps/homepage/commits?author=Nonoss117) - French Translation
-- [pacoculebras](https://github.com/benphelps/homepage/commits?author=pacoculebras) - Catalan Translation
-- [psychodracon](https://github.com/benphelps/homepage/commits?author=psychodracon) - Polish Translation
+- [MountainGod2](https://github.com/benphelps/homepage/discussions/243) - Homepage Logo
 - [quod](https://github.com/benphelps/homepage/commits?author=quod) - Fixed Typos
 - [schklom](https://github.com/benphelps/homepage/commits?author=schklom) - ARM64, ARMv7 and ARMv6
-- [ShlomiPorush](https://github.com/benphelps/homepage/commits?author=ShlomiPorush) - Hebrew Translation
-- [SuperDOS](https://github.com/benphelps/homepage/commits?author=SuperDOS) - Swedish Translation
 - [xicopitz](https://github.com/benphelps/homepage/commits?author=xicopitz) - Gotify & Prowlarr Integration
+
+### Translators
+
+- [3vilson](https://github.com/benphelps/homepage/commits?author=3vilson) - German
+- [4lenz1](https://github.com/benphelps/homepage/commits?author=4lenz1) - Chinese
+- [AmadeusGraves](https://github.com/benphelps/homepage/commits?author=AmadeusGraves) - Spanish
+- [boerniee](https://github.com/benphelps/homepage/commits?author=boerniee) - German
+- [brunoccr](https://github.com/benphelps/homepage/commits?author=brunoccr) - Portuguese (Brazil)
+- [C8opmBM](https://github.com/benphelps/homepage/commits?author=C8opmBM) - Romainian
+- [comradekingu](https://github.com/benphelps/homepage/commits?author=comradekingu) - Norwegian Bokmål
+- Daniel Varga - German & Hungarian
+- [deffcolony](https://github.com/benphelps/homepage/commits?author=deffcolony) - Dutch
+- [desolaris](https://github.com/benphelps/homepage/commits?author=desolaris) - Russian
+- [ericlokz](https://github.com/benphelps/homepage/commits?author=ericlokz) - Yue
+- [FunsKiTo](https://github.com/benphelps/homepage/commits?author=FunsKiTo) - Spanish
+- [jackblk](https://github.com/benphelps/homepage/commits?author=jackblk) - Vietnamese
+- [juanmanuelbc](https://github.com/benphelps/homepage/commits?author=juanmanuelbc) - Spanish and Catalan
+- [ling0412](https://github.com/benphelps/homepage/commits?author=ling0412) - Chinese
+- [milotype](https://github.com/benphelps/homepage/commits?author=milotype) - Croatian
+- [nicedc](https://github.com/benphelps/homepage/commits?author=nicedc) - Chinese
+- [Nonoss117](https://github.com/benphelps/homepage/commits?author=Nonoss117) - French
+- [pacoculebras](https://github.com/benphelps/homepage/commits?author=pacoculebras) - Catalan
+- [Prilann](https://github.com/benphelps/homepage/commits?author=Prilann) - German
+- [psychodracon](https://github.com/benphelps/homepage/commits?author=psychodracon) - Polish
+- Sascha Jelinek - German
+- [ShlomiPorush](https://github.com/benphelps/homepage/commits?author=ShlomiPorush) - Hebrew
+- [SuperDOS](https://github.com/benphelps/homepage/commits?author=SuperDOS) - Swedish
+- [kaihu](https://github.com/benphelps/homepage/commits?author=kaihu) - Finnish

package.json

@@ -32,7 +32,8 @@
     "shvl": "^3.0.0",
     "swr": "^1.3.0",
     "tough-cookie": "^4.1.2",
-    "winston": "^3.8.2"
+    "winston": "^3.8.2",
+    "xml-js": "^1.6.11"
   },
   "devDependencies": {
     "@tailwindcss/forms": "^0.5.3",

pnpm-lock.yaml

@@ -40,6 +40,7 @@ specifiers:
   tough-cookie: ^4.1.2
   typescript: ^4.8.3
   winston: ^3.8.2
+  xml-js: ^1.6.11
 
 dependencies:
   '@headlessui/react': 1.7.2_biqbaboplfbrettd7655fr4n2y
@@ -65,6 +66,7 @@ dependencies:
   swr: 1.3.0_react@18.2.0
   tough-cookie: 4.1.2
   winston: 3.8.2
+  xml-js: 1.6.11
 
 devDependencies:
   '@tailwindcss/forms': 0.5.3_tailwindcss@3.1.8
@@ -2554,6 +2556,10 @@ packages:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
     dev: false
 
+  /sax/1.2.4:
+    resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
+    dev: false
+
   /scheduler/0.23.0:
     resolution: {integrity: sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==}
     dependencies:
@@ -3000,6 +3006,13 @@ packages:
   /wrappy/1.0.2:
     resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
 
+  /xml-js/1.6.11:
+    resolution: {integrity: sha512-7rVi2KMfwfWFl+GpPg6m80IVMWXLRjO+PxTq7V2CDhoGak0wzYzFgUY2m4XJ47OGdXd8eLE8EmwfAmdjw7lC1g==}
+    hasBin: true
+    dependencies:
+      sax: 1.2.4
+    dev: false
+
   /xtend/4.0.2:
     resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
     engines: {node: '>=0.4'}

public/locales/bg/common.json

@@ -0,0 +1,205 @@
+{
+    "sabnzbd": {
+        "queue": "Опашка",
+        "timeleft": "Оставащо Време",
+        "rate": "Rate"
+    },
+    "rutorrent": {
+        "active": "Акитивен",
+        "upload": "Споделяне",
+        "download": "Сваляне"
+    },
+    "widget": {
+        "missing_type": "Липсваща приставка: {{type}}",
+        "api_error": "API Грешка",
+        "status": "Статус"
+    },
+    "weather": {
+        "current": "Текущо местоположение",
+        "allow": "Разреши",
+        "updating": "Обновяване",
+        "wait": "Моля изчакайте"
+    },
+    "search": {
+        "placeholder": "Търсене…"
+    },
+    "resources": {
+        "cpu": "CPU",
+        "total": "Общо",
+        "free": "Свободни",
+        "used": "Заети",
+        "load": "Натоварване"
+    },
+    "unifi": {
+        "users": "Потребители",
+        "uptime": "Активен от",
+        "days": "Дни",
+        "wan": "WAN",
+        "lan_users": "LAN Потребители",
+        "wlan_users": "WLAN Потребители",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Моля изчакайте"
+    },
+    "docker": {
+        "offline": "Изключен",
+        "rx": "RX",
+        "tx": "TX",
+        "mem": "MEM",
+        "cpu": "CPU"
+    },
+    "emby": {
+        "playing": "Възпроизвежда",
+        "transcoding": "Конвертира",
+        "bitrate": "Bitrate",
+        "no_active": "Няма активни потоци"
+    },
+    "tautulli": {
+        "playing": "Възпроизвежда",
+        "transcoding": "Конвертира",
+        "bitrate": "Честота",
+        "no_active": "Няма активни потоци"
+    },
+    "nzbget": {
+        "rate": "Rate",
+        "remaining": "Остава",
+        "downloaded": "Изтеглени"
+    },
+    "plex": {
+        "streams": "Активни Потоци",
+        "movies": "Филми",
+        "tv": "Сериали"
+    },
+    "transmission": {
+        "download": "Сваляне",
+        "upload": "Upload",
+        "leech": "Leech",
+        "seed": "Seed"
+    },
+    "qbittorrent": {
+        "download": "Download",
+        "upload": "Upload",
+        "leech": "Leech",
+        "seed": "Seed"
+    },
+    "sonarr": {
+        "wanted": "Wanted",
+        "queued": "Queued",
+        "series": "Series"
+    },
+    "radarr": {
+        "wanted": "Wanted",
+        "queued": "Queued",
+        "movies": "Movies"
+    },
+    "lidarr": {
+        "wanted": "Wanted",
+        "queued": "Queued",
+        "albums": "Albums"
+    },
+    "readarr": {
+        "wanted": "Wanted",
+        "queued": "Queued",
+        "books": "Books"
+    },
+    "bazarr": {
+        "missingEpisodes": "Missing Episodes",
+        "missingMovies": "Missing Movies"
+    },
+    "ombi": {
+        "pending": "Pending",
+        "approved": "Approved",
+        "available": "Available"
+    },
+    "jellyseerr": {
+        "pending": "Pending",
+        "approved": "Approved",
+        "available": "Available"
+    },
+    "overseerr": {
+        "pending": "Pending",
+        "approved": "Approved",
+        "available": "Available"
+    },
+    "pihole": {
+        "queries": "Queries",
+        "blocked": "Blocked",
+        "gravity": "Gravity"
+    },
+    "adguard": {
+        "queries": "Queries",
+        "blocked": "Blocked",
+        "filtered": "Filtered",
+        "latency": "Latency"
+    },
+    "speedtest": {
+        "upload": "Upload",
+        "download": "Download",
+        "ping": "Ping"
+    },
+    "portainer": {
+        "running": "Running",
+        "stopped": "Stopped",
+        "total": "Total"
+    },
+    "traefik": {
+        "routers": "Routers",
+        "services": "Services",
+        "middleware": "Middleware"
+    },
+    "npm": {
+        "enabled": "Enabled",
+        "disabled": "Disabled",
+        "total": "Total"
+    },
+    "coinmarketcap": {
+        "configure": "Configure one or more crypto currencies to track",
+        "1hour": "1 Hour",
+        "1day": "1 Day",
+        "7days": "7 Days",
+        "30days": "30 Days"
+    },
+    "gotify": {
+        "apps": "Applications",
+        "clients": "Clients",
+        "messages": "Messages"
+    },
+    "prowlarr": {
+        "enableIndexers": "Indexers",
+        "numberOfGrabs": "Grabs",
+        "numberOfQueries": "Queries",
+        "numberOfFailGrabs": "Fail Grabs",
+        "numberOfFailQueries": "Fail Queries"
+    },
+    "authentik": {
+        "loginsLast24H": "Logins (24h)",
+        "users": "Users",
+        "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "jackett": {
+        "configured": "Configured",
+        "errored": "Errored"
+    },
+    "strelaysrv": {
+        "numActiveSessions": "Sessions",
+        "numConnections": "Connections",
+        "dataRelayed": "Relayed",
+        "transferRate": "Rate"
+    },
+    "mastodon": {
+        "user_count": "Users",
+        "status_count": "Posts",
+        "domain_count": "Domains"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
+    }
+}

public/locales/ca/common.json

@@ -33,13 +33,14 @@
         "total": "Total",
         "free": "Lliure",
         "used": "Usat",
-        "load": "Càrrega"
+        "load": "Càrrega",
+        "cpu": "CPU"
     },
     "docker": {
-        "rx": "RX",
-        "tx": "TX",
-        "mem": "MEM",
-        "cpu": "CPU",
+        "rx": "Rebut",
+        "tx": "Transmès",
+        "mem": "Memòria",
+        "cpu": "Processador",
         "offline": "Fora de línia"
     },
     "emby": {
@@ -170,8 +171,35 @@
         "transferRate": "Velocitat"
     },
     "authentik": {
+        "users": "Usuaris",
+        "loginsLast24H": "Inicis de sessió (24h)",
+        "failedLoginsLast24H": "Errors d'inici de sessió (24h)"
+    },
+    "proxmox": {
+        "vms": "VMs",
+        "mem": "Memòria",
+        "cpu": "Processador",
+        "lxc": "LXC"
+    },
+    "unifi": {
         "users": "Users",
-        "loginsLast24H": "Logins (24h)",
-        "failedLoginsLast24H": "Failed Logins (24h)"
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/de/common.json

@@ -11,7 +11,8 @@
         "total": "Gesamt",
         "free": "Frei",
         "used": "Gebraucht",
-        "load": "Belastung"
+        "load": "Belastung",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "Rx",
@@ -173,5 +174,32 @@
         "users": "Benutzer",
         "loginsLast24H": "Anmeldungen (24h)",
         "failedLoginsLast24H": "fehlerhafte Anmeldungen (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/en/common.json

@@ -25,11 +25,23 @@
         "placeholder": "Search…"
     },
     "resources": {
+        "cpu": "CPU",
         "total": "Total",
         "free": "Free",
         "used": "Used",
         "load": "Load"
     },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
     "docker": {
         "rx": "RX",
         "tx": "TX",
@@ -54,6 +66,11 @@
         "remaining": "Remaining",
         "downloaded": "Downloaded"
     },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
     "sabnzbd": {
         "rate": "Rate",
         "queue": "Queue",
@@ -184,5 +201,16 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/es/common.json

@@ -11,13 +11,14 @@
         "total": "Total",
         "free": "Libre",
         "used": "Usado",
-        "load": "Carga"
+        "load": "Carga",
+        "cpu": "CPU"
     },
     "docker": {
-        "rx": "RX",
-        "tx": "TX",
-        "mem": "MEM",
-        "cpu": "CPU",
+        "rx": "Recibido",
+        "tx": "Transmitido",
+        "mem": "Memoria",
+        "cpu": "Procesador",
         "offline": "Desconectado"
     },
     "emby": {
@@ -171,7 +172,34 @@
     },
     "authentik": {
         "users": "Usuarios",
-        "loginsLast24H": "Accesos (24h)",
-        "failedLoginsLast24H": "Accesos Fallidos (24h)"
+        "loginsLast24H": "Inicios de sesión (24h)",
+        "failedLoginsLast24H": "Inicios de sesión fallidos (24h)"
+    },
+    "proxmox": {
+        "mem": "Memoria",
+        "cpu": "Procesador",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "up": "UP",
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/fi/common.json

@@ -0,0 +1,205 @@
+{
+    "widget": {
+        "missing_type": "Puuttuva härpäkkeen tyyppi: {{type}}",
+        "api_error": "API-virhe",
+        "status": "Tila"
+    },
+    "weather": {
+        "current": "Nykyinen sijainti",
+        "allow": "Klikkaa salliaksesi",
+        "updating": "Päivitetään",
+        "wait": "Odota, ole hyvä"
+    },
+    "search": {
+        "placeholder": "Hae…"
+    },
+    "resources": {
+        "cpu": "CPU",
+        "total": "Yhteensä",
+        "free": "Vapaana",
+        "used": "Käytetty",
+        "load": "Kuorma"
+    },
+    "docker": {
+        "rx": "RX",
+        "tx": "TX",
+        "mem": "RAM",
+        "cpu": "CPU",
+        "offline": "Offline"
+    },
+    "emby": {
+        "playing": "Toistaa",
+        "transcoding": "Transkoodaa",
+        "bitrate": "Bittinopeus",
+        "no_active": "Ei aktiivisia striimejä"
+    },
+    "tautulli": {
+        "playing": "Toistaa",
+        "transcoding": "Transkoodaa",
+        "bitrate": "Bittinopeus",
+        "no_active": "Ei aktiivisia striimejä"
+    },
+    "nzbget": {
+        "rate": "Nopeus",
+        "remaining": "Jäljellä",
+        "downloaded": "Ladattu"
+    },
+    "sabnzbd": {
+        "rate": "Nopeus",
+        "queue": "Jono",
+        "timeleft": "Aikaa jäljellä"
+    },
+    "rutorrent": {
+        "active": "Aktiivinen",
+        "upload": "Lähetys",
+        "download": "Lataus"
+    },
+    "transmission": {
+        "download": "Lataus",
+        "upload": "Lähetys",
+        "leech": "Lataajia",
+        "seed": "Lähettäjiä"
+    },
+    "qbittorrent": {
+        "download": "Lataus",
+        "upload": "Lähetys",
+        "leech": "Lataajia",
+        "seed": "Lähettäjiä"
+    },
+    "sonarr": {
+        "wanted": "Haluttu",
+        "queued": "Jonossa",
+        "series": "Sarja"
+    },
+    "radarr": {
+        "wanted": "Haluttu",
+        "queued": "Jonossa",
+        "movies": "Elokuvia"
+    },
+    "lidarr": {
+        "wanted": "Haluttu",
+        "queued": "Jonossa",
+        "albums": "Albumeja"
+    },
+    "readarr": {
+        "wanted": "Haluttu",
+        "queued": "Jonossa",
+        "books": "Kirjoja"
+    },
+    "bazarr": {
+        "missingEpisodes": "Puuttuvia jaksoja",
+        "missingMovies": "Puuttuvia elokuvia"
+    },
+    "ombi": {
+        "pending": "Vireillä",
+        "approved": "Hyväksytty",
+        "available": "Saatavilla"
+    },
+    "jellyseerr": {
+        "pending": "Vireillä",
+        "approved": "Hyväksytty",
+        "available": "Saatavilla"
+    },
+    "overseerr": {
+        "pending": "Vireillä",
+        "approved": "Hyväksytty",
+        "available": "Saatavilla"
+    },
+    "pihole": {
+        "queries": "Kyselyjä",
+        "blocked": "Estetty",
+        "gravity": "Vakavuus"
+    },
+    "adguard": {
+        "queries": "Kyselyjä",
+        "blocked": "Estetty",
+        "filtered": "Suodatettu",
+        "latency": "Viive"
+    },
+    "speedtest": {
+        "upload": "Lähetys",
+        "download": "Lataus",
+        "ping": "Viive"
+    },
+    "portainer": {
+        "running": "Käynnissä",
+        "stopped": "Pysäytetty",
+        "total": "Yhteensä"
+    },
+    "traefik": {
+        "routers": "Reitittimiä",
+        "services": "Palveluja",
+        "middleware": "Middlewareja"
+    },
+    "npm": {
+        "enabled": "Käytössä",
+        "disabled": "Poissa käytöstä",
+        "total": "Yhteensä"
+    },
+    "coinmarketcap": {
+        "configure": "Määritä yksi tai useampi kryptovaluutta seurattavaksi",
+        "1hour": "1 tunti",
+        "1day": "1 päivä",
+        "7days": "7 päivää",
+        "30days": "30 päivää"
+    },
+    "gotify": {
+        "apps": "Sovelluksia",
+        "clients": "Asiakasohjelmia",
+        "messages": "Viestejä"
+    },
+    "prowlarr": {
+        "enableIndexers": "Indeksoijia",
+        "numberOfGrabs": "Nappauksia",
+        "numberOfQueries": "Hakuja",
+        "numberOfFailGrabs": "Epäonnistuneita nappauksia",
+        "numberOfFailQueries": "Epäonnistuneita kyselyjä"
+    },
+    "jackett": {
+        "configured": "Määritettyjä",
+        "errored": "Virheellisiä"
+    },
+    "strelaysrv": {
+        "numActiveSessions": "Istuntoja",
+        "numConnections": "Yhteyksiä",
+        "dataRelayed": "Välitetty",
+        "transferRate": "Nopeus"
+    },
+    "mastodon": {
+        "user_count": "Käyttäjiä",
+        "status_count": "Kirjoituksia",
+        "domain_count": "Verkkotunnuksia"
+    },
+    "authentik": {
+        "users": "Käyttäjiä",
+        "loginsLast24H": "Kirjautumisia (24h)",
+        "failedLoginsLast24H": "Epäonnistuneita kirjautumisia (24h)"
+    },
+    "proxmox": {
+        "mem": "RAM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VKt"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "wait": "Please wait",
+        "days": "Days",
+        "wan": "WAN",
+        "up": "UP",
+        "down": "DOWN"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "wait": "Please wait",
+        "cpu": "CPU",
+        "mem": "MEM"
+    }
+}

public/locales/fr/common.json

@@ -11,7 +11,8 @@
         "total": "Total",
         "free": "Libre",
         "used": "Utilisé",
-        "load": "Charge"
+        "load": "Charge",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "Rx",
@@ -173,5 +174,32 @@
         "users": "Utilisateurs",
         "loginsLast24H": "Cnx. (24h)",
         "failedLoginsLast24H": "Cnx. échouées (24h)"
+    },
+    "proxmox": {
+        "mem": "Mém",
+        "cpu": "Cpu",
+        "lxc": "LxC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Utilisateurs",
+        "uptime": "Disponibilité du système",
+        "days": "Jours",
+        "wan": "WAN",
+        "lan_users": "Utilisateurs LAN",
+        "wlan_users": "Utilisateurs WLAN",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Merci de patienter"
+    },
+    "plex": {
+        "streams": "Flux actif",
+        "movies": "Films",
+        "tv": "Séries TV"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/he/common.json

@@ -17,7 +17,8 @@
         "total": "סה\"כ",
         "free": "פנוי",
         "used": "בשימוש",
-        "load": "עומס"
+        "load": "עומס",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "RX",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/hr/common.json

@@ -12,7 +12,8 @@
         "total": "Ukupno",
         "free": "Slobodno",
         "used": "Korišteno",
-        "load": "Opterećenje"
+        "load": "Opterećenje",
+        "cpu": "CPU"
     },
     "sabnzbd": {
         "rate": "Stopa",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/hu/common.json

@@ -3,7 +3,8 @@
         "total": "Összes",
         "free": "Szabad",
         "used": "Használt",
-        "load": "Terhelés"
+        "load": "Terhelés",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "RX",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/it/common.json

@@ -45,7 +45,8 @@
         "total": "Totale",
         "free": "Libero",
         "used": "In utilizzo",
-        "load": "Load"
+        "load": "Load",
+        "cpu": "CPU"
     },
     "rutorrent": {
         "active": "Attivo",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wait": "Please wait",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/nb-NO/common.json

@@ -11,7 +11,8 @@
         "total": "Totalt",
         "free": "Ledig",
         "used": "Brukt",
-        "load": "Last inn"
+        "load": "Last inn",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "Mottatt",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/nl/common.json

@@ -8,7 +8,8 @@
         "total": "Totaal",
         "free": "Vrij",
         "used": "Gebruikt",
-        "load": "Load"
+        "load": "Load",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "RX",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "lan_users": "LAN Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/pl/common.json

@@ -12,7 +12,8 @@
         "used": "Użyte",
         "load": "Obciążenie",
         "total": "Całkowite",
-        "free": "Wolne"
+        "free": "Wolne",
+        "cpu": "CPU"
     },
     "emby": {
         "no_active": "Brak aktywnych strumieni",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/pt-BR/common.json

@@ -45,7 +45,8 @@
         "total": "Total",
         "free": "Livre",
         "used": "Usado",
-        "load": "Carregamento"
+        "load": "Carregamento",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "Rx",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/pt/common.json

@@ -11,7 +11,8 @@
         "total": "Total",
         "free": "Livre",
         "used": "Usado",
-        "load": "Carregar"
+        "load": "Carregar",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "Rx",
@@ -184,5 +185,32 @@
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)",
         "users": "Users"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/ro/common.json

@@ -3,7 +3,8 @@
         "used": "Utilizați",
         "load": "Sarcină",
         "total": "Total",
-        "free": "Disponibili"
+        "free": "Disponibili",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "RX",
@@ -173,5 +174,32 @@
         "users": "Utilizatori",
         "loginsLast24H": "Autentificări (24h)",
         "failedLoginsLast24H": "Conectări eșuate (24h)"
+    },
+    "proxmox": {
+        "vms": "VMs",
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/ru/common.json

@@ -11,7 +11,8 @@
         "total": "Всего",
         "free": "Свободно",
         "used": "Использовано",
-        "load": "Load"
+        "load": "Load",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "Rx",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/sv/common.json

@@ -14,7 +14,8 @@
         "load": "Laddar",
         "total": "Total",
         "free": "Ledigt",
-        "used": "Använt"
+        "used": "Använt",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "RX",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/te/common.json

@@ -0,0 +1,205 @@
+{
+    "readarr": {
+        "books": "పుస్తకాలు",
+        "wanted": "కావలెను",
+        "queued": "క్యూయూఎడ్"
+    },
+    "adguard": {
+        "blocked": "నిరోధించబడింది",
+        "filtered": "ఫిల్టర్ చేయబడింది",
+        "latency": "జాప్యం",
+        "queries": "ప్రశ్నలు"
+    },
+    "strelaysrv": {
+        "numActiveSessions": "సెషన్స్",
+        "numConnections": "కనెక్షన్లు",
+        "dataRelayed": "రెలయెడఁ",
+        "transferRate": "రేటు"
+    },
+    "widget": {
+        "missing_type": "విడ్జెట్ లేదు: {{type}}",
+        "api_error": "API లోపం",
+        "status": "హోదా"
+    },
+    "weather": {
+        "current": "ప్రస్తుత స్తలం",
+        "allow": "అనుమతించడానికి క్లిక్ చేయండి",
+        "updating": "నవీకరిస్తోంది",
+        "wait": "దయచేసి వేచి ఉండండి"
+    },
+    "search": {
+        "placeholder": "వెతకండి…"
+    },
+    "resources": {
+        "cpu": "సీపియూ",
+        "total": "మొత్తం",
+        "free": "మిగిలింది",
+        "used": "ఉపయోగించబడిన",
+        "load": "లోడ్"
+    },
+    "docker": {
+        "rx": "RX",
+        "tx": "TX",
+        "mem": "MEM",
+        "cpu": "సీపియూ",
+        "offline": "ఆఫ్‌లైన్"
+    },
+    "emby": {
+        "playing": "ఆడుతున్నారు",
+        "transcoding": "ట్రాన్స్‌కోడింగ్",
+        "bitrate": "బిట్రేట్",
+        "no_active": "యాక్టివ్ స్ట్రీమ్‌లు లేవు"
+    },
+    "tautulli": {
+        "playing": "ఆడుతున్నారు",
+        "transcoding": "ట్రాన్స్‌కోడింగ్",
+        "bitrate": "బిట్రేట్",
+        "no_active": "యాక్టివ్ స్ట్రీమ్‌లు లేవు"
+    },
+    "nzbget": {
+        "rate": "రేట్",
+        "remaining": "మిగిలింది",
+        "downloaded": "డౌన్‌లోడ్ చేయబడింది"
+    },
+    "sabnzbd": {
+        "rate": "రేట్",
+        "queue": "వరుస",
+        "timeleft": "మిగిలి వున్న సమయం"
+    },
+    "rutorrent": {
+        "active": "చురుకుగా",
+        "upload": "అప్‌లోడ్",
+        "download": "డౌన్‌లోడ్"
+    },
+    "transmission": {
+        "download": "డౌన్‌లోడ్",
+        "upload": "అప్‌లోడ్",
+        "leech": "జలగ",
+        "seed": "సీడ్"
+    },
+    "qbittorrent": {
+        "download": "డౌన్‌లోడ్",
+        "upload": "అప్లోడ్",
+        "leech": "లీచ్",
+        "seed": "సీడ్"
+    },
+    "sonarr": {
+        "wanted": "కావలెను",
+        "queued": "క్యూయూఎడ్",
+        "series": "సిరీస్"
+    },
+    "radarr": {
+        "wanted": "కావలెను",
+        "queued": "క్యూయూఎడ్",
+        "movies": "సినిమాలు"
+    },
+    "lidarr": {
+        "wanted": "కావలెను",
+        "queued": "క్యూయూఎడ్",
+        "albums": "ఆల్బములు"
+    },
+    "bazarr": {
+        "missingEpisodes": "ఎపిసోడ్‌లు లేవు",
+        "missingMovies": "సినిమాలు లేవు"
+    },
+    "ombi": {
+        "pending": "పెండింగ్",
+        "approved": "ఆమోదించబడింది",
+        "available": "అందుబాటులో వున్నవి"
+    },
+    "jellyseerr": {
+        "pending": "పెండింగ్",
+        "approved": "ఆమోదించబడింది",
+        "available": "అందుబాటులో"
+    },
+    "overseerr": {
+        "pending": "పెండింగ్",
+        "approved": "ఆమోదించబడింది",
+        "available": "అందుబాటులో"
+    },
+    "pihole": {
+        "queries": "ప్రశ్నలు",
+        "blocked": "నిరోధించబడింది",
+        "gravity": "గురుత్వాకర్షణ"
+    },
+    "speedtest": {
+        "upload": "అప్లోడ్",
+        "download": "డౌన్‌లోడ్",
+        "ping": "పింగ్"
+    },
+    "portainer": {
+        "running": "నడుస్తున్నవి",
+        "stopped": "ఆగిపోయినవి",
+        "total": "మొత్తం"
+    },
+    "traefik": {
+        "routers": "రౌటర్లు",
+        "services": "సేవలు",
+        "middleware": "మిడిల్వేర్"
+    },
+    "npm": {
+        "enabled": "ప్రారంభించబడింది",
+        "disabled": "డిసేబ్లెడ్",
+        "total": "మొత్తం"
+    },
+    "coinmarketcap": {
+        "configure": "ట్రాక్ చేయడానికి ఒకటి లేదా అంతకంటే ఎక్కువ క్రిప్టో కరెన్సీలను కాన్ఫిగర్ చేయండి",
+        "1hour": "1 గంట",
+        "1day": "1 రోజు",
+        "7days": "7 రోజులు",
+        "30days": "30 రోజులు"
+    },
+    "gotify": {
+        "apps": "అప్లికేషన్లు",
+        "clients": "ఖాతాదారులు",
+        "messages": "సందేశాలు"
+    },
+    "prowlarr": {
+        "enableIndexers": "సూచికలు",
+        "numberOfGrabs": "గ్రాబ్స్",
+        "numberOfQueries": "ప్రశ్నలు",
+        "numberOfFailGrabs": "ఫెయిల్ గ్రాబ్స్",
+        "numberOfFailQueries": "విఫలమైన ప్రశ్నలు"
+    },
+    "jackett": {
+        "configured": "కాన్ఫిగర్ చేయబడింది",
+        "errored": "పొరపాటు జరిగింది"
+    },
+    "mastodon": {
+        "user_count": "వినియోగదారులు",
+        "status_count": "పోస్ట్‌లు",
+        "domain_count": "డొమైన్‌లు"
+    },
+    "authentik": {
+        "users": "వినియోగదారులు",
+        "loginsLast24H": "లాగిన్లు (24గం)",
+        "failedLoginsLast24H": "విఫలమైన లాగిన్‌లు (24గం)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "సీపియూ",
+        "lxc": "LXC",
+        "vms": "విఎంలు"
+    },
+    "unifi": {
+        "users": "వినియోగదారులు",
+        "uptime": "సిస్టమ్ సమయము",
+        "days": "రోజులు",
+        "wan": "WAN",
+        "lan_users": "LAN వినియోగదారులు",
+        "wlan_users": "WLAN వినియోగదారులు",
+        "up": "అప్",
+        "down": "డౌన్",
+        "wait": "దయచేసి వేచి ఉండండి"
+    },
+    "plex": {
+        "streams": "యాక్టివ్ స్ట్రీమ్‌లు",
+        "movies": "సినిమాలు",
+        "tv": "దూరదర్శిని కార్యక్రమాలు"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
+    }
+}

public/locales/vi/common.json

@@ -11,7 +11,8 @@
         "total": "Tổng",
         "free": "Dư",
         "used": "Đã dùng",
-        "load": "Load"
+        "load": "Load",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "RX",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/yue/common.json

@@ -35,7 +35,8 @@
         "total": "全部",
         "free": "剩餘",
         "used": "用咗",
-        "load": "負荷"
+        "load": "負荷",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "接收",
@@ -173,5 +174,32 @@
         "users": "用戶",
         "loginsLast24H": "登錄（ 24小时）",
         "failedLoginsLast24H": "登錄失敗（ 24鐘頭）"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/zh-CN/common.json

@@ -11,7 +11,8 @@
         "total": "共",
         "free": "空闲",
         "used": "已用",
-        "load": "负载"
+        "load": "负载",
+        "cpu": "CPU"
     },
     "docker": {
         "rx": "接收",
@@ -91,7 +92,7 @@
         "current": "当前定位",
         "allow": "点击并允许",
         "updating": "更新中",
-        "wait": "请稍后"
+        "wait": "请稍候"
     },
     "overseerr": {
         "pending": "待办",
@@ -161,17 +162,44 @@
     "mastodon": {
         "user_count": "用户",
         "status_count": "Posts",
-        "domain_count": "Domains"
+        "domain_count": "域"
     },
     "strelaysrv": {
-        "numActiveSessions": "Sessions",
-        "dataRelayed": "Relayed",
-        "numConnections": "Connections",
-        "transferRate": "Rate"
+        "numActiveSessions": "会话",
+        "dataRelayed": "中继",
+        "numConnections": "连接",
+        "transferRate": "速度"
     },
     "authentik": {
+        "users": "用户",
+        "loginsLast24H": "登录 (24h)",
+        "failedLoginsLast24H": "登录失败 (24h)"
+    },
+    "proxmox": {
+        "mem": "内存",
+        "cpu": "处理器",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
         "users": "Users",
-        "loginsLast24H": "Logins (24h)",
-        "failedLoginsLast24H": "Failed Logins (24h)"
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "请稍候"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/locales/zh-Hant/common.json

@@ -41,7 +41,8 @@
         "total": "Total",
         "free": "Free",
         "used": "Used",
-        "load": "Load"
+        "load": "Load",
+        "cpu": "CPU"
     },
     "nzbget": {
         "rate": "Rate",
@@ -173,5 +174,32 @@
         "users": "Users",
         "loginsLast24H": "Logins (24h)",
         "failedLoginsLast24H": "Failed Logins (24h)"
+    },
+    "proxmox": {
+        "mem": "MEM",
+        "cpu": "CPU",
+        "lxc": "LXC",
+        "vms": "VMs"
+    },
+    "unifi": {
+        "users": "Users",
+        "uptime": "System Uptime",
+        "days": "Days",
+        "wan": "WAN",
+        "lan_users": "LAN Users",
+        "wlan_users": "WLAN Users",
+        "up": "UP",
+        "down": "DOWN",
+        "wait": "Please wait"
+    },
+    "plex": {
+        "streams": "Active Streams",
+        "movies": "Movies",
+        "tv": "TV Shows"
+    },
+    "glances": {
+        "cpu": "CPU",
+        "mem": "MEM",
+        "wait": "Please wait"
     }
 }

public/safari-pinned-tab.svg

@@ -0,0 +1,23 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M1682 5688 c-141 -24 -253 -147 -287 -316 -5 -24 -10 -3658 -5 -4029
+0 -33 0 -33 168 108 92 77 178 151 192 162 14 12 75 64 136 114 62 51 114 99
+116 105 2 7 4 209 3 449 l-1 436 276 0 c151 0 277 -4 280 -8 3 -4 5 -98 4
+-208 0 -111 2 -201 4 -201 3 0 117 95 132 110 3 3 73 61 155 130 168 140 167
+139 250 209 51 43 62 48 75 37 13 -12 524 -441 654 -550 28 -22 68 -57 91 -76
+23 -19 66 -55 95 -80 30 -25 86 -72 125 -105 38 -33 140 -118 225 -190 85 -71
+166 -139 180 -151 14 -13 70 -60 124 -106 55 -46 133 -111 174 -145 41 -35 77
+-61 80 -59 4 2 7 607 7 1344 -1 1197 1 1341 15 1344 8 2 163 3 343 3 l328 0
+-4 685 c-1 377 -6 695 -9 706 -26 90 -93 186 -161 233 -86 58 30 55 -1924 55
+-991 1 -1819 -2 -1841 -6z"/>
+</g>
+</svg>

src/components/bookmarks/group.jsx

@@ -1,10 +1,13 @@
+import ErrorBoundary from "components/errorboundry";
 import List from "components/bookmarks/list";
 
 export default function BookmarksGroup({ group }) {
   return (
-    <div key={group.name} className="basis-full md:basis-1/2 lg:basis-1/3 xl:basis-1/4 flex-1 p-1">
+    <div key={group.name} className="basis-full md:basis-1/2 lg:basis-1/3 xl:basis-1/4 flex-1">
       <h2 className="text-theme-800 dark:text-theme-300 text-xl font-medium">{group.name}</h2>
-      <List bookmarks={group.bookmarks} />
+      <ErrorBoundary>
+        <List bookmarks={group.bookmarks} />
+      </ErrorBoundary>
     </div>
   );
 }

src/components/errorboundry.jsx

@@ -0,0 +1,40 @@
+import React from "react";
+
+export default class ErrorBoundary extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { error: null, errorInfo: null };
+  }
+
+  componentDidCatch(error, errorInfo) {
+    // Catch errors in any components below and re-render with error message
+    this.setState({
+      error,
+      errorInfo,
+    });
+
+    // You can also log error messages to an error reporting service here
+    // eslint-disable-next-line no-console
+    console.error(error, errorInfo);
+  }
+
+  render() {
+    const { error, errorInfo } = this.state;
+    if (errorInfo) {
+      // Error path
+      return (
+        <div className="inline-block text-sm bg-rose-100 text-rose-900 dark:bg-rose-900 dark:text-rose-100 rounded-md p-2 m-1">
+          <div className="font-medium mb-1">Something went wrong.</div>
+          <details className="text-xs font-mono whitespace-pre">
+            <summary>{error && error.toString()}</summary>
+            {errorInfo.componentStack}
+          </details>
+        </div>
+      );
+    }
+
+    // Normally, just render children
+    const { children } = this.props;
+    return children;
+  }
+}

src/components/favicon.jsx

@@ -0,0 +1,114 @@
+/* eslint-disable @next/next/no-img-element */
+/* eslint-disable jsx-a11y/alt-text */
+import { useRef, useEffect, useContext } from "react";
+
+import themes from "utils/styles/themes";
+import { ColorContext } from "utils/contexts/color";
+
+export function Svg({ svgRef = null }) {
+  const { color } = useContext(ColorContext);
+
+  const { iconStart, iconEnd } = themes[color];
+
+  return (
+    <svg
+      ref={svgRef}
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 1024 1024"
+      style={{
+        enableBackground: "new 0 0 1024 1024",
+      }}
+      xmlSpace="preserve"
+      className="w-full h-full"
+    >
+      <style>
+        {
+          ".st0{display:none}.st3{stroke-linecap:square}.st3,.st4{fill:none;stroke:#fff;stroke-miterlimit:10}.st6{display:inline;fill:#333}.st7{fill:#fff}"
+        }
+      </style>
+      <g id="Icon">
+        <path
+          d="M771.9 191c27.7 0 50.1 26.5 50.1 59.3v186.4l-100.2.3V250.3c0-32.8 22.4-59.3 50.1-59.3z"
+          style={{
+            fill: iconStart,
+          }}
+        />
+        <linearGradient
+          id="homepage_favicon_gradient"
+          gradientUnits="userSpaceOnUse"
+          x1={200.746}
+          y1={225.015}
+          x2={764.986}
+          y2={789.255}
+        >
+          <stop
+            offset={0}
+            style={{
+              stopColor: iconStart,
+            }}
+          />
+          <stop
+            offset={1}
+            style={{
+              stopColor: iconEnd,
+            }}
+          />
+        </linearGradient>
+        <path
+          d="M721.8 250.3c0-32.7 22.4-59.3 50.1-59.3H253.1c-27.7 0-50.1 26.5-50.1 59.3v582.2l90.2-75.7-.1-130.3H375v61.8l88-73.8 258.8 217.9V250.6"
+          style={{
+            fill: "url(#homepage_favicon_gradient})",
+          }}
+        />
+      </g>
+    </svg>
+  );
+}
+
+export default function Favicon() {
+  const svgRef = useRef();
+  const imgRef = useRef();
+  const canvasRef = useRef();
+
+  useEffect(() => {
+    const svg = svgRef.current;
+    const img = imgRef.current;
+    const canvas = canvasRef.current;
+
+    if (!svg || !img || !canvas) {
+      return;
+    }
+
+    const xml = new XMLSerializer().serializeToString(svg);
+
+    const svg64 = Buffer.from(xml).toString("base64");
+    const b64Start = "data:image/svg+xml;base64,";
+
+    // prepend a "header"
+    const image64 = b64Start + svg64;
+
+    // set it as the source of the img element
+    img.onload = () => {
+      // draw the image onto the canvas
+      canvas.getContext("2d").drawImage(img, 0, 0);
+      // canvas.width = 256;
+      // canvas.height = 256;
+
+      const link = window.document.createElement("link");
+      link.type = "image/x-icon";
+      link.rel = "shortcut icon";
+      link.href = canvas.toDataURL("image/x-icon");
+      document.getElementsByTagName("head")[0].appendChild(link);
+    };
+
+    img.src = image64;
+  }, []);
+
+  return (
+    <div className="hidden">
+      <Svg svgRef={svgRef} />
+      <img width={64} height={64} ref={imgRef} />
+      <canvas width={64} height={64} ref={canvasRef} />
+    </div>
+  );
+}

src/components/services/item.jsx

@@ -9,19 +9,37 @@ import Docker from "widgets/docker/component";
 import { SettingsContext } from "utils/contexts/settings";
 
 function resolveIcon(icon) {
-  if (icon.startsWith("http")) {
-    return `/api/proxy?url=${encodeURIComponent(icon)}`;
+  // direct or relative URLs
+  if (icon.startsWith("http") || icon.startsWith("/")) {
+    return <Image src={`${icon}`} width={32} height={32} alt="logo" />;
   }
 
-  if (icon.startsWith("/")) {
-    return icon;
+  // mdi- prefixed, material design icons
+  if (icon.startsWith("mdi-")) {
+    const iconName = icon.replace("mdi-", "").replace(".svg", "");
+    return (
+      <div
+        style={{
+          width: 32,
+          height: 32,
+          background: "linear-gradient(180deg, rgb(var(--color-logo-start)), rgb(var(--color-logo-stop)))",
+          mask: `url(https://cdn.jsdelivr.net/npm/@mdi/svg@latest/svg/${iconName}.svg) no-repeat center / contain`,
+          WebkitMask: `url(https://cdn.jsdelivr.net/npm/@mdi/svg@latest/svg/${iconName}.svg) no-repeat center / contain`,
+        }}
+      />
+    );
   }
 
-  if (icon.endsWith(".png")) {
-    return `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${icon}`;
-  }
-
-  return `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${icon}.png`;
+  // fallback to dashboard-icons
+  const iconName = icon.replace(".png", "");
+  return (
+    <Image
+      src={`https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${iconName}.png`}
+      width={32}
+      height={32}
+      alt="logo"
+    />
+  );
 }
 
 export default function Item({ service }) {
@@ -57,12 +75,10 @@ export default function Item({ service }) {
                 rel="noreferrer"
                 className="flex-shrink-0 flex items-center justify-center w-12 "
               >
-                <Image src={resolveIcon(service.icon)} width={32} height={32} alt="logo" />
+                {resolveIcon(service.icon)}
               </a>
             ) : (
-              <div className="flex-shrink-0 flex items-center justify-center w-12 ">
-                <Image src={resolveIcon(service.icon)} width={32} height={32} alt="logo" />
-              </div>
+              <div className="flex-shrink-0 flex items-center justify-center w-12 ">{resolveIcon(service.icon)}</div>
             ))}
 
           {hasLink ? (

src/components/services/widget.jsx

@@ -1,5 +1,6 @@
 import { useTranslation } from "next-i18next";
 
+import ErrorBoundary from "components/errorboundry";
 import components from "widgets/components";
 
 export default function Widget({ service }) {
@@ -8,7 +9,11 @@ export default function Widget({ service }) {
   const ServiceWidget = components[service.widget.type];
 
   if (ServiceWidget) {
-    return <ServiceWidget service={service} />;
+    return (
+      <ErrorBoundary>
+        <ServiceWidget service={service} />
+      </ErrorBoundary>
+    );
   }
 
   return (

src/components/widgets/glances/glances.jsx

@@ -0,0 +1,110 @@
+import useSWR from "swr";
+import { BiError } from "react-icons/bi";
+import { FaMemory } from "react-icons/fa";
+import { FiCpu } from "react-icons/fi";
+import { useTranslation } from "next-i18next";
+
+import UsageBar from "../resources/usage-bar";
+
+export default function Widget({ options }) {
+  const { t, i18n } = useTranslation();
+
+  const { data, error } = useSWR(
+    `/api/widgets/glances?${new URLSearchParams({ lang: i18n.language, ...options }).toString()}`, {
+      refreshInterval: 1500,
+    }
+  );
+
+  if (error || data?.error) {
+    return (
+      <div className="flex flex-col justify-center first:ml-0 ml-4">
+        <div className="flex flex-row items-center justify-end">
+          <div className="flex flex-row items-center">
+            <BiError className="w-8 h-8 text-theme-800 dark:text-theme-200" />
+            <div className="flex flex-col ml-3 text-left">
+              <span className="text-theme-800 dark:text-theme-200 text-sm">{t("widget.api_error")}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  if (!data) {
+    return (
+      <div className="flex flex-col max-w:full sm:basis-auto self-center grow-0 flex-wrap ml-4">
+        <div className="flex flex-row self-center flex-wrap justify-between">
+           <div className="flex-none flex flex-row items-center mr-3 py-1.5">
+            <FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" />
+            <div className="flex flex-col ml-3 text-left min-w-[85px]">
+              <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
+                <div className="pl-0.5 text-xs">
+                  {t("glances.wait")}
+                </div>
+              </div>
+              <UsageBar percent="0" />
+            </div>
+          </div>
+          <div className="flex-none flex flex-row items-center mr-3 py-1.5">
+            <FaMemory className="text-theme-800 dark:text-theme-200 w-5 h-5" />
+            <div className="flex flex-col ml-3 text-left min-w-[85px]">
+              <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
+                <div className="pl-0.5 text-xs">
+                  {t("glances.wait")}
+                </div>
+              </div>
+              <UsageBar percent="0" />
+            </div>
+          </div>
+        </div>
+        {options.label && (
+          <div className="ml-6 pt-1 text-center text-theme-800 dark:text-theme-200 text-xs">{options.label}</div>
+        )}
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col max-w:full sm:basis-auto self-center grow-0 flex-wrap ml-4">
+      <div className="flex flex-row self-center flex-wrap justify-between">
+         <div className="flex-none flex flex-row items-center mr-3 py-1.5">
+          <FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" />
+          <div className="flex flex-col ml-3 text-left min-w-[85px]">
+            <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
+              <div className="pl-0.5">
+                {t("common.number", {
+                  value: data.cpu,
+                  style: "unit",
+                  unit: "percent",
+                  maximumFractionDigits: 0,
+                })}
+              </div>
+              <div className="pr-1">{t("glances.cpu")}</div>
+            </div>
+            <UsageBar percent={data.cpu} />
+          </div>
+        </div>
+        <div className="flex-none flex flex-row items-center mr-3 py-1.5">
+          <FaMemory className="text-theme-800 dark:text-theme-200 w-5 h-5" />
+          <div className="flex flex-col ml-3 text-left min-w-[85px]">
+            <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
+              <div className="pl-0.5">
+                {t("common.number", {
+                  value: data.mem,
+                  style: "unit",
+                  unit: "percent",
+                  maximumFractionDigits: 0,
+                })}
+              </div>
+              <div className="pr-1">{t("glances.mem")}</div>
+            </div>
+            <UsageBar percent={data.mem} />
+          </div>
+        </div>
+      </div>
+      {options.label && (
+        <div className="pt-1 text-center text-theme-800 dark:text-theme-200 text-xs">{options.label}</div>
+      )}
+    </div>
+  );
+}

src/components/widgets/logo/logo.jsx

@@ -0,0 +1,56 @@
+export default function Logo() {
+  return (
+    <div className="w-12 h-12 flex flex-row items-center align-middle mr-3 self-center">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 1024 1024"
+        style={{
+          enableBackground: "new 0 0 1024 1024",
+        }}
+        xmlSpace="preserve"
+        className="w-full h-full"
+      >
+        <style>
+          {
+            ".st0{display:none}.st3{stroke-linecap:square}.st3,.st4{fill:none;stroke:#fff;stroke-miterlimit:10}.st6{display:inline;fill:#333}.st7{fill:#fff}"
+          }
+        </style>
+        <g id="Icon">
+          <path
+            d="M771.9 191c27.7 0 50.1 26.5 50.1 59.3v186.4l-100.2.3V250.3c0-32.8 22.4-59.3 50.1-59.3z"
+            style={{
+              fill: "rgba(var(--color-logo-start))",
+            }}
+          />
+          <linearGradient
+            id="homepage_logo_gradient"
+            gradientUnits="userSpaceOnUse"
+            x1={200.746}
+            y1={225.015}
+            x2={764.986}
+            y2={789.255}
+          >
+            <stop
+              offset={0}
+              style={{
+                stopColor: "rgba(var(--color-logo-start))",
+              }}
+            />
+            <stop
+              offset={1}
+              style={{
+                stopColor: "rgba(var(--color-logo-stop))",
+              }}
+            />
+          </linearGradient>
+          <path
+            d="M721.8 250.3c0-32.7 22.4-59.3 50.1-59.3H253.1c-27.7 0-50.1 26.5-50.1 59.3v582.2l90.2-75.7-.1-130.3H375v61.8l88-73.8 258.8 217.9V250.6"
+            style={{
+              fill: "url(#homepage_logo_gradient)",
+            }}
+          />
+        </g>
+      </svg>
+    </div>
+  );
+}

src/components/widgets/openweathermap/weather.jsx

@@ -16,9 +16,9 @@ function Widget({ options }) {
 
   if (error || data?.cod === 401 || data?.error) {
     return (
-      <div className="flex flex-col justify-center first:ml-0 ml-4">
+      <div className="flex flex-col justify-center first:ml-auto ml-4 mr-2">
         <div className="flex flex-row items-center justify-end">
-          <div className="flex flex-col items-center">
+          <div className="hidden sm:flex flex-col items-center">
             <BiError className="w-8 h-8 text-theme-800 dark:text-theme-200" />
             <div className="flex flex-col ml-3 text-left">
               <span className="text-theme-800 dark:text-theme-200 text-sm">{t("widget.api_error")}</span>
@@ -32,9 +32,9 @@ function Widget({ options }) {
 
   if (!data) {
     return (
-      <div className="flex flex-col justify-center first:ml-0 ml-4">
+      <div className="flex flex-col justify-center first:ml-auto ml-4 mr-2">
         <div className="flex flex-row items-center justify-end">
-          <div className="flex flex-col items-center">
+          <div className="hidden sm:flex flex-col items-center">
             <WiCloudDown className="w-8 h-8 text-theme-800 dark:text-theme-200" />
           </div>
           <div className="flex flex-col ml-3 text-left">
@@ -49,9 +49,9 @@ function Widget({ options }) {
   const unit = options.units === "metric" ? "celsius" : "fahrenheit";
 
   return (
-    <div className="flex flex-col justify-center first:ml-0 ml-4">
+    <div className="flex flex-col justify-center first:ml-auto ml-2 mr-2">
       <div className="flex flex-row items-center justify-end">
-        <div className="flex flex-col items-center">
+        <div className="hidden sm:flex flex-col items-center">
           <Icon
             condition={data.weather[0].id}
             timeOfDay={data.dt > data.sys.sunrise && data.dt < data.sys.sundown ? "day" : "night"}
@@ -102,9 +102,13 @@ export default function OpenWeatherMap({ options }) {
 
   if (!location) {
     return (
-      <button type="button" onClick={() => requestLocation()} className="flex flex-col justify-center first:ml-0 ml-4">
+      <button
+        type="button"
+        onClick={() => requestLocation()}
+        className="flex flex-col justify-center first:ml-auto ml-4 mr-2"
+      >
         <div className="flex flex-row items-center justify-end">
-          <div className="flex flex-col items-center">
+          <div className="hidden sm:flex flex-col items-center">
             {requesting ? (
               <MdLocationSearching className="w-6 h-6 text-theme-800 dark:text-theme-200 animate-pulse" />
             ) : (

src/components/widgets/resources/cpu.jsx

@@ -30,7 +30,7 @@ export default function Cpu({ expanded }) {
         <div className="flex flex-col ml-3 text-left min-w-[85px]">
           <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
             <div className="pl-0.5">-</div>
-            <div className="pr-1">{t("docker.cpu")}</div>
+            <div className="pr-1">{t("resources.cpu")}</div>
           </div>
           {expanded && (
             <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
@@ -59,7 +59,7 @@ export default function Cpu({ expanded }) {
               maximumFractionDigits: 0,
             })}
           </div>
-          <div className="pr-1">{t("docker.cpu")}</div>
+          <div className="pr-1">{t("resources.cpu")}</div>
         </div>
         {expanded && (
           <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">

src/components/widgets/resources/resources.jsx

@@ -5,7 +5,7 @@ import Memory from "./memory";
 export default function Resources({ options }) {
   const { expanded } = options;
   return (
-    <div className="flex flex-col max-w:full sm:basis-auto self-center m-auto flex-wrap">
+    <div className="flex flex-col max-w:full sm:basis-auto self-center grow-0 flex-wrap">
       <div className="flex flex-row self-center flex-wrap justify-between">
         {options.cpu && <Cpu expanded={expanded} />}
         {options.memory && <Memory expanded={expanded} />}

src/components/widgets/search/search.jsx

@@ -56,7 +56,7 @@ export default function Search({ options }) {
   }
 
   return (
-    <form className="flex-col relative h-8 my-4 min-w-full md:min-w-fit grow first:ml-0 ml-4" onSubmit={handleSubmit}>
+    <form className="flex-col relative h-8 my-4 min-w-fit grow first:ml-0 ml-4" onSubmit={handleSubmit}>
       <div className="flex absolute inset-y-0 left-0 items-center pl-3 pointer-events-none w-full text-theme-800 dark:text-white" />
       <input
         type="text"

src/components/widgets/unifi_console/unifi_console.jsx

@@ -0,0 +1,119 @@
+import { BiError, BiWifi, BiCheckCircle, BiXCircle } from "react-icons/bi";
+import { MdSettingsEthernet } from "react-icons/md";
+import { useTranslation } from "next-i18next";
+import { SiUbiquiti } from "react-icons/si";
+
+import useWidgetAPI from "utils/proxy/use-widget-api";
+
+export default function Widget({ options }) {
+  const { t } = useTranslation();
+
+  // eslint-disable-next-line no-param-reassign
+  options.type = "unifi_console";
+  const { data: statsData, error: statsError } = useWidgetAPI(options, "stat/sites", { index: options.index });
+
+  if (statsError || statsData?.error) {
+    return (
+      <div className="flex flex-col justify-center first:ml-0 ml-4">
+        <div className="flex flex-row items-center justify-end">
+          <div className="flex flex-col items-center">
+            <BiError className="w-8 h-8 text-theme-800 dark:text-theme-200" />
+            <div className="flex flex-col ml-3 text-left">
+              <span className="text-theme-800 dark:text-theme-200 text-sm">{t("widget.api_error")}</span>
+              <span className="text-theme-800 dark:text-theme-200 text-xs">-</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  const defaultSite = statsData?.data?.find(s => s.name === "default");
+
+  if (!defaultSite) {
+    return (
+      <div className="flex flex-col justify-center first:ml-0 ml-4">
+        <div className="flex flex-row items-center justify-end">
+          <div className="flex flex-col items-center">
+            <SiUbiquiti className="w-5 h-5 text-theme-800 dark:text-theme-200" />
+          </div>
+          <div className="flex flex-col ml-3 text-left">
+            <span className="text-theme-800 dark:text-theme-200 text-xs">{t("unifi.wait")}</span>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  const wan = defaultSite.health.find(h => h.subsystem === "wan");
+  const lan = defaultSite.health.find(h => h.subsystem === "lan");
+  const wlan = defaultSite.health.find(h => h.subsystem === "wlan");
+  const data = {
+    name: wan.gw_name,
+    uptime: wan["gw_system-stats"].uptime,
+    up: wan.status === 'ok',
+    wlan: {
+      users: wlan.num_user,
+      status: wlan.status
+    },
+    lan: {
+      users: lan.num_user,
+      status: lan.status
+    }
+  };
+
+  return (
+    <div className="flex-none flex flex-row items-center mr-3 py-1.5">
+      <div className="flex flex-col">
+        <div className="flex flex-row ml-3">
+          <SiUbiquiti className="text-theme-800 dark:text-theme-200 w-3 h-3 mr-1" />
+          <div className="text-theme-800 dark:text-theme-200 text-xs font-bold flex flex-row justify-between">
+            {data.name}
+          </div>
+        </div>
+        <div className="flex flex-row ml-3 text-[10px] justify-between">
+          <div className="flex flex-row" title={t("unifi.uptime")}>
+            <div className="pr-0.5 text-theme-800 dark:text-theme-200">
+              {t("common.number", {
+                value: data.uptime / 86400,
+                maximumFractionDigits: 1,
+              })}
+            </div>
+            <div className="pr-1 text-theme-800 dark:text-theme-200">{t("unifi.days")}</div>
+          </div>
+          <div className="flex flex-row">
+            <div className="pr-1 text-theme-800 dark:text-theme-200">{t("unifi.wan")}</div>
+            { data.up
+              ? <BiCheckCircle className="text-theme-800 dark:text-theme-200 h-4 w-3" />
+              : <BiXCircle className="text-theme-800 dark:text-theme-200 h-4 w-3" />
+            }
+          </div>
+        </div>
+      </div>
+      <div className="flex flex-col">
+        <div className="flex flex-row ml-3 py-0.5">
+          <BiWifi className="text-theme-800 dark:text-theme-200 w-4 h-4 mr-1" />
+          <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between" title={t("unifi.users")}>
+            <div className="pr-0.5">
+              {t("common.number", {
+                value: data.wlan.users,
+                maximumFractionDigits: 0,
+              })}
+            </div>
+          </div>
+        </div>
+        <div className="flex flex-row ml-3 pb-0.5">
+          <MdSettingsEthernet className="text-theme-800 dark:text-theme-200 w-4 h-4 mr-1" />
+          <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between" title={t("unifi.users")}>
+            <div className="pr-0.5">
+              {t("common.number", {
+                value: data.lan.users,
+                maximumFractionDigits: 0,
+              })}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

src/components/widgets/weather/weather.jsx

@@ -16,7 +16,7 @@ function Widget({ options }) {
 
   if (error || data?.error) {
     return (
-      <div className="flex flex-col justify-center first:ml-0 ml-4">
+      <div className="flex flex-col justify-center first:ml-0 ml-4 mr-2">
         <div className="flex flex-row items-center justify-end">
           <div className="flex flex-col items-center">
             <BiError className="w-8 h-8 text-theme-800 dark:text-theme-200" />
@@ -32,7 +32,7 @@ function Widget({ options }) {
 
   if (!data) {
     return (
-      <div className="flex flex-col justify-center first:ml-0 ml-4">
+      <div className="flex flex-col justify-center first:ml-0 ml-4 mr-2">
         <div className="flex flex-row items-center justify-end">
           <div className="flex flex-col items-center">
             <WiCloudDown className="w-8 h-8 text-theme-800 dark:text-theme-200" />
@@ -49,7 +49,7 @@ function Widget({ options }) {
   const unit = options.units === "metric" ? "celsius" : "fahrenheit";
 
   return (
-    <div className="flex flex-col justify-center first:ml-0 ml-4">
+    <div className="flex flex-col justify-center first:ml-0 ml-4 mr-2">
       <div className="flex flex-row items-center justify-end">
         <div className="flex flex-col items-center">
           <Icon condition={data.current.condition.code} timeOfDay={data.current.is_day ? "day" : "night"} />
@@ -103,7 +103,11 @@ export default function WeatherApi({ options }) {
 
   if (!location) {
     return (
-      <button type="button" onClick={() => requestLocation()} className="flex flex-col justify-center first:ml-0 ml-4">
+      <button
+        type="button"
+        onClick={() => requestLocation()}
+        className="flex flex-col justify-center first:ml-0 ml-4 mr-2"
+      >
         <div className="flex flex-row items-center justify-end">
           <div className="flex flex-col items-center">
             {requesting ? (

src/components/widgets/widget.jsx

@@ -1,5 +1,7 @@
 import dynamic from "next/dynamic";
 
+import ErrorBoundary from "components/errorboundry";
+
 const widgetMappings = {
   weatherapi: dynamic(() => import("components/widgets/weather/weather")),
   openweathermap: dynamic(() => import("components/widgets/openweathermap/weather")),
@@ -7,13 +9,20 @@ const widgetMappings = {
   search: dynamic(() => import("components/widgets/search/search")),
   greeting: dynamic(() => import("components/widgets/greeting/greeting")),
   datetime: dynamic(() => import("components/widgets/datetime/datetime")),
+  logo: dynamic(() => import("components/widgets/logo/logo"), { ssr: false }),
+  unifi_console: dynamic(() => import("components/widgets/unifi_console/unifi_console")),
+  glances: dynamic(() => import("components/widgets/glances/glances")),
 };
 
 export default function Widget({ widget }) {
   const InfoWidget = widgetMappings[widget.type];
 
   if (InfoWidget) {
-    return <InfoWidget options={widget.options} />;
+    return (
+      <ErrorBoundary>
+        <InfoWidget options={widget.options} />
+      </ErrorBoundary>
+    );
   }
 
   return (

src/pages/_document.jsx

@@ -8,6 +8,13 @@ export default function Document() {
           name="description"
           content="A highly customizable homepage (or startpage / application dashboard) with Docker and service API integrations."
         />
+        <meta name="apple-mobile-web-app-capable" content="yes" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+        <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v=4" />
+        <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=4" />
+        <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png?v=4" />
+        <link rel="manifest" href="/site.webmanifest?v=4" />
+        <link rel="mask-icon" href="/safari-pinned-tab.svg?v=4" color="#1e9cd7" />
       </Head>
       <body>
         <Main />

src/pages/api/proxy.js

@@ -1,59 +0,0 @@
-import https from "https";
-
-import getRawBody from "raw-body";
-
-import { httpRequest, httpsRequest } from "utils/proxy/http";
-
-export const config = {
-  api: {
-    bodyParser: false,
-  },
-};
-
-export default async function handler(req, res) {
-  const headers = ["X-API-Key", "Authorization"].reduce((obj, key) => {
-    if (req.headers && Object.prototype.hasOwnProperty.call(req.headers, key.toLowerCase())) {
-      // eslint-disable-next-line no-param-reassign
-      obj[key] = req.headers[key.toLowerCase()];
-    }
-    return obj;
-  }, {});
-
-  const url = new URL(req.query.url);
-
-  if (url.protocol === "https:") {
-    // this agent allows us to bypass the certificate check
-    // which is required for most self-signed certificates
-    const httpsAgent = new https.Agent({
-      rejectUnauthorized: false,
-    });
-
-    const [status, contentType, data] = await httpsRequest(url, {
-      agent: httpsAgent,
-      method: req.method,
-      headers,
-      body:
-        req.method === "GET" || req.method === "HEAD"
-          ? null
-          : await getRawBody(req, {
-              encoding: "utf8",
-            }),
-    });
-
-    res.setHeader("Content-Type", contentType);
-    return res.status(status).send(data);
-  }
-  const [status, contentType, data] = await httpRequest(url, {
-    method: req.method,
-    headers,
-    body:
-      req.method === "GET" || req.method === "HEAD"
-        ? null
-        : await getRawBody(req, {
-            encoding: "utf8",
-          }),
-  });
-
-  res.setHeader("Content-Type", contentType);
-  return res.status(status).send(data);
-}

src/pages/api/theme.js

@@ -0,0 +1,14 @@
+import checkAndCopyConfig, { getSettings } from "utils/config/config";
+
+export default function handler({ res }) {
+  checkAndCopyConfig("settings.yaml");
+  const settings = getSettings();
+
+  const color = settings.color || "slate";
+  const theme = settings.theme || "dark";
+
+  return res.status(200).json({
+    color,
+    theme,
+  });
+}

src/pages/api/widgets/glances.js

@@ -0,0 +1,40 @@
+import { httpProxy } from "utils/proxy/http";
+import createLogger from "utils/logger";
+import { getPrivateWidgetOptions } from "utils/config/widget-helpers";
+
+const logger = createLogger("glances");
+
+export default async function handler(req, res) {
+  const { index } = req.query;
+
+  const privateWidgetOptions = await getPrivateWidgetOptions("glances", index);
+  
+  const url = privateWidgetOptions?.url;
+  if (!url) {
+    const errorMessage = "Missing Glances URL";
+    logger.error(errorMessage);
+    return res.status(400).json({ error: errorMessage });
+  }
+
+  const apiUrl = `${url}/api/3/quicklook`;
+  const headers = {
+    "Accept-Encoding": "application/json"
+  };
+  if (privateWidgetOptions.username && privateWidgetOptions.password) {
+    headers.Authorization = `Basic ${Buffer.from(`${privateWidgetOptions.username}:${privateWidgetOptions.password}`).toString("base64")}`
+  }
+  const params = { method: "GET", headers };
+
+  const [status, contentType, data] = await httpProxy(apiUrl, params);
+
+  if (status === 401) {
+    logger.error("Authorization failure getting data from glances API. Data: %s", data);
+  }
+
+  if (status !== 200) {
+    logger.error("HTTP %d getting data from glances API. Data: %s", status, data);
+  }
+
+  if (contentType) res.setHeader("Content-Type", contentType);
+  return res.status(status).send(data);
+}

src/pages/browserconfig.xml.jsx

@@ -0,0 +1,29 @@
+import { getSettings } from "utils/config/config";
+import themes from "utils/styles/themes";
+
+export async function getServerSideProps({ res }) {
+  const settings = getSettings();
+
+  const color = settings.color || "slate";
+  const theme = settings.theme || "dark";
+
+  const xml = `<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png?v=2"/>
+            <TileColor>${themes[color][theme]}</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>`;
+
+  res.setHeader("Content-Type", "text/xml");
+  res.write(xml);
+  res.end();
+
+  return {
+    props: {},
+  };
+}
+
+export default function BrowserConfig() {}

src/pages/index.jsx

@@ -19,6 +19,8 @@ import { ColorContext } from "utils/contexts/color";
 import { ThemeContext } from "utils/contexts/theme";
 import { SettingsContext } from "utils/contexts/settings";
 import { bookmarksResponse, servicesResponse, widgetsResponse } from "utils/config/api-response";
+import ErrorBoundary from "components/errorboundry";
+import themes from "utils/styles/themes";
 
 const ThemeToggle = dynamic(() => import("components/toggles/theme"), {
   ssr: false,
@@ -144,11 +146,20 @@ function Index({ initialSettings, fallback }) {
 
   return (
     <SWRConfig value={{ fallback, fetcher: (resource, init) => fetch(resource, init).then((res) => res.json()) }}>
-      <Home initialSettings={initialSettings} />
+      <ErrorBoundary>
+        <Home initialSettings={initialSettings} />
+      </ErrorBoundary>
     </SWRConfig>
   );
 }
 
+const headerStyles = {
+  boxed:
+    "m-4 mb-0 sm:m-8 sm:mb-0 rounded-md shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 dark:bg-white/5 p-3",
+  underlined: "m-4 mb-0 sm:m-8 sm:mb-1 border-b-2 pb-4 border-theme-800 dark:border-theme-200/50",
+  clean: "m-4 mb-0 sm:m-8 sm:mb-0",
+};
+
 function Home({ initialSettings }) {
   const { i18n } = useTranslation();
   const { theme, setTheme } = useContext(ThemeContext);
@@ -182,10 +193,24 @@ function Home({ initialSettings }) {
       <Head>
         <title>{initialSettings.title || "Homepage"}</title>
         {initialSettings.base && <base href={initialSettings.base} />}
-        {initialSettings.favicon && <link rel="icon" href={initialSettings.favicon} />}
+        {initialSettings.favicon ? (
+          <link rel="icon" href={initialSettings.favicon} />
+        ) : (
+          <link rel="shortcut icon" href="/homepage.ico" />
+        )}
+        <meta
+          name="msapplication-TileColor"
+          content={themes[initialSettings.color || "slate"][initialSettings.theme || "dark"]}
+        />
+        <meta name="theme-color" content={themes[initialSettings.color || "slate"][initialSettings.theme || "dark"]} />
       </Head>
       <div className="relative container m-auto flex flex-col justify-between z-10">
-        <div className="flex flex-row flex-wrap m-8 pb-4 mt-10 border-b-2 border-theme-800 dark:border-theme-200 justify-between">
+        <div
+          className={classNames(
+            "flex flex-row flex-wrap  justify-between",
+            headerStyles[initialSettings.headerStyle || "underlined"]
+          )}
+        >
           {widgets && (
             <>
               {widgets
@@ -194,7 +219,7 @@ function Home({ initialSettings }) {
                   <Widget key={i} widget={widget} />
                 ))}
 
-              <div className="ml-4 flex flex-wrap basis-full grow sm:basis-auto justify-between md:justify-end mt-2 md:mt-0">
+              <div className="m-auto sm:ml-2 flex flex-wrap grow sm:basis-auto justify-between md:justify-end">
                 {widgets
                   .filter((widget) => rightAlignedWidgets.includes(widget.type))
                   .map((widget, i) => (
@@ -206,7 +231,7 @@ function Home({ initialSettings }) {
         </div>
 
         {services && (
-          <div className="flex flex-wrap p-8 items-start">
+          <div className="flex flex-wrap p-4 sm:p-8 sm:pt-4 items-start pb-2">
             {services.map((group) => (
               <ServicesGroup key={group.name} services={group} layout={initialSettings.layout?.[group.name]} />
             ))}
@@ -214,7 +239,7 @@ function Home({ initialSettings }) {
         )}
 
         {bookmarks && (
-          <div className="grow flex flex-wrap pt-0 p-8">
+          <div className="grow flex flex-wrap pt-0 p-4 sm:p-8">
             {bookmarks.map((group) => (
               <BookmarksGroup key={group.name} group={group} />
             ))}
@@ -238,8 +263,6 @@ function Home({ initialSettings }) {
 export default function Wrapper({ initialSettings, fallback }) {
   const wrappedStyle = {};
   if (initialSettings && initialSettings.background) {
-    // wrappedStyle.backgroundImage = `url(${initialSettings.background})`;
-    // wrappedStyle.backgroundSize = "cover";
     const opacity = initialSettings.backgroundOpacity ?? 1;
     const opacityValue = 1 - opacity;
     wrappedStyle.backgroundImage = `

src/pages/site.webmanifest.jsx

@@ -0,0 +1,42 @@
+import checkAndCopyConfig, { getSettings } from "utils/config/config";
+import themes from "utils/styles/themes";
+
+export async function getServerSideProps({ res }) {
+  checkAndCopyConfig("settings.yaml");
+  const settings = getSettings();
+
+  const color = settings.color || "slate";
+  const theme = settings.theme || "dark";
+
+  const manifest = {
+    name: settings.title || "Homepage",
+    short_name: settings.title || "Homepage",
+    icons: [
+      {
+        src: "/android-chrome-192x192.png?v=2",
+        sizes: "192x192",
+        type: "image/png",
+      },
+      {
+        src: "/android-chrome-512x512.png?v=2",
+        sizes: "512x512",
+        type: "image/png",
+      },
+    ],
+    theme_color: themes[color][theme],
+    background_color: themes[color][theme],
+    display: "standalone",
+  };
+
+  res.setHeader("Content-Type", "application/manifest+json");
+  res.write(JSON.stringify(manifest));
+  res.end();
+
+  return {
+    props: {},
+  };
+}
+
+export default function Webmanifest() {
+  return null;
+}

src/styles/globals.css

@@ -13,6 +13,9 @@ html,
 body {
   font-family: Manrope, "Manrope-Fallback", Arial, sans-serif;
   overflow: hidden;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 }
 
 #page_wrapper {
@@ -36,7 +39,6 @@ body {
 
 #page_container {
   overflow: auto;
-  overflow: overlay;
   scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
 }
 

src/styles/manrope.css

@@ -13,49 +13,16 @@
 
 @font-face {
   font-family: "Manrope";
-  font-weight: 200;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
+  font-weight: 200 800;
+  font-style: normal;
+  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2"), url("./font/Manrope.ttf") format("ttf");
   font-display: swap;
 }
 
 @font-face {
   font-family: "Manrope";
-  font-weight: 300;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Manrope";
-  font-weight: 400;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Manrope";
-  font-weight: 500;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Manrope";
-  font-weight: 600;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Manrope";
-  font-weight: 700;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
-  font-display: swap;
-}
-
-@font-face {
-  font-family: "Manrope";
-  font-weight: 800;
-  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2");
+  font-weight: 200 800;
+  fint-style: italic;
+  src: local("Manrope"), url("./font/Manrope.woff2") format("woff2"), url("./font/Manrope.ttf") format("ttf");
   font-display: swap;
 }

src/styles/theme.css

@@ -9,6 +9,9 @@
   --color-700: 40 40 40;
   --color-800: 255 255 255;
   --color-900: 255 255 255;
+
+  --color-logo-start: 128 128 128 / 20%;
+  --color-logo-stop: 128 128 128 / 40%;
 }
 
 .theme-slate {
@@ -22,6 +25,9 @@
   --color-700: 51 65 85;
   --color-800: 30 41 59;
   --color-900: 15 23 42;
+
+  --color-logo-start: 148 163 184;
+  --color-logo-stop: 51 65 85;
 }
 
 .theme-gray {
@@ -35,6 +41,9 @@
   --color-700: 55 65 81;
   --color-800: 31 41 55;
   --color-900: 17 24 39;
+
+  --color-logo-start: 156 163 175;
+  --color-logo-stop: 55 65 81;
 }
 
 .theme-zinc {
@@ -48,6 +57,9 @@
   --color-700: 63 63 70;
   --color-800: 39 39 42;
   --color-900: 24 24 27;
+
+  --color-logo-start: 161 161 170;
+  --color-logo-stop: 63 63 70;
 }
 
 .theme-neutral {
@@ -61,6 +73,9 @@
   --color-700: 64 64 64;
   --color-800: 38 38 38;
   --color-900: 23 23 23;
+
+  --color-logo-start: 163 163 163;
+  --color-logo-stop: 64 64 64;
 }
 
 .theme-stone {
@@ -74,6 +89,9 @@
   --color-700: 68 64 60;
   --color-800: 41 37 36;
   --color-900: 28 25 23;
+
+  --color-logo-start: 168 162 158;
+  --color-logo-stop: 68 64 60;
 }
 
 .theme-red {
@@ -87,6 +105,9 @@
   --color-700: 185 28 28;
   --color-800: 153 27 27;
   --color-900: 127 29 29;
+
+  --color-logo-start: 248 113 113;
+  --color-logo-stop: 185 28 28;
 }
 
 .theme-orange {
@@ -100,6 +121,9 @@
   --color-700: 194 65 12;
   --color-800: 154 52 18;
   --color-900: 124 45 18;
+
+  --color-logo-start: 251 146 60;
+  --color-logo-stop: 194 65 12;
 }
 
 .theme-amber {
@@ -113,6 +137,9 @@
   --color-700: 180 83 9;
   --color-800: 146 64 14;
   --color-900: 120 53 15;
+
+  --color-logo-start: 251 191 36;
+  --color-logo-stop: 180 83 9;
 }
 
 .theme-yellow {
@@ -126,6 +153,9 @@
   --color-700: 161 98 7;
   --color-800: 133 77 14;
   --color-900: 113 63 18;
+
+  --color-logo-start: 250 204 21;
+  --color-logo-stop: 161 98 7;
 }
 
 .theme-lime {
@@ -139,6 +169,9 @@
   --color-700: 77 124 15;
   --color-800: 63 98 18;
   --color-900: 54 83 20;
+
+  --color-logo-start: 163 230 53;
+  --color-logo-stop: 77 124 15;
 }
 
 .theme-green {
@@ -152,6 +185,9 @@
   --color-700: 21 128 61;
   --color-800: 22 101 52;
   --color-900: 20 83 45;
+
+  --color-logo-start: 74 222 128;
+  --color-logo-stop: 21 128 61;
 }
 
 .theme-emerald {
@@ -165,6 +201,9 @@
   --color-700: 4 120 87;
   --color-800: 6 95 70;
   --color-900: 6 78 59;
+
+  --color-logo-start: 52 211 153;
+  --color-logo-stop: 4 120 87;
 }
 
 .theme-teal {
@@ -178,6 +217,9 @@
   --color-700: 15 118 110;
   --color-800: 17 94 89;
   --color-900: 19 78 74;
+
+  --color-logo-start: 45 212 191;
+  --color-logo-stop: 15 118 110;
 }
 
 .theme-cyan {
@@ -191,6 +233,9 @@
   --color-700: 14 116 144;
   --color-800: 21 94 117;
   --color-900: 22 78 99;
+
+  --color-logo-start: 34 211 238;
+  --color-logo-stop: 14 116 144;
 }
 
 .theme-sky {
@@ -204,6 +249,9 @@
   --color-700: 3 105 161;
   --color-800: 7 89 133;
   --color-900: 12 74 110;
+
+  --color-logo-start: 56 189 248;
+  --color-logo-stop: 3 105 161;
 }
 
 .theme-blue {
@@ -217,6 +265,9 @@
   --color-700: 29 78 216;
   --color-800: 30 64 175;
   --color-900: 30 58 138;
+
+  --color-logo-start: 96 165 250;
+  --color-logo-stop: 29 78 216;
 }
 
 .theme-indigo {
@@ -230,6 +281,9 @@
   --color-700: 67 56 202;
   --color-800: 55 48 163;
   --color-900: 49 46 129;
+
+  --color-logo-start: 129 140 248;
+  --color-logo-stop: 67 56 202;
 }
 
 .theme-violet {
@@ -243,6 +297,9 @@
   --color-700: 109 40 217;
   --color-800: 91 33 182;
   --color-900: 76 29 149;
+
+  --color-logo-start: 167 139 250;
+  --color-logo-stop: 109 40 217;
 }
 
 .theme-purple {
@@ -256,6 +313,9 @@
   --color-700: 126 34 206;
   --color-800: 107 33 168;
   --color-900: 88 28 135;
+
+  --color-logo-start: 192 132 252;
+  --color-logo-stop: 126 34 206;
 }
 
 .theme-fuchsia {
@@ -269,6 +329,9 @@
   --color-700: 162 28 175;
   --color-800: 134 25 143;
   --color-900: 112 26 117;
+
+  --color-logo-start: 232 121 249;
+  --color-logo-stop: 162 28 175;
 }
 
 .theme-pink {
@@ -282,6 +345,9 @@
   --color-700: 190 24 93;
   --color-800: 157 23 77;
   --color-900: 131 24 67;
+
+  --color-logo-start: 244 114 182;
+  --color-logo-stop: 190 24 93;
 }
 
 .theme-rose {
@@ -295,4 +361,7 @@
   --color-700: 190 18 60;
   --color-800: 159 18 57;
   --color-900: 136 19 55;
+
+  --color-logo-start: 251 113 133;
+  --color-logo-stop: 190 18 60;
 }

src/utils/config/api-response.js

@@ -6,6 +6,7 @@ import yaml from "js-yaml";
 
 import checkAndCopyConfig from "utils/config/config";
 import { servicesFromConfig, servicesFromDocker, cleanServiceGroups } from "utils/config/service-helpers";
+import { cleanWidgetGroups, widgetsFromConfig } from "utils/config/widget-helpers";
 
 export async function bookmarksResponse() {
   checkAndCopyConfig("bookmarks.yaml");
@@ -29,21 +30,17 @@ export async function bookmarksResponse() {
 }
 
 export async function widgetsResponse() {
-  checkAndCopyConfig("widgets.yaml");
+  let configuredWidgets;
 
-  const widgetsYaml = path.join(process.cwd(), "config", "widgets.yaml");
-  const fileContents = await fs.readFile(widgetsYaml, "utf8");
-  const widgets = yaml.load(fileContents);
+  try {
+    configuredWidgets = cleanWidgetGroups(await widgetsFromConfig());
+  } catch (e) {
+    console.error("Failed to load widgets, please check widgets.yaml for errors or remove example entries.");
+    if (e) console.error(e);
+    configuredWidgets = [];
+  }
 
-  if (!widgets) return [];
-
-  // map easy to write YAML objects into easy to consume JS arrays
-  const widgetsArray = widgets.map((group) => ({
-    type: Object.keys(group)[0],
-    options: { ...group[Object.keys(group)[0]] },
-  }));
-
-  return widgetsArray;
+  return configuredWidgets;
 }
 
 export async function servicesResponse() {

src/utils/config/config.js

@@ -33,4 +33,4 @@ export function getSettings() {
   const settingsYaml = join(process.cwd(), "config", "settings.yaml");
   const fileContents = readFileSync(settingsYaml, "utf8");
   return yaml.load(fileContents);
-}
+}

src/utils/config/service-helpers.js

@@ -59,7 +59,7 @@ export async function servicesFromDocker() {
         let constructedService = null;
 
         Object.keys(container.Labels).forEach((label) => {
-          if (label.startsWith("homepage")) {
+          if (label.startsWith("homepage.")) {
             if (!constructedService) {
               constructedService = {
                 container: container.Names[0].replace(/^\//, ""),
@@ -165,4 +165,4 @@ export default async function getServiceWidget(group, service) {
   }
 
   return false;
-}
+}

src/utils/config/widget-helpers.js

@@ -0,0 +1,73 @@
+import { promises as fs } from "fs";
+import path from "path";
+
+import yaml from "js-yaml";
+
+import checkAndCopyConfig from "utils/config/config";
+
+export async function widgetsFromConfig() {
+    checkAndCopyConfig("widgets.yaml");
+
+    const widgetsYaml = path.join(process.cwd(), "config", "widgets.yaml");
+    const fileContents = await fs.readFile(widgetsYaml, "utf8");
+    const widgets = yaml.load(fileContents);
+
+    if (!widgets) return [];
+
+    // map easy to write YAML objects into easy to consume JS arrays
+    const widgetsArray = widgets.map((group, index) => ({
+        type: Object.keys(group)[0],
+        options: {
+            index,
+            ...group[Object.keys(group)[0]]
+        },
+    }));
+    return widgetsArray;
+}
+
+export async function cleanWidgetGroups(widgets) {
+    return widgets.map((widget, index) => {
+        const sanitizedOptions = widget.options;
+        const optionKeys = Object.keys(sanitizedOptions);
+        ["url", "username", "password", "key"].forEach((pO) => { 
+            if (optionKeys.includes(pO)) {
+                delete sanitizedOptions[pO];
+            }
+        });
+
+        return {
+            type: widget.type,
+            options: {
+                index,
+                ...sanitizedOptions
+            },
+        }
+    });
+}
+
+export async function getPrivateWidgetOptions(type, widgetIndex) {
+    const widgets = await widgetsFromConfig();
+  
+    const privateOptions = widgets.map((widget) => {
+        const {
+            index,
+            url,
+            username,
+            password,
+            key
+        } = widget.options;
+
+        return {
+            type: widget.type,
+            options: {
+                index,
+                url,
+                username,
+                password,
+                key
+            },
+        }
+    });
+  
+    return (type !== undefined && widgetIndex !== undefined) ? privateOptions.find(o => o.type === type && o.options.index === parseInt(widgetIndex, 10))?.options : privateOptions;
+}

src/utils/proxy/api-helpers.js

@@ -2,7 +2,7 @@ export function formatApiCall(url, args) {
   const find = /\{.*?\}/g;
   const replace = (match) => {
     const key = match.replace(/\{|\}/g, "");
-    return args[key];
+    return args[key] || "";
   };
 
   return url.replace(/\/+$/, "").replace(find, replace);

src/utils/proxy/cached-fetch.js

@@ -1,8 +1,13 @@
 import cache from "memory-cache";
 
+const defaultDuration = 5;
+
 export default async function cachedFetch(url, duration) {
   const cached = cache.get(url);
 
+  // eslint-disable-next-line no-param-reassign
+  duration = duration || defaultDuration;
+
   if (cached) {
     return cached;
   }

src/utils/proxy/handlers/credentialed.js

@@ -29,6 +29,8 @@ export default async function credentialedProxyHandler(req, res) {
         headers["X-gotify-Key"] = `${widget.key}`;
       } else if (widget.type === "authentik") {
         headers.Authorization = `Bearer ${widget.key}`;
+      } else if (widget.type === "proxmox") {
+        headers.Authorization = `PVEAPIToken=${widget.username}=${widget.password}`;
       } else {
         headers["X-API-Key"] = `${widget.key}`;
       }

src/utils/styles/themes.js

@@ -0,0 +1,142 @@
+const themes = {
+  white: {
+    light: "#ffffff",
+    iconStart: "#ffffff",
+    iconEnd: "#282828",
+    dark: "#ffffff",
+  },
+  slate: {
+    light: "#f8fafc",
+    iconStart: "#94a3b8",
+    iconEnd: "#334155",
+    dark: "#1e293b",
+  },
+  gray: {
+    light: "#f9fafb",
+    iconStart: "#9ca3af",
+    iconEnd: "#374151",
+    dark: "#1f2937",
+  },
+  zinc: {
+    light: "#fafafa",
+    iconStart: "#a1a1aa",
+    iconEnd: "#3f3f46",
+    dark: "#27272a",
+  },
+  neutral: {
+    light: "#fafafa",
+    iconStart: "#a3a3a3",
+    iconEnd: "#404040",
+    dark: "#262626",
+  },
+  stone: {
+    light: "#fafaf9",
+    iconStart: "#a8a29e",
+    iconEnd: "#44403c",
+    dark: "#292524",
+  },
+  red: {
+    light: "#fef2f2",
+    iconStart: "#f87171",
+    iconEnd: "#b91c1c",
+    dark: "#991b1b",
+  },
+  orange: {
+    light: "#fff7ed",
+    iconStart: "#fb923c",
+    iconEnd: "#c2410c",
+    dark: "#9a3412",
+  },
+  amber: {
+    light: "#fffbeb",
+    iconStart: "#fbbf24",
+    iconEnd: "#b45309",
+    dark: "#92400e",
+  },
+  yellow: {
+    light: "#fefce8",
+    iconStart: "#facc15",
+    iconEnd: "#a16207",
+    dark: "#854d0e",
+  },
+  lime: {
+    light: "#f7fee7",
+    iconStart: "#a3e635",
+    iconEnd: "#4d7c0f",
+    dark: "#3f6212",
+  },
+  green: {
+    light: "#f0fdf4",
+    iconStart: "#4ade80",
+    iconEnd: "#15803d",
+    dark: "#166534",
+  },
+  emerald: {
+    light: "#ecfdf5",
+    iconStart: "#34d399",
+    iconEnd: "#047857",
+    dark: "#065f46",
+  },
+  teal: {
+    light: "#f0fdfa",
+    iconStart: "#2dd4bf",
+    iconEnd: "#0f766e",
+    dark: "#115e59",
+  },
+  cyan: {
+    light: "#ecfeff",
+    iconStart: "#22d3ee",
+    iconEnd: "#0e7490",
+    dark: "#155e75",
+  },
+  sky: {
+    light: "#f0f9ff",
+    iconStart: "#38bdf8",
+    iconEnd: "#0369a1",
+    dark: "#075985",
+  },
+  blue: {
+    light: "#eff6ff",
+    iconStart: "#60a5fa",
+    iconEnd: "#1d4ed8",
+    dark: "#1e40af",
+  },
+  indigo: {
+    light: "#eef2ff",
+    iconStart: "#818cf8",
+    iconEnd: "#4338ca",
+    dark: "#3730a3",
+  },
+  violet: {
+    light: "#f5f3ff",
+    iconStart: "#a78bfa",
+    iconEnd: "#6d28d9",
+    dark: "#5b21b6",
+  },
+  purple: {
+    light: "#faf5ff",
+    iconStart: "#c084fc",
+    iconEnd: "#7e22ce",
+    dark: "#6b21a8",
+  },
+  fuchsia: {
+    light: "#fdf4ff",
+    iconStart: "#e879f9",
+    iconEnd: "#a21caf",
+    dark: "#86198f",
+  },
+  pink: {
+    light: "#fdf2f8",
+    iconStart: "#f472b6",
+    iconEnd: "#be185d",
+    dark: "#9d174d",
+  },
+  rose: {
+    light: "#fff1f2",
+    iconStart: "#fb7185",
+    iconEnd: "#be123c",
+    dark: "#9f1239",
+  },
+};
+
+export default themes;

src/widgets/components.js

@@ -18,8 +18,10 @@ const components = {
   ombi: dynamic(() => import("./ombi/component")),
   overseerr: dynamic(() => import("./overseerr/component")),
   pihole: dynamic(() => import("./pihole/component")),
+  plex: dynamic(() => import("./plex/component")),
   portainer: dynamic(() => import("./portainer/component")),
   prowlarr: dynamic(() => import("./prowlarr/component")),
+  proxmox: dynamic(() => import("./proxmox/component")),
   qbittorrent: dynamic(() => import("./qbittorrent/component")),
   radarr: dynamic(() => import("./radarr/component")),
   readarr: dynamic(() => import("./readarr/component")),
@@ -31,6 +33,7 @@ const components = {
   tautulli: dynamic(() => import("./tautulli/component")),
   traefik: dynamic(() => import("./traefik/component")),
   transmission: dynamic(() => import("./transmission/component")),
+  unifi: dynamic(() => import("./unifi/component")),
 };
 
 export default components;

src/widgets/docker/component.jsx

@@ -40,14 +40,16 @@ export default function Component({ service }) {
     );
   }
 
+  const network = statsData.stats.networks?.eth0 || statsData.stats.networks?.network;
+
   return (
     <Container service={service}>
       <Block label="docker.cpu" value={t("common.percent", { value: calculateCPUPercent(statsData.stats) })} />
       <Block label="docker.mem" value={t("common.bytes", { value: statsData.stats.memory_stats.usage })} />
-      {statsData.stats.networks && (
+      {network && (
         <>
-          <Block label="docker.rx" value={t("common.bytes", { value: statsData.stats.networks.eth0.rx_bytes })} />
-          <Block label="docker.tx" value={t("common.bytes", { value: statsData.stats.networks.eth0.tx_bytes })} />
+          <Block label="docker.rx" value={t("common.bytes", { value: network.rx_bytes })} />
+          <Block label="docker.tx" value={t("common.bytes", { value: network.tx_bytes })} />
         </>
       )}
     </Container>

src/widgets/plex/component.jsx

@@ -0,0 +1,38 @@
+import useSWR from "swr";
+import { useTranslation } from "next-i18next";
+
+import Block from "components/services/widget/block";
+import Container from "components/services/widget/container";
+import { formatProxyUrl } from "utils/proxy/api-helpers";
+
+export default function Component({ service }) {
+  const { t } = useTranslation();
+
+  const { widget } = service;
+
+  const { data: plexData, error: plexAPIError } = useSWR(formatProxyUrl(widget, "unified"), {
+    refreshInterval: 5000,
+  });
+
+  if (plexAPIError) {
+    return <Container error={t("widget.api_error")} />;
+  }
+
+  if (!plexData) {
+    return (
+      <Container service={service}>
+        <Block label="plex.streams" />
+        <Block label="plex.movies" />
+        <Block label="plex.tv" />
+      </Container>
+    );
+  }
+
+  return (
+    <Container service={service}>
+      <Block label="plex.streams" value={t("common.number", { value: plexData.streams })} />
+      <Block label="plex.movies" value={t("common.number", { value: plexData.movies })} />
+      <Block label="plex.tv" value={t("common.number", { value: plexData.tv })} />
+    </Container>
+  );
+}

src/widgets/plex/proxy.js

@@ -0,0 +1,110 @@
+/* eslint-disable no-underscore-dangle */
+import cache from "memory-cache";
+import { xml2json } from "xml-js";
+
+import { formatApiCall } from "utils/proxy/api-helpers";
+import { httpProxy } from "utils/proxy/http";
+import getServiceWidget from "utils/config/service-helpers";
+import createLogger from "utils/logger";
+import widgets from "widgets/widgets";
+
+const proxyName = "plexProxyHandler";
+const librariesCacheKey = `${proxyName}__libraries`;
+const moviesCacheKey = `${proxyName}__movies`;
+const tvCacheKey = `${proxyName}__tv`;
+const logger = createLogger(proxyName);
+
+async function getWidget(req) {
+  const { group, service } = req.query;
+
+  if (!group || !service) {
+    logger.debug("Invalid or missing service '%s' or group '%s'", service, group);
+    return null;
+  }
+
+  const widget = await getServiceWidget(group, service);
+
+  if (!widget) {
+    logger.debug("Invalid or missing widget for service '%s' in group '%s'", service, group);
+    return null;
+  }
+
+  return widget;
+}
+
+async function fetchFromPlexAPI(endpoint, widget) {
+  const api = widgets?.[widget.type]?.api;
+  if (!api) {
+    return [403, null];
+  }
+
+  const url = new URL(formatApiCall(api, { endpoint, ...widget }));
+
+  const [status, contentType, data] = await httpProxy(url);
+
+  if (status !== 200) {
+    logger.error("HTTP %d communicating with Plex. Data: %s", status, data.toString());
+    return [status, data.toString()];
+  }
+
+  try {
+    const dataDecoded = xml2json(data.toString(), { compact: true });
+    return [status, JSON.parse(dataDecoded), contentType];
+  } catch (e) {
+    logger.error("Error decoding Plex API data. Data: %s", data.toString());
+    return [status, null];
+  }
+}
+
+export default async function plexProxyHandler(req, res) {
+  const widget = await getWidget(req);
+  if (!widget) {
+    return res.status(400).json({ error: "Invalid proxy service type" });
+  }
+
+  logger.debug("Getting streams from Plex API");
+  let streams;
+  let [status, apiData] = await fetchFromPlexAPI("/status/sessions", widget);
+  if (apiData && apiData.MediaContainer) {
+    streams = apiData.MediaContainer._attributes.size;
+  }
+
+  let libraries = cache.get(librariesCacheKey);
+  if (libraries === null) {
+    logger.debug("Getting libraries from Plex API");
+    [status, apiData] = await fetchFromPlexAPI("/library/sections", widget);
+    if (apiData && apiData.MediaContainer) {
+      libraries = apiData.MediaContainer.Directory;
+      cache.put(librariesCacheKey, libraries, 1000 * 60 * 60 * 6);
+    }
+  }
+
+  let movies = cache.get(moviesCacheKey);
+  let tv = cache.get(tvCacheKey);
+  if (movies === null || tv === null) {
+    movies = 0;
+    tv = 0;
+    logger.debug("Getting movie + tv counts from Plex API");
+    libraries.filter(l => ["movie", "show"].includes(l._attributes.type)).forEach(async (library) => {
+      [status, apiData] = await fetchFromPlexAPI(`/library/sections/${library._attributes.key}/all`, widget);
+      if (apiData && apiData.MediaContainer) {
+        const size = parseInt(apiData.MediaContainer._attributes.size, 10);
+        if (library._attributes.type === "movie") {
+          movies += size;
+        } else if (library._attributes.type === "show") {
+          tv += size;
+        }
+      }
+      cache.put(tvCacheKey, tv, 1000 * 60 * 10);
+      cache.put(moviesCacheKey, movies, 1000 * 60 * 10);
+    });
+  }
+  
+  const data = {
+    streams,
+    tv,
+    movies
+  };
+
+  return res.status(status).send(data);
+}

src/widgets/plex/widget.js

@@ -0,0 +1,14 @@
+import plexProxyHandler from "./proxy";
+
+const widget = {
+  api: "{url}{endpoint}?X-Plex-Token={key}",
+  proxyHandler: plexProxyHandler,
+
+  mappings: {
+    unified: {
+      endpoint: "/",
+    },
+  },
+};
+
+export default widget;

src/widgets/proxmox/component.jsx

@@ -0,0 +1,53 @@
+import { useTranslation } from "next-i18next";
+
+import Container from "components/services/widget/container";
+import Block from "components/services/widget/block";
+import useWidgetAPI from "utils/proxy/use-widget-api";
+
+function calcRunning(total, current) {
+  return current.status === "running" ? total + 1 : total;
+}
+
+export default function Component({ service }) {
+  const { t } = useTranslation();
+
+  const { widget } = service;
+
+  const { data: clusterData, error: clusterError } = useWidgetAPI(widget, "cluster/resources");
+
+  if (clusterError) {
+    return <Container error={t("widget.api_error")} />;
+  }
+
+  if (!clusterData || !clusterData.data) {
+    return (
+      <Container service={service}>
+        <Block label="proxmox.vms" />
+        <Block label="proxmox.lxc" />
+        <Block label="proxmox.cpu" />
+        <Block label="proxmox.ram" />
+      </Container>
+    );
+  }
+
+  const { data } = clusterData ;
+  const vms = data.filter(item => item.type === "qemu") || [];
+  const lxc = data.filter(item => item.type === "lxc") || [];
+  const nodes = data.filter(item => item.type === "node") || [];
+
+  const runningVMs = vms.reduce(calcRunning, 0);
+  const runningLXC = lxc.reduce(calcRunning, 0);
+
+  // TODO: support more than one node
+  // TODO: better handling of cluster with zero nodes
+  const node = nodes.length > 0 ? nodes[0] : { cpu: 0.0, mem: 0, maxmem: 0 };
+
+  return (
+    <Container service={service}>
+      <Block label="proxmox.vms" value={`${runningVMs} / ${vms.length}`} />
+      <Block label="proxmox.lxc" value={`${runningLXC} / ${lxc.length}`} />
+      <Block label="proxmox.cpu" value={t("common.percent", { value: (node.cpu * 100) })} />
+      <Block label="proxmox.mem" value={t("common.percent", { value: ((node.mem / node.maxmem) * 100) })} />
+    </Container>
+  );
+}

src/widgets/proxmox/widget.js

@@ -0,0 +1,14 @@
+import credentialedProxyHandler from "utils/proxy/handlers/credentialed";
+
+const widget = {
+  api: "{url}/api2/json/{endpoint}",
+  proxyHandler: credentialedProxyHandler,
+
+  mappings: {
+    "cluster/resources": {
+      endpoint: "cluster/resources",
+    },
+  },
+};
+
+export default widget;

src/widgets/speedtest/component.jsx

@@ -11,7 +11,7 @@ export default function Component({ service }) {
 
   const { data: speedtestData, error: speedtestError } = useWidgetAPI(widget, "speedtest/latest");
 
-  if (speedtestError) {
+  if (speedtestError || (speedtestData && !speedtestData.data)) {
     return <Container error={t("widget.api_error")} />;
   }
 
@@ -31,10 +31,7 @@ export default function Component({ service }) {
         label="speedtest.download"
         value={t("common.bitrate", { value: speedtestData.data.download * 1024 * 1024 })}
       />
-      <Block
-        label="speedtest.upload"
-        value={t("common.bitrate", { value: speedtestData.data.upload * 1024 * 1024 })}
-      />
+      <Block label="speedtest.upload" value={t("common.bitrate", { value: speedtestData.data.upload * 1024 * 1024 })} />
       <Block
         label="speedtest.ping"
         value={t("common.ms", {

src/widgets/unifi/component.jsx

@@ -0,0 +1,58 @@
+import { useTranslation } from "next-i18next";
+
+import Container from "components/services/widget/container";
+import Block from "components/services/widget/block";
+import useWidgetAPI from "utils/proxy/use-widget-api";
+
+export default function Component({ service }) {
+    const { t } = useTranslation();
+
+    const { widget } = service;
+
+    const { data: statsData, error: statsError } = useWidgetAPI(widget, "stat/sites");
+
+    if (statsError || statsData?.error) {
+        return <Container error={t("widget.api_error")} />;
+    }
+
+    const defaultSite = statsData?.data?.find(s => s.name === "default");
+
+    if (!defaultSite) {
+        return (
+        <Container service={service}>
+            <Block label="unifi.uptime" />
+            <Block label="unifi.wan" />
+            <Block label="unifi.lan_users" />
+            <Block label="unifi.wlan_users" />
+        </Container>
+        );
+    }
+
+    const wan = defaultSite.health.find(h => h.subsystem === "wan");
+    const lan = defaultSite.health.find(h => h.subsystem === "lan");
+    const wlan = defaultSite.health.find(h => h.subsystem === "wlan");
+    const data = {
+        name: wan.gw_name,
+        uptime: wan["gw_system-stats"].uptime,
+        up: wan.status === 'ok',
+        wlan: {
+            users: wlan.num_user,
+            status: wlan.status
+        },
+        lan: {
+            users: lan.num_user,
+            status: lan.status
+        },
+    };
+
+    const uptime = `${t("common.number", { value: data.uptime / 86400, maximumFractionDigits: 1 })} ${t("unifi.days")}`;
+
+    return (
+        <Container service={service}>
+            <Block label="unifi.uptime" value={ uptime } />
+            <Block label="unifi.wan" value={ data.up ? t("unifi.up") : t("unifi.down") } />
+            <Block label="unifi.lan_users" value={ t("common.number", { value: data.lan.users }) } />
+            <Block label="unifi.wlan_users" value={ t("common.number", { value: data.wlan.users }) } />
+        </Container>
+    );
+}

src/widgets/unifi/proxy.js

@@ -0,0 +1,119 @@
+import cache from "memory-cache";
+
+import { formatApiCall } from "utils/proxy/api-helpers";
+import { httpProxy } from "utils/proxy/http";
+import { addCookieToJar, setCookieHeader } from "utils/proxy/cookie-jar";
+import getServiceWidget from "utils/config/service-helpers";
+import { getPrivateWidgetOptions } from "utils/config/widget-helpers";
+import createLogger from "utils/logger";
+import widgets from "widgets/widgets";
+
+const udmpPrefix = "/proxy/network";
+const proxyName = "unifiProxyHandler";
+const prefixCacheKey = `${proxyName}__prefix`;
+const logger = createLogger(proxyName);
+
+async function getWidget(req) {
+  const { group, service, type } = req.query;
+  
+  let widget = null;
+  if (type === "unifi_console") { // info widget
+    const index = req.query?.query ? JSON.parse(req.query.query).index : undefined;
+    widget = await getPrivateWidgetOptions(type, index);
+    if (!widget) {
+      logger.debug("Error retrieving settings for this Unifi widget");
+      return null;
+    }
+    widget.type = "unifi";
+  } else {
+    if (!group || !service) {
+      logger.debug("Invalid or missing service '%s' or group '%s'", service, group);
+      return null;
+    }
+  
+    widget = await getServiceWidget(group, service);
+
+    if (!widget) {
+      logger.debug("Invalid or missing widget for service '%s' in group '%s'", service, group);
+      return null;
+    }
+  }
+
+  return widget;
+}
+
+async function login(widget) {
+  const endpoint = (widget.prefix === udmpPrefix) ? "auth/login" : "login";
+  const api = widgets?.[widget.type]?.api?.replace("{prefix}", ""); // no prefix for login url
+  const loginUrl = new URL(formatApiCall(api, { endpoint, ...widget }));
+  const loginBody = { username: widget.username, password: widget.password, remember: true };
+  const headers = { "Content-Type": "application/json" };
+  const [status, contentType, data, responseHeaders] = await httpProxy(loginUrl, {
+    method: "POST",
+    body: JSON.stringify(loginBody),
+    headers,
+  });
+  return [status, contentType, data, responseHeaders];
+}
+
+export default async function unifiProxyHandler(req, res) {
+  const widget = await getWidget(req);
+  if (!widget) {
+    return res.status(400).json({ error: "Invalid proxy service type" });
+  }
+
+  const api = widgets?.[widget.type]?.api;
+  if (!api) {
+    return res.status(403).json({ error: "Service does not support API calls" });
+  }
+
+  let [status, contentType, data, responseHeaders] = [];
+  let prefix = cache.get(prefixCacheKey);
+  if (prefix === null) {
+    // auto detect if we're talking to a UDM Pro, and cache the result so that we
+    // don't make two requests each time data from Unifi is required
+    [status, contentType, data, responseHeaders] = await httpProxy(widget.url);
+    prefix = "";
+    if (responseHeaders["x-csrf-token"]) {
+      prefix = udmpPrefix;
+    }
+    cache.put(prefixCacheKey, prefix);
+  }
+
+  widget.prefix = prefix;
+
+  const { endpoint } = req.query;
+  const url = new URL(formatApiCall(api, { endpoint, ...widget }));
+  const params = { method: "GET", headers: {} };
+  setCookieHeader(url, params);
+
+  [status, contentType, data, responseHeaders] = await httpProxy(url, params);
+  if (status === 401) {
+    logger.debug("Unifi isn't logged in or rejected the reqeust, attempting login.");  
+    [status, contentType, data, responseHeaders] = await login(widget);
+
+    if (status !== 200) {
+      logger.error("HTTP %d logging in to Unifi. Data: %s", status, data);
+      return res.status(status).end(data);
+    }
+
+    const json = JSON.parse(data.toString());
+    if (!(json?.meta?.rc === "ok" || json.login_time)) {
+      logger.error("Error logging in to Unifi: Data: %s", data);
+      return res.status(401).end(data);
+    }
+
+    addCookieToJar(url, responseHeaders);
+    setCookieHeader(url, params);
+
+    logger.debug("Retrying Unifi request after login.");
+    [status, contentType, data, responseHeaders] = await httpProxy(url, params);
+  }
+
+  if (status !== 200) {
+    logger.error("HTTP %d getting data from Unifi endpoint %s. Data: %s", status, url.href, data);
+  }
+
+  if (contentType) res.setHeader("Content-Type", contentType);
+  return res.status(status).send(data);
+}

src/widgets/unifi/widget.js

@@ -0,0 +1,14 @@
+import unifiProxyHandler from "./proxy";
+
+const widget = {
+  api: "{url}{prefix}/api/{endpoint}",
+  proxyHandler: unifiProxyHandler,
+
+  mappings: {
+    "stat/sites": {
+      endpoint: "stat/sites",
+    },
+  }
+};
+
+export default widget;

src/widgets/widgets.js

@@ -13,8 +13,10 @@ import nzbget from "./nzbget/widget";
 import ombi from "./ombi/widget";
 import overseerr from "./overseerr/widget";
 import pihole from "./pihole/widget";
+import plex from "./plex/widget";
 import portainer from "./portainer/widget";
 import prowlarr from "./prowlarr/widget";
+import proxmox from "./proxmox/widget";
 import qbittorrent from "./qbittorrent/widget";
 import radarr from "./radarr/widget";
 import readarr from "./readarr/widget";
@@ -26,6 +28,7 @@ import strelaysrv from "./strelaysrv/widget";
 import tautulli from "./tautulli/widget";
 import traefik from "./traefik/widget";
 import transmission from "./transmission/widget";
+import unifi from "./unifi/widget";
 
 const widgets = {
   adguard,
@@ -44,8 +47,10 @@ const widgets = {
   ombi,
   overseerr,
   pihole,
+  plex,
   portainer,
   prowlarr,
+  proxmox,
   qbittorrent,
   radarr,
   readarr,
@@ -57,6 +62,8 @@ const widgets = {
   tautulli,
   traefik,
   transmission,
+  unifi,
+  unifi_console: unifi
 };
 
 export default widgets;