import gradio as gr
import json
from PIL import Image
import os

# In-memory data storage (for demonstration purposes only)
users = {}
posts = []

def create_account(username, password, profile_picture):
    if username in users:
        return "Username already exists", None
    try:
        # Resize and save profile picture (replace with actual storage)
        img = Image.open(profile_picture)
        img = img.resize((300, 300))
        img_path = f"pfp_{username}.png"  # Example, needs real storage
        img.save(img_path)

        users[username] = {"password": password, "profile_picture": img_path}
        return "Account created successfully!", gr.Image(img_path)
    except Exception as e:
        return str(e), None

def login(username, password):
    if username in users and users[username]["password"] == password:
        return "Login successful!", username  # Return username for session management
    else:
        return "Invalid credentials", None

def post_update(username, update_text):
    posts.append({"username": username, "text": update_text}) # Placeholder - No timestamp yet
    return "Post created!", get_feed() #Update the feed

def get_feed():
    # Format the feed. This is a basic example, style it as needed.
    feed_html = ""
    for post in reversed(posts):  # Display in reverse chronological order
        feed_html += f"<div><strong>{post['username']}:</strong> {post['text']}</div>"
    return feed_html

with gr.Blocks() as demo:
    with gr.Tab("Create Account"):
        with gr.Row():
            username_input = gr.Textbox(label="Username")
            password_input = gr.Password(label="Password")
        profile_picture_input = gr.Image(label="Profile Picture", type="filepath")
        create_button = gr.Button("Create Account")
        create_output = gr.Textbox()
        create_image_output = gr.Image()
        create_button.click(create_account, inputs=[username_input, password_input, profile_picture_input], outputs=[create_output, create_image_output])

    with gr.Tab("Login"):
        username_login = gr.Textbox(label="Username")
        password_login = gr.Password(label="Password")
        login_button = gr.Button("Login")
        login_output = gr.Textbox()
        login_button.click(login, inputs=[username_login, password_login], outputs=[login_output])

    with gr.Tab("Feed"): # The Feed will be in this tab
        with gr.Column():
            feed_output = gr.HTML()  # Use HTML component for styled feed
            update_text = gr.Textbox(label="Your Update")
            post_button = gr.Button("Post")


            # Placeholder: assuming you have a 'current_user' variable
            current_user = "test_user" # NEEDS TO BE SET AFTER LOGIN
            post_button.click(post_update, inputs=[current_user, update_text], outputs=[feed_output])
            
            feed_output.value = get_feed() # Initial feed display


demo.launch()