title: TextField not updating when applying State Hoisting
body: <p>I am building a simple app following Mitch Tabian's youtube tutorial about Jetpack Compose.
  In the State Hoisting video, he extracts the code for the search TextField into a separate Composable. When I do so, my textField doesn't update the value and I can't find what I am doing wrong.</p>
  <p><strong>SearchAppBar Composable</strong></p>
  <pre><code>@Composable
  fun SearchAppBar(
    query: String,
    onQueryChanged: (String) -&gt; Unit,
    onExecuteSearch: () -&gt; Unit,
    selectedCategory: FoodCategory?,
    onSelectedCategoryChanged: (String) -&gt; Unit
  ) {
    Surface(
      modifier = Modifier
        .fillMaxWidth(),
      color = Color.White,
      elevation = 4.dp
    ) {
      Column {
        Row(modifier = Modifier.fillMaxWidth()) {
          val focusManager = LocalFocusManager.current
          OutlinedTextField(
            value = query,
            onValueChange = { newValue -&gt; onQueryChanged(newValue) },
            modifier = Modifier
              .background(color = MaterialTheme.colors.surface)
              .fillMaxWidth()
              .padding(8.dp),
            label = {
              Text(text = &quot;Search&quot;)
            },
  ...
  </code></pre>
  <p><strong>Fragment</strong></p>
  <pre><code>class RecipeListFragment : Fragment() {
    private val viewModel: RecipeListViewModel by viewModels()
  
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
      return ComposeView(requireContext()).apply {
        setContent {
          val recipes = viewModel.recipes.value
          val query = viewModel.query.value
          val selectedCategory = viewModel.selectedCategory.value
          Column {
            SearchAppBar(
              query = query,
              onQueryChanged = { viewModel.onQueryChanged(query) },
              onExecuteSearch = { viewModel::newSearch },
              selectedCategory = selectedCategory,
              onSelectedCategoryChanged = { viewModel::onSelectedCategoryChanged })
            LazyColumn {
              itemsIndexed(items = recipes) { index, recipe -&gt;
                RecipeCard(recipe = recipe, onClick = { })
              }
            }
          }
        }
      }
    }
  }
  </code></pre>
  <p><strong>ViewModel</strong></p>
  <pre><code>class RecipeListViewModel @Inject constructor(private val repository: RecipeRepository, @Named(&quot;auth_token&quot;) private val token: String) : ViewModel() {
    val recipes: MutableState&lt;List&lt;Recipe&gt;&gt; = mutableStateOf(listOf())
    val query = mutableStateOf(&quot;&quot;)
    val selectedCategory: MutableState&lt;FoodCategory?&gt; = mutableStateOf(null)
  
    init {
      newSearch()
    }
  
    fun onQueryChanged(query: String) {
      this.query.value = query
    }
  
    fun newSearch() {
      viewModelScope.launch {
        recipes.value = repository.search(token = token, page = 1, query = query.value)
      }
    }
  
    fun onSelectedCategoryChanged(category: String) {
      val newCategory = getFoodCategory(category)
      selectedCategory.value = newCategory
      onQueryChanged(category)
    }
  }
  </code></pre>