displayed items on detail view

lib/assets/example_data.dart

@@ -7,6 +7,5 @@ List<Checklist> checklists = [
     'Test1',
     'tiersntiersntsrien',
     DateTime.now(),
-    List.empty(),
   )
 ];

lib/models/checklist.dart

@@ -1,14 +1,10 @@
-import 'listitem.dart';
-
 class Checklist {
   final int id;
   final String ownerId;
   String title;
   String description;
   final DateTime createdTime;
-  List<Item> items;
 
-  Checklist(this.id, this.ownerId, this.title, this.description,
-      this.createdTime, List<Item>? items)
-      : items = items ?? [];
+  Checklist(
+      this.id, this.ownerId, this.title, this.description, this.createdTime);
 }

lib/pages/detail_checklist_page.dart

@@ -1,3 +1,5 @@
+import 'dart:js_interop';
+
 import 'package:briessenchecker/models/checklist.dart';
 import 'package:briessenchecker/models/listitem.dart';
 import 'package:briessenchecker/services/checklist_provider.dart';
@@ -15,10 +17,12 @@ class DetailChecklistPage extends StatefulWidget {
 }
 
 class _DetailChecklistPageState extends State<DetailChecklistPage> {
-  late Future<Checklist> _checklistFuture;
+  late Future<List<Object>> _checklistFutures;
   late final ChecklistProvider _checklistProvider;
-  late Checklist _currentChecklist;
+  Checklist? _checklist;
+  List<Item> _items = [];
   int? _selectedItemId;
+  String? pageTitle;
 
   @override
   void dispose() {
@@ -30,19 +34,31 @@ class _DetailChecklistPageState extends State<DetailChecklistPage> {
   void initState() {
     super.initState();
     _checklistProvider = Provider.of<ChecklistProvider>(context, listen: false);
-    _checklistFuture =
-        DbHelper.getChecklistById(_checklistProvider.selectedChecklistId!);
+    _checklistFutures = initFutures(_checklistProvider.selectedChecklistId!);
   }
 
   Widget _futureBuilder(
-      BuildContext context, AsyncSnapshot<Checklist> snapshot) {
+      BuildContext context, AsyncSnapshot<List<Object>> snapshot) {
     if (snapshot.hasData) {
-      _currentChecklist = snapshot.data!;
-      String title = _currentChecklist.title;
+      _checklist = snapshot.data!.first as Checklist;
+      _items = snapshot.data!.last as List<Item>;
+      String title = _checklist!.title;
+      if (pageTitle == null) {
+        WidgetsBinding.instance
+            .addPostFrameCallback((_) => setState(() => pageTitle = title));
+      }
       return Column(
         children: [
-          Text(title == '' ? 'Unnamed ${_currentChecklist.id}' : title),
-          Text(_currentChecklist.description),
+          Text(title == '' ? 'Unnamed ${_checklist!.id}' : title),
+          Text(_checklist!.description),
+          SizedBox(
+            width: 500,
+            height: 500,
+            child: ListView.builder(
+              itemCount: _items.length,
+              itemBuilder: _itemList,
+            ),
+          ),
         ],
       );
     } else if (snapshot.hasError) {
@@ -60,7 +76,7 @@ class _DetailChecklistPageState extends State<DetailChecklistPage> {
     TextEditingController titleCon = TextEditingController();
     TextEditingController descCon = TextEditingController();
     if (_selectedItemId != null) {
-      final item = _currentChecklist.items.elementAt(_selectedItemId!);
+      final item = _items.elementAt(_selectedItemId!);
       titleCon.text = item.title;
       descCon.text = item.description;
     }
@@ -103,8 +119,11 @@ class _DetailChecklistPageState extends State<DetailChecklistPage> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
+      appBar: AppBar(
+        title: Text(pageTitle ?? ''),
+      ),
       body: FutureBuilder(
-        future: _checklistFuture,
+        future: _checklistFutures,
         builder: _futureBuilder,
       ),
       floatingActionButton: FloatingActionButton(
@@ -113,4 +132,18 @@ class _DetailChecklistPageState extends State<DetailChecklistPage> {
       ),
     );
   }
+
+  Widget? _itemList(BuildContext context, int index) {
+    return ListTile(
+      title: Text(_items.elementAt(index).title),
+      subtitle: Text(_items.elementAt(index).description),
+    );
+  }
+
+  Future<List<Object>> initFutures(int checklistId) async {
+    return Future.wait([
+      DbHelper.getChecklistById(checklistId),
+      DbHelper.getItemsByChecklistId(checklistId),
+    ]);
+  }
 }

lib/services/dbhelper.dart

@@ -1,14 +1,14 @@
 import 'package:flutter_dotenv/flutter_dotenv.dart';
 import 'package:supabase_flutter/supabase_flutter.dart';
-import '../assets/example_data.dart' as ed;
 import '../models/checklist.dart';
 import '../models/listitem.dart';
 
 class DbHelper {
-  static late final SupabaseClient _client;
+  static const checkedItemsTableName = 'checkedItems';
   static const checklistsTableName = 'checklists';
   static const itemsTableName = 'items';
-  static const checkedItemsTableName = 'checkedItems';
+
+  static late final SupabaseClient _client;
 
   static Future<void> init() async {
     await Supabase.initialize(
@@ -42,7 +42,6 @@ class DbHelper {
         element['title'],
         element['description'],
         DateTime.parse(element['createdTime']),
-        [],
       );
       checklists.add(cl);
     }
@@ -72,19 +71,43 @@ class DbHelper {
     return res.last['id'] as int;
   }
 
+  static Future<List<Item>> getItemsByChecklistId(int checklist_id) async {
+    final List<Item> items = [];
+
+    final itemRes = await _client
+        .from(itemsTableName)
+        .select<List<Map<String, dynamic>>>()
+        .eq('checklist_id', checklist_id);
+
+    for (final item in itemRes) {
+      items.add(
+        Item(
+          item['id'],
+          item['owner_id'],
+          item['title'],
+          item['description'],
+          DateTime.parse(item['createdTime']),
+          null,
+        ),
+      );
+    }
+
+    return items;
+  }
+
   static Future<Checklist> getChecklistById(int id) async {
-    final res = await _client
+    final checklistRes = await _client
         .from(checklistsTableName)
         .select<Map<String, dynamic>>()
         .eq('id', id)
         .single();
+
     return Checklist(
-      res['id'],
-      res['ownerId'],
-      res['title'],
-      res['description'],
-      DateTime.parse(res['createdTime']),
-      [],
+      checklistRes['id'],
+      checklistRes['ownerId'],
+      checklistRes['title'],
+      checklistRes['description'],
+      DateTime.parse(checklistRes['createdTime']),
     );
   }