feat: add admin menu configuration and sidebar improvements

- Add AdminMenuConfig model for per-platform menu customization
- Add menu registry for centralized menu configuration
- Add my-menu-config and platform-menu-config admin pages
- Update sidebar with improved layout and Alpine.js interactions
- Add FrontendType enum for admin/vendor menu separation
- Document self-contained module patterns in session note

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-27 20:34:58 +01:00
parent 32e43efb3c
commit 9a828999fe
14 changed files with 2346 additions and 619 deletions

View File

@@ -38,9 +38,9 @@
</ul>
{% endmacro %}
{# Macro for menu item #}
{# Macro for menu item with visibility check #}
{% macro menu_item(page_id, url, icon, label) %}
<li class="relative px-6 py-3">
<li x-show="isMenuItemVisible('{{ page_id }}')" class="relative px-6 py-3">
<span x-show="currentPage === '{{ page_id }}'" class="absolute inset-y-0 left-0 w-1 bg-purple-600 rounded-tr-lg rounded-br-lg" aria-hidden="true"></span>
<a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
:class="currentPage === '{{ page_id }}' ? 'text-gray-800 dark:text-gray-100' : ''"
@@ -56,7 +56,7 @@
============================================================================ #}
{% macro sidebar_content() %}
<div class="py-4 text-gray-500 dark:text-gray-400">
<div class="py-4 text-gray-500 dark:text-gray-400" x-init="loadMenuConfig()">
<a class="ml-6 text-lg font-bold text-gray-800 dark:text-gray-200" href="/admin/dashboard">
Admin Portal
</a>
@@ -77,80 +77,110 @@
</template>
<!-- Platform Administration Section -->
{{ section_header('Platform Administration', 'platformAdmin') }}
{% call section_content('platformAdmin') %}
{{ menu_item('companies', '/admin/companies', 'office-building', 'Companies') }}
{{ menu_item('vendors', '/admin/vendors', 'shopping-bag', 'Vendors') }}
{{ menu_item('messages', '/admin/messages', 'chat-bubble-left-right', 'Messages') }}
{% endcall %}
<div x-show="isSectionVisible('platformAdmin')">
{{ section_header('Platform Administration', 'platformAdmin') }}
{% call section_content('platformAdmin') %}
{{ menu_item('companies', '/admin/companies', 'office-building', 'Companies') }}
{{ menu_item('vendors', '/admin/vendors', 'shopping-bag', 'Vendors') }}
{{ menu_item('messages', '/admin/messages', 'chat-bubble-left-right', 'Messages') }}
{% endcall %}
</div>
<!-- Vendor Operations Section -->
{{ section_header('Vendor Operations', 'vendorOps') }}
{% call section_content('vendorOps') %}
{{ menu_item('vendor-products', '/admin/vendor-products', 'cube', 'Products') }}
{{ menu_item('customers', '/admin/customers', 'user-group', 'Customers') }}
{{ menu_item('inventory', '/admin/inventory', 'archive', 'Inventory') }}
{{ menu_item('orders', '/admin/orders', 'clipboard-list', 'Orders') }}
{# Future items - uncomment when implemented:
{{ menu_item('shipping', '/admin/shipping', 'truck', 'Shipping') }}
#}
{% endcall %}
<div x-show="isSectionVisible('vendorOps')">
{{ section_header('Vendor Operations', 'vendorOps') }}
{% call section_content('vendorOps') %}
{{ menu_item('vendor-products', '/admin/vendor-products', 'cube', 'Products') }}
{{ menu_item('customers', '/admin/customers', 'user-group', 'Customers') }}
{{ menu_item('inventory', '/admin/inventory', 'archive', 'Inventory') }}
{{ menu_item('orders', '/admin/orders', 'clipboard-list', 'Orders') }}
{# Future items - uncomment when implemented:
{{ menu_item('shipping', '/admin/shipping', 'truck', 'Shipping') }}
#}
{% endcall %}
</div>
<!-- Marketplace Section -->
{{ section_header('Marketplace', 'marketplace') }}
{% call section_content('marketplace') %}
{{ menu_item('marketplace-letzshop', '/admin/marketplace/letzshop', 'shopping-cart', 'Letzshop') }}
{% endcall %}
<div x-show="isSectionVisible('marketplace')">
{{ section_header('Marketplace', 'marketplace') }}
{% call section_content('marketplace') %}
{{ menu_item('marketplace-letzshop', '/admin/marketplace/letzshop', 'shopping-cart', 'Letzshop') }}
{% endcall %}
</div>
<!-- Billing & Subscriptions Section -->
{{ section_header('Billing & Subscriptions', 'billing') }}
{% call section_content('billing') %}
{{ menu_item('subscription-tiers', '/admin/subscription-tiers', 'tag', 'Subscription Tiers') }}
{{ menu_item('subscriptions', '/admin/subscriptions', 'credit-card', 'Vendor Subscriptions') }}
{{ menu_item('billing-history', '/admin/billing-history', 'document-text', 'Billing History') }}
{% endcall %}
<div x-show="isSectionVisible('billing')">
{{ section_header('Billing & Subscriptions', 'billing') }}
{% call section_content('billing') %}
{{ menu_item('subscription-tiers', '/admin/subscription-tiers', 'tag', 'Subscription Tiers') }}
{{ menu_item('subscriptions', '/admin/subscriptions', 'credit-card', 'Vendor Subscriptions') }}
{{ menu_item('billing-history', '/admin/billing-history', 'document-text', 'Billing History') }}
{% endcall %}
</div>
<!-- Content Management Section -->
{{ section_header('Content Management', 'contentMgmt') }}
{% call section_content('contentMgmt') %}
{{ menu_item('platforms', '/admin/platforms', 'globe-alt', 'Platforms') }}
{{ menu_item('content-pages', '/admin/content-pages', 'document-text', 'Content Pages') }}
{{ menu_item('vendor-theme', '/admin/vendor-themes', 'color-swatch', 'Vendor Themes') }}
{% endcall %}
<div x-show="isSectionVisible('contentMgmt')">
{{ section_header('Content Management', 'contentMgmt') }}
{% call section_content('contentMgmt') %}
{{ menu_item('platforms', '/admin/platforms', 'globe-alt', 'Platforms') }}
{{ menu_item('content-pages', '/admin/content-pages', 'document-text', 'Content Pages') }}
{{ menu_item('vendor-themes', '/admin/vendor-themes', 'color-swatch', 'Vendor Themes') }}
{% endcall %}
</div>
<!-- Developer Tools Section -->
{{ section_header('Developer Tools', 'devTools') }}
{% call section_content('devTools') %}
{{ menu_item('components', '/admin/components', 'view-grid', 'Components') }}
{{ menu_item('icons', '/admin/icons', 'photograph', 'Icons') }}
{% endcall %}
<div x-show="isSectionVisible('devTools')">
{{ section_header('Developer Tools', 'devTools') }}
{% call section_content('devTools') %}
{{ menu_item('components', '/admin/components', 'view-grid', 'Components') }}
{{ menu_item('icons', '/admin/icons', 'photograph', 'Icons') }}
{% endcall %}
</div>
<!-- Platform Health Section -->
{{ section_header('Platform Health', 'platformHealth') }}
{% call section_content('platformHealth') %}
{{ menu_item('platform-health', '/admin/platform-health', 'chart-bar', 'Capacity Monitor') }}
{{ menu_item('testing', '/admin/testing', 'beaker', 'Testing Hub') }}
{{ menu_item('code-quality', '/admin/code-quality', 'shield-check', 'Code Quality') }}
{% endcall %}
<div x-show="isSectionVisible('platformHealth')">
{{ section_header('Platform Health', 'platformHealth') }}
{% call section_content('platformHealth') %}
{{ menu_item('platform-health', '/admin/platform-health', 'chart-bar', 'Capacity Monitor') }}
{{ menu_item('testing', '/admin/testing', 'beaker', 'Testing Hub') }}
{{ menu_item('code-quality', '/admin/code-quality', 'shield-check', 'Code Quality') }}
{% endcall %}
</div>
<!-- Platform Monitoring Section -->
{{ section_header('Platform Monitoring', 'monitoring') }}
{% call section_content('monitoring') %}
{{ menu_item('imports', '/admin/imports', 'cube', 'Import Jobs') }}
{{ menu_item('background-tasks', '/admin/background-tasks', 'collection', 'Background Tasks') }}
{{ menu_item('logs', '/admin/logs', 'document-text', 'Application Logs') }}
{{ menu_item('notifications', '/admin/notifications', 'bell', 'Notifications') }}
{% endcall %}
<div x-show="isSectionVisible('monitoring')">
{{ section_header('Platform Monitoring', 'monitoring') }}
{% call section_content('monitoring') %}
{{ menu_item('imports', '/admin/imports', 'cube', 'Import Jobs') }}
{{ menu_item('background-tasks', '/admin/background-tasks', 'collection', 'Background Tasks') }}
{{ menu_item('logs', '/admin/logs', 'document-text', 'Application Logs') }}
{{ menu_item('notifications', '/admin/notifications', 'bell', 'Notifications') }}
{% endcall %}
</div>
<!-- Platform Settings Section -->
{{ section_header('Platform Settings', 'settingsSection') }}
{% call section_content('settingsSection') %}
{{ menu_item('settings', '/admin/settings', 'cog', 'General') }}
{{ menu_item('email-templates', '/admin/email-templates', 'mail', 'Email Templates') }}
{# TODO: Implement profile and API keys pages #}
{# {{ menu_item('profile', '/admin/profile', 'user-circle', 'Profile') }} #}
{# {{ menu_item('api-keys', '/admin/api-keys', 'key', 'API Keys') }} #}
{% endcall %}
<div x-show="isSectionVisible('settingsSection')">
{{ section_header('Platform Settings', 'settingsSection') }}
{% call section_content('settingsSection') %}
{{ menu_item('settings', '/admin/settings', 'cog', 'General') }}
{{ menu_item('email-templates', '/admin/email-templates', 'mail', 'Email Templates') }}
<!-- My Menu - super admin only (customize personal sidebar) -->
<template x-if="isSuperAdmin">
<li x-show="isMenuItemVisible('my-menu')" class="relative px-6 py-3">
<span x-show="currentPage === 'my-menu'" class="absolute inset-y-0 left-0 w-1 bg-purple-600 rounded-tr-lg rounded-br-lg" aria-hidden="true"></span>
<a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
:class="currentPage === 'my-menu' ? 'text-gray-800 dark:text-gray-100' : ''"
href="/admin/my-menu">
<span x-html="$icon('view-grid')"></span>
<span class="ml-4">My Menu</span>
</a>
</li>
</template>
{# TODO: Implement profile and API keys pages #}
{# {{ menu_item('profile', '/admin/profile', 'user-circle', 'Profile') }} #}
{# {{ menu_item('api-keys', '/admin/api-keys', 'key', 'API Keys') }} #}
{% endcall %}
</div>
</div>
{% endmacro %}