- Web UI: login, dashboard, links CRUD, collections, API keys, admin pages - Query engine: AND/OR/XOR with field filters, tag search, preview endpoint - Session management: token expiry detection, 401 interceptor, expiry banner - Links search: tags included, multi-word AND, query mode with set operations - Collections: static/dynamic, query builder with preview, public tree view - Save as Collection: convert search results (static) or query (dynamic) - Dashboard stats: resilient loading with allSettled pattern - Login page: redesigned with public collections tree view - Bug fix: query executor None fields crash (notes/description/url/title) - E2E tests: 20 Playwright tests covering all critical user flows - All 104 tests passing (84 unit/integration + 20 E2E)
81 lines
3.5 KiB
HTML
81 lines
3.5 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Collections - LinkSync{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="page-header">
|
|
<h1>Collections</h1>
|
|
<button class="btn btn-primary" id="new-collection-btn">+ New Collection</button>
|
|
</div>
|
|
|
|
<div id="collections-list" class="collections-grid">
|
|
<div class="loading">Loading collections...</div>
|
|
</div>
|
|
|
|
<div id="collection-modal" class="modal" style="display: none;">
|
|
<div class="modal-overlay"></div>
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h2 id="collection-modal-title">Create Collection</h2>
|
|
<button class="modal-close" id="collection-modal-close">×</button>
|
|
</div>
|
|
<form id="collection-form">
|
|
<input type="hidden" id="collection-id">
|
|
<div class="form-group">
|
|
<label for="collection-name">Name *</label>
|
|
<input type="text" id="collection-name" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="collection-description">Description</label>
|
|
<textarea id="collection-description" rows="2"></textarea>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="collection-type">Type</label>
|
|
<select id="collection-type">
|
|
<option value="static">Static (manual links)</option>
|
|
<option value="dynamic">Dynamic (query-based)</option>
|
|
</select>
|
|
</div>
|
|
<div id="query-builder-section" style="display: none;">
|
|
<div class="form-group">
|
|
<label for="collection-query">Query Expression</label>
|
|
<input type="text" id="collection-query" placeholder="e.g. personal AND lan NOT ai">
|
|
<small class="form-hint">Supports: AND, OR, XOR, parentheses, field filters (tag:, url:, title:)</small>
|
|
</div>
|
|
<div class="form-actions" style="margin-top: 0; margin-bottom: 1rem;">
|
|
<button type="button" class="btn btn-sm btn-secondary" id="preview-query-btn">Preview Results</button>
|
|
<span id="query-status" class="query-status"></span>
|
|
</div>
|
|
<div id="query-preview-results" class="query-preview" style="display: none;"></div>
|
|
</div>
|
|
<div class="form-group checkbox-group">
|
|
<label>
|
|
<input type="checkbox" id="collection-public">
|
|
Public
|
|
</label>
|
|
</div>
|
|
<div class="form-actions">
|
|
<button type="button" class="btn btn-secondary" id="collection-cancel-btn">Cancel</button>
|
|
<button type="submit" class="btn btn-primary" id="collection-save-btn">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="delete-collection-modal" class="modal" style="display: none;">
|
|
<div class="modal-overlay"></div>
|
|
<div class="modal-content modal-sm">
|
|
<h2>Delete Collection</h2>
|
|
<p>Are you sure you want to delete this collection? This action cannot be undone.</p>
|
|
<div class="form-actions">
|
|
<button class="btn btn-secondary" id="delete-collection-cancel-btn">Cancel</button>
|
|
<button class="btn btn-danger" id="confirm-delete-collection-btn">Delete</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script src="/static/js/collections-page.js?v={{ build_id }}"></script>
|
|
{% endblock %}
|