import 'package:flex_color_picker/flex_color_picker.dart';
import 'package:flutter/material.dart';
import 'package:hexcolor/hexcolor.dart';
import 'package:temperaturdecke/db_test.dart';
import 'package:temperaturdecke/widgets/modal_wrapper.dart';

class AddWoolModal extends StatelessWidget {
  AddWoolModal({super.key});

  Color selectedColor = Colors.white;
  String title = "";
  String manufacture = "";

  void setSelectedColor(Color color) {
    selectedColor = color;
  }

  @override
  Widget build(BuildContext context) {
    return ModalWrapper(
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            height: 15,
          ),
          Text(
            "Randdaten",
            textAlign: TextAlign.start,
            style: Theme.of(context).textTheme.headlineSmall,
          ),
          SizedBox(
            height: 10,
          ),
          TextField(
            onChanged: (value) => {title = value},
            decoration: InputDecoration(
              border: OutlineInputBorder(),
              labelText: 'Name',
            ),
          ),
          SizedBox(
            height: 25,
          ),
          TextField(
            onChanged: (value) => {manufacture = value},
            decoration: InputDecoration(
              border: OutlineInputBorder(),
              labelText: 'Marke',
            ),
          ),
          SizedBox(
            height: 30,
          ),
          Text(
            "Farbe",
            textAlign: TextAlign.start,
            style: Theme.of(context).textTheme.headlineSmall,
          ),
          SizedBox(
            height: 10,
          ),
          ColorPicker(
            spacing: 8,
            padding: EdgeInsets.all(0),
            borderRadius: 10,
            onColorChanged: (value) => setSelectedColor(value),
            enableShadesSelection: false,
            enableTonalPalette: true,
            tonalColorSameSize: true,
            pickersEnabled: {ColorPickerType.accent: false},
            tonalSubheading: Divider(),
          ),
          SizedBox(
            height: 25,
          ),
          Align(
            alignment: Alignment.centerRight,
            child: FilledButton(
              onPressed: () => addWool(
                context,
                title,
                manufacture,
                selectedColor,
              ),
              child: Text(
                "Hinzufügen",
                style: TextStyle(fontSize: 16),
              ),
            ),
          )
        ],
      ),
      title: "Wolle hinzufügen",
    );
  }
}