How to show a long loading operation?

In our Material-based app, we have integrated a speech recognition service. Typically when a user reopens our app, the speech recognition session needs to be resumed by either (1) reconnecting, which takes around 1-3 seconds or (2) starting a new session, which can take up to 10 seconds.

The speech recognition is an important part of our app, but the app is still partly usable without it (for example navigation could still work).

For the short reconnecting operation, our idea is to show show a circular indeterminate loader (https://material.google.com/components/progress-activity.html#progress-activity-types-of-indicators) instead of the normal recording button:

enter image description here

I have three questions:

  1. Do you think this UI is adequate?
  2. For the long running restarting operation, would it make sense to indicate what the application is doing (snackbar? tooltip?) or show a dialog (that will block the application) with a determinate loader so that users know how long they (roughly) have to wait?
  3. Do you have any other ideas how to implement this within Material?
Tags: