Is it possible to allow multiple entities to use one global ChangeNotifier in flutter?

Question

I'm designing an application that allows users to view content of their desired integrations (this could be anything such as twitter, bbc.co.uk etc...). I have a settings page in which I would like the user to authenticate the services they would like to integrate simply by entering an api key.

Currently, there are four services I have defined, each service is a separate Entity class with attributes such as: entityNotifier; title; apiToken; accountType; expiryDate. Each entity has its own update button. Whenever a valid apiToken is entered, shared preferences is updated to hold the new key relevant to that entity (which is uniquely identified by its name).

So far I have created one EntityChangeNotifier as such:

class EntityNotifier extends ChangeNotifier {
  final String entityName;
  final String entityTitle;
  String _api_token = "N/A";
  String _accountType = "N/A";
  String _expiryDate = "N/A";

  EntityNotifier({required this.entityName, required this.entityTitle});

  Future<void> loadDataFromPreferences() async {
    final prefs = await SharedPreferences.getInstance();

    _accountType = prefs.getString('{$entityName}_account_type') ?? 'N/A';
    _expiryDate = prefs.getString('{$entityName}_expiry_date') ?? 'N/A';

    notifyListeners();
  }

  Future<void> setValues(String accountType, String expiryDate) async {
    final prefs = await SharedPreferences.getInstance();
    await prefs.setString('{$entityName}_account_type', accountType);
    await prefs.setString('{$entityName}_expiry_date', expiryDate);

    _accountType = accountType;
    _expiryDate = expiryDate;

    notifyListeners();
  }
}

Each notifier is instantiated within a multi provider in the page assembly:

@override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider<EntityNotifier>(
          create: (_) => EntityNotifier(entityName: '', entityTitle: "")..loadDataFromPreferences(),
        ),
        ChangeNotifierProvider<EntityNotifier>(
          create: (_) => EntityNotifier(entityName: '', entityTitle: "")..loadDataFromPreferences(),
        ),
        ChangeNotifierProvider<EntityNotifier>(
          create: (_) => EntityNotifier(entityName: '', entityTitle: "")..loadDataFromPreferences(),
        ),
        ChangeNotifierProvider<EntityNotifier>(
          create: (_) => EntityNotifier(entityName: '', entityTitle: "")..loadDataFromPreferences(),
        ),
      ],
      child: _SettingsPageContent(),
    );
  }
}

Multiple notifiers are then built in the page state:

Consumer<EntityNotifier>(
              builder: (_, entityNotifier, __) {
                return EntityColumn(
                  entityName: "value1",
                  entityId: 0,
                  entityNotifier: entityNotifier, //this is the param passed through
                );
              },
            )

Currently, when a successful update occurs for one of the entities, all the changes are reflected in all of the entities. That makes me believe that they are all using the same change notifier. Which begs the question, how do I create them independently? I really don't want to make individual classes for each notifier of a service, so is there a way to use one class and apply unique logic?

So far I have attempted to use one global class that extends ChangeNotifiers. Although in practice, they all are unique entities, they all share the same data when they are updated which means none of them are unique.

Example:

TikTok
<Input field to enter key> : 97233632
Current Value: N/A
<Button Update>

Instagram
<Input field to enter key>
Current Value: N/A
<Button Update>

Facebook
<Input field to enter key>
Current Value: N/A
<Button Update>

Twitter
<Input field to enter key>
Current Value: N/A
<Button Update>

Output:

TikTok
<Input field to enter key>
Current Value: 97233632
<Button Update>

Instagram
<Input field to enter key>
Current Value: 97233632
<Button Update>

Facebook
<Input field to enter key>
Current Value: 97233632
<Button Update>

Twitter
<Input field to enter key>
Current Value: 97233632
<Button Update>

score 0 · Answer 1 · answered Jun 25 '23 at 21:40

Is it possible to allow multiple entities to use one global ChangeNotifier in Flutter?

YES if entities mean State, but in your case NO

if you want to treat each entity as an independent implementation, you must create a method for each impl. For this case, you can manage one provider when storing or retrieving data, then distribute them accordingly at your presentation area, in this case, Instagram, Twitter, or Facebook or you can also evaluate each of them in their different methods.

store all entities as a single value to one Key, say userId, then when consuming call that key "userId" and distribute record

Thanks for the response, I'll work on this. If I have any more problems, I'll update the thread. — PyShah, Jun 25 '23 at 23:53

Is it possible to allow multiple entities to use one global ChangeNotifier in flutter?

1 Answers1