Cannot use "ref" after the widget was disposed - How to avoid the dependency of my providers from the ui part

[Robbley]

Hey,
I´m still learning how to utilize riverpod and ran into a problem I just cannot solve.

My app is measuring volume levels and triggers recording on a condition. It works fine while the user stays on the Page which triggers the stream but i keep running into the "Unhandled Exception: Bad state: Cannot use "ref" after the widget was disposed." error, when i try to pop that page, the user should be able to navigate through the app while the process is still running.
I've tried to seperate the logic from the UI but have seemed to fail somewhere and just cannot wrap my head around how to solve this.

short breakdown of what it does:
starts listening to a stream, the callback function has a callback, in case of an event where noise threshold X was exceeded.

So here is my example code:

I've tried to minize the code:

frontend:

class ExamplePage extends ConsumerWidget {
   const ExamplePage({super.key});


@override
  Widget build(BuildContext context, WidgetRef ref) {

    final noiseState = ref.watch(isNoiseMeasuringProvider);
    final volume = ref.watch(volumeStateProvider);
    final threshold = ref.watch(thresholdProvider);



    return Scaffold(
      backgroundColor: Colors.blueGrey[700],
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [     
            
            /// WHILE RECORDING AND MEASURING
            if (noiseState == true && currentState == RecordState.record)
            Column(
              children: [
                Text(
                  'Lautstärke: ${volume.toStringAsFixed(2)} dB', // Format to two decimal places
                  style: TextStyle(fontSize: 23.sp, color: Colors.yellow[800]),
                ),
                SizedBox(
                  width: MediaQuery.of(context).size.width * 0.5,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      /// Stop Button
                      IconButton(onPressed: () => stopAll(ref),
                          icon: const Icon(Icons.stop_circle_outlined),
                      iconSize: 70, color: Colors.yellow[900]),
                    ],
                  ),
                ),
              ],
            )

            ///  WHILE NOT RECORDING BUT MEASURING
           else if(currentState == RecordState.stop && noiseState == true) // Not recording and noisemeter stopped
            Column(
              children: [
                /// Amplitude Text
                Text(
                  'Volume: ${volume.toStringAsFixed(2)} dB',
                  style: TextStyle(fontSize: 23.sp, color: Colors.yellow[800]),
                ),

                SizedBox(
                  width: MediaQuery.of(context).size.width * 0.5,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      /// Stop Button
                      IconButton(onPressed: () => stopAll(ref),
                          icon: const Icon(Icons.stop_circle_outlined),
                          iconSize: 70, color: Colors.yellow[900]),
                    ],
                  ),
                ),
              ],
            )

            /// WHILE NOT RECORDING AND NOT MEASURING
           else if (currentState == RecordState.stop && noiseState == false) // Not recording and noisemeter stopped
              SizedBox(
              width: MediaQuery.of(context).size.width * 0.5,
              child: ElevatedButton(
                onPressed: () => startAll(ref),
                style: ElevatedButton.styleFrom(
                  backgroundColor:Colors.yellow[700],
                  shadowColor:Colors.yellow[800],
                  elevation: 5,
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    const Icon(Icons.star),
                    const SizedBox(width: 8),
                    Text('StartMeasuring',
                    ),
                  ],
                ),
              ),
            ),
          }

This is the NoiseMeter itself

class NoiseMeterLogic {
  bool isNoiseMeasuring = false;
  NoiseReading? _latestReading;
  StreamSubscription<NoiseReading>? _noiseSubscription;
  late double _latestMean;
  NoiseMeter? noiseMeter;
  bool isRecording = false;
  bool beenStopped = false;

  NoiseMeterLogic(this.noiseMeter);

  Future<bool> checkPermission() async => await Permission.microphone.isGranted;

  Future<void> requestPermission() async => await Permission.microphone.request();

  Future<void> start(WidgetRef ref) async {
    if (!(await checkPermission())) await requestPermission();

    _noiseSubscription = noiseMeter!.noise.listen(
          (noiseReading) {
        onData(noiseReading, ref);
      },
      onError: onError,
    );

    ref.read(isNoiseMeasuringProvider.notifier).isNoiseMeasuringTrue();
  }
  
  void onData(NoiseReading noiseReading, WidgetRef ref) {
    double threshold = ref.read(thresholdProvider).value!.toDouble();
    RecordState currentState = ref.watch(recordingStateProvider);
    bool beenStopped = ref.watch(recordingStoppedProvider);
    bool isNoiseMeasuring = ref.watch(isNoiseMeasuringProvider);
    bool isRecording = ref.watch(isRecordingProvider);

    _latestReading = noiseReading;
    _latestMean = _latestReading!.meanDecibel;
    ref.read(volumeStateProvider.notifier).updateVolume(_latestMean);

    if (_latestMean >= threshold &&
        isNoiseMeasuring &&
        !isRecording &&
        currentState == RecordState.stop &&
        !beenStopped) {

      RecorderFunctions _thisRecorderClass = RecorderFunctions(ref.watch(currentRecorderProvider));
      ref.read(currentRecorderClassProvider.notifier).state = _thisRecorderClass;
      _thisRecorderClass.startRecording(ref);
      ref.read(isRecordingProvider.notifier).isRecordingTrue();

    } else if (beenStopped && isRecording) {
      ref.read(currentRecorderClassProvider).stopRecording(ref);
    }
  }

  void onError(Object error) {
    print('onDataError: $error');
    // Handle error appropriately here
  }

  }

The generation file for the providers:

/// Provider for the noise meter logic
@Riverpod(keepAlive: true)
class NoiseMeterNotifier extends _$NoiseMeterNotifier {
  @override
  NoiseMeterLogic build() {
    return NoiseMeterLogic(NoiseMeter());
  }
}

/// Provider for mean volume state
@Riverpod(keepAlive: true)
class VolumeState extends _$VolumeState {
  @override
  double build() {
    return 0.0;
  }

  void updateVolume(double value) {
    state = value;
  }
}

/// Provider for noise measuring state
@Riverpod(keepAlive: true)
class IsNoiseMeasuring extends _$IsNoiseMeasuring {
  @override
  bool build() {
    return false;
  }

  void isNoiseMeasuringTrue() {
    state = true;
  }

  void isNoiseMeasuringFalse() {
    state = false;
  }
}

And finally the function called to start measuring:

void startAll(WidgetRef ref) {
  final noiseMeterLogic = ref.read(noiseMeterNotifierProvider);

  noiseMeterLogic.start(ref);
  ref.read(isNoiseMeasuringProvider.notifier).isNoiseMeasuringTrue();
}

When navigating away from the page using navigator.pop, due to removing the frontend page from the tree, it throws the mentioned error at me. I do understand why but i just cannot figure out, how to kleep the stream and trigger functions "alive" while navigating through the app and after coming back to the frontend page, showing the current progress.

How to get rid of the dependency between my logic and the frontend page, is what's driving me crazy.
I've tried to create anything outside of the widget which is beeing disposed.

This is how i think my code is set up and why I thought my providers were indipendent from the frontend page.

In fact there is a lot of code which i left out but i was trying to keep it as short as possible and assume it is a problem with me not understandig how to properly seperate the NoiseMeter from the ui.

When pushing a new page insted of popping the current one, its working fine but i would prefer to keep the tree short and navigation straightforward, if possible.

In case I didn't meet the expectations how to ask questions, i already want to apologize, I`m a hobby programmer and might didn't understand this wasn't a riverpod issue, just the "ref" hinted me towards it. I've tried to google the issue and to ask LLM but couldn't find an answer which i was able to understand, or saw fitting for my specific issue.

Thanks in advance for help

[gdurandrexel]

The problem certainly comes from using a WidgetRef in onData, since this ref will probably be invalidated once the Widget it comes from is disposed.
Maybe you could store the ref from your provider in NoiseMeterLogic and use this, as it comes from an always alive provider.

class NoiseMeterLogic {
  final Ref ref;
  ...

  NoiseMeterLogic(this.noiseMeter, this.ref);
}

@Riverpod(keepAlive: true)
class NoiseMeterNotifier extends _$NoiseMeterNotifier {
  @override
  NoiseMeterLogic build() {
    return NoiseMeterLogic(NoiseMeter(), ref);
  }
}

Perhaps there is also a "cleaner" way to organize all this.