Why does cubit result show before using the second Textfield?

Question

The goal of this app is to take input from the First Text Field and then scramble it in the second screen. The user is then prompted to unscramble and input it into Second TextField. If the user's second_text_field input matches that in the firs_text_field then the UI should display 'OKAY'; otherwise, 'Not Okay'. It seems to me that the variable mycontroller stores nothing when it reaches the text widget that is under BlockBuilder. Here is the snapshot:

Here is the relevant screen code:

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

  import 'package:rafia_unscramble_demo/cubit/sentence_cubit.dart';

  class ScrambledUnscrambled extends StatelessWidget {
  final String? userInputFromFirstTextField;
  //final String? secondSTring;

  ScrambledUnscrambled({
  required this.userInputFromFirstTextField,
  //this.secondSTring,
  });

  @override
  Widget build(BuildContext context) {
  String str = "";
  final mycontroller = TextEditingController();

  List<String> inputs = userInputFromFirstTextField!.split(" ");
  String shuffledWords(List<String> input) {
    input.shuffle();
    // print(input);
    return input.join(" ");
  }

  return BlocProvider<SentenceCubit>(
    create: (context) => SentenceCubit(),
    child: Scaffold(
      appBar: AppBar(
        title: const Text('Unscramble'),
      ),
      body: Column(
        children: [
          Card(
            margin: const EdgeInsets.only(top: 50),
            child: Container(
              alignment: Alignment.center,
              width: double.infinity,
              height: 100,
              color: Colors.blueAccent,
              padding: const EdgeInsets.all(15),
              child: Text(
                shuffledWords(inputs),
                style: const TextStyle(
                  fontSize: 20,
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
            ),
          ),
          const SizedBox(
            width: 20,
          ),
          Container(
            padding: const EdgeInsets.all(20),
            alignment: Alignment.center,
            child: TextField(
              controller: mycontroller,
              onChanged: (String text) {},
              decoration: InputDecoration(
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(10),
                ),
                hintText: 'Please, enter a grammatically correct sentence.',
                labelText: 'Second Input',
                labelStyle: TextStyle(
                  fontSize: 24,
                  color: Colors.blue[900],
                ),
              ),
            ),
          ),
          ElevatedButton(
            onPressed: () {
              str = mycontroller.text;
            },
            child: const Text("Submit"),
          ),
          if (str == mycontroller.text)
            BlocBuilder<SentenceCubit, SentenceState>(
              builder: (context, state) {
                return Container(
                  color: Colors.blueAccent,
                  padding: const EdgeInsets.all(20),
                  width: double.infinity,
                  height: 100,
                  child: Text(
                    BlocProvider.of<SentenceCubit>(context).checkForError(
                      str,
                      userInputFromFirstTextField!,
                    ),
                  ),
                );
              },
            ),
        ],
      ),
    ),
  );
  }
  }

Here is the cubit part: SentenceState:

    part of 'sentence_cubit.dart';

@immutable
abstract class SentenceState {}

class SentenceInitial extends SentenceState {
  final String textInput;
  SentenceInitial({
    this.textInput = "",
  });
}

class Success extends SentenceState {
  final String okay;
  Success({
    required this.okay,
  });
}

class Failed extends SentenceState {
  final String notOkay;
  Failed({
    required this.notOkay,
  });
}

SentenceCubit:

    import 'package:bloc/bloc.dart';
import 'package:flutter/material.dart';
import 'package:meta/meta.dart';

part 'sentence_state.dart';

class SentenceCubit extends Cubit<SentenceState> {
  //final String firstScreenText;
  // final String secondString;
  SentenceCubit(
      // this.firstScreenText,
      //this.secondString,
      )
      : super(SentenceInitial());

  String checkForError(String getSecondText, String getFirstString) {
    // getSecondText = secondString;
    final okay = Success(okay: "Okay");
    final notOkay = Failed(notOkay: "Not Okay");

    if (getSecondText == getFirstString) {
      return okay.okay;
    } else if (getSecondText == " ") {
      return " ";
    } else {
      return notOkay.notOkay;
    }
  }
}

Answer 1

} else if (getSecondText == " ") {

this will only be true if the second text is a white space, I am guessing this is a typo that is causing your error.