Riverpod: Simple way to ingest REST API - flutter

Question

I'm currently building an app that is ingesting the WordPress REST API to display blog posts. On initial app load, I want to have it pull initial data with a method to then pull more posts via user interaction. I currently have this working, however, my implementation seems complex and there may be a cleaner way to get this working. I based my implementation on this GitHub issue response. Here is what my code looks like:
In main.dart:
final blogRepository = FutureProvider((ref) async {
final posts = await getPosts();
return BlogService(posts);
},
);
final blogProvider = StateNotifierProvider<BlogService, List<BlogPost>>((ref) => throw UnimplementedError(
"Access to a [BlogService] should be provided through a [ProviderScope]."));
In blogservice.dart:
class BlogService extends StateNotifier<List<BlogPost>> {
final List<BlogPost> _posts;
BlogService(this._posts) : super(_posts);
List<BlogPost> get posts => _posts;
Future<void> morePosts(int length) async {
Response response;
var dio = Dio();
response = await dio.get('https://wordpress-site.com/wp-json/wp/v2/posts/?offset=' + length.toString());
var posts = (response.data as List);
state = [...state, ...posts.map((post) => BlogPost.fromJson(post)).toList()];
}
}
Future<List<BlogPost>> getPosts() async {
Response response;
var dio = Dio();
response = await dio.get('https://wordpress-site.com/wp-json/wp/v2/posts/');
var posts = (response.data as List);
return posts.map((post) => BlogPost.fromJson(post)).toList();
}
I think a better way of doing this would be to use AsyncValue, however, I wasn't able to find any good reference implementations consuming an API using this.

Answer 1

This is an example using AsyncValue - It eliminates the repository
Have your service.dart file like this:
final blogServiceProvider = Provider<BlogService>((ref) => BlogService());
class BlogService {
Future<AsyncValue<List<BlogPost>>> getBlogPost() async {
try {
var dio = Dio();
Response response = await dio.get('https://wordpress-site.com/wp-json/wp/v2/posts/');
var posts = (response.data as List);
List<BlogPost> list = posts.map<BlogPost>((post) => BlogPost.fromJson(post)).toList();
return AsyncData(list);
} catch (e) {
return AsyncError("Something went wrong");
}
}
}
And your provider like so:
final blogNotifierProvider = StateNotifierProvider<BlogNotifier, AsyncValue<List<BlogPost>>>((ref){
BlogService _service = ref.read(blogServiceProvider);
return BlogNotifier(_service);
});
class BlogNotifier extends StateNotifier<AsyncValue<List<BlogPost>>> {
BlogNotifier(this._service) : super(AsyncLoading()) {
getPosts();
}
final BlogService _service;
void getPosts() async {
state = await _service.getBlogPost();
}
}
Edit: To merge existing posts with new ones, try this:
class BlogService {
List<BlogPost> _posts = [];
Future<AsyncValue<List<BlogPost>>> getBlogPost() async {
try {
var dio = Dio();
Response response = await dio.get('https://wordpress-site.com/wp-json/wp/v2/posts/');
var posts = (response.data as List);
List<BlogPost> list = posts.map<BlogPost>((post) => BlogPost.fromJson(post)).toList();
_posts = list;
return AsyncData(list);
} catch (e) {
return AsyncError("Something went wrong");
}
}
Future<AsyncValue<List<BlogPost>>> morePosts() async {
try {
var dio = Dio();
Response response = await dio.get('https://wordpress-site.com/wp-json/wp/v2/posts/?offset=' + length.toString());
var posts = (response.data as List);
List<BlogPost> list = posts.map<BlogPost>((post) => BlogPost.fromJson(post)).toList();
_posts.addAll(list);
return AsyncData(_posts);
} catch (e) {
return AsyncError("Something went wrong");
}
}
}
And the notifier class would be:
class BlogNotifier extends StateNotifier<AsyncValue<List<BlogPost>>> {
BlogNotifier(this._service) : super(AsyncLoading()) {
getPosts();
}
final BlogService _service;
void getPosts() async {
state = await _service.getBlogPost();
}
void morePosts() async {
state = await _service.morePosts();
}
}

Answer 2

Please best wa create another class to provide data from Api and use drift Package
see my screens how i provide data from database (drift is sqlite DB)
This is my database class based on sqlite(drift)
import 'dart:io';
import 'package:drift/native.dart';
import 'package:mobile_nsk/models/policy/driver.dart';
import 'package:mobile_nsk/models/policy/driver_converter.dart';
import 'package:mobile_nsk/models/policy/holders.dart';
import 'package:mobile_nsk/models/policy/holders_converter.dart';
import 'package:mobile_nsk/models/policy/vehicle.dart';
import 'package:mobile_nsk/models/policy/vehicle_converter.dart';
import 'package:path/path.dart' as p;
import 'package:drift/drift.dart';
import 'package:path_provider/path_provider.dart';
part 'database.g.dart';
LazyDatabase _openConnection()=> LazyDatabase(()async{
final dbFolder = await getApplicationDocumentsDirectory();
final file = File(p.join(dbFolder.path, 'db.sqlite'));
return NativeDatabase(file,logStatements: true);
});
#DriftDatabase(tables: [Holders, Drivers, Vehicles])
class MyDatabase extends _$MyDatabase {
MyDatabase() : super(_openConnection());
// Для страхователя
Future<List<Holder>> getAllHolders() => select(holders).get();
Stream<List<Holder>> watchAllHolder() => select(holders).watch();
Future insertNewHolder(Holder holder) => into(holders).insert(holder, mode: InsertMode.insertOrReplace);
Future deleteHolder(Holder holder) => delete(holders).delete(holder);
Future<Holder> getHolderById(Holder holder)=> select(holders).getSingle();
Future insetData(Holder holder) => into(holders).insert(holder, mode: InsertMode.insertOrReplace);
Future updateHolder(Holder holder, int id, String phone) async
{
await update(holders)..where((tbl) => tbl.id.equals(id))..write(HoldersCompanion(phone: Value(phone)));
await into(holders).insert(holder, mode: InsertMode.insertOrReplace);
}
// Для Водителя
Future<List<Driver>> getAllDriver() => select(drivers).get();
Stream<List<Driver>> watchAllDriver() => select(drivers).watch();
Future insertNewDriver(Driver driver) => into(drivers).insert(driver, mode: InsertMode.insertOrReplace);
Future deleteDriver(Driver driver) => delete(drivers).delete(driver);
// Для транспорта
Future<List<Vehicle>> getAllVehicles() => select(vehicles).get();
Stream<List<Vehicle>> watchAllVehicle() => select(vehicles).watch();
Future insertNewVehicle(Vehicle vehicle) => into(vehicles).insert(vehicle, mode: InsertMode.insertOrReplace);
Future deleteVehicle(Vehicle vehicle) => delete(vehicles).delete(vehicle);
// всегда инкрементить версию схему если что то добавил/убрал/изменил/нахуевертил
#override
int get schemaVersion => 1;
}
this iss my holder model (ang generate by build_runner)
import 'package:drift/drift.dart';
import 'package:json_annotation/json_annotation.dart' as j;
import 'package:mobile_nsk/database/database.dart';
import 'package:mobile_nsk/models/policy/holders_converter.dart';
#UseRowClass(Holder)
class Holders extends Table{
IntColumn get id => integer()();
TextColumn get firstName =>text()();
TextColumn get middleName => text()();
TextColumn get lastName => text()();
TextColumn get legalName => text()();
IntColumn get isIndividual => integer()();
TextColumn get iin => text()();
IntColumn get isResident => integer()();
TextColumn get phone => text()();
TextColumn get email => text()();
TextColumn get address => text()();
IntColumn get documentTypeId => integer()();
TextColumn get documentNumber => text()();
TextColumn get documentIssueDate => text()();
TextColumn get classType => text().named("class")();
TextColumn get birthDate => text()();
BoolColumn get isExperienced => boolean()();
BoolColumn get isPrivileged => boolean()();
TextColumn get holders =>
text().map(const HolderConverter()).nullable()();
#override
Set<Column> get primaryKey=> {id};
}
#j.JsonSerializable()
class Holder implements Insertable<Holder>{
final int id;
final String firstName;
final String middleName;
final String lastName;
final String legalName;
final int isIndividual;
final String iin;
final int isResident;
final String phone;
final String email;
final String address;
final int documentTypeId;
final String documentNumber;
final String documentIssueDate;
#j.JsonKey(name: "class")
final String classType;
final String birthDate;
final bool isExperienced;
final bool isPrivileged;
const Holder(this.id, this.firstName, this.middleName, this.lastName, this.legalName, this.isIndividual, this.iin, this.isResident, this.phone, this.email, this.address, this.documentTypeId, this.documentNumber, this.documentIssueDate, this.classType, this.birthDate, this.isExperienced, this.isPrivileged);
factory Holder.fromJson(Map<String, dynamic>json)=> Holder(
json['id'] as int,
json['firstName'] as String? ?? "",
json['middleName'] as String? ?? "",
json['lastName'] as String? ?? "",
json['legalName'] as String? ?? "",
json['isIndividual'] as int,
json['iin'] as String? ?? "",
json['isResident'] as int? ?? 0,
json['phone'] as String? ?? "",
json['email'] as String? ?? "",
json['address'] as String? ?? "",
json['documentTypeId'] as int? ?? 0,
json['documentNumber'] as String? ?? "",
json['documentIssueDate'] as String? ?? "",
json['class'] as String? ?? "",
json['birthDate'] as String? ?? "",
json['isExperienced'] as bool? ?? false,
json['isPrivileged'] as bool? ?? false,
);
Map<String, dynamic>toJson()=>{
'id': id,
'firstName':firstName,
'middleName': middleName,
'lastName': lastName,
'legalName': legalName,
'isIndividual': isIndividual,
'iin': iin,
'isResident': isResident,
'phone': phone,
'email': email,
'address': address,
'documentTypeId': documentTypeId,
'documentNumber': documentNumber,
'documentIssueDate': documentIssueDate,
'class': classType,
'birthDate': birthDate,
'isExperienced': isExperienced,
'isPrivileged': isPrivileged,
};
#override
Map<String, Expression> toColumns(bool nullToAbsent) {
return HoldersCompanion(
id: Value(id),
firstName: Value(firstName),
middleName: Value(middleName),
lastName: Value(lastName),
legalName: Value(legalName),
isIndividual: Value(isIndividual),
iin: Value(iin),
isResident: Value(isResident),
phone: Value(phone),
email: Value(email),
address: Value(address),
documentTypeId: Value(documentTypeId),
documentNumber: Value(documentNumber),
documentIssueDate: Value(documentIssueDate),
classType: Value(classType),
birthDate: Value(birthDate),
isExperienced: Value(isExperienced),
isPrivileged: Value(isPrivileged)
).toColumns(nullToAbsent);
}
}
this is my code inser from api to database
import 'dart:convert';
import 'dart:developer';
import 'package:http/http.dart' as http;
import 'package:mobile_nsk/database/database.dart';
import 'package:mobile_nsk/models/policy/holders.dart';
class HolderProvider {
String baseUrl = 'http://172.16.3.49:9096/api/v1';
Future<void> getHolder(
String iin,MyDatabase database
) async {
final response = await http.get(
Uri.parse(baseUrl + '/Customer/get_full_client?iin=$iin'),
headers: {'Content-Type': 'application/json'});
if (jsonDecode(response.body)['isExperienced'] != false) {
database.insertNewHolder(Holder.fromJson(jsonDecode(response.body)));
} else {
throw Exception();
}
}
}