Files
orion/app/templates/store/base.html
Samir Boulahtit 3ce9468397
Some checks failed
CI / ruff (push) Successful in 17s
CI / validate (push) Has been cancelled
CI / dependency-scanning (push) Has been cancelled
CI / docs (push) Has been cancelled
CI / deploy (push) Has been cancelled
CI / pytest (push) Has been cancelled
fix(cache-bust): close FE-024 gaps so every JS/CSS gets ?v=<sha>
The 2026-05-18 cache-busting system was only catching a fraction of
includes because:

1. FE-024 anti-pattern only matched `'<module>_static'` mount names
   (e.g. `'core_static'`, `'billing_static'`). The bare `'static'`
   mount — which is what every persona base.html uses for shared JS,
   CSS, and Tailwind output — never matched.
2. The rule explicitly excluded `base.html` files, which are exactly
   where most of the shared JS/CSS includes live.

User reported only a handful of files had `?v=` in their Network tab.
Swept 5 persona base.html + 15 standalone templates (login/register/
forgot/reset password, error pages, onboarding, invitation-accept,
admin module-info/config, etc.) — 53 url_for('static', ...) refs for
.js/.css converted to static_v(request, 'static', ...).

Then tightened FE-024:
- Added an anti-pattern for the bare `'static'` mount.
- Dropped `base.html` from exceptions (kept `partials/`).

Re-running the validator: same 126-warning baseline, 0 FE-024 hits.

Now every deploy flips the `?v=<sha>` query string on every shared
asset; browsers refetch automatically without a hard refresh.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-29 21:01:44 +02:00

111 lines
5.2 KiB
HTML

{# app/templates/store/base.html #}
{% from 'shared/macros/modals.html' import confirm_modal_dynamic %}
<!DOCTYPE html>
<html :class="{ 'dark': dark }" x-data="{% block alpine_data %}data(){% endblock %}" lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{% block title %}Store Panel{% endblock %} - {{ store.name if store else 'Multi-Tenant Platform' }}</title>
<!-- Fonts: Local fallback + Google Fonts -->
<link href="{{ static_v(request, 'static', path='shared/fonts/inter.css') }}" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
<!-- Tailwind CSS v4 (built locally via standalone CLI) -->
<link rel="stylesheet" href="{{ static_v(request, 'static', path='store/css/tailwind.output.css') }}" />
<!-- Flag Icons for Language Selector with local fallback -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/flag-icons@7.2.3/css/flag-icons.min.css"
onerror="this.onerror=null; this.href='{{ static_v(request, 'static', path='shared/css/store/flag-icons.min.css') }}';"
/>
<!-- Alpine Cloak -->
<style>
[x-cloak] { display: none !important; }
</style>
<!-- Dev debug toolbar (dev only — auto-hides in production, must load early for interceptors) -->
<script src="{{ static_v(request, 'static', path='shared/js/dev-toolbar.js') }}"></script>
{% block extra_head %}{% endblock %}
</head>
<body x-cloak>
<div class="flex h-screen bg-gray-50 dark:bg-gray-900" :class="{ 'overflow-hidden': isSideMenuOpen }">
<!-- Sidebar (server-side included) -->
{% include 'store/partials/sidebar.html' %}
<div class="flex flex-col flex-1 w-full">
<!-- Header (server-side included) -->
{% include 'store/partials/header.html' %}
<!-- Main Content -->
<main class="h-full overflow-y-auto">
<div class="container px-6 mx-auto grid">
{% block content %}{% endblock %}
</div>
</main>
</div>
</div>
<!-- Upgrade Limit Reached Confirm Modal -->
{{ confirm_modal_dynamic('limitReachedConfirm', 'Usage Limit Reached', '$store.upgrade.limitReachedMessage', '$store.upgrade.confirmUpgrade()', '$store.upgrade.showLimitReachedConfirm', 'Go to Billing', 'Dismiss', 'warning') }}
<!-- Core Scripts - ORDER MATTERS! -->
<!-- 0. Frontend type (server-injected, used by log-config and dev-toolbar) -->
<script>window.FRONTEND_TYPE = '{{ frontend_type | default("store") }}';</script>
<!-- 1. FIRST: Log Configuration -->
<script defer src="{{ static_v(request, 'static', path='shared/js/log-config.js') }}"></script>
<!-- 1.5: Store Configuration (resolved via PlatformSettingsService) -->
<script>
window.STORE_CODE = '{{ store_code | default("") }}';
window.STORE_CONFIG = {
locale: '{{ storefront_locale }}',
currency: '{{ storefront_currency }}',
dashboardLanguage: '{{ dashboard_language }}'
};
window.USER_PERMISSIONS = {{ user_permissions | default([]) | tojson }};
</script>
<!-- 2. SECOND: Icons (before Alpine.js) -->
<script defer src="{{ static_v(request, 'static', path='shared/js/icons.js') }}"></script>
<!-- 3. THIRD: Alpine.js Base Data -->
<script src="{{ static_v(request, 'core_static', path='store/js/init-alpine.js') }}"></script>
<!-- 4. FOURTH: Utils (standalone utilities) -->
<script defer src="{{ static_v(request, 'static', path='shared/js/utils.js') }}"></script>
<!-- 4b. i18n Support -->
<script defer src="{{ static_v(request, 'static', path='shared/js/i18n.js') }}"></script>
<script>
// Initialize i18n with dashboard language and preload modules
// Wrapped in DOMContentLoaded so deferred i18n.js has loaded
document.addEventListener('DOMContentLoaded', async function() {
const modules = {% block i18n_modules %}[]{% endblock %};
await I18n.init('{{ current_language | default("en") }}', modules);
});
</script>
<!-- 5. FIFTH: API Client (depends on Utils) -->
<script defer src="{{ static_v(request, 'static', path='shared/js/api-client.js') }}"></script>
<!-- 6. SIXTH: Feature Store (depends on API Client, registers with Alpine) -->
<script defer src="{{ static_v(request, 'billing_static', path='shared/js/feature-store.js') }}"></script>
<!-- 7. SEVENTH: Upgrade Prompts (depends on API Client, registers with Alpine) -->
<script defer src="{{ static_v(request, 'billing_static', path='shared/js/upgrade-prompts.js') }}"></script>
<!-- 8. Page-specific scripts (MUST load before Alpine.js) -->
{% block extra_scripts %}{% endblock %}
<!-- 9. LAST: Alpine.js v3 (must be last defer script — auto-initializes on load) -->
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.13.3/dist/cdn.min.js"
onerror="var s=document.createElement('script');s.defer=true;s.src='{{ static_v(request, 'static', path='shared/js/lib/alpine.min.js') }}';document.head.appendChild(s);"></script>
</body>
</html>