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

refactor: standardize admin templates with shared macros

Browse Source 
Migrate all admin templates to use standardized components:
- Use tabs macros (tabs_nav, tab_button) for tab navigation
- Use number_stepper for quantity/numeric inputs
- Use headers macros for consistent page layouts
- Use modals macros for dialog components

Affected pages: dashboard, settings, logs, content-pages, companies,
vendors, users, imports, marketplace, code-quality, and more.

🤖 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-07 17:04:43 +01:00
parent 2ec150e8a5
commit bb2e5fd260
31 changed files with 261 additions and 1290 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
app/templates/admin/logs.html
View File

@@ -1,47 +1,20 @@
{# app/templates/admin/logs.html #}
{% extends "admin/base.html" %}
{% from 'shared/macros/pagination.html' import pagination %}
{% from 'shared/macros/alerts.html' import alert_dynamic, error_state %}
{% from 'shared/macros/headers.html' import page_header_refresh %}
{% from 'shared/macros/tabs.html' import tabs_nav, tab_button %}
{% block title %}Application Logs{% endblock %}
{% block alpine_data %}adminLogs(){% endblock %}
{% block content %}
<!-- Page Header -->
<div class="flex items-center justify-between my-6">
<h2 class="text-2xl font-semibold text-gray-700 dark:text-gray-200">
Application Logs
</h2>
<div class="flex items-center space-x-3">
<button
@click="refresh()"
:disabled="loading"
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 disabled:opacity-50 disabled:cursor-not-allowed"
>
<span x-show="!loading" x-html="$icon('refresh', 'w-4 h-4 mr-2')"></span>
<span x-show="loading" x-html="$icon('spinner', 'w-4 h-4 mr-2')"></span>
<span x-text="loading ? 'Loading...' : 'Refresh'"></span>
</button>
</div>
</div>
{{ page_header_refresh('Application Logs') }}
<!-- Success Message -->
<div x-show="successMessage" x-transition class="mb-6 p-4 bg-green-100 border border-green-400 text-green-700 rounded-lg flex items-start">
<span x-html="$icon('check-circle', 'w-5 h-5 mr-3 mt-0.5 flex-shrink-0')"></span>
<div>
<p class="font-semibold">Success</p>
<p class="text-sm" x-text="successMessage"></p>
</div>
</div>
{{ alert_dynamic(type='success', title='Success', message_var='successMessage', show_condition='successMessage') }}
<!-- Error Message -->
<div x-show="error" x-transition class="mb-6 p-4 bg-red-100 border border-red-400 text-red-700 rounded-lg flex items-start">
<span x-html="$icon('exclamation', 'w-5 h-5 mr-3 mt-0.5 flex-shrink-0')"></span>
<div>
<p class="font-semibold">Error</p>
<p class="text-sm" x-text="error"></p>
</div>
</div>
{{ error_state('Error', show_condition='error') }}
<!-- Statistics Cards -->
<div x-show="stats" class="grid gap-6 mb-8 md:grid-cols-2 xl:grid-cols-4">
@@ -91,28 +64,10 @@
</div>
<!-- Log Source Tabs -->
<div class="mb-6">
<div class="border-b border-gray-200 dark:border-gray-700">
<nav class="-mb-px flex space-x-8">
<button
@click="logSource = 'database'; loadLogs()"
:class="logSource === 'database' ? 'border-purple-500 text-purple-600 dark:text-purple-400' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300'"
class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm transition-colors"
>
<span x-html="$icon('database', 'inline w-5 h-5 mr-2')"></span>
Database Logs
</button>
<button
@click="logSource = 'file'; loadFileLogs()"
:class="logSource === 'file' ? 'border-purple-500 text-purple-600 dark:text-purple-400' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300'"
class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm transition-colors"
>
<span x-html="$icon('document', 'inline w-5 h-5 mr-2')"></span>
File Logs
</button>
</nav>
</div>
</div>
{% call tabs_nav() %}
{{ tab_button('database', 'Database Logs', tab_var='logSource', icon='database', onclick="logSource = 'database'; loadLogs()") }}
{{ tab_button('file', 'File Logs', tab_var='logSource', icon='document', onclick="logSource = 'file'; loadFileLogs()") }}
{% endcall %}
<!-- Database Logs Section -->
<div x-show="logSource === 'database'" x-transition>
@@ -299,6 +254,7 @@
</div>
</div>
{# noqa: FE-004 - Log detail modal with dynamic show variable and custom content layout #}
<!-- Log Detail Modal -->
<div x-show="selectedLog" x-transition class="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50" @click.self="selectedLog = null">
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-xl max-w-4xl w-full mx-4 max-h-[90vh] overflow-hidden">