Rebrand to Obsidian with modern UI and auto-refresh
- Renamed project from "Test Artifact Data Lake" to "Obsidian" - Updated all branding across README, quickstart scripts, and API - Implemented dark mode theme with professional color palette - Simplified table to 4 essential columns (Sim Source, Artifacts, Date, Uploaded By) - Replaced emoji icons with Lucide SVG icons for better scaling - Added auto-refresh functionality (5-second intervals, toggleable) - Enhanced UI with modern flexbox layouts and hover effects - Updated upload form labels to match new terminology 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -3,13 +3,14 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Test Artifact Data Lake</title>
|
||||
<title>Obsidian - Test Artifact Data Lake</title>
|
||||
<link rel="stylesheet" href="/static/css/styles.css">
|
||||
<script src="https://unpkg.com/lucide@latest"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<h1>🗄️ Test Artifact Data Lake</h1>
|
||||
<h1>◆ Obsidian</h1>
|
||||
<div class="header-info">
|
||||
<span id="deployment-mode" class="badge"></span>
|
||||
<span id="storage-backend" class="badge"></span>
|
||||
@@ -17,16 +18,29 @@
|
||||
</header>
|
||||
|
||||
<nav class="tabs">
|
||||
<button class="tab-button active" onclick="showTab('artifacts')">📋 Artifacts</button>
|
||||
<button class="tab-button" onclick="showTab('upload')">⬆️ Upload</button>
|
||||
<button class="tab-button" onclick="showTab('query')">🔍 Query</button>
|
||||
<button class="tab-button active" onclick="showTab('artifacts')">
|
||||
<i data-lucide="database" style="width: 16px; height: 16px;"></i> Artifacts
|
||||
</button>
|
||||
<button class="tab-button" onclick="showTab('upload')">
|
||||
<i data-lucide="upload" style="width: 16px; height: 16px;"></i> Upload
|
||||
</button>
|
||||
<button class="tab-button" onclick="showTab('query')">
|
||||
<i data-lucide="search" style="width: 16px; height: 16px;"></i> Query
|
||||
</button>
|
||||
</nav>
|
||||
|
||||
<!-- Artifacts Tab -->
|
||||
<div id="artifacts-tab" class="tab-content active">
|
||||
<div class="toolbar">
|
||||
<button onclick="loadArtifacts()" class="btn btn-primary">🔄 Refresh</button>
|
||||
<button onclick="generateSeedData()" class="btn btn-secondary">🌱 Generate Seed Data</button>
|
||||
<button onclick="loadArtifacts()" class="btn btn-primary">
|
||||
<i data-lucide="refresh-cw" style="width: 16px; height: 16px;"></i> Refresh
|
||||
</button>
|
||||
<button id="auto-refresh-toggle" onclick="toggleAutoRefresh()" class="btn btn-success">
|
||||
Auto-refresh: ON
|
||||
</button>
|
||||
<button onclick="generateSeedData()" class="btn btn-secondary">
|
||||
<i data-lucide="sparkles" style="width: 16px; height: 16px;"></i> Generate Seed Data
|
||||
</button>
|
||||
<span id="artifact-count" class="count-badge"></span>
|
||||
</div>
|
||||
|
||||
@@ -34,21 +48,16 @@
|
||||
<table id="artifacts-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Filename</th>
|
||||
<th>Type</th>
|
||||
<th>Size</th>
|
||||
<th>Test Name</th>
|
||||
<th>Suite</th>
|
||||
<th>Result</th>
|
||||
<th>Tags</th>
|
||||
<th>Created</th>
|
||||
<th>Sim Source</th>
|
||||
<th>Artifacts</th>
|
||||
<th>Date</th>
|
||||
<th>Uploaded By</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="artifacts-tbody">
|
||||
<tr>
|
||||
<td colspan="10" class="loading">Loading artifacts...</td>
|
||||
<td colspan="5" class="loading">Loading artifacts...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -74,12 +83,12 @@
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="test-name">Test Name</label>
|
||||
<input type="text" id="test-name" name="test_name" placeholder="e.g., login_test">
|
||||
<label for="sim-source">Sim Source *</label>
|
||||
<input type="text" id="sim-source" name="test_suite" placeholder="e.g., Jenkins, GitLab CI" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="test-suite">Test Suite</label>
|
||||
<input type="text" id="test-suite" name="test_suite" placeholder="e.g., integration">
|
||||
<label for="uploaded-by">Uploaded By *</label>
|
||||
<input type="text" id="uploaded-by" name="test_name" placeholder="e.g., john.doe" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -120,7 +129,9 @@
|
||||
<textarea id="custom-metadata" name="custom_metadata" rows="4" placeholder='{"build": "1234", "commit": "abc123"}'></textarea>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary btn-large">📤 Upload Artifact</button>
|
||||
<button type="submit" class="btn btn-primary btn-large">
|
||||
<i data-lucide="upload" style="width: 18px; height: 18px;"></i> Upload Artifact
|
||||
</button>
|
||||
</form>
|
||||
<div id="upload-status"></div>
|
||||
</div>
|
||||
@@ -187,8 +198,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary btn-large">🔍 Search</button>
|
||||
<button type="button" onclick="clearQuery()" class="btn btn-secondary">Clear</button>
|
||||
<button type="submit" class="btn btn-primary btn-large">
|
||||
<i data-lucide="search" style="width: 18px; height: 18px;"></i> Search
|
||||
</button>
|
||||
<button type="button" onclick="clearQuery()" class="btn btn-secondary">
|
||||
<i data-lucide="x" style="width: 18px; height: 18px;"></i> Clear
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@@ -204,5 +219,9 @@
|
||||
</div>
|
||||
|
||||
<script src="/static/js/app.js"></script>
|
||||
<script>
|
||||
// Initialize Lucide icons
|
||||
lucide.createIcons();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user