import 'package:flutter/material.dart';
import 'package:notube/components/formComponents/formatDropdown.dart';
import 'package:notube/components/formComponents/submitButton.dart';
import 'package:notube/components/formComponents/urlTextField.dart';
import 'package:notube/states/dlFormState.dart';
import 'package:provider/provider.dart';

class DlForm extends StatelessWidget {
  const DlForm({super.key});

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
        create: (context) => DlFormState(),
        child: Form(child: LayoutBuilder(
            builder: (BuildContext context, BoxConstraints constraints) {
          debugPrint('Max width: ${constraints.maxWidth}');
          debugPrint('Max height: ${MediaQuery.of(context).size.height}');
          if (constraints.maxWidth < 320) {
            return Column(
              children: [
                Row(children: <Widget>[
                  UrlTextField(),
                ]),
                Row(children: <Widget>[
                  Expanded(flex: 1, child: DropdownFormat()),
                ]),
                Row(children: <Widget>[
                  Expanded(flex: 1, child: SubmitButton()),
                ]),
                DebugDlFormState(),
              ],
            );
          } else if (constraints.maxWidth < 720) {
            return Column(
              children: [
                Row(children: <Widget>[
                  UrlTextField(),
                ]),
                Row(children: <Widget>[
                  Expanded(flex: 1, child: DropdownFormat()),
                  Expanded(flex: 2, child: SubmitButton()),
                ]),
                DebugDlFormState(),
              ],
            );
          } else {
            return Column(
              children: [
                Row(children: <Widget>[
                  UrlTextField(),
                  DropdownFormat(),
                  SubmitButton(),
                ]),
                DebugDlFormState(),
              ],
            );
          }
        })));
  }
}

class DebugDlFormState extends StatelessWidget {
  const DebugDlFormState({super.key});

  @override
  Widget build(BuildContext context) {
    var dlForm = context.watch<DlFormState>();

    return Column(
      children: <Widget>[
        Text('Url: ${dlForm.url}'),
        Text('Format: ${dlForm.format}'),
      ],
    );
  }
}