I’ve got this widget:

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: TypeAheadField(
        hideOnEmpty: true,
        builder: (context, controller, focusNode) {
          return TextField(
            controller: _controller,
            focusNode: focusNode,
            autofocus: false,
            style: const TextStyle(
                fontFamily: 'DynaPuff',
                fontWeight: FontWeight.w100,
                color: secondaryColor,
                decoration: TextDecoration.none),
            decoration: InputDecoration(
              labelStyle: const TextStyle(color: secondaryColor),
              enabledBorder: const OutlineInputBorder(
                borderSide: BorderSide(color: thirdColor, width: 1.0),
              ),
              focusedBorder: const OutlineInputBorder(
                borderSide: BorderSide(color: thirdColor, width: 1.0),
              ),
              fillColor: mainBgColor,
              suffixIcon: Visibility(
                visible: textValue.isNotEmpty,
                child: IconButton(
                  onPressed: () {
                    _controller.clear();
                    setState(() {
                      textValue = '';
                    });
                  },
                  icon: const Icon(
                    Ionicons.close_outline,
                    color: secondaryColor,
                  ),
                ),
              ),
              prefixIcon: const Icon(
                Ionicons.search_outline,
                color: secondaryColor,
              ),
              labelText: 'Search',
            ),
            onSubmitted: (value) {
              textValue = value;
              saveSearchHistory(value: textValue);
            },
            onChanged: (value) {
              setState(() {
                textValue = value;
              });
            },
          );
        },
        itemBuilder: (context, value) {
          return ListTile(
            tileColor: Colors.transparent,
            title: Text(
              value.toString(),
            ),
            trailing: IconButton(
              icon: const Icon(
                Ionicons.close_outline,
                size: 15.0,
              ),
              onPressed: () {
                removeFromHistory(value: value);
              },
            ),
          );
        },
        onSelected: (value) {
          _controller.text = value.toString();
        },
        suggestionsCallback: (pattern) {
          return _searchHistory
              .where((suggestion) =>
                  suggestion.toLowerCase().contains(pattern.toLowerCase()))
              .toList();
        },
      ),
    );
  }

When the user submits the TextField I’d like to add the value of the TextField to the dropdown menu.
I’m using this function to add the element to the list:

  saveSearchHistory({required String value}) async {
    if (_searchHistory.contains(value)) {
      _searchHistory.remove(value);
    }
    _searchHistory.add(value);
    await _prefs.setStringList('searchHistory', _searchHistory);
    _controller.clear();
  }

Unfortunately, when I tap on the TextField again, the newly added item wont show;

I also added an IconButton to the ListTile to remove en element, but it also won’t work and the element stays on the list, until the page is reloading.

  removeFromHistory({required String value}) async {
    setState(() {
      _searchHistory.remove(value);
    });
    await _prefs.setStringList('searchHistory', _searchHistory);
  }

Do you have any suggestions?