{% extends "base.html" %}
{% block title %}My Notes - {{ config.APP_NAME }}{% endblock %}
{% block content %}
<h1>My Notes</h1>

<div class="auth-card" style="max-width:520px; margin-bottom:24px;">
    <form method="POST" action="{{ url_for('notes.add') }}">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <div class="field"><label>Note</label><textarea name="note_text" rows="3" required></textarea></div>
        <div class="field"><label>Tags (comma-separated)</label><input type="text" name="topic_tags"></div>
        <div class="field">
            <label>Category</label>
            <select name="category_id">
                <option value="">- none -</option>
                {% for c in categories %}<option value="{{ c.category_id }}">{{ c.category_icon }} {{ c.category_name }}</option>{% endfor %}
            </select>
        </div>
        <div class="field"><label><input type="checkbox" name="is_pinned"> Pinned</label></div>
        <div class="field"><label><input type="checkbox" name="is_favorite"> Favorite</label></div>
        <button type="submit" class="btn-primary">Save Note</button>
    </form>
</div>

{% if notes %}
<div class="table-responsive">
<table class="data-table">
    <thead><tr><th></th><th>Note</th><th>Tags</th><th>Last Modified</th><th>Actions</th></tr></thead>
    <tbody>
        {% for n in notes %}
        <tr>
            <td>{{ "📌" if n.is_pinned else "" }}{{ "⭐" if n.is_favorite else "" }}</td>
            <td>{{ n.note }}</td>
            <td>{{ n.topic_tags or "-" }}</td>
            <td>{{ n.last_modified[:10] if n.last_modified else "-" }}</td>
            <td>
                <a href="{{ url_for('notes.edit', note_id=n.note_id) }}">Edit</a>
                <form method="POST" action="{{ url_for('notes.delete', note_id=n.note_id) }}" style="display:inline"
                      onsubmit="return confirm('Delete this note?');">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <button type="submit" class="btn-danger-link">Delete</button>
                </form>
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>
</div>
{% else %}
<p>No notes yet.</p>
{% endif %}
{% endblock %}