refactor: migrate vendor APIs to token-based context and consolidate architecture
## Vendor-in-Token Architecture (Complete Migration) - Migrate all vendor API endpoints from require_vendor_context() to token_vendor_id - Update permission dependencies to extract vendor from JWT token - Add vendor exceptions: VendorAccessDeniedException, VendorOwnerOnlyException, InsufficientVendorPermissionsException - Shop endpoints retain require_vendor_context() for URL-based detection - Add AUTH-004 architecture rule enforcing vendor context patterns - Fix marketplace router missing /marketplace prefix ## Exception Pattern Fixes (API-003/API-004) - Services raise domain exceptions, endpoints let them bubble up - Add code_quality and content_page exception modules - Move business logic from endpoints to services (admin, auth, content_page) - Fix exception handling in admin, shop, and vendor endpoints ## Tailwind CSS Consolidation - Consolidate CSS to per-area files (admin, vendor, shop, platform) - Remove shared/cdn-fallback.html and shared/css/tailwind.min.css - Update all templates to use area-specific Tailwind output files - Remove Node.js config (package.json, postcss.config.js, tailwind.config.js) ## Documentation & Cleanup - Update vendor-in-token-architecture.md with completed migration status - Update architecture-rules.md with new rules - Move migration docs to docs/development/migration/ - Remove duplicate/obsolete documentation files - Merge pytest.ini settings into pyproject.toml 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -1,195 +1,108 @@
|
||||
{# app/templates/shop/errors/base.html #}
|
||||
{# Error page base template using Tailwind CSS with vendor theme support #}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="en" class="h-full">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% block title %}{{ status_code }} - {{ status_name }}{% endblock %}{% if vendor %} | {{ vendor.name }}{% endif %}</title>
|
||||
|
||||
{# Tailwind CSS #}
|
||||
<link rel="stylesheet" href="{{ url_for('static', path='shop/css/tailwind.output.css') }}">
|
||||
|
||||
{# Vendor theme colors via CSS variables #}
|
||||
<style>
|
||||
:root {
|
||||
/* Default theme colors (fallback) */
|
||||
--color-primary: {{ theme.colors.primary if theme and theme.colors else '#6366f1' }};
|
||||
--color-secondary: {{ theme.colors.secondary if theme and theme.colors else '#8b5cf6' }};
|
||||
--color-accent: {{ theme.colors.accent if theme and theme.colors else '#ec4899' }};
|
||||
--color-background: {{ theme.colors.background if theme and theme.colors else '#ffffff' }};
|
||||
--color-text: {{ theme.colors.text if theme and theme.colors else '#1f2937' }};
|
||||
--color-border: {{ theme.colors.border if theme and theme.colors else '#e5e7eb' }};
|
||||
--font-heading: {{ theme.fonts.heading if theme and theme.fonts else "'Inter', sans-serif" }};
|
||||
--font-body: {{ theme.fonts.body if theme and theme.fonts else "'Inter', sans-serif" }};
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-body);
|
||||
.bg-gradient-theme {
|
||||
background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--color-text);
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.error-container {
|
||||
background: var(--color-background);
|
||||
border-radius: 1.5rem;
|
||||
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
padding: 3rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
{% if vendor and vendor.logo %}
|
||||
.vendor-logo {
|
||||
max-width: 150px;
|
||||
max-height: 60px;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
{% endif %}
|
||||
|
||||
.error-icon {
|
||||
font-size: 5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.status-code {
|
||||
font-size: 6rem;
|
||||
font-weight: 700;
|
||||
.text-theme-primary {
|
||||
color: var(--color-primary);
|
||||
line-height: 1;
|
||||
margin-bottom: 0.5rem;
|
||||
font-family: var(--font-heading);
|
||||
}
|
||||
|
||||
.status-name {
|
||||
font-size: 1.75rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 1rem;
|
||||
font-family: var(--font-heading);
|
||||
.bg-theme-primary {
|
||||
background-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.error-message {
|
||||
font-size: 1.125rem;
|
||||
color: #6b7280;
|
||||
margin-bottom: 2.5rem;
|
||||
line-height: 1.6;
|
||||
.border-theme-primary {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
border-radius: 0.75rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: var(--color-primary);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
opacity: 0.9;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: transparent;
|
||||
color: var(--color-primary);
|
||||
border: 2px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: var(--color-primary);
|
||||
color: white;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.support-link {
|
||||
margin-top: 2.5rem;
|
||||
padding-top: 2rem;
|
||||
border-top: 1px solid var(--color-border);
|
||||
font-size: 0.875rem;
|
||||
color: #6b7280;
|
||||
}
|
||||
|
||||
.support-link a {
|
||||
color: var(--color-primary);
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.support-link a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.vendor-info {
|
||||
margin-top: 2rem;
|
||||
font-size: 0.875rem;
|
||||
color: #9ca3af;
|
||||
.hover\:bg-theme-primary:hover {
|
||||
background-color: var(--color-primary);
|
||||
}
|
||||
|
||||
{% block extra_styles %}{% endblock %}
|
||||
</style>
|
||||
|
||||
{% if theme and theme.custom_css %}
|
||||
<style>
|
||||
{{ theme.custom_css | safe }}
|
||||
</style>
|
||||
<style>{{ theme.custom_css | safe }}</style>
|
||||
{% endif %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="error-container">
|
||||
<body class="h-full bg-gradient-theme flex items-center justify-center p-8">
|
||||
<div class="bg-white rounded-3xl shadow-2xl max-w-xl w-full p-12 text-center">
|
||||
{# Vendor Logo #}
|
||||
{% if vendor and theme and theme.branding and theme.branding.logo %}
|
||||
<img src="{{ theme.branding.logo }}" alt="{{ vendor.name }}" class="vendor-logo">
|
||||
<img src="{{ theme.branding.logo }}"
|
||||
alt="{{ vendor.name }}"
|
||||
class="max-w-[150px] max-h-[60px] mx-auto mb-8 object-contain">
|
||||
{% endif %}
|
||||
|
||||
{% block content %}
|
||||
<div class="error-icon">{% block icon %}⚠️{% endblock %}</div>
|
||||
<div class="status-code">{{ status_code }}</div>
|
||||
<div class="status-name">{{ status_name }}</div>
|
||||
<div class="error-message">{{ message }}</div>
|
||||
{# Error Icon #}
|
||||
<div class="text-7xl mb-4">{% block icon %}⚠️{% endblock %}</div>
|
||||
|
||||
<div class="action-buttons">
|
||||
{# Status Code #}
|
||||
<div class="text-8xl font-bold text-theme-primary leading-none mb-2">
|
||||
{{ status_code }}
|
||||
</div>
|
||||
|
||||
{# Status Name #}
|
||||
<h1 class="text-3xl font-semibold text-gray-900 mb-4">
|
||||
{{ status_name }}
|
||||
</h1>
|
||||
|
||||
{# Error Message #}
|
||||
<p class="text-lg text-gray-500 mb-10 leading-relaxed">
|
||||
{{ message }}
|
||||
</p>
|
||||
|
||||
{# Action Buttons #}
|
||||
<div class="flex gap-4 justify-center flex-wrap mt-8">
|
||||
{% block action_buttons %}
|
||||
<a href="{{ base_url }}shop/" class="btn btn-primary">Continue Shopping</a>
|
||||
<a href="{{ base_url }}shop/contact" class="btn btn-secondary">Contact Us</a>
|
||||
<a href="{{ base_url }}shop/"
|
||||
class="inline-flex items-center px-8 py-4 rounded-xl font-semibold text-white bg-theme-primary hover:opacity-90 hover:-translate-y-0.5 transition-all shadow-lg">
|
||||
Continue Shopping
|
||||
</a>
|
||||
<a href="{{ base_url }}shop/contact"
|
||||
class="inline-flex items-center px-8 py-4 rounded-xl font-semibold text-theme-primary border-2 border-theme-primary hover:bg-theme-primary hover:text-white hover:-translate-y-0.5 transition-all">
|
||||
Contact Us
|
||||
</a>
|
||||
{% endblock %}
|
||||
</div>
|
||||
|
||||
{% block extra_content %}{% endblock %}
|
||||
|
||||
<div class="support-link">
|
||||
{# Support Link #}
|
||||
<div class="mt-10 pt-8 border-t border-gray-200 text-sm text-gray-500">
|
||||
{% block support_link %}
|
||||
Need help? <a href="{{ base_url }}shop/contact">Contact our support team</a>
|
||||
Need help? <a href="{{ base_url }}shop/contact" class="text-theme-primary font-semibold hover:underline">Contact our support team</a>
|
||||
{% endblock %}
|
||||
</div>
|
||||
|
||||
{# Vendor Info #}
|
||||
{% if vendor %}
|
||||
<div class="vendor-info">
|
||||
<div class="mt-8 text-sm text-gray-400">
|
||||
{{ vendor.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user