Flutter - Riverpod. Save response from http in a provider

Question

I new to Riverpod, and I have a basic question.

On the start up of my app, I make an http to load a preload. This returns a Json response, with basic stings and lists of string, data that is used around the app.

I make the request like this:

class PreLoadApi {

  getPreloadList() {

http.get(url,
        headers:  {HttpHeaders.contentTypeHeader: "application/json", HttpHeaders.authorizationHeader: "Bearer $token"}
    ).then((http.Response response) {
      int statusCode = response.statusCode;

      print(statusCode);

      log("2124: PreLoad. response.body:${response.body}");

      var data = json.decode(response.body);

      String name = data['name']

      *** Here I want to save the string "name" to a provider. ***

}

Now I want to save this String name in a provider. I would like to make a provider like this:

final nameProvider = StateProvider((ref)=> name); 

I want this, so that this string will be available all over the app.

However, providers have to been defined top level, so I'm not sure how to get the data there?

Meaning, in the above http request I make, in the .then function which is called on the result of the request, I want to store there the value into a provider. How to I create a provider there? Since the provider is global, I don't know how to save the result data String into the provider

I hope the question is clear, and thanks for the help!

Answer 1

To read a provider, you need a WidgetRef. You can pass it on getPreloadList . In this case it will be

final nameProvider = StateProvider.autoDispose((ref) => "");

class PreLoadApi {
  getPreloadList(WidgetRef ref) {
    //Future.delayed will be your http.get
    Future.delayed(Duration(seconds: 3)).then((value) {
      ref.read(nameProvider.notifier).state = "new Value";
    });
  }
}

To have a widgetRef you can wrap the widget with Consumer

 return Consumer(
      builder: (context, ref, child) => Scaffold(
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            PreLoadApi api = PreLoadApi();
            api.getPreloadList(ref);
          },
        ),
     body: Text(ref.watch(nameProvider)),

There are others way handling this like getting text from future instead of passing WidgetRef. Also check StateNotifierProvider, ChangeNotifierProvider.

You can start from riverpod.dev