Converted all inline onclick/onsubmit handlers to Alpine.js @click/@submit directives and added x-data attributes to template body tags. Templates updated: - admin.templ: Added x-data="admin", converted scan/hide buttons - analytics.templ: Added x-data, converted loadAnalytics button - api_explorer.templ: Added x-data for API explorer page - bookshelf.templ: Added x-data, converted library/pagination handlers - collection_modal.templ: Added x-data for modal components - collection_rules.templ: Added x-data, converted all rule handlers - collections.templ: Added x-data, converted navigation/book handlers - conflicts.templ: Added x-data, converted resolve/dismiss handlers - header.templ: Converted theme dropdown and user menu handlers - index.templ: Added x-data for theme/auth - login.templ: Added x-data for theme switching - profile.templ: Added x-data, converted delete account - profile_form.templ: Converted modal close handler - profile_modal.templ: Added x-data for modal - progress.templ: Removed script (uses header.logout) - queue.templ: Added x-data, converted queue handlers - register.templ: Added x-data for theme - restore_system_collection_modal.templ: Added x-data - toast.templ: Converted to x-init with Alpine - unlinked_books.templ: Added x-data for bulk operations Dynamic content in devices.templ uses event delegation via data attributes.
30 lines
1.0 KiB
Templ
30 lines
1.0 KiB
Templ
package templates
|
|
|
|
templ ProfileModal(user User) {
|
|
<div id="profile-modal" class="fixed inset-0 flex items-center justify-center z-50" x-data="profileModal" x-init="setupProfileModal()" style="background-color: rgba(0,0,0,0.5);">
|
|
<div class="rounded-lg shadow-xl max-w-4xl w-full mx-4 max-h-[90vh] overflow-y-auto" style="background-color: var(--bg-secondary);">
|
|
<!-- Modal Header -->
|
|
<div class="flex justify-between items-center p-6 border-b" style="border-color: var(--border);">
|
|
<div>
|
|
<h2 class="text-2xl font-bold" style="color: var(--text-primary)">Edit User Profile</h2>
|
|
<p class="text-sm mt-1" style="color: var(--text-secondary);">
|
|
{ user.Username } ({ user.Email })
|
|
</p>
|
|
</div>
|
|
<button
|
|
@click="closeProfileModal()"
|
|
class="text-2xl"
|
|
style="color: var(--text-secondary);"
|
|
>
|
|
×
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Modal Body - uses reusable form -->
|
|
<div class="p-6">
|
|
@ProfileForm(user, "/api/auth/profile/" + user.ID, false, true, true)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|