Update app.py

app.py

@@ -1,49 +1,120 @@
+import streamlit as st
 import requests
 import re
 import json
 from datetime import datetime
+from PIL import Image
+import io
 import os
-import gradio as gr
 from dotenv import load_dotenv
 
+# ========== PAGE CONFIGURATION ==========
+st.set_page_config(
+    page_title="CdGarment WordPress Publisher",
+    page_icon="🏭",
+    layout="wide",
+    initial_sidebar_state="collapsed"
+)
+
+# ========== CUSTOM CSS ==========
+st.markdown("""
+<style>
+    .main {
+        padding: 2rem;
+    }
+    .main-header {
+        font-size: 2.8rem;
+        font-weight: 800;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        -webkit-background-clip: text;
+        -webkit-text-fill-color: transparent;
+        text-align: center;
+        margin-bottom: 0.5rem;
+    }
+    .paste-box {
+        border: 2px solid #3B82F6;
+        border-radius: 10px;
+        padding: 1.5rem;
+        background-color: #F8FAFC;
+        height: 500px;
+    }
+    .image-preview {
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+        border: 2px solid #E5E7EB;
+        max-height: 200px;
+        width: 100%;
+        object-fit: cover;
+    }
+    .publish-btn {
+        background: linear-gradient(135deg, #059669 0%, #10B981 100%);
+        color: white;
+        font-size: 1.5rem;
+        font-weight: 700;
+        padding: 1.2rem;
+        border: none;
+        border-radius: 12px;
+        width: 100%;
+        cursor: pointer;
+        transition: all 0.3s ease;
+        box-shadow: 0 6px 20px rgba(16, 185, 129, 0.3);
+        margin-top: 1.5rem;
+    }
+    .publish-btn:hover {
+        transform: translateY(-3px);
+        box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4);
+    }
+    .publish-btn:disabled {
+        background: linear-gradient(135deg, #9CA3AF 0%, #6B7280 100%);
+        cursor: not-allowed;
+        transform: none;
+        box-shadow: none;
+    }
+    .rank-math-badge {
+        background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
+        color: #991B1B;
+        padding: 0.5rem 1rem;
+        border-radius: 20px;
+        font-weight: 600;
+        display: inline-block;
+        margin-bottom: 1rem;
+    }
+</style>
+""", unsafe_allow_html=True)
+
+# ========== INITIALIZE SESSION STATE ==========
+for key in ['parsed_data', 'uploaded_image', 'wp_config', 'post_status', 'wp_config_locked', 'env_loaded']:
+    if key not in st.session_state:
+        if key == 'wp_config_locked':
+            st.session_state[key] = False
+        elif key == 'env_loaded':
+            st.session_state[key] = False
+        elif key == 'wp_config':
+            st.session_state[key] = {}
+        elif key == 'post_status':
+            st.session_state[key] = 'draft'
+        else:
+            st.session_state[key] = None
+
 # ========== LOAD ENVIRONMENT VARIABLES ==========
-def load_environment_variables():
-    """Load environment variables for both local and Hugging Face"""
-    # For Hugging Face Spaces (use environment variables)
-    huggingface_url = os.environ.get('WORDPRESS_URL')
-    huggingface_username = os.environ.get('WORDPRESS_USERNAME')
-    huggingface_password = os.environ.get('WORDPRESS_APP_PASSWORD')
-    huggingface_status = os.environ.get('DEFAULT_STATUS')
-    
-    # If Hugging Face env vars exist, use them
-    if huggingface_url and huggingface_username:
-        return {
-            'url': huggingface_url,
-            'username': huggingface_username,
-            'password': huggingface_password or '',
-            'status': huggingface_status or 'draft'
-        }
-    
-    # Fallback to local .env file for development
+if not st.session_state.env_loaded:
     try:
         load_dotenv(dotenv_path='rank_cd.env')
-        return {
-            'url': os.getenv('WORDPRESS_URL', 'https://cdgarment.com'),
-            'username': os.getenv('WORDPRESS_USERNAME', ''),
-            'password': os.getenv('WORDPRESS_APP_PASSWORD', ''),
-            'status': os.getenv('DEFAULT_STATUS', 'draft')
-        }
+        # Initialize wp_config from env if not already set
+        if not st.session_state.wp_config:
+            st.session_state.wp_config = {
+                'url': os.getenv('WORDPRESS_URL', 'https://cdgarment.com'),
+                'username': os.getenv('WORDPRESS_USERNAME', ''),
+                'password': os.getenv('WORDPRESS_APP_PASSWORD', ''),
+                'status': os.getenv('DEFAULT_STATUS', 'draft')
+            }
+        st.session_state.env_loaded = True
     except Exception as e:
-        print(f"Could not load rank_cd.env: {str(e)}")
-        return {
-            'url': 'https://cdgarment.com',
-            'username': '',
-            'password': '',
-            'status': 'draft'
-        }
+        st.warning(f"Could not load rank_cd.env: {str(e)}")
 
 # ========== FUNCTIONS ==========
-def parse_gemini_content(content, post_status='draft'):
+def parse_gemini_content(content):
     """Parse Gemini content for cdgarment.com with Rank Math"""
     data = {
         'seo_title': '',
@@ -57,66 +128,35 @@ def parse_gemini_content(content, post_status='draft'):
     }
     
     try:
-        # Clean content
-        content = re.sub(r'\r\n', '\n', content)
-        content = re.sub(r'\n\s*\n', '\n\n', content)
-        
         # Extract SEO Title
-        seo_title_match = re.search(r'SEO\s*Title\s*:?\s*(.+?)(?=\n|$)', content, re.IGNORECASE | re.DOTALL)
+        seo_title_match = re.search(r'SEO Title:\s*(.+?)(?=\n)', content)
         if seo_title_match:
             data['seo_title'] = seo_title_match.group(1).strip()
         
         # Extract Primary Keyword
-        keyword_match = re.search(r'Primary\s*Keyword\s*:?\s*(.+?)(?=\n|$)', content, re.IGNORECASE | re.DOTALL)
+        keyword_match = re.search(r'Primary Keyword:\s*(.+?)(?=\n)', content)
         if keyword_match:
             data['primary_keyword'] = keyword_match.group(1).strip()
         
         # Extract Meta Description
-        meta_match = re.search(r'Meta\s*Description\s*:?\s*(.+?)(?=\n\s*\n|\nCharacter|\nTags|\n---|$)', content, re.IGNORECASE | re.DOTALL)
+        meta_match = re.search(r'Meta Description:\s*(.+?)(?=\n)', content)
         if meta_match:
             data['meta_description'] = meta_match.group(1).strip()
         
         # Extract Tags
-        tags_patterns = [
-            r'Tags\s*:?\s*(.+?)(?=\n\s*\n|\n---|\n##|\n📝|$)',  # Tags: on same line
-            r'Tags\s*\n(.+?)(?=\n\s*\n|\n---|\n##|$)'  # Tags on one line, actual tags on next
-        ]
-        
-        tags_str = ""
-        for pattern in tags_patterns:
-            tags_match = re.search(pattern, content, re.IGNORECASE | re.DOTALL)
-            if tags_match:
-                tags_str = tags_match.group(1).strip()
-                break
-        
-        if tags_str:
-            # Clean and split tags
-            tags_list = []
-            for tag in re.split(r'[,;\n]', tags_str):
-                cleaned_tag = tag.strip()
-                if cleaned_tag and cleaned_tag.lower() not in ['', 'tags', 'tags:']:
-                    tags_list.append(cleaned_tag)
-            data['tags'] = tags_list
+        tags_match = re.search(r'Tags:\s*(.+?)(?=\n|📝)', content)
+        if tags_match:
+            tags_str = tags_match.group(1).strip()
+            data['tags'] = [tag.strip() for tag in re.split(r'[,;]', tags_str) if tag.strip()]
         
         # Extract Article Content
-        content_patterns = [
-            r'---\s*\n(.+?)(?=\n##\s|\n###\s|\nConclusion:|$)',  # After ---
-            r'📝\s*Article[^\n]*\n(.+?)(?=\n##\s|\n###\s|\nConclusion:|$)',  # After emoji
-            r'##\s+(.+?)(?=\n##\s|\n###\s|\nConclusion:|$)'  # After heading
-        ]
-        
-        for pattern in content_patterns:
-            article_match = re.search(pattern, content, re.DOTALL)
-            if article_match:
-                full_content = article_match.group(1).strip()
-                lines = full_content.split('\n')
-                if lines:
-                    # Remove markdown heading markers if present
-                    title = lines[0].strip()
-                    title = re.sub(r'^#+\s*', '', title)
-                    data['article_title'] = title
-                    data['content'] = '\n'.join(lines[1:])
-                break
+        article_match = re.search(r'(?:📝|▶|●|◆).*?(?:Article|Content)[:\-]?\s*(.+)', content, re.DOTALL)
+        if article_match:
+            full_content = article_match.group(1).strip()
+            lines = full_content.split('\n')
+            if lines:
+                data['article_title'] = lines[0].strip()
+                data['content'] = '\n'.join(lines[1:])
         
         # Generate URL slug
         if data['seo_title']:
@@ -129,11 +169,11 @@ def parse_gemini_content(content, post_status='draft'):
         if not data['seo_title'] and data['article_title']:
             data['seo_title'] = data['article_title']
         
-        # Prepare Rank Math meta fields
+        # Prepare Rank Math meta fields (based on your screenshot)
         data['rank_math_meta'] = {
             'rank_math_title': data['seo_title'],
             'rank_math_description': data['meta_description'],
-            'rank_math_robots': ['index'] if post_status == 'publish' else ['noindex'],
+            'rank_math_robots': ['index'] if st.session_state.post_status == 'publish' else ['noindex'],
             'rank_math_news_sitemap_robots': 'index',
             'rank_math_facebook_title': data['seo_title'],
             'rank_math_facebook_description': data['meta_description'],
@@ -142,35 +182,26 @@ def parse_gemini_content(content, post_status='draft'):
             'rank_math_canonical_url': '',
         }
         
-        # Add primary keyword if available
+        # If we have primary keyword, add it (though not in your screenshot)
         if data['primary_keyword']:
             data['rank_math_meta']['rank_math_focus_keyword'] = data['primary_keyword']
         
         return data
         
     except Exception as e:
-        print(f"Error parsing: {str(e)}")
-        return {'error': f"Error parsing: {str(e)}"}
+        st.error(f"Error parsing: {str(e)}")
+        return None
 
 def upload_image_to_wordpress(image_file, wp_config, filename_slug):
     """Upload image to WordPress with auto-naming"""
     try:
-        # Handle file path from Gradio
-        if isinstance(image_file, str):
-            with open(image_file, 'rb') as f:
-                image_data = f.read()
-            file_extension = image_file.split('.')[-1].lower()
-        else:
-            # Handle file object
-            image_data = image_file.read()
-            file_extension = image_file.name.split('.')[-1].lower()
-        
         # Generate filename from slug
+        file_extension = image_file.name.split('.')[-1].lower()
         filename = f"{filename_slug}.{file_extension}"
         
         # Prepare image data
         files = {
-            'file': (filename, image_data, f'image/{file_extension}')
+            'file': (filename, image_file.getvalue(), f'image/{file_extension}')
         }
         
         auth = (wp_config['username'], wp_config['password'])
@@ -198,14 +229,14 @@ def upload_image_to_wordpress(image_file, wp_config, filename_slug):
             
             return media_data['id']
         else:
-            print(f"Image upload failed: {response.text}")
+            st.error(f"Image upload failed: {response.text}")
             return None
             
     except Exception as e:
-        print(f"Error uploading image: {str(e)}")
+        st.error(f"Error uploading image: {str(e)}")
         return None
 
-def create_wordpress_post(parsed_data, wp_config, media_id=None, post_status='draft'):
+def create_wordpress_post(parsed_data, wp_config, media_id=None):
     """Create WordPress post with Rank Math meta"""
     try:
         # Base post data
@@ -213,7 +244,7 @@ def create_wordpress_post(parsed_data, wp_config, media_id=None, post_status='dr
             'title': parsed_data['seo_title'],
             'content': parsed_data['content'],
             'slug': parsed_data['url_slug'],
-            'status': post_status,
+            'status': st.session_state.post_status,
             'meta': parsed_data['rank_math_meta']
         }
         
@@ -267,99 +298,318 @@ def create_wordpress_post(parsed_data, wp_config, media_id=None, post_status='dr
             
             return post_result
         else:
-            print(f"Post creation failed: {response.text}")
             return None
             
     except Exception as e:
-        print(f"Error creating post: {str(e)}")
+        st.error(f"Error creating post: {str(e)}")
         return None
 
-# ========== GRADIO UI FUNCTIONS ==========
-def parse_content(gemini_content, post_status):
-    """Parse Gemini content and return preview"""
-    if not gemini_content or not gemini_content.strip():
-        return "Please paste content first", "", "", "", "", "", "", {}
+# ========== STREAMLIT UI ==========
+# Header
+st.markdown('<h1 class="main-header">🏭 CdGarment WordPress Publisher</h1>', unsafe_allow_html=True)
+st.markdown('<div class="rank-math-badge">✓ Optimized for Rank Math SEO</div>', unsafe_allow_html=True)
+
+# Two main columns
+col1, col2 = st.columns([2, 1], gap="large")
+
+# ========== LEFT COLUMN: CONTENT ==========
+with col1:
+    st.markdown('<div class="paste-box">', unsafe_allow_html=True)
+    
+    st.markdown("### 📋 Paste Gemini Content")
+    st.caption("Include SEO package and article")
+    
+    # Example content
+    example_content = """SEO Toolkit: Article #20
+Element Suggestion 
+Primary Keyword: Apparel ODM Design Services
+SEO Title: The Creative Engine: Inside CdGarment's Powerful R&D Team for ODM Success
+Meta Description: Elevate your brand with CdGarment's R&D team. We provide expert ODM services, from trend analysis to prototype development, ensuring your vision becomes reality.
+Tags: apparel ODM partner, fashion R&D team, original design manufacturer, garment prototype development, CdGarment R&D, fashion trend development
+📝 Article #20: Full Content
+The Creative Engine: How CdGarment's R&D Team Powers Global ODM Success...
+
+[Paste your complete Gemini output here]"""
+    
+    gemini_content = st.text_area(
+        "Paste your Gemini output below:",
+        height=350,
+        value=example_content,
+        label_visibility="collapsed",
+        placeholder="Paste your complete Gemini output here with all formatting",
+        help="Formatting will be preserved exactly as pasted"
+    )
+    
+    # Parse button
+    if st.button("🔍 Parse Content", type="primary", use_container_width=True):
+        if gemini_content.strip():
+            with st.spinner("Parsing content and preparing Rank Math meta..."):
+                parsed = parse_gemini_content(gemini_content)
+                if parsed:
+                    st.session_state.parsed_data = parsed
+                    st.success(f"✅ Parsed: {parsed['seo_title']}")
+                else:
+                    st.error("❌ Could not parse content")
+        else:
+            st.warning("Please paste content first")
+    
+    st.markdown('</div>', unsafe_allow_html=True)
+
+# ========== RIGHT COLUMN: IMAGE & SETTINGS ==========
+with col2:
+    st.markdown("### 🖼️ Image & Upload")
+    
+    # Image preview box (always visible, empty when no image)
+    st.markdown("**📷 Image Preview**")
+    
+    # Empty preview area with border
+    if 'uploaded_image' not in st.session_state or not st.session_state.uploaded_image:
+        # Show empty preview box
+        st.markdown(
+            '<div style="border: 2px dashed #8B5CF6; border-radius: 10px; padding: 2rem; text-align: center; background-color: #FAF5FF;">'
+            '<div style="font-size: 3rem; margin-bottom: 1rem;">📁</div>'
+            '<div style="color: #6B7280;">No image uploaded yet</div>'
+            '</div>',
+            unsafe_allow_html=True
+        )
+    else:
+        # Show image preview
+        st.image(
+            st.session_state.uploaded_image,
+            width=200,
+            use_column_width=False
+        )
     
-    parsed = parse_gemini_content(gemini_content, post_status)
+    # Image upload button
+    uploaded_image = st.file_uploader(
+        "Upload image",
+        type=['jpg', 'jpeg', 'png', 'gif', 'webp'],
+        help="Image will be automatically named and added to post",
+        label_visibility="collapsed"
+    )
     
-    if 'error' in parsed:
-        return parsed['error'], "", "", "", "", "", "", {}
+    # Handle image upload
+    if uploaded_image:
+        st.session_state.uploaded_image = uploaded_image
+        st.rerun()  # Refresh to show the preview
+    
+    # Image description field
+    st.markdown("**🖋️ Image Description**")
+    image_description = st.text_area(
+        "Image description",
+        height=100,
+        placeholder="Auto-generated description will appear here",
+        label_visibility="collapsed"
+    )
     
-    # Ensure all fields exist
-    parsed.setdefault('seo_title', 'No title')
-    parsed.setdefault('meta_description', '')
-    parsed.setdefault('primary_keyword', '')
-    parsed.setdefault('tags', [])
-    parsed.setdefault('content', '')
-    parsed.setdefault('url_slug', '')
+    st.markdown("---")
+    st.markdown("### ⚙️ WordPress Settings")
     
-    # Format tags for display
-    if parsed['tags'] and len(parsed['tags']) > 0:
-        tags_display = ", ".join(parsed['tags'][:8])
-    else:
-        tags_display = "No tags found in content"
+    # Get current values from session state
+    current_config = st.session_state.wp_config or {
+        'url': 'https://cdgarment.com',
+        'username': '',
+        'password': '',
+        'status': 'draft'
+    }
     
-    # Format meta description preview
-    if parsed['meta_description']:
-        meta_preview = parsed['meta_description'][:120] + "..." if len(parsed['meta_description']) > 120 else parsed['meta_description']
-    else:
-        meta_preview = "No meta description found"
+    # Lock/Unlock toggle
+    col_lock, col_spacer = st.columns([1, 4])
+    with col_lock:
+        st.session_state.wp_config_locked = st.toggle(
+            "🔒",
+            value=st.session_state.wp_config_locked,
+            help="Lock/Unlock configuration"
+        )
     
-    return (
-        f"✅ Parsed: {parsed['seo_title'][:50]}..." if len(parsed['seo_title']) > 50 else f"✅ Parsed: {parsed['seo_title']}",
-        parsed['seo_title'] or "No title extracted",
-        parsed['url_slug'] or "No slug generated",
-        meta_preview,
-        parsed['primary_keyword'] or "No primary keyword",
-        tags_display,
-        f"Content Length: {len(parsed['content'])} characters",
-        parsed
+    # WordPress configuration
+    wp_url = st.text_input(
+        "WordPress URL",
+        value=current_config['url'],
+        help="Your WordPress site URL",
+        disabled=st.session_state.wp_config_locked
     )
-
-def publish_post(parsed_data, wp_config, image_file, post_status, wp_url, wp_username, wp_password):
-    """Publish post to WordPress"""
-    if not parsed_data:
-        yield "❌ No parsed content available. Please parse content first.", None
-        return
     
-    # Use stored config or provided inputs
-    if not wp_config:
-        wp_config = {
-            'url': wp_url.rstrip('/') if wp_url else '',
-            'username': wp_username,
-            'password': wp_password,
-            'status': post_status
-        }
+    wp_username = st.text_input(
+        "Username",
+        value=current_config['username'],
+        placeholder="admin",
+        help="WordPress username",
+        disabled=st.session_state.wp_config_locked
+    )
     
-    # Validate config
-    if not all([wp_config['url'], wp_config['username'], wp_config['password']]):
-        yield "❌ WordPress configuration incomplete. Please provide URL, username, and password.", None
-        return
+    wp_password = st.text_input(
+        "Application Password",
+        value=current_config['password'],
+        type="password",
+        placeholder="••••••••",
+        help="From WordPress: Users → Profile → Application Passwords",
+        disabled=st.session_state.wp_config_locked
+    )
+    
+    # Post status
+    post_status = st.selectbox(
+        "Post Status",
+        options=["draft", "publish"],
+        index=0 if current_config.get('status') == 'draft' else 1,
+        help="Set whether the post should be a draft or immediately published"
+    )
+    st.session_state.post_status = post_status
+    
+    # Save button
+    if not st.session_state.wp_config_locked:
+        if st.button("💾 Save Configuration", use_container_width=True):
+            st.session_state.wp_config = {
+                'url': wp_url,
+                'username': wp_username,
+                'password': wp_password,
+                'status': post_status
+            }
+            st.success("Configuration saved!")
+
+# ========== PREVIEW SECTION ==========
+if st.session_state.parsed_data:
+    st.markdown("---")
+    st.markdown("### 👁️ Preview")
+    
+    parsed = st.session_state.parsed_data
+    
+    # Show extracted data
+    col_pre1, col_pre2, col_pre3 = st.columns(3)
+    
+    with col_pre1:
+        st.markdown("**SEO Title**")
+        st.info(parsed['seo_title'])
+        
+        st.markdown("**URL Slug**")
+        st.code(parsed['url_slug'])
+    
+    with col_pre2:
+        st.markdown("**Meta Description**")
+        st.text(parsed['meta_description'][:100] + "..." if len(parsed['meta_description']) > 100 else parsed['meta_description'])
+        
+        st.markdown("**Primary Keyword**")
+        st.success(parsed['primary_keyword'])
+    
+    with col_pre3:
+        st.markdown("**Tags**")
+        tags_html = ""
+        for tag in parsed['tags'][:4]:
+            tags_html += f'<span style="background:#E5E7EB; padding:0.25rem 0.75rem; border-radius:12px; margin-right:0.5rem; font-size:0.9rem;">{tag}</span>'
+        st.markdown(tags_html, unsafe_allow_html=True)
+        
+        st.markdown(f"**Content Length:** {len(parsed['content'])} chars")
+    
+    # Rank Math meta preview
+    with st.expander("🔴 Rank Math Meta Fields (Will be set)"):
+        for key, value in parsed['rank_math_meta'].items():
+            st.write(f"**{key}:**")
+            st.code(str(value)[:200] + "..." if len(str(value)) > 200 else str(value))
+
+# ========== PUBLISH SECTION ==========
+st.markdown("---")
+st.markdown("### 🚀 Ready to Publish")
+
+# Status indicators
+status_cols = st.columns(4)
+
+with status_cols[0]:
+    status_content = "✅ Content" if st.session_state.parsed_data else "❌ Content"
+    st.markdown(f"**{status_content}**")
+
+with status_cols[1]:
+    status_image = "✅ Image" if st.session_state.uploaded_image else "⚠️ Image Optional"
+    st.markdown(f"**{status_image}**")
+
+# Check config status using stored config or current inputs
+config_ready = False
+if st.session_state.wp_config:
+    config_ready = all([
+        st.session_state.wp_config.get('url'),
+        st.session_state.wp_config.get('username'),
+        st.session_state.wp_config.get('password')
+    ])
+else:
+    config_ready = all([wp_url, wp_username, wp_password])
+
+with status_cols[2]:
+    status_wp = "✅ WordPress" if config_ready else "❌ WordPress"
+    st.markdown(f"**{status_wp}**")
+
+with status_cols[3]:
+    st.markdown(f"**📊 Status: {post_status.upper()}**")
+
+# Main publish button
+publish_disabled = not (st.session_state.parsed_data and config_ready)
+
+if st.button(
+    "🚀 PUSH TO WORDPRESS",
+    disabled=publish_disabled,
+    key="publish_button",
+    use_container_width=True
+):
+    # Show progress
+    progress_bar = st.progress(0)
+    status_text = st.empty()
     
     try:
-        yield "🖼️ Uploading image to WordPress...", None
+        # Use stored config or create from current inputs
+        if st.session_state.wp_config and all([
+            st.session_state.wp_config.get('url'),
+            st.session_state.wp_config.get('username'),
+            st.session_state.wp_config.get('password')
+        ]):
+            # Use existing stored config
+            pass
+        else:
+            # Save new config from current inputs
+            st.session_state.wp_config = {
+                'url': wp_url.rstrip('/'),
+                'username': wp_username,
+                'password': wp_password
+            }
         
         # Step 1: Upload image
         media_id = None
-        if image_file:
+        if uploaded_image:
+            status_text.text("🖼️ Uploading image to WordPress...")
             media_id = upload_image_to_wordpress(
-                image_file,
-                wp_config,
-                parsed_data['url_slug']
+                uploaded_image,
+                st.session_state.wp_config,
+                st.session_state.parsed_data['url_slug']
             )
-        
-        yield "📤 Creating post with Rank Math meta...", None
+            progress_bar.progress(40)
         
         # Step 2: Create post
+        status_text.text("📤 Creating post with Rank Math meta...")
         result = create_wordpress_post(
-            parsed_data,
-            wp_config,
-            media_id,
-            post_status
+            st.session_state.parsed_data,
+            st.session_state.wp_config,
+            media_id
         )
+        progress_bar.progress(80)
+        
+        # Step 3: Complete
+        progress_bar.progress(100)
+        status_text.text("✅ Complete!")
         
         if result:
-            # Create download data
+            # Success
+            st.balloons()
+            st.success(f"✅ Post published successfully! (ID: {result['id']})")
+            
+            # Show results
+            col_result = st.columns(2)
+            
+            with col_result[0]:
+                st.metric("Post ID", result['id'])
+                st.metric("Status", result['status'])
+            
+            with col_result[1]:
+                st.metric("Date", result['date'][:10])
+                st.link_button("View Post", result['link'])
+            
+            # Export data
             export_data = {
                 'post_id': result['id'],
                 'title': result['title']['rendered'],
@@ -369,518 +619,27 @@ def publish_post(parsed_data, wp_config, image_file, post_status, wp_url, wp_use
                 'published_at': datetime.now().isoformat()
             }
             
-            # Save JSON to file
-            json_file = f"post_{result['id']}.json"
-            with open(json_file, 'w') as f:
-                json.dump(export_data, f, indent=2)
-            
-            success_msg = f"""
-            ✅ Post published successfully!
-            
-            Post ID: {result['id']}
-            Status: {result['status']}
-            Date: {result['date'][:10]}
-            Link: {result['link']}
-            
-            Click the download button to get post data.
-            """
+            st.download_button(
+                "📥 Download Post Data",
+                data=json.dumps(export_data, indent=2),
+                file_name=f"post_{result['id']}.json",
+                mime="application/json",
+                use_container_width=True
+            )
             
-            yield success_msg, json_file
+            # Clear button for new post
+            if st.button("🔄 Create Another Post", use_container_width=True):
+                st.session_state.parsed_data = None
+                st.session_state.uploaded_image = None
+                st.rerun()
+                
         else:
-            yield "❌ Failed to publish post. Check WordPress configuration and try again.", None
+            st.error("❌ Failed to publish post")
             
     except Exception as e:
-        yield f"❌ Error: {str(e)}", None
-
-def clear_all():
-    """Clear all inputs"""
-    return (
-        "",  # gemini_content
-        None,  # image
-        "https://cdgarment.com",  # wp_url
-        "",  # wp_username
-        "",  # wp_password
-        "draft",  # post_status
-        "",  # parse_status
-        "",  # seo_title
-        "",  # url_slug
-        "",  # meta_description
-        "",  # primary_keyword
-        "",  # tags
-        "",  # content_length
-        "",  # publish_status
-        None,  # download_file
-    )
-
-# ========== CREATE GRADIO INTERFACE ==========
-with gr.Blocks(title="CdGarment WordPress Publisher") as demo:
-    
-    # State variables
-    parsed_data_state = gr.State(None)
-    wp_config_state = gr.State(None)
-    
-    # Header
-    gr.HTML("""
-    <div style="text-align: center; margin: 20px 0;">
-        <h1 style="
-            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            font-size: 2.5rem;
-            font-weight: 800;
-            margin-bottom: 10px;
-        ">🏭 CdGarment WordPress Publisher</h1>
-        <div style="
-            background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
-            color: #991B1B;
-            padding: 8px 16px;
-            border-radius: 20px;
-            font-weight: 600;
-            display: inline-block;
-            margin-bottom: 20px;
-        ">✓ Optimized for Rank Math SEO</div>
-    </div>
-    """)
-    
-    # Two main columns
-    with gr.Row():
-        with gr.Column(scale=2):
-            with gr.Group():
-                gr.Markdown("### 📋 Paste Gemini Content")
-                gr.Markdown("Include SEO package and article. Formatting preserved!")
-                
-                # Formatting toolbar
-                gr.HTML("""
-                <div style="background: #f8f9fa; padding: 10px; border-radius: 5px; margin-bottom: 10px; border: 1px solid #e9ecef;">
-                    <strong>Formatting:</strong>
-                    <button class="format-btn" data-wrap="# " data-type="H1" style="background: white; border: 1px solid #dee2e6; padding: 5px 10px; margin-right: 5px; border-radius: 4px; cursor: pointer;">H1</button>
-                    <button class="format-btn" data-wrap="## " data-type="H2" style="background: white; border: 1px solid #dee2e6; padding: 5px 10px; margin-right: 5px; border-radius: 4px; cursor: pointer;">H2</button>
-                    <button class="format-btn" data-wrap="**" data-type="Bold" style="background: white; border: 1px solid #dee2e6; padding: 5px 10px; margin-right: 5px; border-radius: 4px; cursor: pointer; font-weight: bold;">B</button>
-                    <button class="format-btn" data-wrap="*" data-type="Italic" style="background: white; border: 1px solid #dee2e6; padding: 5px 10px; margin-right: 5px; border-radius: 4px; cursor: pointer; font-style: italic;">I</button>
-                    <button class="format-btn" data-wrap="- " data-type="List" style="background: white; border: 1px solid #dee2e6; padding: 5px 10px; margin-right: 5px; border-radius: 4px; cursor: pointer;">• List</button>
-                </div>
-
-                <script>
-                function formatText(wrapText, type) {
-                    const textarea = document.querySelector('textarea[aria-label="Gemini Content"]');
-                    if (!textarea) return;
-                    
-                    const start = textarea.selectionStart;
-                    const end = textarea.selectionEnd;
-                    const selected = textarea.value.substring(start, end);
-                    
-                    if (selected) {
-                        textarea.value = textarea.value.substring(0, start) + wrapText + selected + wrapText + textarea.value.substring(end);
-                        textarea.selectionStart = start + wrapText.length;
-                        textarea.selectionEnd = end + wrapText.length;
-                    } else {
-                        textarea.value = textarea.value.substring(0, start) + wrapText + type + wrapText + textarea.value.substring(end);
-                        textarea.selectionStart = textarea.selectionEnd = start + wrapText.length + type.length;
-                    }
-                    textarea.focus();
-                    
-                    const event = new Event('input', { bubbles: true });
-                    textarea.dispatchEvent(event);
-                }
-
-                document.addEventListener('DOMContentLoaded', function() {
-                    const buttons = document.querySelectorAll('.format-btn');
-                    buttons.forEach(btn => {
-                        btn.addEventListener('click', function(e) {
-                            e.preventDefault();
-                            const wrap = this.getAttribute('data-wrap');
-                            const type = this.getAttribute('data-type');
-                            formatText(wrap, type);
-                        });
-                    });
-                });
-                </script>
-                """)
-                
-                # Markdown editor
-                example_content = """SEO Toolkit: Article #21
-
-Element
-Suggestion
-
-Primary Keyword
-Garment Supply Chain Security
-
-SEO Title
-Guaranteed Delivery: How CdGarment Solves the Global Sourcing Lead-Time Crisis
-
-Meta Description
-Eliminate delivery risks with CdGarment. Our advanced automated facilities and "In-Time" communication guarantee reliable lead times and supply chain security.
-
-Character Count
-156 Characters
-
-Tags
-reliable garment supplier, apparel lead time management, secure supply chain fashion, automated apparel production, CdGarment delivery guarantee
-
----
-
-## Guaranteed Delivery: Solving the Lead-Time Crisis Through Automation
-
-In 2026, the greatest risk to a fashion brand isn't design—it's **delivery**. Port delays, labor shortages, and manual production bottlenecks have made traditional "medium" manufacturers unreliable.
-
-CdGarment has solved this by rebuilding the manufacturing process around **Security and Stability**. When we commit to a date, our automated ecosystem ensures we meet it.
-
-### 1. Automation = Predictability
-
-Manual factories suffer from "human variance." If a worker is sick or a bundle is lost, the whole line stops.
+        st.error(f"Error: {str(e)}")
 
-- **The Hanging System Advantage**: Our automated system ensures a continuous flow.
-- **Buffer Management**: Our integrated bases allow us to shift production loads.
+# ========== FOOTER ==========
+st.markdown("---")
+st.caption(f"CdGarment WordPress Publisher • {datetime.now().year}")
 
-### 2. Real-Time Supply Chain Visibility
-
-Supply chain security comes from knowing, not guessing.
-
-- **Digital Tracking**: Every order is logged in our system.
-- **Proactive Logistics**: Our logistics team monitors global shipping lanes.
-
-### 3. Financial and Compliance Security
-
-A secure supplier is a compliant supplier. CdGarment maintains all global certifications."""
-
-                gemini_content = gr.Textbox(
-                    label="Gemini Content",
-                    value=example_content,
-                    lines=25,
-                    placeholder="""Paste your Gemini output here...
-
-Example format:
-SEO Title: Your Title Here
-Primary Keyword: Your Keyword
-Meta Description: Your description
-Tags: tag1, tag2, tag3
-
---- (or 📝 Article)
-
-## Article Title
-Your article content here...""",
-                    elem_classes="paste-box"
-                )
-                
-                with gr.Row():
-                    parse_btn = gr.Button("🔍 Parse Content", variant="primary", scale=2)
-                    clear_btn = gr.Button("🗑️ Clear", variant="secondary", scale=1)
-        
-        with gr.Column(scale=1):
-            # Image upload section
-            with gr.Group():
-                gr.Markdown("### 🖼️ Image & Upload")
-                image_input = gr.File(
-                    label="Upload Image",
-                    file_types=["image"],
-                    type="filepath"
-                )
-                image_preview = gr.Image(
-                    label="Image Preview",
-                    height=200,
-                    visible=False
-                )
-                image_description = gr.Textbox(
-                    label="Image Description",
-                    placeholder="Auto-generated description will appear here",
-                    lines=3
-                )
-            
-            # WordPress settings section
-            with gr.Group():
-                gr.Markdown("### ⚙️ WordPress Settings")
-                
-                # Load environment variables
-                env_config = load_environment_variables()
-                
-                wp_url = gr.Textbox(
-                    label="WordPress URL",
-                    value=env_config['url'],
-                    placeholder="https://cdgarment.com"
-                )
-                wp_username = gr.Textbox(
-                    label="Username",
-                    value=env_config['username'],
-                    placeholder="admin"
-                )
-                wp_password = gr.Textbox(
-                    label="Application Password",
-                    value=env_config['password'],
-                    type="password",
-                    placeholder="••••••••"
-                )
-                post_status = gr.Radio(
-                    label="Post Status",
-                    choices=["draft", "publish"],
-                    value=env_config['status']
-                )
-                
-                save_config_btn = gr.Button("💾 Save Configuration", variant="secondary")
-    
-    # Parse status and preview
-    parse_status = gr.Textbox(label="Parse Status", visible=False)
-    
-    with gr.Row(visible=False) as preview_row:
-        with gr.Column():
-            seo_title = gr.Textbox(label="SEO Title")
-            url_slug = gr.Textbox(label="URL Slug")
-        
-        with gr.Column():
-            meta_description = gr.Textbox(label="Meta Description")
-            primary_keyword = gr.Textbox(label="Primary Keyword")
-        
-        with gr.Column():
-            tags = gr.Textbox(label="Tags")
-            content_length = gr.Textbox(label="Content Length")
-    
-    # Publish section
-    gr.Markdown("---")
-    gr.Markdown("### 🚀 Ready to Publish")
-    
-    # Status indicators
-    with gr.Row():
-        content_status = gr.HTML("<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: #fee2e2; color: #991b1b;'>❌ Content</span>")
-        image_status = gr.HTML("<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: #fef3c7; color: #92400e;'>⚠️ Image Optional</span>")
-        wp_status = gr.HTML("<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: #fee2e2; color: #991b1b;'>❌ WordPress</span>")
-        status_indicator = gr.HTML("<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: #e5e7eb;'>📊 Status: DRAFT</span>")
-    
-    publish_btn = gr.Button("🚀 PUSH TO WORDPRESS", variant="primary", size="lg")
-    
-    # Publish results
-    publish_status = gr.Textbox(label="Publish Status", lines=5)
-    download_file = gr.File(label="Download Post Data", visible=False)
-    
-    # Footer
-    gr.Markdown("---")
-    gr.Markdown(f"CdGarment WordPress Publisher • {datetime.now().year}")
-    
-    # ========== EVENT HANDLERS ==========
-    
-    def update_status_indicators(has_content, has_image, has_wp_config, post_status_value):
-        """Update status indicators"""
-        content_color = "#d1fae5" if has_content else "#fee2e2"
-        content_text = "✅ Content" if has_content else "❌ Content"
-        content_html = f"<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: {content_color}; color: #065f46;'>{content_text}</span>"
-        
-        image_color = "#d1fae5" if has_image else "#fef3c7"
-        image_text = "✅ Image" if has_image else "⚠️ Image Optional"
-        image_html = f"<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: {image_color}; color: #92400e;'>{image_text}</span>"
-        
-        wp_color = "#d1fae5" if has_wp_config else "#fee2e2"
-        wp_text = "✅ WordPress" if has_wp_config else "❌ WordPress"
-        wp_html = f"<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: {wp_color}; color: #065f46;'>{wp_text}</span>"
-        
-        status_html = f"<span style='padding: 5px 10px; border-radius: 5px; font-weight: bold; margin: 2px; background-color: #e5e7eb;'>📊 Status: {post_status_value.upper()}</span>"
-        
-        return content_html, image_html, wp_html, status_html
-    
-    def check_wp_config(wp_url_val, wp_username_val, wp_password_val):
-        """Check if WordPress config is complete"""
-        return all([wp_url_val, wp_username_val, wp_password_val])
-    
-    # Image upload handler
-    def update_image_preview(image_file):
-        if image_file:
-            return gr.update(visible=True, value=image_file), True
-        return gr.update(visible=False), False
-    
-    # Parse button handler
-    def on_parse_click(gemini_content_val, post_status_val):
-        if not gemini_content_val or not gemini_content_val.strip():
-            return (
-                gr.update(value="Please paste content first", visible=True),
-                gr.update(visible=False),
-                "", "", "", "", "",
-                None,
-                *update_status_indicators(False, False, False, post_status_val)
-            )
-        
-        result, parsed = parse_content(gemini_content_val, post_status_val)
-        
-        if isinstance(result, tuple):
-            parse_status_val, seo_title_val, url_slug_val, meta_desc_val, keyword_val, tags_val, content_len_val = result[:7]
-            
-            # Debug output
-            print(f"DEBUG - Parsed tags: {parsed.get('tags', [])}")
-            print(f"DEBUG - Tags display: {tags_val}")
-            
-            return (
-                gr.update(value=parse_status_val, visible=True),
-                gr.update(visible=True),
-                seo_title_val,
-                url_slug_val,
-                meta_desc_val,
-                keyword_val,
-                tags_val if tags_val else "No tags extracted",
-                content_len_val,
-                parsed,
-                *update_status_indicators(True, False, False, post_status_val)
-            )
-        else:
-            return (
-                gr.update(value=result, visible=True),
-                gr.update(visible=False),
-                "", "", "", "", "",
-                None,
-                *update_status_indicators(False, False, False, post_status_val)
-            )
-    
-    # Save config handler
-    def on_save_config(wp_url_val, wp_username_val, wp_password_val, post_status_val):
-        if all([wp_url_val, wp_username_val, wp_password_val]):
-            wp_config = {
-                'url': wp_url_val.rstrip('/'),
-                'username': wp_username_val,
-                'password': wp_password_val,
-                'status': post_status_val
-            }
-            return (
-                gr.update(value="✅ Configuration saved!"),
-                wp_config,
-                *update_status_indicators(False, False, True, post_status_val)
-            )
-        return (
-            gr.update(value="⚠️ Please fill all WordPress configuration fields"),
-            None,
-            *update_status_indicators(False, False, False, post_status_val)
-        )
-    
-    # Publish button handler
-    def on_publish_click(parsed_data, wp_config, image_file, post_status_val, wp_url_val, wp_username_val, wp_password_val):
-        if not parsed_data:
-            yield (
-                gr.update(value="❌ No parsed content available. Please parse content first"),
-                gr.update(visible=False),
-                *update_status_indicators(False, bool(image_file), bool(wp_config), post_status_val)
-            )
-            return
-        
-        wp_config_to_use = wp_config or {
-            'url': wp_url_val.rstrip('/') if wp_url_val else '',
-            'username': wp_username_val,
-            'password': wp_password_val,
-            'status': post_status_val
-        }
-        
-        # Update status during processing
-        yield (
-            gr.update(value="🖼️ Uploading image to WordPress..."),
-            gr.update(visible=False),
-            *update_status_indicators(True, bool(image_file), True, post_status_val)
-        )
-        
-        # Call the publish function
-        for status_msg, download_file_val in publish_post(parsed_data, wp_config_to_use, image_file, post_status_val, wp_url_val, wp_username_val, wp_password_val):
-            if download_file_val:
-                yield (
-                    gr.update(value=status_msg),
-                    gr.update(value=download_file_val, visible=True),
-                    *update_status_indicators(True, bool(image_file), True, post_status_val)
-                )
-            else:
-                yield (
-                    gr.update(value=status_msg),
-                    gr.update(visible=False),
-                    *update_status_indicators(True, bool(image_file), True, post_status_val)
-                )
-            break
-    
-    # Update status indicators when inputs change
-    def update_indicators_on_change(gemini_content_val, image_file, wp_url_val, wp_username_val, wp_password_val, post_status_val, parsed_data):
-        has_content = bool(parsed_data) or bool(gemini_content_val and gemini_content_val.strip())
-        has_image = bool(image_file)
-        has_wp = check_wp_config(wp_url_val, wp_username_val, wp_password_val)
-        return update_status_indicators(has_content, has_image, has_wp, post_status_val)
-    
-    # ========== BIND EVENT HANDLERS ==========
-    
-    # Image upload
-    image_input.change(
-        update_image_preview,
-        inputs=[image_input],
-        outputs=[image_preview, image_status]
-    )
-    
-    # Parse button
-    parse_btn.click(
-        on_parse_click,
-        inputs=[gemini_content, post_status],
-        outputs=[
-            parse_status,
-            preview_row,
-            seo_title,
-            url_slug,
-            meta_description,
-            primary_keyword,
-            tags,
-            content_length,
-            parsed_data_state,
-            content_status,
-            image_status,
-            wp_status,
-            status_indicator
-        ]
-    )
-    
-    # Save config button
-    save_config_btn.click(
-        on_save_config,
-        inputs=[wp_url, wp_username, wp_password, post_status],
-        outputs=[parse_status, wp_config_state, content_status, image_status, wp_status, status_indicator]
-    )
-    
-    # Publish button
-    publish_btn.click(
-        on_publish_click,
-        inputs=[parsed_data_state, wp_config_state, image_input, post_status, wp_url, wp_username, wp_password],
-        outputs=[publish_status, download_file, content_status, image_status, wp_status, status_indicator]
-    )
-    
-    # Clear button
-    clear_btn.click(
-        clear_all,
-        outputs=[
-            gemini_content,
-            image_input,
-            wp_url,
-            wp_username,
-            wp_password,
-            post_status,
-            parse_status,
-            seo_title,
-            url_slug,
-            meta_description,
-            primary_keyword,
-            tags,
-            content_length,
-            publish_status,
-            download_file
-        ]
-    )
-    
-    # Update status indicators on input changes
-    for input_component in [gemini_content, image_input, wp_url, wp_username, wp_password, post_status]:
-        input_component.change(
-            update_indicators_on_change,
-            inputs=[gemini_content, image_input, wp_url, wp_username, wp_password, post_status, parsed_data_state],
-            outputs=[content_status, image_status, wp_status, status_indicator]
-        )
-
-# ========== LAUNCH THE APP ==========
-if __name__ == "__main__":
-    demo.launch(
-        server_name="0.0.0.0",
-        server_port=7860,
-        share=False,
-        debug=True,
-        ssr_mode=False,
-        css="""
-        .gradio-container { max-width: 1400px !important; }
-        .paste-box textarea { 
-            font-family: 'Courier New', monospace !important;
-            font-size: 14px !important;
-            line-height: 1.5 !important;
-        }
-        """
-    )