import 'package:flutter/material.dart';
import 'package:gomix_flutter/edit_port_dialog.dart';
import 'package:gomix_flutter/mixer_state.dart' as mixer;

enum MenuAction { edit, delete }

class PortsTab extends StatefulWidget {
  final mixer.MixerState mixerState;
  final void Function(Map<String, Object> data) sendAction;
  const PortsTab(
      {super.key, required this.mixerState, required this.sendAction});

  @override
  State<PortsTab> createState() => _PortsTabState();
}

class _PortsTabState extends State<PortsTab> {
  void onEditPort(mixer.Port port) {
    CreatePortDialog().show(context, widget.sendAction, port, false);
  }

  void onDeletePort(mixer.Port port) {
    showDialog<String>(
      context: context,
      builder: (BuildContext context) => AlertDialog(
        title: const Text("Delete Port"),
        content: Text("Are you sure you want to delete ${port.name}?"),
        actions: <Widget>[
          TextButton(
            onPressed: () => Navigator.pop(context, 'Cancel'),
            child: const Text('Cancel'),
          ),
          TextButton(
            onPressed: () {
              widget.sendAction({"method": "deletePort", "uuid": port.uuid});
              Navigator.pop(context, 'Delete');
            },
            child: const Text("Delete"),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Column(
        children: [...widget.mixerState.inputs, ...widget.mixerState.outputs]
            .indexed
            .map(
              (elem) => Card(
                child: ListTile(
                  leading: (elem.$1 >= widget.mixerState.inputs.length)
                      ? const Icon(Icons.speaker_outlined)
                      : const Icon(Icons.mic_none_outlined),
                  title: Text(elem.$2.name),
                  subtitle: Text('Backend: ${elem.$2.properties.backend}'),
                  trailing: PopupMenuButton<MenuAction>(
                    tooltip: "More Options",
                    onSelected: (MenuAction item) {
                      switch (item) {
                        case MenuAction.edit:
                          onEditPort(elem.$2);
                        case MenuAction.delete:
                          onDeletePort(elem.$2);
                      }
                    },
                    itemBuilder: (BuildContext context) =>
                        <PopupMenuEntry<MenuAction>>[
                      const PopupMenuItem<MenuAction>(
                        value: MenuAction.edit,
                        child: ListTile(
                          leading: Icon(Icons.mode_edit),
                          title: Text('Edit'),
                        ),
                      ),
                      const PopupMenuItem<MenuAction>(
                        value: MenuAction.delete,
                        child: ListTile(
                          leading: Icon(Icons.delete),
                          title: Text('Delete'),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            )
            .toList(),
      ),
    );
  }
}