Files
orion/static/admin/js/content-pages.js
Samir Boulahtit 3d3b8cae22 feat: add platform detail/edit admin UI and service enhancements
- Add platform detail and edit admin pages with templates and JS
- Add ContentPageService methods: list_all_platform_pages, list_all_vendor_defaults
- Deprecate /admin/platform-homepage route (redirects to /admin/platforms)
- Add migration to fix content_page nullable columns
- Refine platform and vendor context middleware
- Add platform context middleware unit tests
- Update platforms.js with improved functionality
- Add section-based homepage plan documentation

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-23 14:08:02 +01:00

267 lines
10 KiB
JavaScript

// noqa: js-006 - async init pattern is safe, loadData has try/catch
// static/admin/js/content-pages.js
// Use centralized logger
const contentPagesLog = window.LogConfig.loggers.contentPages || window.LogConfig.createLogger('contentPages');
// ============================================
// CONTENT PAGES MANAGER FUNCTION
// ============================================
function contentPagesManager() {
return {
// Inherit base layout functionality from init-alpine.js
...data(),
// Page identifier for sidebar active state
currentPage: 'content-pages',
// Content pages specific state
allPages: [],
platforms: [],
loading: false,
error: null,
// Tabs and filters
activeTab: 'all', // all, platform_marketing, vendor_defaults, vendor_overrides
searchQuery: '',
selectedPlatform: '', // Platform code filter
// Initialize
async init() {
contentPagesLog.info('=== CONTENT PAGES MANAGER INITIALIZING ===');
// Prevent multiple initializations
if (window._contentPagesInitialized) {
contentPagesLog.warn('Content pages manager already initialized, skipping...');
return;
}
window._contentPagesInitialized = true;
contentPagesLog.group('Loading data');
await Promise.all([
this.loadPages(),
this.loadPlatforms()
]);
contentPagesLog.groupEnd();
// Check for platform filter in URL (support both 'platform' and 'platform_code')
const urlParams = new URLSearchParams(window.location.search);
const platformParam = urlParams.get('platform_code') || urlParams.get('platform');
if (platformParam) {
this.selectedPlatform = platformParam;
}
// Check for slug param - if specified, redirect to edit page
const slugParam = urlParams.get('slug');
if (slugParam && platformParam) {
await this.redirectToEditIfSlugMatches(platformParam, slugParam);
}
contentPagesLog.info('=== CONTENT PAGES MANAGER INITIALIZATION COMPLETE ===');
},
// Computed: Platform Marketing pages (is_platform_page=true, vendor_id=null)
get platformMarketingPages() {
return this.allPages.filter(page => page.is_platform_page && !page.vendor_id);
},
// Computed: Vendor Default pages (is_platform_page=false, vendor_id=null)
get vendorDefaultPages() {
return this.allPages.filter(page => !page.is_platform_page && !page.vendor_id);
},
// Computed: Vendor Override pages (vendor_id is set)
get vendorOverridePages() {
return this.allPages.filter(page => page.vendor_id);
},
// Legacy computed (for backward compatibility)
get platformPages() {
return [...this.platformMarketingPages, ...this.vendorDefaultPages];
},
get vendorPages() {
return this.vendorOverridePages;
},
// Computed: Filtered pages based on active tab, platform, and search
get filteredPages() {
let pages = [];
// Filter by tab (three-tier system)
if (this.activeTab === 'platform_marketing') {
pages = this.platformMarketingPages;
} else if (this.activeTab === 'vendor_defaults') {
pages = this.vendorDefaultPages;
} else if (this.activeTab === 'vendor_overrides') {
pages = this.vendorOverridePages;
} else {
pages = this.allPages;
}
// Filter by selected platform
if (this.selectedPlatform) {
pages = pages.filter(page =>
page.platform_code === this.selectedPlatform
);
}
// Filter by search query
if (this.searchQuery) {
const query = this.searchQuery.toLowerCase();
pages = pages.filter(page =>
page.title.toLowerCase().includes(query) ||
page.slug.toLowerCase().includes(query) ||
(page.vendor_name && page.vendor_name.toLowerCase().includes(query)) ||
(page.platform_name && page.platform_name.toLowerCase().includes(query))
);
}
// Sort by display_order, then title
return pages.sort((a, b) => {
if (a.display_order !== b.display_order) {
return a.display_order - b.display_order;
}
return a.title.localeCompare(b.title);
});
},
// Load all content pages
async loadPages() {
this.loading = true;
this.error = null;
try {
contentPagesLog.info('Fetching all content pages...');
// Fetch all pages (platform + vendor, published + unpublished)
const response = await apiClient.get('/admin/content-pages/?include_unpublished=true');
contentPagesLog.debug('API Response:', response);
if (!response) {
throw new Error('Invalid API response');
}
// Handle response - API returns array directly
this.allPages = Array.isArray(response) ? response : (response.data || response.items || []);
contentPagesLog.info(`Loaded ${this.allPages.length} pages`);
} catch (err) {
contentPagesLog.error('Error loading content pages:', err);
this.error = err.message || 'Failed to load content pages';
} finally {
this.loading = false;
}
},
// Load platforms for filter dropdown
async loadPlatforms() {
try {
contentPagesLog.info('Fetching platforms...');
const response = await apiClient.get('/admin/platforms');
this.platforms = response.platforms || [];
contentPagesLog.info(`Loaded ${this.platforms.length} platforms`);
} catch (err) {
contentPagesLog.error('Error loading platforms:', err);
// Non-critical - don't set error state
}
},
// Redirect to edit page if a specific slug is requested
async redirectToEditIfSlugMatches(platformCode, slug) {
contentPagesLog.info(`Looking for page with platform=${platformCode}, slug=${slug}`);
// Find the page matching the platform and slug
const matchingPage = this.allPages.find(page =>
page.platform_code === platformCode && page.slug === slug
);
if (matchingPage) {
contentPagesLog.info(`Found matching page: ${matchingPage.id}, redirecting to edit...`);
window.location.href = `/admin/content-pages/${matchingPage.id}/edit`;
} else {
contentPagesLog.warn(`No page found for platform=${platformCode}, slug=${slug}`);
// Show a toast and offer to create
if (slug === 'home') {
// Offer to create homepage
if (confirm(`No homepage found for ${platformCode}. Would you like to create one?`)) {
window.location.href = `/admin/content-pages/create?platform_code=${platformCode}&slug=home&is_platform_page=true`;
}
}
}
},
// Get page tier label (three-tier system)
getPageTierLabel(page) {
if (page.vendor_id) {
return 'Vendor Override';
} else if (page.is_platform_page) {
return 'Platform Marketing';
} else {
return 'Vendor Default';
}
},
// Get page tier CSS class (three-tier system)
getPageTierClass(page) {
if (page.vendor_id) {
// Vendor Override - purple
return 'bg-purple-100 text-purple-800 dark:bg-purple-900 dark:text-purple-200';
} else if (page.is_platform_page) {
// Platform Marketing - blue
return 'bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200';
} else {
// Vendor Default - teal
return 'bg-teal-100 text-teal-800 dark:bg-teal-900 dark:text-teal-200';
}
},
// Delete a page
async deletePage(page) {
if (!confirm(`Are you sure you want to delete "${page.title}"?`)) {
return;
}
try {
contentPagesLog.info(`Deleting page: ${page.id}`);
await apiClient.delete(`/admin/content-pages/${page.id}`);
// Remove from local array
this.allPages = this.allPages.filter(p => p.id !== page.id);
contentPagesLog.info('Page deleted successfully');
} catch (err) {
contentPagesLog.error('Error deleting page:', err);
Utils.showToast(`Failed to delete page: ${err.message}`, 'error');
}
},
// Format date helper
formatDate(dateString) {
if (!dateString) return '—';
const date = new Date(dateString);
const now = new Date();
const diffMs = now - date;
const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24));
if (diffDays === 0) {
return 'Today';
} else if (diffDays === 1) {
return 'Yesterday';
} else if (diffDays < 7) {
return `${diffDays} days ago`;
} else {
return date.toLocaleDateString('en-US', {
year: 'numeric',
month: 'short',
day: 'numeric'
});
}
}
};
}