mirror of
https://github.com/DeNNiiInc/Connect-5.git
synced 2026-04-18 00:56:00 +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'),
|
detailsPanel: document.getElementById('dbStatusDetails'),
|
||||||
errorBanner: document.getElementById('sqlErrorBanner'),
|
errorBanner: document.getElementById('sqlErrorBanner'),
|
||||||
errorMessage: document.getElementById('sqlErrorMessage'),
|
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.logs = [];
|
||||||
this.maxLogs = 50;
|
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() {
|
start() {
|
||||||
// Initial check
|
// Initial check
|
||||||
this.addLog('Database status monitor started', 'success');
|
this.addLog('Database status monitor started', 'success');
|
||||||
this.checkStatus();
|
this.checkStatus();
|
||||||
|
this.fetchVersion();
|
||||||
|
|
||||||
// Set up periodic checks
|
// Set up periodic checks
|
||||||
this.intervalId = setInterval(() => {
|
this.intervalId = setInterval(() => {
|
||||||
|
|||||||
@@ -297,6 +297,13 @@
|
|||||||
Retry
|
Retry
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
|
|
||||||
<!-- Database Status Details (for testing phase) -->
|
<!-- 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 { initializeDatabase, db, pool } = require('./database');
|
||||||
const GameManager = require('./gameManager');
|
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 app = express();
|
||||||
const server = http.createServer(app);
|
const server = http.createServer(app);
|
||||||
const io = socketIO(server, {
|
const io = socketIO(server, {
|
||||||
@@ -27,6 +40,11 @@ app.get('/', (req, res) => {
|
|||||||
res.sendFile(path.join(__dirname, 'index.html'));
|
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
|
// Database health check endpoint with detailed diagnostics
|
||||||
app.get('/api/db-status', async (req, res) => {
|
app.get('/api/db-status', async (req, res) => {
|
||||||
const startTime = Date.now();
|
const startTime = Date.now();
|
||||||
|
|||||||
34
styles.css
34
styles.css
@@ -1350,3 +1350,37 @@ body {
|
|||||||
color: white;
|
color: white;
|
||||||
border-color: rgba(255, 255, 255, 0.2);
|
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