"""
Cleaner Tabs implementation using wrapper components to reduce repetition.
"""

from ritz.syntax import *


@component
def VerticalTab(label, is_active, tab_value):
    """Reusable vertical tab button with active state handling."""
    # Note: In current implementation, we still need the if/else for class
    # But it's encapsulated in one place instead of repeated everywhere
    if is_active:
        with Button(class_="vertical-tab active"):
            yield label
    else:
        with Button(class_="vertical-tab"):
            yield label


@component
def VerticalTabs():
    """Vertical tabs for settings categories."""
    setting_tab = signal(0)

    def set_setting(value):
        setting_tab = value

    with Div(class_="vertical-tabs"):
        # Vertical tab menu
        with Div(class_="vertical-tab-menu"):
            # Now each tab is just one line instead of 6!
            yield VerticalTab("⚙️ General", setting_tab == 0, 0)
            yield VerticalTab("🔒 Privacy", setting_tab == 1, 1)
            yield VerticalTab("🚀 Advanced", setting_tab == 2, 2)

        # Tab content (same as before)
        with Div(class_="vertical-tab-content"):
            match setting_tab:
                case 0:
                    with Div(class_="setting-pane"):
                        with H3():
                            yield "⚙️ General Settings"
                        with P():
                            yield "Language: English"
                        with P():
                            yield "Time Zone: UTC"

                case 1:
                    with Div(class_="setting-pane"):
                        with H3():
                            yield "🔒 Privacy Settings"
                        with P():
                            yield "Data Collection: Disabled"
                        with P():
                            yield "Analytics: Opt-out"

                case 2:
                    with Div(class_="setting-pane"):
                        with H3():
                            yield "🚀 Advanced Settings"
                        with P():
                            yield "Debug Mode: Off"
                        with P():
                            yield "Experimental Features: Disabled"

                case _:
                    with Div(class_="setting-pane"):
                        with P():
                            yield "Invalid setting"