"""
Enhanced Twitter Dashboard with modern UI components and improved user experience.
"""
import streamlit as st
from typing import Dict, List, Optional, Any
import json
from datetime import datetime, timedelta
import plotly.express as px
import plotly.graph_objects as go
from plotly.subplots import make_subplots
import pandas as pd
import numpy as np
from .tweet_generator import smart_tweet_generator
from .twitter_streamlit_ui import (
TwitterDashboard,
FeatureCard,
TweetCard,
TweetForm,
SettingsForm,
Sidebar,
Header,
Tabs,
Breadcrumbs,
Theme,
save_to_session,
get_from_session,
clear_session,
show_success_message,
show_error_message,
show_info_message,
show_warning_message
)
def apply_modern_styling():
"""Apply modern CSS styling to the dashboard."""
st.markdown("""
""", unsafe_allow_html=True)
def render_connection_status():
"""Render Twitter connection status with modern styling."""
# Simulate connection status (replace with real authentication check)
is_connected = get_from_session("twitter_connected", False)
if is_connected:
user_info = get_from_session("twitter_user", {"name": "Demo User", "handle": "@demo_user"})
st.markdown(f"""
✅
Connected as {user_info['name']}
{user_info['handle']}
""", unsafe_allow_html=True)
else:
st.markdown("""
⚠️
Twitter Not Connected
Connect your account to access all features
""", unsafe_allow_html=True)
if st.button("🔗 Connect Twitter Account", key="connect_twitter"):
# Simulate connection (replace with real OAuth flow)
save_to_session("twitter_connected", True)
save_to_session("twitter_user", {"name": "Demo User", "handle": "@demo_user"})
st.rerun()
def render_dashboard_header():
"""Render the modern dashboard header."""
st.markdown("""
""", unsafe_allow_html=True)
def render_quick_actions():
"""Render quick action buttons."""
st.markdown("### 🚀 Quick Actions")
col1, col2, col3, col4 = st.columns(4)
with col1:
if st.button("✍️ Create Tweet", use_container_width=True, key="quick_tweet"):
st.session_state.current_page = "tweet_generator"
st.rerun()
with col2:
if st.button("📊 View Analytics", use_container_width=True, key="quick_analytics"):
st.session_state.current_page = "analytics"
st.rerun()
with col3:
if st.button("📅 Content Calendar", use_container_width=True, key="quick_calendar"):
show_info_message("Content Calendar feature coming soon!")
with col4:
if st.button("⚙️ Settings", use_container_width=True, key="quick_settings"):
st.session_state.current_page = "settings"
st.rerun()
def render_metrics_overview():
"""Render key metrics overview."""
st.markdown("### 📈 Performance Overview")
# Generate sample metrics (replace with real data)
col1, col2, col3, col4 = st.columns(4)
with col1:
st.markdown("""
""", unsafe_allow_html=True)
with col2:
st.markdown("""
""", unsafe_allow_html=True)
with col3:
st.markdown("""
""", unsafe_allow_html=True)
with col4:
st.markdown("""
""", unsafe_allow_html=True)
def render_engagement_chart():
"""Render engagement trends chart."""
st.markdown("### 📊 Engagement Trends")
# Generate sample data (replace with real Twitter data)
dates = pd.date_range(start=datetime.now() - timedelta(days=30), periods=30)
engagement = np.random.normal(100, 20, 30)
engagement = np.maximum(engagement, 0) # Ensure positive values
df = pd.DataFrame({
'Date': dates,
'Engagement': engagement,
'Likes': engagement * 0.6,
'Retweets': engagement * 0.3,
'Replies': engagement * 0.1
})
# Create interactive chart
fig = make_subplots(
rows=2, cols=1,
subplot_titles=('Total Engagement', 'Engagement Breakdown'),
vertical_spacing=0.1,
row_heights=[0.7, 0.3]
)
# Main engagement line
fig.add_trace(
go.Scatter(
x=df['Date'],
y=df['Engagement'],
mode='lines+markers',
name='Total Engagement',
line=dict(color='#1DA1F2', width=3),
marker=dict(size=6)
),
row=1, col=1
)
# Stacked area chart for breakdown
fig.add_trace(
go.Scatter(
x=df['Date'],
y=df['Likes'],
mode='lines',
name='Likes',
fill='tonexty',
line=dict(color='#E53E3E')
),
row=2, col=1
)
fig.add_trace(
go.Scatter(
x=df['Date'],
y=df['Retweets'],
mode='lines',
name='Retweets',
fill='tonexty',
line=dict(color='#38A169')
),
row=2, col=1
)
fig.add_trace(
go.Scatter(
x=df['Date'],
y=df['Replies'],
mode='lines',
name='Replies',
fill='tonexty',
line=dict(color='#D69E2E')
),
row=2, col=1
)
fig.update_layout(
height=500,
showlegend=True,
hovermode='x unified',
plot_bgcolor='rgba(0,0,0,0)',
paper_bgcolor='rgba(0,0,0,0)'
)
fig.update_xaxes(showgrid=True, gridwidth=1, gridcolor='rgba(0,0,0,0.1)')
fig.update_yaxes(showgrid=True, gridwidth=1, gridcolor='rgba(0,0,0,0.1)')
st.plotly_chart(fig, use_container_width=True)
def render_feature_grid():
"""Render the feature grid with modern cards."""
st.markdown("### 🛠️ Available Tools")
features = [
{
"title": "Smart Tweet Generator",
"description": "Create engaging tweets with AI assistance, hashtag suggestions, and emoji optimization",
"icon": "✨",
"status": "active",
"action": "tweet_generator"
},
{
"title": "Performance Predictor",
"description": "Predict tweet engagement and find optimal posting times",
"icon": "🔮",
"status": "coming_soon",
"action": None
},
{
"title": "Content Calendar",
"description": "Plan and schedule your Twitter content strategy",
"icon": "📅",
"status": "coming_soon",
"action": None
},
{
"title": "Hashtag Research",
"description": "Discover trending hashtags and analyze their performance",
"icon": "#️⃣",
"status": "coming_soon",
"action": None
},
{
"title": "Visual Content",
"description": "Create quote cards, infographics, and visual tweets",
"icon": "🎨",
"status": "coming_soon",
"action": None
},
{
"title": "Analytics Dashboard",
"description": "Deep dive into your Twitter performance metrics",
"icon": "📊",
"status": "coming_soon",
"action": None
}
]
# Create grid layout
cols = st.columns(3)
for i, feature in enumerate(features):
with cols[i % 3]:
status_class = "status-active" if feature["status"] == "active" else "status-coming-soon"
card_html = f"""
{feature['icon']}
{feature['title']}
{feature['description']}
{feature['status'].replace('_', ' ')}
"""
st.markdown(card_html, unsafe_allow_html=True)
# Add button for active features
if feature["status"] == "active" and feature["action"]:
if st.button(f"Launch {feature['title']}", key=f"launch_{i}", use_container_width=True):
st.session_state.current_page = feature["action"]
st.rerun()
def render_recent_activity():
"""Render recent activity feed."""
st.markdown("### 📱 Recent Activity")
# Sample activity data (replace with real data)
activities = [
{"time": "2 hours ago", "action": "Generated tweet", "details": "AI-powered content about social media trends"},
{"time": "5 hours ago", "action": "Analyzed performance", "details": "Tweet received 45 likes and 12 retweets"},
{"time": "1 day ago", "action": "Scheduled tweet", "details": "Content scheduled for optimal posting time"},
{"time": "2 days ago", "action": "Updated hashtags", "details": "Added trending hashtags to improve reach"}
]
for activity in activities:
st.markdown(f"""
{activity['action']}
{activity['details']}
{activity['time']}
""", unsafe_allow_html=True)
def run_dashboard():
"""Main function to run the enhanced Twitter dashboard."""
# Apply modern styling
apply_modern_styling()
# Initialize session state
if "current_page" not in st.session_state:
st.session_state.current_page = "dashboard"
# Handle page navigation
if st.session_state.current_page == "tweet_generator":
if st.button("← Back to Dashboard", key="back_to_dashboard"):
st.session_state.current_page = "dashboard"
st.rerun()
smart_tweet_generator()
return
# Main dashboard container
st.markdown('', unsafe_allow_html=True)
# Render dashboard header
render_dashboard_header()
# Render connection status
render_connection_status()
# Create main layout
tab1, tab2, tab3 = st.tabs(["🏠 Overview", "📊 Analytics", "⚙️ Settings"])
with tab1:
# Quick actions
render_quick_actions()
# Metrics overview
render_metrics_overview()
# Feature grid
render_feature_grid()
# Recent activity
col1, col2 = st.columns([2, 1])
with col1:
render_engagement_chart()
with col2:
render_recent_activity()
with tab2:
st.markdown("### 📈 Advanced Analytics")
# Time range selector
col1, col2 = st.columns([1, 3])
with col1:
time_range = st.selectbox(
"Time Range",
["Last 7 days", "Last 30 days", "Last 90 days", "Last year"],
index=1
)
# Detailed analytics
render_engagement_chart()
# Performance insights
st.markdown("### 💡 Performance Insights")
insights = [
"Your tweets perform 23% better when posted between 2-4 PM",
"Tweets with 2-3 hashtags get 15% more engagement",
"Visual content increases engagement by 35%",
"Questions in tweets boost replies by 28%"
]
for insight in insights:
st.info(f"💡 {insight}")
with tab3:
st.markdown("### ⚙️ Dashboard Settings")
# Twitter API settings
with st.expander("🔑 Twitter API Configuration", expanded=False):
st.markdown("Configure your Twitter API credentials to enable full functionality.")
api_key = st.text_input("API Key", type="password", help="Your Twitter API key")
api_secret = st.text_input("API Secret", type="password", help="Your Twitter API secret")
access_token = st.text_input("Access Token", type="password", help="Your Twitter access token")
access_token_secret = st.text_input("Access Token Secret", type="password", help="Your Twitter access token secret")
if st.button("Save API Configuration"):
# Save configuration (implement secure storage)
show_success_message("API configuration saved successfully!")
# Dashboard preferences
with st.expander("🎨 Dashboard Preferences", expanded=True):
theme = st.selectbox("Theme", ["Light", "Dark", "Auto"], index=0)
default_tone = st.selectbox("Default Tweet Tone", ["Professional", "Casual", "Humorous", "Inspirational"], index=1)
auto_hashtags = st.checkbox("Auto-suggest hashtags", value=True)
if st.button("Save Preferences"):
show_success_message("Preferences saved successfully!")
# Account management
with st.expander("👤 Account Management", expanded=False):
st.markdown("Manage your connected Twitter accounts and permissions.")
if get_from_session("twitter_connected", False):
st.success("✅ Twitter account connected")
if st.button("Disconnect Account"):
save_to_session("twitter_connected", False)
st.rerun()
else:
st.warning("⚠️ No Twitter account connected")
if st.button("Connect Account"):
save_to_session("twitter_connected", True)
st.rerun()
st.markdown('
', unsafe_allow_html=True)
# JavaScript for handling feature clicks
st.markdown("""
""", unsafe_allow_html=True)
if __name__ == "__main__":
run_dashboard()