Electron CI Build + Version Info Modal

CI Pipeline:
- New electron-build stage (electronuserland/builder:wine) builds Windows installer
- New electron-deploy stage copies artifacts to container /data/downloads/
- Triggers on electron/ or VERSION changes + manual trigger
- bump-version now syncs electron/package.json via jq

Version Modal:
- Click version badge to open info modal
- Shows Hub Version, Desktop App Version, Server status
- Hint when versions differ (update available)
- Download link when not using Electron app
- Escape + overlay click to close

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Daniel 2026-03-07 19:38:37 +01:00
parent 76a2487d70
commit 0ef2a2899a
3 changed files with 242 additions and 3 deletions

View file

@ -35,6 +35,7 @@ export default function App() {
setActiveTabRaw(tab);
localStorage.setItem('hub_activeTab', tab);
};
const [showVersionModal, setShowVersionModal] = useState(false);
const [pluginData, setPluginData] = useState<Record<string, any>>({});
const eventSourceRef = useRef<EventSource | null>(null);
@ -127,6 +128,14 @@ export default function App() {
const electronVersion = (window as any).electronAPI?.version ?? null;
// Close version modal on Escape
useEffect(() => {
if (!showVersionModal) return;
const handler = (e: KeyboardEvent) => { if (e.key === 'Escape') setShowVersionModal(false); };
window.addEventListener('keydown', handler);
return () => window.removeEventListener('keydown', handler);
}, [showVersionModal]);
const handleCheckForUpdates = () => {
setUpdateState('checking');
setUpdateError('');
@ -196,7 +205,13 @@ export default function App() {
{'\u{1F504}'}
</button>
)}
<span className="hub-version">v{version}</span>
<span
className="hub-version hub-version-clickable"
onClick={() => setShowVersionModal(true)}
title="Versionsinformationen"
>
v{version}
</span>
</div>
</header>
@ -276,6 +291,46 @@ export default function App() {
</div>
)}
{showVersionModal && (
<div className="hub-version-overlay" onClick={() => setShowVersionModal(false)}>
<div className="hub-version-modal" onClick={e => e.stopPropagation()}>
<div className="hub-version-modal-header">
<span>Versionsinformationen</span>
<button className="hub-version-modal-close" onClick={() => setShowVersionModal(false)}>
{'\u2715'}
</button>
</div>
<div className="hub-version-modal-body">
<div className="hub-version-modal-row">
<span className="hub-version-modal-label">Hub Version</span>
<span className="hub-version-modal-value">v{version}</span>
</div>
<div className="hub-version-modal-row">
<span className="hub-version-modal-label">Desktop App</span>
<span className="hub-version-modal-value">
{electronVersion
? `v${electronVersion}`
: <a href="/downloads/GamingHub-Setup.exe" download className="hub-version-modal-link">Herunterladen</a>
}
</span>
</div>
<div className="hub-version-modal-row">
<span className="hub-version-modal-label">Server</span>
<span className="hub-version-modal-value">
<span className={`hub-version-modal-dot ${connected ? 'online' : ''}`} />
{connected ? 'Verbunden' : 'Getrennt'}
</span>
</div>
{electronVersion && electronVersion !== version && (
<div className="hub-version-modal-hint">
Desktop App und Hub Version unterschiedlich Update verfügbar.
</div>
)}
</div>
</div>
</div>
)}
<main className="hub-content">
{plugins.length === 0 ? (
<div className="hub-empty">