categories but ?

tp1/lib/favorite_page.dart

@@ -2,7 +2,14 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'app_state.dart';
 
-class FavoritePage extends StatelessWidget {
+class FavoritePage extends StatefulWidget {
+  @override
+  _FavoritePageState createState() => _FavoritePageState();
+}
+
+class _FavoritePageState extends State<FavoritePage> {
+  String? selectedCategory;
+
   @override
   Widget build(BuildContext context) {
     TindBookState state = Provider.of<TindBookState>(context);
@@ -10,6 +17,22 @@ class FavoritePage extends StatelessWidget {
     return Scaffold(
       appBar: AppBar(
         title: Text('Favorite Books'),
+        actions: [
+          DropdownButton<String>(
+            value: selectedCategory,
+            onChanged: (String? newValue) {
+              setState(() {
+                selectedCategory = newValue;
+              });
+            },
+            items: state.uniqueCategories.map((String category) {
+              return DropdownMenuItem<String>(
+                value: category,
+                child: Text(category),
+              );
+            }).toList(),
+          ),
+        ],
       ),
       body: GridView.builder(
         gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
@@ -18,19 +41,23 @@ class FavoritePage extends StatelessWidget {
         ),
         itemCount: state.favorites.length,
         itemBuilder: (context, index) {
+          Map<String, dynamic> book = state.getFav(index);
+          if (selectedCategory != null && book['category'] != selectedCategory) {
+            return Container(); // Return an empty container if the book doesn't belong to the selected category
+          }
           return GestureDetector(
             onTap: () {
               Navigator.push(
                 context,
                 MaterialPageRoute(
-                  builder: (context) => ImageScreen(book: state.getFav(index)),
+                  builder: (context) => ImageScreen(book: book),
                 ),
               );
             },
             child: Padding(
               padding: const EdgeInsets.all(8.0),
               child: Image.asset(
-                state.getFav(index)['image'],
+                book['image'],
                 fit: BoxFit.cover,
               ),
             ),