How to listen message event from real-time database and show them in banner or snackbar?

// Automatic FlutterFlow imports
import '/backend/backend.dart';
import '/backend/schema/structs/index.dart';
import '/flutter_flow/flutter_flow_theme.dart';
import '/flutter_flow/flutter_flow_util.dart';
import '/custom_code/actions/index.dart'; // Imports other custom actions
import '/flutter_flow/custom_functions.dart'; // Imports custom functions
import 'package:flutter/material.dart';
// Begin custom action code
// DO NOT REMOVE OR MODIFY THE CODE ABOVE!

import 'dart:async';

// Set your action name, define your arguments and return parameter,
// and then add the boilerplate code using the green button on the right!
import 'package:firebase_database/firebase_database.dart';

Future<void> initListener(BuildContext context) async {
  final database = FirebaseDatabase.instance;

  DatabaseReference _messagesRef = database.ref('messages');
  database.setPersistenceCacheSizeBytes(10000000);

  await _messagesRef.keepSynced(true);

  try {
    final messageSnapshot = await _messagesRef.get();

    print(
      'Connected to directly configured database and read '
      '${messageSnapshot.value}',
    );
  } catch (err) {
    print(err);
  }

  _messagesRef.onValue.listen(
    (DatabaseEvent event) {
      final data = event.snapshot.value as Map<String, dynamic>?;

      if (data != null) {
        var snackBar = SnackBar(
          content: Text('${data['message']['info']}'),
          behavior: SnackBarBehavior.floating,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(24),
          ),
          margin: EdgeInsets.only(
              bottom: MediaQuery.of(context).size.height - 100,
              right: 20,
              left: 20),
        );
        ScaffoldMessenger.of(context).showSnackBar(snackBar);
      } else {
        return;
      }
    },
    onError: (Object o) async {
      final error = o as FirebaseException;
      var snackBar = SnackBar(
        content: Text('$error'),
        behavior: SnackBarBehavior.floating,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(24),
        ),
        margin: EdgeInsets.only(
            bottom: MediaQuery.of(context).size.height - 100,
            right: 20,
            left: 20),
      );
      ScaffoldMessenger.of(context).showSnackBar(snackBar);
    },
  );
}