// static/store/js/content-page-edit.js // Use centralized logger const contentPageEditLog = window.LogConfig.loggers.contentPageEdit || window.LogConfig.createLogger('contentPageEdit'); // ============================================ // STORE CONTENT PAGE EDITOR // ============================================ function storeContentPageEditor(pageId) { return { // Inherit base layout functionality from init-alpine.js ...data(), // Page identifier for sidebar active state currentPage: 'content-pages', // Editor state pageId: pageId, isOverride: false, form: { slug: '', title: '', content: '', content_format: 'html', meta_description: '', meta_keywords: '', is_published: false, show_in_header: false, show_in_footer: true, show_in_legal: false, display_order: 0 }, loading: false, saving: false, error: null, successMessage: null, // Default preview modal state showingDefaultPreview: false, loadingDefault: false, defaultContent: null, // Delete confirmation modal state showDeletePageConfirm: false, // Initialize async init() { // Prevent multiple initializations if (window._storeContentPageEditInitialized) { contentPageEditLog.warn('Content page editor already initialized, skipping...'); return; } window._storeContentPageEditInitialized = true; // IMPORTANT: Call parent init first to set storeCode from URL const parentInit = data().init; if (parentInit) { await parentInit.call(this); } try { contentPageEditLog.info('=== STORE CONTENT PAGE EDITOR INITIALIZING ==='); contentPageEditLog.info('Page ID:', this.pageId); if (this.pageId) { // Edit mode - load existing page contentPageEditLog.group('Loading page for editing'); await this.loadPage(); contentPageEditLog.groupEnd(); } else { // Create mode - use default values contentPageEditLog.info('Create mode - using default form values'); } contentPageEditLog.info('=== STORE CONTENT PAGE EDITOR INITIALIZATION COMPLETE ==='); } catch (error) { contentPageEditLog.error('Failed to initialize content page editor:', error); } }, // Load existing page async loadPage() { this.loading = true; this.error = null; try { contentPageEditLog.info(`Fetching page ${this.pageId}...`); // Use the store API to get page by ID // We need to get the page details - use overrides endpoint and find by ID const response = await apiClient.get('/store/content-pages/overrides'); const pages = response.data || response || []; const page = pages.find(p => p.id === this.pageId); if (!page) { throw new Error('Page not found or you do not have access to it'); } contentPageEditLog.debug('Page data:', page); this.isOverride = page.is_store_override || false; this.form = { slug: page.slug || '', title: page.title || '', content: page.content || '', content_format: page.content_format || 'html', meta_description: page.meta_description || '', meta_keywords: page.meta_keywords || '', is_published: page.is_published || false, show_in_header: page.show_in_header || false, show_in_footer: page.show_in_footer !== undefined ? page.show_in_footer : true, show_in_legal: page.show_in_legal || false, display_order: page.display_order || 0 }; contentPageEditLog.info('Page loaded successfully'); } catch (err) { contentPageEditLog.error('Error loading page:', err); this.error = err.message || 'Failed to load page'; } finally { this.loading = false; } }, // Save page (create or update) async savePage() { if (this.saving) return; this.saving = true; this.error = null; this.successMessage = null; try { contentPageEditLog.info(this.pageId ? 'Updating page...' : 'Creating page...'); const payload = { slug: this.form.slug, title: this.form.title, content: this.form.content, content_format: this.form.content_format, meta_description: this.form.meta_description, meta_keywords: this.form.meta_keywords, is_published: this.form.is_published, show_in_header: this.form.show_in_header, show_in_footer: this.form.show_in_footer, show_in_legal: this.form.show_in_legal, display_order: this.form.display_order }; contentPageEditLog.debug('Payload:', payload); let response; if (this.pageId) { // Update existing page response = await apiClient.put(`/store/content-pages/${this.pageId}`, payload); this.successMessage = 'Page updated successfully!'; contentPageEditLog.info('Page updated'); } else { // Create new page response = await apiClient.post('/store/content-pages/', payload); this.successMessage = 'Page created successfully!'; contentPageEditLog.info('Page created'); // Redirect to edit page after creation const pageData = response.data || response; if (pageData && pageData.id) { setTimeout(() => { window.location.href = `/store/${this.storeCode}/content-pages/${pageData.id}/edit`; }, 1500); } } // Clear success message after 3 seconds setTimeout(() => { this.successMessage = null; }, 3000); } catch (err) { contentPageEditLog.error('Error saving page:', err); this.error = err.message || 'Failed to save page'; // Scroll to top to show error window.scrollTo({ top: 0, behavior: 'smooth' }); } finally { this.saving = false; } }, // Show default content preview async showDefaultPreview() { this.showingDefaultPreview = true; this.loadingDefault = true; this.defaultContent = null; try { contentPageEditLog.info('Loading platform default for slug:', this.form.slug); const response = await apiClient.get(`/store/content-pages/platform-default/${this.form.slug}`); this.defaultContent = response.data || response; contentPageEditLog.info('Default content loaded'); } catch (err) { contentPageEditLog.error('Error loading default content:', err); this.defaultContent = { title: 'Error', content: `

Failed to load platform default: ${err.message}

` }; } finally { this.loadingDefault = false; } }, // Delete page (revert to default for overrides) async deletePage() { try { contentPageEditLog.info('Deleting page:', this.pageId); await apiClient.delete(`/store/content-pages/${this.pageId}`); // Redirect back to list window.location.href = `/store/${this.storeCode}/content-pages`; } catch (err) { contentPageEditLog.error('Error deleting page:', err); this.error = err.message || 'Failed to delete page'; } } }; }