File size: 4,056 Bytes
a3bdcf1
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
"""
⚡ Code Studio - The Main IDE Interface
"""
import streamlit as st
import os
from components.style import apply_custom_css
from components.file_explorer import render_file_tree
from components.code_viewer import render_code_viewer_simple
from components.panels import render_chat_panel, render_search_panel, render_generate_panel

st.set_page_config(
    page_title="Code Studio", 
    page_icon="⚡", 
    layout="wide", 
    initial_sidebar_state="collapsed" # Hide standard sidebar
)

apply_custom_css()

# --- State Management ---
if "active_tab" not in st.session_state:
    st.session_state.active_tab = "explorer"
    
if "processed_files" not in st.session_state or not st.session_state.processed_files:
    # If accessed directly without processing, redirect home
    st.warning("⚠️ Please index a codebase first.")
    if st.button("Go Home"):
        st.switch_page("app.py")
    st.stop()

# --- Layout Configuration ---
# Allow user to resize the split
with st.sidebar:
    st.header("⚙️ Layout Settings")
    split_ratio = st.slider(
        "Panel Width (%)", 
        min_value=20, 
        max_value=80, 
        value=30, 
        step=5,
        help="Adjust the width of the left panel (Chat/Explorer)."
    )

# Calculate column ratios based on percentage
panel_width = split_ratio / 100.0
editor_width = 1.0 - panel_width

# Main Layout
col_panel, col_editor = st.columns([panel_width, editor_width])

# --- Side Panel (Tabs) ---
with col_panel:
    # Use native Streamlit tabs for horizontal navigation
    tab_explorer, tab_search, tab_chat, tab_generate = st.tabs(["📁 Explorer", "🔍 Search", "💬 Chat", "✨ Generate"])
    
    with tab_explorer:
        st.markdown("### 📁 Project Files")
        render_file_tree(
            st.session_state.get("indexed_files", []),
            st.session_state.get("workspace_root", "")
        )
        
        st.divider()
        if st.button("🏠 Index New Codebase", use_container_width=True):
            st.session_state.processed_files = False
            st.session_state.chat_engine = None
            st.session_state.indexed_files = None
            st.session_state.workspace_root = None
            st.session_state.selected_file = None
            st.switch_page("app.py")

    with tab_search:
        render_search_panel(st.session_state.get("indexed_files", []))

    with tab_chat:
        chat_engine = st.session_state.get("chat_engine")
        if chat_engine:
            render_chat_panel(chat_engine)
        else:
            st.error("Chat engine unavailable. Please index a codebase first.")

    with tab_generate:
        chat_engine = st.session_state.get("chat_engine")
        if chat_engine:
            render_generate_panel(chat_engine, st.session_state.get("indexed_files", []))
        else:
            st.error("Chat engine unavailable.")

# --- Main Editor ---
with col_editor:
    # If a file is selected, show it. Otherwise show welcome/empty state.
    selected_file = st.session_state.get("selected_file")
    
    if selected_file:
        # We use a container to ensure height consistency
        with st.container():
            # Alignment Spacer: Matches the height of st.tabs headers (~50px)
            st.markdown("<div style='height: 50px;'></div>", unsafe_allow_html=True)
            
            # Breadcrumbs / File Header
            filename = os.path.basename(selected_file)
            st.caption(f"Editing: {filename}")
            
            # Code Viewer
            render_code_viewer_simple(selected_file)
            
    else:
        # Empty State
        st.markdown(
            """
            <div style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 60vh; opacity: 0.5;">
                <h1>⚡ Code Studio</h1>
                <p>Select a file from the explorer to view context.</p>
                <p>Use the tabs on the left to switch between tools.</p>
            </div>
            """, 
            unsafe_allow_html=True
        )