cloudsolutions-atoms/lib/views/widgets/parts/auto_complete_parts_field.dart

import 'package:flutter/material.dart';
import 'package:flutter_typeahead/flutter_typeahead.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/parts_provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/controllers/providers/settings/setting_provider.dart';
import 'package:test_sa/models/part.dart';
import 'package:test_sa/views/app_style/colors.dart';
import 'package:test_sa/views/app_style/sizing.dart';

class AutoCompletePartsField extends StatefulWidget {
  final String initialValue;
  final num assetId;
  final bool clearAfterPick;
  final Function(Part) onPick;

  const AutoCompletePartsField({Key key, this.initialValue, this.assetId, this.onPick, this.clearAfterPick = true}) : super(key: key);

  @override
  _AutoCompletePartsFieldState createState() => _AutoCompletePartsFieldState();
}

class _AutoCompletePartsFieldState extends State<AutoCompletePartsField> {
  SettingProvider _settingProvider;
  PartsProvider _partsProvider;
  UserProvider _userProvider;
  TextEditingController _controller;

  @override
  void initState() {
    _controller = TextEditingController(text: widget.initialValue);
    super.initState();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    _settingProvider = Provider.of<SettingProvider>(context);
    _userProvider = Provider.of<UserProvider>(context);
    _partsProvider = Provider.of<PartsProvider>(context);

    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 16),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border.all(color: AColors.black),
          borderRadius: BorderRadius.circular(AppStyle.borderRadius * AppStyle.getScaleFactor(context)),
          boxShadow: const [AppStyle.boxShadow]),
      child: TypeAheadField<Part>(
        textFieldConfiguration: TextFieldConfiguration(
          style: Theme.of(context).textTheme.subtitle1,
          controller: _controller,
          textAlign: TextAlign.center,
          decoration: const InputDecoration(
            border: InputBorder.none,
            disabledBorder: InputBorder.none,
            focusedBorder: InputBorder.none,
            enabledBorder: InputBorder.none,
          ),
          textInputAction: TextInputAction.search,
        ),
        suggestionsCallback: (vale) async {
          return await _partsProvider.getPartsList(host: _settingProvider.host, title: vale, assetId: widget.assetId);
        },
        itemBuilder: (context, part) {
          return ListTile(
            title: Text(part.partNo),
            subtitle: Text(
              part.partName,
              style: Theme.of(context).textTheme.caption,
            ),
          );
        },
        onSuggestionSelected: (part) {
          if (widget.clearAfterPick) {
            _controller.clear();
          } else {
            _controller.text = part.partNo;
          }
          widget.onPick(part);
        },
      ),
    );
  }
}