import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import '../../../providers/test_results.dart';

class TestResultSearchBox extends StatelessWidget {
  const TestResultSearchBox({
    Key? key,
    required this.searchCTRL,
    required double deviceBlockSize,
  })  : _deviceBlockSize = deviceBlockSize,
        super(key: key);

  final TextEditingController searchCTRL;
  final double _deviceBlockSize;

  @override
  Widget build(BuildContext context) {
    var textVal;
    return Row(
      crossAxisAlignment: CrossAxisAlignment.end,
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        SizedBox(
          width: 3,
        ),
        Expanded(
          child: TextField(
            onEditingComplete: () {
              FocusScope.of(context).unfocus();
            },
            controller: searchCTRL,
            onChanged: (value) async {
              textVal = value;
            },
            decoration: InputDecoration(
              labelStyle: TextStyle(
                fontWeight: FontWeight.w100,
                fontSize: 4 * _deviceBlockSize,
              ),
              labelText: 'Search by test name',
              isDense: true,
              contentPadding: EdgeInsets.symmetric(vertical: 2, horizontal: 3),
            ),
            style: TextStyle(
              fontWeight: FontWeight.w700,
              fontSize: 5 * _deviceBlockSize,
            ),
            keyboardType: TextInputType.number,
          ),
        ),
        InkWell(
          onTap: () async {
            var testResults =
                await Provider.of<TestResultsProvider>(context, listen: false);
            testResults.setLoading();
            await testResults.search(textVal);
          },
          child: Container(
            padding: EdgeInsets.all(7),
            width: 8 * _deviceBlockSize,
            margin: EdgeInsets.only(left: 5),
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              color: Colors.black,
            ),
            child: Center(
              child: Icon(
                Icons.search,
                size: 4 * _deviceBlockSize,
                color: Colors.white,
              ),
            ),
          ),
        ),
      ],
    );
  }
}