mobile: Use new API on selection screens

mobile/lib/screens/home.dart

@@ -3,18 +3,36 @@ import 'package:musicus_database/musicus_database.dart';
 
 import '../backend.dart';
 import '../editors/tracks.dart';
+import '../widgets/lists.dart';
 
 import 'person.dart';
 import 'settings.dart';
 
-class HomeScreen extends StatelessWidget {
+class HomeScreen extends StatefulWidget {
+  @override
+  _HomeScreenState createState() => _HomeScreenState();
+}
+
+class _HomeScreenState extends State<HomeScreen> {
+  String _search;
+
   @override
   Widget build(BuildContext context) {
     final backend = Backend.of(context);
 
     return Scaffold(
       appBar: AppBar(
-        title: Text('Musicus'),
+        title: TextField(
+          autofocus: true,
+          onChanged: (text) {
+            setState(() {
+              _search = text;
+            });
+          },
+          decoration: InputDecoration.collapsed(
+            hintText: 'Composers',
+          ),
+        ),
         actions: <Widget>[
           PopupMenuButton(
             icon: const Icon(Icons.more_vert),
@@ -49,31 +67,22 @@ class HomeScreen extends StatelessWidget {
           ),
         ],
       ),
-      body: FutureBuilder<List<Person>>(
+      body: PagedListView<Person>(
-        future: backend.db.getPersons(),
+        search: _search,
-        builder: (context, snapshot) {
+        fetch: (page, search) async {
-          if (snapshot.hasData) {
+          return await backend.db.getPersons(page, search);
-            return ListView.builder(
-              itemCount: snapshot.data.length,
-              itemBuilder: (context, index) {
-                final person = snapshot.data[index];
-                return ListTile(
-                  title: Text('${person.lastName}, ${person.firstName}'),
-                  onTap: () => Navigator.push(
-                    context,
-                    MaterialPageRoute(
-                      builder: (context) => PersonScreen(
-                        person: person,
-                      ),
-                    ),
-                  ),
-                );
-              },
-            );
-          } else {
-            return Container();
-          }
         },
+        builder: (context, person) => ListTile(
+          title: Text('${person.lastName}, ${person.firstName}'),
+          onTap: () => Navigator.push(
+            context,
+            MaterialPageRoute(
+              builder: (context) => PersonScreen(
+                person: person,
+              ),
+            ),
+          ),
+        ),
       ),
     );
   }

mobile/lib/screens/person.dart

@@ -3,23 +3,42 @@ import 'package:musicus_database/musicus_database.dart';
 
 import '../backend.dart';
 import '../editors/person.dart';
+import '../widgets/lists.dart';
 
 import 'work.dart';
 
-class PersonScreen extends StatelessWidget {
+class PersonScreen extends StatefulWidget {
   final Person person;
 
   PersonScreen({
     this.person,
   });
 
+  @override
+  _PersonScreenState createState() => _PersonScreenState();
+}
+
+class _PersonScreenState extends State<PersonScreen> {
+  String _search;
+
   @override
   Widget build(BuildContext context) {
     final backend = Backend.of(context);
 
     return Scaffold(
       appBar: AppBar(
-        title: Text('${person.firstName} ${person.lastName}'),
+        title: TextField(
+          autofocus: true,
+          onChanged: (text) {
+            setState(() {
+              _search = text;
+            });
+          },
+          decoration: InputDecoration.collapsed(
+            hintText:
+                'Works by ${widget.person.firstName} ${widget.person.lastName}',
+          ),
+        ),
         actions: <Widget>[
           IconButton(
             icon: const Icon(Icons.edit),
@@ -28,7 +47,7 @@ class PersonScreen extends StatelessWidget {
                 context,
                 MaterialPageRoute(
                   builder: (context) => PersonEditor(
-                    person: person,
+                    person: widget.person,
                   ),
                   fullscreenDialog: true,
                 ),
@@ -37,36 +56,22 @@ class PersonScreen extends StatelessWidget {
           ),
         ],
       ),
-      body: FutureBuilder<List<WorkInfo>>(
+      body: PagedListView<WorkInfo>(
-        future: backend.db.getWorks(person.id),
+        search: _search,
-        builder: (context, snapshot) {
+        fetch: (page, search) async {
-          if (snapshot.hasData) {
+          return await backend.db.getWorks(widget.person.id, page, search);
-            return ListView.builder(
-              itemCount: snapshot.data.length,
-              itemBuilder: (context, index) {
-                final work = snapshot.data[index].work;
-
-                return ListTile(
-                  title: Text(work.title),
-                  onTap: () async {
-                    final workInfo = await backend.db.getWorkInfo(work);
-
-                    Navigator.push(
-                      context,
-                      MaterialPageRoute(
-                        builder: (context) => WorkScreen(
-                          workInfo: workInfo,
-                        ),
-                      ),
-                    );
-                  },
-                );
-              },
-            );
-          } else {
-            return Container();
-          }
         },
+        builder: (context, workInfo) => ListTile(
+          title: Text(workInfo.work.title),
+          onTap: () => Navigator.push(
+            context,
+            MaterialPageRoute(
+              builder: (context) => WorkScreen(
+                workInfo: workInfo,
+              ),
+            ),
+          ),
+        ),
       ),
     );
   }

mobile/lib/screens/work.dart

@@ -4,6 +4,7 @@ import 'package:musicus_database/musicus_database.dart';
 import '../backend.dart';
 import '../editors/work.dart';
 import '../widgets/texts.dart';
+import '../widgets/lists.dart';
 
 class WorkScreen extends StatelessWidget {
   final WorkInfo workInfo;
@@ -36,34 +37,22 @@ class WorkScreen extends StatelessWidget {
           ),
         ],
       ),
-      body: FutureBuilder<List<RecordingInfo>>(
+      body: PagedListView<RecordingInfo>(
-        future: backend.db.getRecordings(workInfo.work.id),
+        fetch: (page, _) async {
-        builder: (context, snapshot) {
+          return await backend.client.getRecordings(workInfo.work.id, page);
-          if (snapshot.hasData) {
-            return ListView.builder(
-              itemCount: snapshot.data.length,
-              itemBuilder: (context, index) {
-                final recordingInfo = snapshot.data[index];
-                final recording = recordingInfo.recording;
-
-                return ListTile(
-                  title: PerformancesText(
-                    performanceInfos: recordingInfo.performances,
-                  ),
-                  onTap: () async {
-                    final tracks = backend.ml.tracks[recording.id];
-                    tracks.sort(
-                        (t1, t2) => t1.track.index.compareTo(t2.track.index));
-
-                    backend.player.addTracks(backend.ml.tracks[recording.id]);
-                  },
-                );
-              },
-            );
-          } else {
-            return Container();
-          }
         },
+        builder: (context, recordingInfo) => ListTile(
+          title: PerformancesText(
+            performanceInfos: recordingInfo.performances,
+          ),
+          onTap: () {
+            final tracks = backend.ml.tracks[recordingInfo.recording.id];
+            tracks.sort((t1, t2) => t1.track.index.compareTo(t2.track.index));
+
+            backend.player
+                .addTracks(backend.ml.tracks[recordingInfo.recording.id]);
+          },
+        ),
       ),
     );
   }