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

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

  @override
  State<MixingTab> createState() => _MixingTabState();
}

class _MixingTabState extends State<MixingTab> {
  Widget buildCardGrid(List<mixer.Port> from, int cols,
      double cardGridAspectRatio, bool isOutput) {
    return GridView.count(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      childAspectRatio: cardGridAspectRatio,
      crossAxisCount: cols,
      mainAxisSpacing: 10,
      crossAxisSpacing: 10,
      children: from
          .map((p) => MixingCard(
                port: p,
                sendAction: widget.sendAction,
                isOutput: isOutput,
                mixerState: widget.mixerState,
              ))
          .toList(),
    );
  }

  @override
  Widget build(BuildContext context) {
    double screenWidth = MediaQuery.of(context).size.width;
    int cols = 1 + (screenWidth ~/ 550);
    int cardHeight = 110;
    double cardGridAspectRatio =
        (screenWidth - 32 - (10 * (cols - 1))) / cardHeight / cols;

    return SizedBox.expand(
      child: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text("Inputs", style: Theme.of(context).textTheme.titleLarge),
              const SizedBox(height: 10),
              buildCardGrid(
                  widget.mixerState.inputs, cols, cardGridAspectRatio, false),
              const SizedBox(height: 20),
              Text("Outputs", style: Theme.of(context).textTheme.titleLarge),
              const SizedBox(height: 10),
              buildCardGrid(
                  widget.mixerState.outputs, cols, cardGridAspectRatio, true),
            ],
          ),
        ),
      ),
    );
  }
}