M Dombaugh
c8a1d5ba40
Add up/down arrow buttons to reorder links within a folder, with lazy sort_order initialization. Add dropdown to move existing links into the current folder. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
106 lines
5.3 KiB
HTML
106 lines
5.3 KiB
HTML
{% extends "base.html" %}
|
|
{% block content %}
|
|
<div class="page-header">
|
|
<h1 class="page-title">Bookmarks<span class="page-count">{{ items|length }}</span></h1>
|
|
<div class="flex gap-2">
|
|
<a href="/weblinks/folders/create" class="btn btn-secondary">+ New Folder</a>
|
|
<a href="/weblinks/create{{ '?folder_id=' ~ current_folder_id if current_folder_id }}" class="btn btn-primary">+ New Link</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="weblinks-layout">
|
|
<!-- Folder sidebar -->
|
|
<div class="weblinks-folders">
|
|
<a href="/weblinks" class="weblink-folder-item {{ 'active' if not current_folder_id }}">
|
|
All Links
|
|
</a>
|
|
{% for folder in top_folders %}
|
|
<a href="/weblinks?folder_id={{ folder.id }}" class="weblink-folder-item {{ 'active' if current_folder_id == folder.id|string }}">
|
|
{{ folder.name }}
|
|
{% if folder.link_count %}<span class="badge" style="margin-left: auto;">{{ folder.link_count }}</span>{% endif %}
|
|
</a>
|
|
{% for child in child_folder_map.get(folder.id|string, []) %}
|
|
<a href="/weblinks?folder_id={{ child.id }}" class="weblink-folder-item {{ 'active' if current_folder_id == child.id|string }}" style="padding-left: 28px;">
|
|
{{ child.name }}
|
|
{% if child.link_count %}<span class="badge" style="margin-left: auto;">{{ child.link_count }}</span>{% endif %}
|
|
</a>
|
|
{% endfor %}
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Links list -->
|
|
<div class="weblinks-content">
|
|
{% if current_folder %}
|
|
<div class="flex items-center justify-between mb-2">
|
|
<h2 style="font-size: 1rem; font-weight: 600;">{{ current_folder.name }}</h2>
|
|
<form action="/weblinks/folders/{{ current_folder.id }}/delete" method="post"
|
|
data-confirm="Delete folder '{{ current_folder.name }}'?" style="display:inline">
|
|
<button type="submit" class="btn btn-ghost btn-xs" style="color: var(--red)">Delete Folder</button>
|
|
</form>
|
|
</div>
|
|
{% if available_links %}
|
|
<div class="card" style="margin-bottom: 12px;">
|
|
<form action="/weblinks/folders/{{ current_folder.id }}/add-link" method="post"
|
|
style="display: flex; gap: 8px; align-items: end; padding: 12px;">
|
|
<div class="form-group" style="flex: 1; margin: 0;">
|
|
<label class="form-label">Add existing link</label>
|
|
<select name="link_id" class="form-select" required>
|
|
<option value="">Select link...</option>
|
|
{% for l in available_links %}
|
|
<option value="{{ l.id }}">{{ l.label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary btn-sm">Add</button>
|
|
</form>
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
{% if items %}
|
|
<div class="card">
|
|
{% for item in items %}
|
|
<div class="list-row">
|
|
<span class="row-title">
|
|
<a href="{{ item.url }}" target="_blank" rel="noopener">{{ item.label }}</a>
|
|
</span>
|
|
<span class="row-meta text-xs" style="max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
|
|
{{ item.url }}
|
|
</span>
|
|
{% if item.tags %}
|
|
{% for tag in item.tags %}
|
|
<span class="row-tag">{{ tag }}</span>
|
|
{% endfor %}
|
|
{% endif %}
|
|
<div class="row-actions">
|
|
{% if current_folder_id %}
|
|
<form action="/weblinks/folders/{{ current_folder_id }}/reorder" method="post" style="display:inline">
|
|
<input type="hidden" name="link_id" value="{{ item.id }}">
|
|
<input type="hidden" name="direction" value="up">
|
|
<button type="submit" class="btn btn-ghost btn-xs" title="Move up">▲</button>
|
|
</form>
|
|
<form action="/weblinks/folders/{{ current_folder_id }}/reorder" method="post" style="display:inline">
|
|
<input type="hidden" name="link_id" value="{{ item.id }}">
|
|
<input type="hidden" name="direction" value="down">
|
|
<button type="submit" class="btn btn-ghost btn-xs" title="Move down">▼</button>
|
|
</form>
|
|
{% endif %}
|
|
<a href="/weblinks/{{ item.id }}/edit" class="btn btn-ghost btn-xs">Edit</a>
|
|
<form action="/weblinks/{{ item.id }}/delete" method="post" data-confirm="Delete this link?" style="display:inline">
|
|
<button type="submit" class="btn btn-ghost btn-xs" style="color: var(--red)">Del</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="empty-state">
|
|
<div class="empty-state-icon">🔗</div>
|
|
<div class="empty-state-text">No links{{ ' in this folder' if current_folder }} yet</div>
|
|
<a href="/weblinks/create{{ '?folder_id=' ~ current_folder_id if current_folder_id }}" class="btn btn-primary">Add Link</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|