new version 1.2.4

This commit is contained in:
MacRimi
2026-07-18 21:09:40 +02:00
parent 52d7e20979
commit 451f541342
21 changed files with 1069 additions and 176 deletions

View File

@@ -32,6 +32,7 @@ import {
FileText,
RefreshCw,
Shield,
Download,
X,
Clock,
BellOff,
@@ -39,6 +40,7 @@ import {
Settings2,
HelpCircle,
} from "lucide-react"
import { ScriptTerminalModal } from "./script-terminal-modal"
interface CategoryCheck {
status: string
@@ -122,6 +124,7 @@ export function HealthStatusModal({ open, onOpenChange, getApiUrl }: HealthStatu
const [error, setError] = useState<string | null>(null)
const [dismissingKey, setDismissingKey] = useState<string | null>(null)
const [expandedCategories, setExpandedCategories] = useState<Set<string>>(new Set())
const [showUpdateTerminal, setShowUpdateTerminal] = useState(false)
const fetchHealthDetails = useCallback(async () => {
setLoading(true)
@@ -722,6 +725,23 @@ export function HealthStatusModal({ open, onOpenChange, getApiUrl }: HealthStatu
No issues detected
</div>
)}
{/* Only offer "Update Now" when the category is not
already OK — hiding it when there's nothing
pending prevents the operator from spawning a
terminal that would only report "System is
already up to date". */}
{key === "updates" && status?.toUpperCase() !== "OK" && (
<div className="flex justify-end px-3 py-2 pt-1">
<Button
size="sm"
onClick={() => setShowUpdateTerminal(true)}
className="bg-purple-600/15 hover:bg-purple-600/25 border border-purple-500/40 text-purple-300 hover:text-purple-200"
>
<Download className="h-4 w-4 mr-1.5" />
Update Now
</Button>
</div>
)}
</div>
)}
</div>
@@ -848,6 +868,23 @@ export function HealthStatusModal({ open, onOpenChange, getApiUrl }: HealthStatu
</div>
)}
</DialogContent>
<ScriptTerminalModal
open={showUpdateTerminal}
onClose={() => {
setShowUpdateTerminal(false)
// Refresh health checks so the "System Updates" row updates
// (pending count / kernel version) without waiting for the
// next polling tick after the update finishes.
fetchHealthDetails().catch(() => {})
}}
scriptPath="/usr/local/share/proxmenux/scripts/utilities/proxmox_update.sh"
scriptName="proxmox_update"
params={{
EXECUTION_MODE: "web",
}}
title="Proxmox System Update"
description="Runs apt-get update + dist-upgrade and post-update cleanup on the host."
/>
</Dialog>
)
}

View File

@@ -271,7 +271,7 @@ export function Login({ onLogin }: LoginProps) {
</form>
</div>
<p className="text-center text-sm text-muted-foreground">ProxMenux Monitor v1.2.3</p>
<p className="text-center text-sm text-muted-foreground">ProxMenux Monitor v1.2.4</p>
</div>
</div>
)

View File

@@ -836,7 +836,7 @@ export function ProxmoxDashboard() {
</Tabs>
<footer className="mt-8 md:mt-12 pt-4 md:pt-6 border-t border-border text-center text-xs md:text-sm text-muted-foreground">
<p className="font-medium mb-2">ProxMenux Monitor v1.2.3</p>
<p className="font-medium mb-2">ProxMenux Monitor v1.2.4</p>
<p>
<a
href="https://ko-fi.com/macrimi"

View File

@@ -0,0 +1,217 @@
"use client"
import { useCallback, useEffect, useState } from "react"
import { Plus, Share, X } from "lucide-react"
// ==========================================================
// PwaInstallPrompt
// ==========================================================
// Bottom-sheet shown on mobile when the Monitor is opened in
// a browser (not launched as an installed PWA). Two variants:
// iOS Safari → manual 3-step instructions
// Android → generic "browser menu → Add to Home Screen"
//
// No `beforeinstallprompt` handling: the Monitor no longer
// registers a Service Worker (see `pwa-register.tsx`), so
// Chromium never fires it. Installation is always manual.
//
// Never shown on desktop, or when already running standalone.
// Dismissal options:
// "Not now" → temporary, hidden for 30 days
// "Don't show again" → permanent (no expiry)
// Backdrop / X → session-only dismiss (reappears on
// the next page load)
// ==========================================================
const DISMISSED_FOREVER_KEY = "proxmenux-install-dismissed"
const DISMISSED_UNTIL_KEY = "proxmenux-install-dismissed-until"
const NOT_NOW_DAYS = 30
function isMobileDevice(): boolean {
if (typeof window === "undefined") return false
// Prefer feature detection (coarse pointer + touch) over UA sniffing,
// and fall back to UA for the corner case where a mobile browser
// reports fine pointer under a desktop-mode toggle.
const coarse = window.matchMedia("(pointer: coarse)").matches
const ua = navigator.userAgent
const uaMobile = /Android|iPhone|iPad|iPod|Mobile|Opera Mini|BlackBerry|IEMobile/i.test(ua)
return coarse || uaMobile
}
function isStandalone(): boolean {
if (typeof window === "undefined") return false
const displayModeStandalone = window.matchMedia("(display-mode: standalone)").matches
const iosStandalone = (window.navigator as Navigator & { standalone?: boolean }).standalone === true
return displayModeStandalone || iosStandalone
}
function isIOS(): boolean {
if (typeof window === "undefined") return false
const ua = navigator.userAgent
// iPadOS 13+ reports as MacIntel — detect that too when maxTouchPoints > 1.
const iPadMasqueradingAsMac =
ua.includes("Macintosh") && (navigator as Navigator & { maxTouchPoints?: number }).maxTouchPoints! > 1
return /iPhone|iPad|iPod/i.test(ua) || iPadMasqueradingAsMac
}
export function PwaInstallPrompt() {
const [open, setOpen] = useState(false)
const [platform, setPlatform] = useState<"ios" | "android" | null>(null)
useEffect(() => {
if (typeof window === "undefined") return
if (!isMobileDevice() || isStandalone()) return
try {
if (localStorage.getItem(DISMISSED_FOREVER_KEY) === "1") return
const untilRaw = localStorage.getItem(DISMISSED_UNTIL_KEY)
if (untilRaw) {
const until = Number.parseInt(untilRaw, 10)
// Corrupt / non-numeric values fall through and the prompt shows,
// which is the safe default.
if (Number.isFinite(until) && until > Date.now()) return
}
} catch {
// localStorage unavailable (private mode etc.) — treat as not dismissed.
}
setPlatform(isIOS() ? "ios" : "android")
setOpen(true)
}, [])
const handleNotNow = useCallback(() => {
try {
const until = Date.now() + NOT_NOW_DAYS * 24 * 60 * 60 * 1000
localStorage.setItem(DISMISSED_UNTIL_KEY, String(until))
} catch {
// Best-effort; if localStorage fails the user will see the prompt
// again next visit, which is the safe default.
}
setOpen(false)
}, [])
const handleNeverAgain = useCallback(() => {
try {
localStorage.setItem(DISMISSED_FOREVER_KEY, "1")
} catch {
// Best-effort; if localStorage fails the user will see the prompt
// again next visit, which is the safe default.
}
setOpen(false)
}, [])
const handleClose = useCallback(() => {
// Session-only dismiss: closing via X or backdrop does NOT persist,
// so the prompt reappears on the next page load. Users who want to
// silence it for longer must use "Not now" (30 d) or "Don't show again".
setOpen(false)
}, [])
if (!open || !platform) return null
return (
<div
role="dialog"
aria-modal="true"
aria-labelledby="pwa-install-title"
className="fixed inset-0 z-[100] flex items-end justify-center bg-black/60 backdrop-blur-sm animate-in fade-in duration-200"
onClick={(e) => {
if (e.target === e.currentTarget) handleClose()
}}
>
<div
className="w-full max-w-md rounded-t-2xl bg-background text-foreground shadow-2xl border-t border-border animate-in slide-in-from-bottom duration-300"
style={{ paddingBottom: "max(1.25rem, env(safe-area-inset-bottom))" }}
>
<div className="relative px-5 pt-5">
<div className="mx-auto mb-3 h-1 w-10 rounded-full bg-border" aria-hidden="true" />
<button
type="button"
onClick={handleClose}
aria-label="Close"
className="absolute right-3 top-3 flex h-8 w-8 items-center justify-center rounded-full text-muted-foreground hover:bg-muted transition-colors"
>
<X className="h-4 w-4" />
</button>
<div className="mb-4 flex items-start gap-3.5">
<div className="flex h-[52px] w-[52px] shrink-0 items-center justify-center rounded-xl bg-muted p-1 shadow-md">
<img src="/icon.svg" alt="ProxMenux Monitor" className="h-full w-full object-contain" />
</div>
<div className="flex-1 min-w-0">
<h3 id="pwa-install-title" className="text-[17px] font-bold leading-tight tracking-tight text-foreground">
Install ProxMenux Monitor
</h3>
<p className="mt-1 text-[13px] leading-snug text-muted-foreground">
{platform === "ios"
? "Add the Monitor to your home screen for quick access."
: "Add the Monitor as an app to launch it like a native application."}
</p>
</div>
</div>
{platform === "ios" ? (
<ol className="mb-4 flex flex-col gap-2" role="list">
<li className="flex items-center gap-3 rounded-xl bg-primary/10 px-3.5 py-3 text-[13.5px] leading-tight">
<span className="flex h-[22px] w-[22px] shrink-0 items-center justify-center rounded-full bg-primary text-[11px] font-bold text-primary-foreground">
1
</span>
<span>
Tap the{" "}
<span className="inline-flex items-center gap-1 font-semibold text-primary">
<Share className="h-4 w-4" aria-hidden="true" />
Share
</span>{" "}
button in the bottom bar
</span>
</li>
<li className="flex items-center gap-3 rounded-xl bg-primary/10 px-3.5 py-3 text-[13.5px] leading-tight">
<span className="flex h-[22px] w-[22px] shrink-0 items-center justify-center rounded-full bg-primary text-[11px] font-bold text-primary-foreground">
2
</span>
<span>
Choose{" "}
<span className="inline-flex items-center gap-1 font-semibold text-primary">
<Plus className="h-4 w-4" aria-hidden="true" />
Add to Home Screen
</span>
</span>
</li>
<li className="flex items-center gap-3 rounded-xl bg-primary/10 px-3.5 py-3 text-[13.5px] leading-tight">
<span className="flex h-[22px] w-[22px] shrink-0 items-center justify-center rounded-full bg-primary text-[11px] font-bold text-primary-foreground">
3
</span>
<span>
Confirm by tapping <b>Add</b> in the top-right
</span>
</li>
</ol>
) : (
<div className="mb-4 rounded-lg border border-border bg-muted/50 px-3.5 py-3 text-[13px] leading-relaxed text-muted-foreground">
Open the browser menu <b className="text-foreground"></b> {" "}
<b className="text-foreground">Add to Home Screen</b> confirm by tapping{" "}
<b className="text-foreground">Install</b>.
</div>
)}
<div className="mt-1 flex flex-col gap-1 border-t border-border pt-3">
<button
type="button"
onClick={handleNotNow}
className="rounded-lg py-2.5 text-center text-[13.5px] font-semibold text-muted-foreground hover:bg-muted transition-colors"
>
Not now
</button>
<button
type="button"
onClick={handleNeverAgain}
className="rounded-lg py-2.5 text-center text-[13.5px] font-semibold text-amber-700 dark:text-amber-500 hover:bg-muted transition-colors"
>
Don&apos;t show again
</button>
</div>
</div>
</div>
</div>
)
}

View File

@@ -2,38 +2,27 @@
import { useEffect } from "react"
// ===========================================================
// PwaRegister
// ===========================================================
// Registers /sw.js once on mount. Chrome (Android) only
// surfaces the "Install app" prompt when a service worker
// is active, so even though the SW itself does nothing
// (network-only, no caching), its mere presence flips the
// PWA-installability check from no-to-yes.
//
// Mounted from app/layout.tsx so it runs on every route.
// ===========================================================
// Unregisters any Service Worker registered against this origin on
// mount. Having a SW active on the Monitor origin caused a mobile
// dashboard-freeze bug over HTTPS + reverse proxy (setInterval polls
// stopped firing real fetches under battery throttling). Confirmed
// as the sole cause by the affected reporter on Brave and Firefox
// Android. `sw.js` is kept in the tree so PWA offline support can
// be revisited later without archaeology.
export function PwaRegister() {
useEffect(() => {
if (typeof window === "undefined") return
if (!("serviceWorker" in navigator)) return
// Wait for the load event to avoid competing with the
// initial render — the SW registration is not on the
// critical render path.
const register = () => {
navigator.serviceWorker
.register("/sw.js", { scope: "/" })
.catch((err) => {
// Surface the failure only in DevTools — silent in prod.
console.warn("[pwa] service worker registration failed:", err)
})
}
if (document.readyState === "complete") {
register()
} else {
window.addEventListener("load", register, { once: true })
return () => window.removeEventListener("load", register)
}
navigator.serviceWorker
.getRegistrations()
.then((regs) => {
if (regs.length === 0) return
return Promise.all(regs.map((r) => r.unregister()))
})
.catch(() => {
// Best-effort — private browsing or a locked-down browser
// may reject the API; nothing to do.
})
}, [])
return null
}

View File

@@ -6,7 +6,7 @@ import { Dialog, DialogContent, DialogTitle } from "./ui/dialog"
import { X, Sparkles, Thermometer, Activity, HardDrive, Shield, Globe, Cpu, Zap, Sliders, Wrench, RefreshCw, Server, BellOff, Bell, Calendar, DatabaseBackup } from "lucide-react"
import { Checkbox } from "./ui/checkbox"
const APP_VERSION = "1.2.3" // Sync with AppImage/package.json
const APP_VERSION = "1.2.4" // Sync with AppImage/package.json
interface ReleaseNote {
date: string
@@ -18,6 +18,21 @@ interface ReleaseNote {
}
export const CHANGELOG: Record<string, ReleaseNote> = {
"1.2.3": {
date: "July 15, 2026",
changes: {
added: [
"Backups integrated in the Monitor — a new first-class section to create, schedule and restore host backups against Local, PBS or Borg destinations from the Web dashboard. Jobs run on a proper systemd timer or attach to an existing PVE vzdump job with retention live-inherited from the parent. Encrypted PBS backups store a paired recovery blob next to each snapshot so a fresh install can always get the key back. After a reboot the tab shows a real-time restore progress card with milestones, per-component status (NVIDIA, Intel GPU tools, Coral, AMD tools), boot sanity warnings and a rollback delta listing anything on the host that wasn't in the backup.",
"Network Flow diagram — a new live topology view on the Network tab showing NICs → host → bridges → LXCs / VMs with animated rx / tx pulses on every internal link, so the operator can see in real time how traffic distributes inside the host and which guests are pulling or pushing data.",
"Physical Disks and Physical Interfaces cards redesigned — clearer per-item presentation on the Storage and Network tabs. USB-NVMe / USB-SATA enclosures reporting removable=0 (ASMedia, JMicron, Realtek, ASM105x) now walk sysfs to detect USB attachment, so the -d snt* pass-through is tried and the drive's real model, serial, temperature, power-on hours and health surface — instead of the bridge's chatter.",
"Richer notifications out of the box — for users not running an AI agent, the templated body now identifies the affected object (which storage, which interface, which container), surfaces the top offenders with an \"…and N more\" tail when the list is long, and preserves the same identity in the recovery message. Users with AI enrichment enabled continue to get their tailored rewrite on top of this improved base.",
],
changed: [
"Redesigned cards across Overview, VM / LXC, Storage and Network — layouts reworked for faster reading and denser, more practical information: key numbers surface at a glance, grouped by relevance, and the responsive grid now behaves cleanly from a phone up to an ultrawide.",
"Health Monitor Thresholds — the Settings panel that controls per-category Warning and Critical levels (CPU, memory, temperature, storage, disks, ...) was reworked with clearer visual grouping and inline hints, so tuning a threshold now takes a couple of clicks instead of scrolling through a wall of numbers.",
],
},
},
"1.2.2": {
date: "May 31, 2026",
changes: {
@@ -217,28 +232,12 @@ export const CHANGELOG: Record<string, ReleaseNote> = {
const CURRENT_VERSION_FEATURES = [
{
icon: <DatabaseBackup className="h-5 w-5" />,
text: "Backups integrated in the Monitor — a new first-class section to create, schedule and restore host backups against Local, PBS or Borg destinations from the Web dashboard. Jobs run on a proper systemd timer or attach to an existing PVE vzdump job with retention live-inherited from the parent. Encrypted PBS backups store a paired recovery blob next to each snapshot so a fresh install can always get the key back. After a reboot the tab shows a real-time restore progress card with milestones, per-component status (NVIDIA, Intel GPU tools, Coral, AMD tools), boot sanity warnings and a rollback delta listing anything on the host that wasn't in the backup.",
},
{
icon: <Activity className="h-5 w-5" />,
text: "Network Flow diagram — a new live topology view on the Network tab showing NICs → host → bridges → LXCs / VMs with animated rx / tx pulses on every internal link, so the operator can see in real time how traffic distributes inside the host and which guests are pulling or pushing data.",
icon: <RefreshCw className="h-5 w-5" />,
text: "One-click host update from the Health Monitor — new Update Now button in the System Updates section runs the Proxmox update flow in an in-dashboard terminal, without leaving the browser.",
},
{
icon: <Sparkles className="h-5 w-5" />,
text: "Redesigned cards across Overview, VM / LXC, Storage and Network — layouts reworked for faster reading and denser, more practical information: key numbers surface at a glance, grouped by relevance, and the responsive grid now behaves cleanly from a phone up to an ultrawide.",
},
{
icon: <HardDrive className="h-5 w-5" />,
text: "Physical Disks and Physical Interfaces cards redesigned — clearer per-item presentation on the Storage and Network tabs. USB-NVMe / USB-SATA enclosures reporting removable=0 (ASMedia, JMicron, Realtek, ASM105x) now walk sysfs to detect USB attachment, so the -d snt* pass-through is tried and the drive's real model, serial, temperature, power-on hours and health surface — instead of the bridge's chatter.",
},
{
icon: <Sliders className="h-5 w-5" />,
text: "Health Monitor Thresholds — the Settings panel that controls per-category Warning and Critical levels (CPU, memory, temperature, storage, disks, ...) was reworked with clearer visual grouping and inline hints, so tuning a threshold now takes a couple of clicks instead of scrolling through a wall of numbers.",
},
{
icon: <Bell className="h-5 w-5" />,
text: "Richer notifications out of the box — for users not running an AI agent, the templated body now identifies the affected object (which storage, which interface, which container), surfaces the top offenders with an \"…and N more\" tail when the list is long, and preserves the same identity in the recovery message. Users with AI enrichment enabled continue to get their tailored rewrite on top of this improved base.",
text: "In-app Install prompt for mobile — first-time visitors on Android and iOS Safari now see a bottom-sheet with clear steps for adding the Monitor to their home screen as a PWA.",
},
]

View File

@@ -3717,7 +3717,7 @@ ${observationsHtml}
<!-- Footer -->
<div class="rpt-footer">
<div>Report generated by ProxMenux Monitor</div>
<div>ProxMenux Monitor v1.2.3</div>
<div>ProxMenux Monitor v1.2.4</div>
</div>
</body>