This commit is contained in:
Bryce
2025-08-03 19:37:23 -07:00
parent f5938c5586
commit 21d3a710f2
5 changed files with 144 additions and 134 deletions

View File

@@ -0,0 +1,39 @@
<div id="folder-modal" @click.away="$refs.modal.close()" class="modal-box">
<h3 class="font-bold text-lg mb-4" id="modal-title">
{% if folder %}Edit Folder{% else %}Add New Folder{% endif %}
</h3>
<form id="folder-form" {% if folder %} hx-put="/api/folders/{{ folder.id }}" {% else %} hx-post="/api/folders" {%
endif %} hx-target="#folders-list" hx-swap="innerHTML">
{% if folder %}
<input type="hidden" id="folder-id" name="id" value="{{ folder.id }}">
{% endif %}
<div class="mb-4">
<label for="folder-name" class="block text-sm font-medium mb-1">Name</label>
<input type="text" id="folder-name" name="name" class="input input-bordered w-full"
placeholder="e.g., Work, Personal, Newsletters" required
value="{% if folder %}{{ folder.name }}{% endif %}">
</div>
<div class="mb-4">
<label for="folder-rule" class="block text-sm font-medium mb-1">Rule (Natural Language)</label>
<textarea id="folder-rule" name="rule_text" class="textarea textarea-bordered w-full h-24"
placeholder="e.g., Move emails from 'newsletter@company.com' to this folder"
required>{% if folder %}{{ folder.rule_text }}{% endif %}</textarea>
</div>
<div class="mb-4">
<label for="folder-priority" class="block text-sm font-medium mb-1">Priority</label>
<select id="folder-priority" name="priority" class="select select-bordered w-full">
<option value="1" {% if folder and folder.priority==1 %}selected{% endif %}>High</option>
<option value="0" {% if not folder or (folder and folder.priority==0) %}selected{% endif %}>Normal
</option>
<option value="-1" {% if folder and folder.priority==-1 %}selected{% endif %}>Low</option>
</select>
</div>
<div class="modal-action">
<button type="button" class="btn btn-outline"
@click="$dispatch('close-modal')">Cancel</button>
<button type="submit" class="btn btn-primary" id="submit-btn">
{% if folder %}Update Folder{% else %}Add Folder{% endif %}
</button>
</div>
</form>
</div>

View File

@@ -1,23 +1,18 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{% for folder in folders %}
<div class="card bg-base-100 shadow-sm">
<div class="card bg-base-100 shadow-xl border border-base-300">
<div class="card-body">
<div class="flex justify-between items-start mb-2">
<h3 class="text-xl font-bold">{{ folder.name }}</h3>
<div class="flex space-x-2">
<button class="btn"
@click="$dispatch('open-edit-folder-modal', {
detail: {
id: '{{ folder.id }}',
name: '{{ folder.name }}',
rule_text: '{{ folder.rule_text }}',
priority: '{{ folder.priority or 0 }}'
}
})">
Edit
<button class="btn btn-sm btn-outline"
hx-get="/api/folders/{{ folder.id }}/edit"
hx-target="#modal-holder"
hx-swap="innerHTML"
hx-trigger="click">
<i class="fas fa-edit"></i>
</button>
<button class="text-red-400 btn"
<button class="btn btn-sm btn-outline btn-error"
hx-delete="/api/folders/{{ folder.id }}"
hx-target="#folders-list"
hx-swap="innerHTML"
@@ -27,26 +22,37 @@
</div>
</div>
<ul class="list bg-base-200 rounded">
<li class="list-row">{{ folder.rule_text }}</li>
</ul>
<div class="flex justify-between items-center">
<span class="badge badge-primary">Priority: {{ folder.priority or 'Normal' }}</span>
<span class="text-xs badge badge-secondary">0 emails</span>
</div>
<div class="bg-base-200 rounded-box p-4 mb-4">
<p class="text-base-content/80">{{ folder.rule_text }}</p>
</div>
<div class="flex justify-between items-center mt-2">
{% if folder.priority == 1 %}
<span class="badge badge-error">High Priority</span>
{% elif folder.priority == -1 %}
<span class="badge badge-info">Low Priority</span>
{% else %}
<span class="badge badge-primary">Normal Priority</span>
{% endif %}
<span class="text-xs badge badge-secondary">0 emails</span>
</div>
</div>
</div>
{% else %}
<div class="col-span-full text-center py-12">
<div class="text-5xl mb-4">
<div class="col-span-full text-center py-12 bg-base-100 rounded-box shadow-lg">
<div class="text-5xl mb-4 text-primary">
<i class="fas fa-folder-open"></i>
</div>
<h3 class="text-xl font-semibold mb-2">No folders yet</h3>
<p class="mb-4">Add your first folder to get started organizing your emails.</p>
<button class="btn btn-primary" @click="$dispatch('open-add-folder-modal')">
<h3 class="text-2xl font-bold mb-2">No folders yet</h3>
<p class="mb-6 text-base-content/70">Add your first folder to get started organizing your emails.</p>
<button class="btn btn-primary btn-lg"
hx-get="/api/folders/new"
hx-target="#modal-holder"
hx-swap="innerHTML"
hx-trigger="click">
<i class="fas fa-plus mr-2"></i>
Create Folder
</button>
</div>
{% endfor %}
</div>
</div>