Add organize_enabled toggle for folders and improve UI with loading states

This commit is contained in:
Bryce
2025-08-05 10:47:16 -07:00
parent 1eca7f3ff9
commit 31871ed8ec
12 changed files with 119 additions and 57 deletions

View File

@@ -16,7 +16,7 @@
{% 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"
<input type="text" id="folder-name" name="name"
class="input input-bordered w-full {% if errors and errors.name %}input-error{% endif %}"
placeholder="e.g., Work, Personal, Newsletters" required
value="{% if name is defined %}{{ name }}{% elif folder %}{{ folder.name }}{% endif %}">
@@ -26,7 +26,7 @@
</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"
<textarea id="folder-rule" name="rule_text"
class="textarea textarea-bordered w-full h-24 {% if errors and errors.rule_text %}textarea-error{% endif %}"
placeholder="e.g., Move emails from 'newsletter@company.com' to this folder"
required>{% if rule_text is defined %}{{ rule_text }}{% elif folder %}{{ folder.rule_text }}{% endif %}</textarea>
@@ -42,11 +42,12 @@
<option value="-1" {% if (priority is defined and priority == '-1') or (folder and folder.priority==-1) %}selected{% endif %}>Low</option>
</select>
</div>
<div class="modal-action">
<div class="modal-action" data-loading-states>
<button type="button" class="btn btn-outline"
@click="$dispatch('close-modal')">Cancel</button>
<button type="submit" class="btn btn-primary" id="submit-btn" :class="{ 'shake': errors }">
{% if folder %}Update Folder{% else %}Add Folder{% endif %}
<button type="submit" class="btn btn-primary" id="submit-btn" :class="{ 'shake': errors }" >
<span data-loading-class="!hidden">{% if folder %}Update Folder{% else %}Add Folder{% endif %}</span>
<span class="loading loading-spinner loading-xs hidden" data-loading-class-remove="hidden"></span>
</button>
</div>
</form>