app_for_reddit/Reddit App/Views/Components/SidebarNavItemView.swift

import SwiftUI

struct SidebarNavItemView: View {
    let item: SidebarNavItem
    let isSelected: Bool
    let action: () -> Void

    var body: some View {
        Button(action: action) {
            SidebarItemRow(
                title: item.title,
                subtitle: item.subtitle,
                isSelected: isSelected
            ) {
                ModernSidebarIconView(kind: item.iconKind)
            }
        }
        .buttonStyle(.plain)
    }
}

struct SidebarQuickAccessItemView: View {
    let isSelected: Bool
    let action: () -> Void

    var body: some View {
        Button(action: action) {
            SidebarItemRow(
                title: "Open Reddit",
                subtitle: "Browse Reddit in-app",
                isSelected: isSelected,
                showsCardBackground: true,
                showsChevron: true,
                selectedBorderColor: AppTheme.accentPurple.opacity(0.4)
            ) {
                ModernRedditIconView()
            }
        }
        .buttonStyle(.plain)
    }
}

private struct SidebarItemRow<Icon: View>: View {
    let title: String
    let subtitle: String
    var isSelected: Bool = false
    var showsCardBackground: Bool = false
    var showsChevron: Bool = false
    var selectedBorderColor: Color = .clear
    @ViewBuilder let icon: () -> Icon

    var body: some View {
        HStack(alignment: .center, spacing: AppTheme.sidebarRowSpacing) {
            icon()
                .frame(width: AppTheme.iconContainerSize, height: AppTheme.iconContainerSize)

            VStack(alignment: .leading, spacing: 1) {
                Text(title)
                    .font(.system(size: 12, weight: .semibold))
                    .foregroundStyle(AppTheme.textPrimary)
                Text(subtitle)
                    .font(.system(size: 10))
                    .foregroundStyle(AppTheme.textSecondary)
            }
            .padding(.leading, 2)

            Spacer(minLength: 0)

            if showsChevron {
                Image(systemName: "chevron.right")
                    .font(.system(size: 10, weight: .semibold))
                    .foregroundStyle(AppTheme.textSecondary)
            }
        }
        .padding(.horizontal, AppTheme.sidebarRowPaddingH)
        .padding(.vertical, AppTheme.sidebarRowPaddingV)
        .contentShape(RoundedRectangle(cornerRadius: AppTheme.cornerRadiusSmall))
        .background(rowBackground)
    }

    @ViewBuilder
    private var rowBackground: some View {
        if showsCardBackground {
            RoundedRectangle(cornerRadius: AppTheme.cornerRadiusSmall)
                .fill(AppTheme.quickAccessBackground)
                .overlay(
                    RoundedRectangle(cornerRadius: AppTheme.cornerRadiusSmall)
                        .stroke(
                            isSelected ? selectedBorderColor : AppTheme.cardBorder,
                            lineWidth: 1
                        )
                )
        } else if isSelected {
            RoundedRectangle(cornerRadius: AppTheme.cornerRadiusSmall)
                .fill(Color.white.opacity(0.05))
        }
    }
}

struct SidebarSectionHeader: View {
    let title: String

    var body: some View {
        Text(title)
            .font(.system(size: 10, weight: .bold))
            .foregroundStyle(AppTheme.textTertiary)
            .tracking(1.0)
            .frame(maxWidth: .infinity, alignment: .leading)
            .padding(.horizontal, AppTheme.sidebarRowPaddingH)
            .padding(.top, 5)
            .padding(.bottom, 4)
    }
}