Mobx duvida com funcao async

[LucasMendestr]

Olá pessoal tudo bem?
Estou com problemas para receber um dado vindo de uma funcao async
tenho uma tela que exibe uma lista de contas (tiles):
class _LedgerViewPageState extends State {
@OverRide
void initState() {
GetIt.I.get().getAllLedgers();
super.initState();
}

final ledgerViewController = GetIt.I.get();
@OverRide
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xffDEDACF),
appBar: const CustomAppBar(title: 'Contas'),
drawer: const CustomDrawer(),
body: Observer(builder: () {
return GroupedListView<dynamic, String>(
elements: ledgerViewController.ledgers,
groupBy: (e) => e.clas,
groupHeaderBuilder: (v) => Container(
padding: const EdgeInsets.all(8),
child: Text(v.clas),
),
itemBuilder: (, e) => LedgerTile(ledger: e),
);
}),
floatingActionButton: FloatingActionButton(
backgroundColor: const Color(0xff46406C),
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(builder: (context) => const LedgerEditPage()));
},
child: const Icon(
Icons.add,
),
),
bottomNavigationBar: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.end,
children: const [AdvertisementWidget(), SizedBox(height: 6)],
),
);
}
}

segue o codigo do tile

  final ledgerTileController = GetIt.I.get<LedgerTileController>();
  final TextEditingController nameController = TextEditingController();
  var real = NumberFormat.currency(locale: 'pt_BR', name: 'R\$');

  @override
  void initState() {
    GetIt.I.get<LedgerTileController>().getCategoryName(categoryId: widget.ledger.categoryId);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final widthMax = MediaQuery.of(context).size.width;
    GetIt.I.get<LedgerTileController>().getCategoryName(categoryId: widget.ledger.categoryId);
    if (ledgerTileController.isLoading == true) {
      return const Center(child: CircularProgressIndicator());
    } else {
      return Card(
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
        color: const Color(0xFF46406C),
        child: InkWell(
          splashColor: Colors.blue,
          onTap: () {
            Navigator.of(context).push(MaterialPageRoute(builder: (context) => EntryViewPage(ledgerName: widget.ledger.ledgerName)));
          },
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              const SizedBox(width: 10),
              SizedBox(
                width: widthMax * 0.8,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const SizedBox(height: 10),
                    Text(
                      widget.ledger.clas,
                      style: const TextStyle(color: Colors.white),
                    ),
                    Text(
                      ledgerTileController.categoryName!,
                      style: const TextStyle(color: Colors.white),
                    ),
                    Text(
                      widget.ledger.ledgerName,
                      style: const TextStyle(color: Colors.white),
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [const Text('Saldo atual R\$:', style: TextStyle(color: Colors.white)), Text(real.format(widget.ledger.balance), style: const TextStyle(color: Colors.white))],
                    ),
                    const SizedBox(height: 10),
                  ],
                ),
              ),
            ],
          ),
        ),
      );
    }
  }
}```

e do controller:

```abstract class _LedgerTileControllerBase with Store {
  final categoryStore = GetIt.I.get<CategoryStore>();

  @observable
  bool isLoading = false;

  @observable
  String? categoryName;

  @action
  Future<void> getCategoryName({required int categoryId}) async {
    isLoading = true;
    Category? category = await categoryStore.getCategory(categoryId: categoryId);
    categoryName = category!.categoryName;
    isLoading = false;
  }
}```

acontece que quando ele chama a função getCatogoryName(antes estava tentando usar no initState) ele muda o isLoading para true, porem como é async o widget nao atuliza se nada acontecer no app(tipo ir e voltar da pagina).

[EduardoM-GO]

Ola @LucasMendestr, tu pode utilizar o widget FutureBuilder para atualizar a tela quando for finalizado a função getCategoryName.
Ficaria assim:

`@override
Widget build(BuildContext context) {
final widthMax = MediaQuery.of(context).size.width;

return FutureBuilder(
  future: GetIt.I
      .get<LedgerTileController>()
      .getCategoryName(categoryId: widget.ledger.categoryId),
  builder: (context, snapshot) {
    if (ledgerTileController.isLoading == true) {
      return const Center(child: CircularProgressIndicator());
    } else {
      return Card(
        shape:
            RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
        color: const Color(0xFF46406C),
        child: InkWell(
          splashColor: Colors.blue,
          onTap: () {
            Navigator.of(context).push(MaterialPageRoute(
                builder: (context) =>
                    EntryViewPage(ledgerName: widget.ledger.ledgerName)));
          },
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              const SizedBox(width: 10),
              SizedBox(
                width: widthMax * 0.8,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const SizedBox(height: 10),
                    Text(
                      widget.ledger.clas,
                      style: const TextStyle(color: Colors.white),
                    ),
                    Text(
                      ledgerTileController.categoryName!,
                      style: const TextStyle(color: Colors.white),
                    ),
                    Text(
                      widget.ledger.ledgerName,
                      style: const TextStyle(color: Colors.white),
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        const Text('Saldo atual R\$:',
                            style: TextStyle(color: Colors.white)),
                        Text(real.format(widget.ledger.balance),
                            style: const TextStyle(color: Colors.white))
                      ],
                    ),
                    const SizedBox(height: 10),
                  ],
                ),
              ),
            ],
          ),
        ),
      );
    }
  },
);

}`

[LucasMendestr]

Mutismo obrigado, funcionou certinho.