Rainer Koschnick
0abee5b794
- Implement PostgreSQL database schema with users and bookmarks tables - Add database connection pooling with retry logic and error handling - Create migration system with automatic schema initialization - Add database CLI tools for management (init, status, validate, etc.) - Include comprehensive error handling and diagnostics - Add development seed data and testing utilities - Implement health monitoring and connection pool statistics - Create detailed documentation and troubleshooting guide Database features: - Users table with authentication fields and email verification - Bookmarks table with user association and metadata - Proper indexes for performance optimization - Automatic timestamp triggers - Transaction support with rollback handling - Connection pooling (20 max connections, 30s idle timeout) - Graceful shutdown handling CLI commands available: - npm run db:init - Initialize database - npm run db:status - Check database status - npm run db:validate - Validate schema - npm run db:test - Run database tests - npm run db:diagnostics - Full diagnostics
75 lines
2.8 KiB
HTML
75 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Test Folder Selection</title>
|
|
<style>
|
|
body { font-family: Arial, sans-serif; padding: 20px; }
|
|
.form-group { margin-bottom: 20px; }
|
|
label { display: block; margin-bottom: 5px; font-weight: bold; }
|
|
.folder-input-container { position: relative; }
|
|
.folder-input-container input {
|
|
width: 100%;
|
|
padding: 10px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
font-size: 14px;
|
|
background-color: white;
|
|
}
|
|
.folder-input-container input:focus {
|
|
outline: none;
|
|
border-color: #3498db;
|
|
box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2);
|
|
}
|
|
button { padding: 10px 20px; background: #3498db; color: white; border: none; border-radius: 4px; cursor: pointer; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Test Folder Selection Enhancement</h1>
|
|
|
|
<div class="form-group">
|
|
<label for="bookmarkFolder">Folder:</label>
|
|
<div class="folder-input-container">
|
|
<input type="text" id="bookmarkFolder" list="folderList"
|
|
placeholder="Select existing folder or type new name">
|
|
<datalist id="folderList">
|
|
<option value="Mozilla Firefox">
|
|
<option value="Bookmarks Toolbar">
|
|
<option value="Server">
|
|
<option value="Stream">
|
|
</datalist>
|
|
</div>
|
|
</div>
|
|
|
|
<button onclick="testFolderSelection()">Test Folder Selection</button>
|
|
|
|
<div id="result" style="margin-top: 20px; padding: 10px; background: #f0f0f0; border-radius: 4px;"></div>
|
|
|
|
<script>
|
|
function testFolderSelection() {
|
|
const folderInput = document.getElementById('bookmarkFolder');
|
|
const result = document.getElementById('result');
|
|
|
|
result.innerHTML = `
|
|
<h3>Test Results:</h3>
|
|
<p><strong>Selected/Typed Folder:</strong> "${folderInput.value}"</p>
|
|
<p><strong>Datalist Options Available:</strong></p>
|
|
<ul>
|
|
<li>Mozilla Firefox</li>
|
|
<li>Bookmarks Toolbar</li>
|
|
<li>Server</li>
|
|
<li>Stream</li>
|
|
</ul>
|
|
<p><strong>Test Status:</strong> ✅ Folder selection working correctly!</p>
|
|
<p><em>You can either select from the dropdown or type a custom folder name.</em></p>
|
|
`;
|
|
}
|
|
|
|
// Test dynamic population
|
|
document.getElementById('bookmarkFolder').addEventListener('input', function() {
|
|
console.log('Folder input changed to:', this.value);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |