from PyQt5.QtWidgets import QFrame, QVBoxLayout, QHBoxLayout, QLabel, QListWidget, QWidget, QPushButton, QListWidgetItem
from PyQt5.QtSvg import QSvgWidget
from PyQt5.QtCore import Qt
from PyQt5.QtGui import QPixmap, QIcon
import os

from src.config import SECONDARY_COLOR, UXUI_ASSETS, BUTTON_STYLE, DongleIconMap, DongleModelMap

def create_device_layout(parent, device_controller):
    """Create the device list layout"""
    try:
        devices_frame = QFrame(parent)
        devices_frame.setStyleSheet(f"border: none; background: {SECONDARY_COLOR}; border-radius: 15px;")

        # 固定高度，避免滾輪問題
        devices_frame.setFixedHeight(200)
        devices_frame.setFixedWidth(240)
        
        devices_layout = QVBoxLayout(devices_frame)

        # Title
        title_layout = QHBoxLayout()
        
        title_container = QWidget()
        container_layout = QHBoxLayout(title_container)
        container_layout.setSpacing(10)
        
        device_icon = QSvgWidget(os.path.join(UXUI_ASSETS, "Assets_svg/ic_window_device.svg"))
        device_icon.setFixedSize(20, 20)
        container_layout.addWidget(device_icon)
        
        title_label = QLabel("Device")
        title_label.setStyleSheet("color: white; font-size: 20px; font-weight: bold;")
        container_layout.addWidget(title_label)
        
        title_layout.addWidget(title_container)
        devices_layout.addLayout(title_layout)

        # Device list
        device_list_widget = QListWidget(parent)
        device_list_widget.setStyleSheet("""
            QListWidget {
                background-color: transparent;
                border: none;
                color: white;
            }
            QListWidget::item {
                padding: 5px;
                border-radius: 5px;
            }
            QListWidget::item:selected {
                background-color: rgba(255, 255, 255, 0.2);
            }
            QScrollBar:vertical {
                width: 0px;
            }
            QScrollBar:horizontal {
                height: 0px;
            }
        """)
        device_list_widget.setVerticalScrollBarPolicy(Qt.ScrollBarAlwaysOff)
        device_list_widget.setHorizontalScrollBarPolicy(Qt.ScrollBarAlwaysOff)
        
        # Connect item selection signal
        device_list_widget.itemClicked.connect(lambda item: device_controller.select_device(
            item.data(Qt.UserRole), item, device_list_widget
        ))
        
        devices_layout.addWidget(device_list_widget)

        # Detail button
        detail_button = QPushButton("Details", parent)
        detail_button.setStyleSheet(BUTTON_STYLE)
        detail_button.setFixedSize(72, 30)
        detail_button.clicked.connect(parent.show_device_popup)
        
        button_container = QWidget()
        button_layout = QHBoxLayout(button_container)
        button_layout.addWidget(detail_button, alignment=Qt.AlignCenter)
        button_layout.setContentsMargins(0, 0, 0, 0)
        devices_layout.addWidget(button_container)

        return devices_frame, device_list_widget
    except Exception as e:
        print(f"Error in create_device_layout: {e}")
        return QFrame(parent), QListWidget(parent)