sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use correct page_header_flex macro in messages template

Browse Source 
The page_header macro doesn't accept a 'buttons' parameter.
Changed to page_header_flex with caller block for custom button.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Samir Boulahtit
2025-12-21 20:59:21 +01:00
parent 26b3dc9e3b
commit 0c65da0166
1 changed files with 57 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
app/templates/admin/messages.html
View File

@@ -1,16 +1,21 @@
{# app/templates/admin/messages.html #} {# app/templates/admin/messages.html #}
{% extends "admin/base.html" %} {% extends "admin/base.html" %}
{% from 'shared/macros/headers.html' import page_header %} {% from 'shared/macros/headers.html' import page_header_flex %}
{% from 'shared/macros/alerts.html' import loading_state, error_state %} {% from 'shared/macros/alerts.html' import loading_state, error_state %}
{% from 'shared/macros/modals.html' import form_modal %}
{% block title %}Messages{% endblock %} {% block title %}Messages{% endblock %}
{% block alpine_data %}adminMessages({{ conversation_id or 'null' }}){% endblock %} {% block alpine_data %}adminMessages({{ conversation_id or 'null' }}){% endblock %}
{% block content %} {% block content %}
{{ page_header('Messages', buttons=[ {% call page_header_flex(title='Messages') %}
{'text': 'New Conversation', 'icon': 'plus', 'click': 'showComposeModal = true', 'primary': True} <button @click="showComposeModal = true"
]) }} class="flex items-center px-4 py-2 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">
<span x-html="$icon('plus', 'w-4 h-4 mr-2')"></span>
New Conversation
</button>
{% endcall %}
{{ loading_state('Loading conversations...') }} {{ loading_state('Loading conversations...') }}
@@ -271,86 +276,59 @@
</div> </div>
<!-- Compose Modal --> <!-- Compose Modal -->
<div x-show="showComposeModal" {% call form_modal('composeModal', 'New Conversation', show_var='showComposeModal', submit_action='createConversation()', submit_text='Start Conversation', loading_var='creatingConversation', loading_text='Creating...') %}
x-cloak <!-- Recipient Type -->
class="fixed inset-0 z-50 flex items-center justify-center" <div class="space-y-4">
@keydown.escape.window="showComposeModal = false"> <div>
<div class="absolute inset-0 bg-black bg-opacity-50" @click="showComposeModal = false"></div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Send to</label>
<div class="relative bg-white dark:bg-gray-800 rounded-lg shadow-xl w-full max-w-lg mx-4"> <select
<div class="flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-gray-700"> x-model="compose.recipientType"
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100">New Conversation</h3> @change="compose.recipientId = null; loadRecipients()"
<button @click="showComposeModal = false" class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"> class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
<span x-html="$icon('x-mark', 'w-5 h-5')"></span> >
</button> <option value="">Select type...</option>
<option value="vendor">Vendor</option>
<option value="customer">Customer</option>
</select>
</div> </div>
<form @submit.prevent="createConversation()" class="p-6 space-y-4"> <!-- Recipient -->
<!-- Recipient Type --> <div x-show="compose.recipientType">
<div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Recipient</label>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Send to</label> <select
<select x-model="compose.recipientId"
x-model="compose.recipientType" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
@change="compose.recipientId = null; loadRecipients()" >
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300" <option value="">Select recipient...</option>
> <template x-for="r in recipients" :key="r.id">
<option value="">Select type...</option> <option :value="r.id" x-text="r.name + (r.vendor_name ? ' (' + r.vendor_name + ')' : '') + ' - ' + (r.email || '')"></option>
<option value="vendor">Vendor</option> </template>
<option value="customer">Customer</option> </select>
</select> </div>
</div>
<!-- Recipient --> <!-- Subject -->
<div x-show="compose.recipientType"> <div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Recipient</label> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Subject</label>
<select <input
x-model="compose.recipientId" type="text"
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300" x-model="compose.subject"
> placeholder="What is this about?"
<option value="">Select recipient...</option> class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
<template x-for="r in recipients" :key="r.id"> >
<option :value="r.id" x-text="r.name + (r.vendor_name ? ' (' + r.vendor_name + ')' : '') + ' - ' + (r.email || '')"></option> </div>
</template>
</select>
</div>
<!-- Subject --> <!-- Message -->
<div> <div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Subject</label> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Message</label>
<input <textarea
type="text" x-model="compose.message"
x-model="compose.subject" rows="4"
placeholder="What is this about?" placeholder="Type your message..."
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300" class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300 resize-none"
> ></textarea>
</div> </div>
<!-- Message -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Message</label>
<textarea
x-model="compose.message"
rows="4"
placeholder="Type your message..."
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300 resize-none"
></textarea>
</div>
<!-- Actions -->
<div class="flex justify-end gap-3 pt-4">
<button type="button" @click="showComposeModal = false"
class="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 rounded-lg">
Cancel
</button>
<button type="submit"
:disabled="!compose.recipientId || !compose.subject.trim() || creatingConversation"
class="px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 disabled:opacity-50">
<span x-show="!creatingConversation">Start Conversation</span>
<span x-show="creatingConversation">Creating...</span>
</button>
</div>
</form>
</div> </div>
</div> {% endcall %}
{% endblock %} {% endblock %}
{% block page_scripts %} {% block page_scripts %}