mirror of
https://github.com/DeNNiiInc/Connect-5.git
synced 2026-04-17 18:26:01 +00:00
UI: Add git commit hash and age to status bar
This commit is contained in:
34
db-status.js
34
db-status.js
@@ -13,7 +13,12 @@ class DatabaseStatusMonitor {
|
||||
detailsPanel: document.getElementById('dbStatusDetails'),
|
||||
errorBanner: document.getElementById('sqlErrorBanner'),
|
||||
errorMessage: document.getElementById('sqlErrorMessage'),
|
||||
errorDetails: document.getElementById('sqlErrorDetails')
|
||||
errorDetails: document.getElementById('sqlErrorDetails'),
|
||||
version: {
|
||||
container: document.getElementById('gitVersion'),
|
||||
hash: document.getElementById('commitHash'),
|
||||
age: document.getElementById('commitAge')
|
||||
}
|
||||
};
|
||||
this.logs = [];
|
||||
this.maxLogs = 50;
|
||||
@@ -289,10 +294,37 @@ class DatabaseStatusMonitor {
|
||||
}
|
||||
}
|
||||
|
||||
async fetchVersion() {
|
||||
try {
|
||||
const response = await fetch('/api/version');
|
||||
const data = await response.json();
|
||||
|
||||
if (data.hash && this.elements.version.container) {
|
||||
this.elements.version.container.style.display = 'flex';
|
||||
this.elements.version.hash.textContent = data.hash;
|
||||
|
||||
// Calculate age
|
||||
const now = Math.floor(Date.now() / 1000);
|
||||
const diff = now - data.timestamp;
|
||||
|
||||
let ageText = '';
|
||||
if (diff < 60) ageText = 'just now';
|
||||
else if (diff < 3600) ageText = `${Math.floor(diff / 60)}m ago`;
|
||||
else if (diff < 86400) ageText = `${Math.floor(diff / 3600)}h ago`;
|
||||
else ageText = `${Math.floor(diff / 86400)}d ago`;
|
||||
|
||||
this.elements.version.age.textContent = ageText;
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn('Failed to fetch version:', e);
|
||||
}
|
||||
}
|
||||
|
||||
start() {
|
||||
// Initial check
|
||||
this.addLog('Database status monitor started', 'success');
|
||||
this.checkStatus();
|
||||
this.fetchVersion();
|
||||
|
||||
// Set up periodic checks
|
||||
this.intervalId = setInterval(() => {
|
||||
|
||||
@@ -297,6 +297,13 @@
|
||||
Retry
|
||||
</button>
|
||||
</div>
|
||||
<div class="db-status-item version-container">
|
||||
<div class="version-pill" id="gitVersion" title="Git Commit Version" style="display: none;">
|
||||
<span class="commit-hash" id="commitHash"></span>
|
||||
<span class="version-separator">•</span>
|
||||
<span class="commit-age" id="commitAge"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Database Status Details (for testing phase) -->
|
||||
|
||||
18
server.js
18
server.js
@@ -6,6 +6,19 @@ const path = require('path');
|
||||
const { initializeDatabase, db, pool } = require('./database');
|
||||
const GameManager = require('./gameManager');
|
||||
|
||||
const { execSync } = require('child_process');
|
||||
|
||||
// Capture Git Version Info at Startup
|
||||
let gitVersion = { hash: 'dev', timestamp: Date.now() / 1000 };
|
||||
try {
|
||||
const hash = execSync('git log -1 --format=%h').toString().trim();
|
||||
const timestamp = parseInt(execSync('git log -1 --format=%ct').toString().trim());
|
||||
gitVersion = { hash, timestamp };
|
||||
console.log(`📦 Version: ${hash} (${new Date(timestamp * 1000).toISOString()})`);
|
||||
} catch (e) {
|
||||
console.warn('⚠️ Failed to get git version:', e.message);
|
||||
}
|
||||
|
||||
const app = express();
|
||||
const server = http.createServer(app);
|
||||
const io = socketIO(server, {
|
||||
@@ -27,6 +40,11 @@ app.get('/', (req, res) => {
|
||||
res.sendFile(path.join(__dirname, 'index.html'));
|
||||
});
|
||||
|
||||
// Version Endpoint
|
||||
app.get('/api/version', (req, res) => {
|
||||
res.json(gitVersion);
|
||||
});
|
||||
|
||||
// Database health check endpoint with detailed diagnostics
|
||||
app.get('/api/db-status', async (req, res) => {
|
||||
const startTime = Date.now();
|
||||
|
||||
34
styles.css
34
styles.css
@@ -1350,3 +1350,37 @@ body {
|
||||
color: white;
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
/* Version Pill in Status Bar */
|
||||
.version-container {
|
||||
margin-left: auto;
|
||||
padding-left: 1rem;
|
||||
border-left: 1px solid var(--border-light);
|
||||
}
|
||||
|
||||
.version-pill {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
padding: 0.25rem 0.75rem;
|
||||
border-radius: 12px;
|
||||
border: 1px solid var(--border-light);
|
||||
font-family: monospace;
|
||||
font-size: 0.8rem;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.commit-hash {
|
||||
color: #8b5cf6; /* Violet */
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.version-separator {
|
||||
color: var(--text-muted);
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
|
||||
.commit-age {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user