How to add a circular progress indicator while doing flutter firebase phone auth with getx controler?

Question

I am doing firebase phone auth with getx controler. I make a getx controler to handle the auth state. How do i give a response to users that there auth is doing by a cricular progress indicator?? In the phoneauth method i want to add a cricular progress indicator by which when the user click the create account button a circular progress indicator start until the firebase auth dosent finished. Please Help?

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:live_exam/Assets_Widget/logintextfeild.dart';
import 'package:live_exam/homepage.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:live_exam/login.dart';
import 'package:live_exam/loginfinal.dart';

import '../userdata/users.dart';

class AuthControler extends GetxController {
  //these are textfeild controler for sent user data and handle user to firestore.
  TextEditingController namecontroler = TextEditingController();
  TextEditingController mobilecontroler = TextEditingController();
  TextEditingController emailControler = TextEditingController();
  TextEditingController addressControler = TextEditingController();
  TextEditingController schoolnameControler = TextEditingController();
  TextEditingController countrycode = TextEditingController();
  TextEditingController pinControler = TextEditingController();

  FirebaseAuth auth = FirebaseAuth.instance;

  RxBool isloading = false.obs;

  phoneauth(context) async {
    isloading.isTrue;
    await auth
        .verifyPhoneNumber(
            phoneNumber: mobilecontroler.text,
            timeout: const Duration(seconds: 60),
            verificationCompleted: ((PhoneAuthCredential credential) async {
              var result = await auth.signInWithCredential(credential);
              final firestore = FirebaseFirestore.instance;
              User? user = result.user;
              firestore.collection("Users").doc(user!.uid).set({
                "name": namecontroler.text,
                "phone": mobilecontroler.text,
                "email": emailControler.text,
                "address": addressControler.text,
                "institute": schoolnameControler.text
              });
              if (user != null) {
                Get.offAll(HomePage());
              }
            }),
            verificationFailed: (FirebaseException exception) {
              print(exception);
              Get.snackbar("Live exam", exception.toString(),
                  duration: Duration(seconds: 5));
            },
            codeSent: ((String verificationId, int? forceResendingToken) {
              final alertbox = AlertDialog(
                content: Container(
                  width: 291.w,
                  height: 349.h,
                  child: Column(
                    children: [
                      SizedBox(
                        height: 31.h,
                      ),
                      Text(
                        "Enter your verification OTP",
                        style: TextStyle(
                            fontSize: 18.sp,
                            fontWeight: FontWeight.bold,
                            fontFamily: 'Jaldi'),
                      ),
                      SizedBox(
                        height: 19.h,
                      ),
                      OtpScreeen(
                          controller: pinControler, hintText: "Enter OTP"),
                      SizedBox(
                        height: 20.h,
                      ),
                      ShahedButton3(
                          ontap: () async {
                            try {
                              FocusManager.instance.primaryFocus?.unfocus();
                              Get.snackbar("Live Exam", "verifing.. OTP",
                                  duration: Duration(seconds: 2));
                              final smscode = pinControler.text;
                              PhoneAuthCredential phoneAuthCredential =
                                  PhoneAuthProvider.credential(
                                      verificationId: verificationId,
                                      smsCode: smscode);
                              var result = await auth
                                  .signInWithCredential(phoneAuthCredential);
                              final firestore = FirebaseFirestore.instance;
                              User? user = result.user;
                              firestore.collection("Users").doc(user!.uid).set({
                                "name": namecontroler.text,
                                "phone": mobilecontroler.text,
                                "email": emailControler.text,
                                "address": addressControler.text,
                                "institute": schoolnameControler.text
                              });
                              if (user != null) {
                                Get.offAll(HomePage());
                              }
                            } on FirebaseAuthException catch (e) {
                              Get.snackbar("Live", e.toString(),
                                  duration: Duration(seconds: 5));
                            }
                          },
                          titile: "Submit")
                    ],
                  ),
                ),
              );

              showDialog(
                  context: context,
                  builder: ((context) {
                    return alertbox;
                  }));
            }),
            codeAutoRetrievalTimeout: ((verificationId) {}))
        .then((value) => isloading.isFalse);
  }

and here i try to show the the progress indicator!

Obx(
                          () => authControler.isloading.isTrue
                              ? CircularProgressIndicator()
                              : ShahedButton(
                                  ontap: () async {
                                    FocusManager.instance.primaryFocus
                                        ?.unfocus();
                                    if (formkey.currentState!.validate()) {
                                      await authControler.phoneauth(context);
                                    }

                                    // Get.to(LogInPageOtp());
                                  },
                                  titile: "Create Account"),
                        ),

Answer 1

When you start authentication in phoneauth method, there is

isloading.isTrue;

it should be like this:

isloading.value = true;

Also update the codeAutoRetrievalTimeout too.