fix: remaining_loan_time ui and format

lib/src/providers/auth_provider.dart

@@ -182,13 +182,12 @@ class AuthProvider with ChangeNotifier {
   }
 
   Future<void> createMemberLoan(int memberId, int bookId, int loanDay) async {
-    final loanDate = DateTime.now();
-    final dueDay = loanDate.day + loanDay;
-    final dueDate = loanDate.add(Duration(days: dueDay));
+    final now = DateTime.now();
+    final dueDate = now.add(Duration(days: loanDay));
     final body = {
       "book": bookId,
       "member": memberId,
-      "loan_date": loanDate.toString(),
+      "loan_date": now.toString(),
       "due_date": dueDate.toString(),
     };
 

lib/src/widgets/loans/loan_item.dart

@@ -24,12 +24,16 @@ class LoanItem extends StatelessWidget {
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              Padding(
-                padding: const EdgeInsets.only(bottom: 10.0),
-                child: Badge(
-                  label: Text(
-                    remainingDays,
-                  ),
+              Container(
+                padding:
+                    const EdgeInsets.symmetric(vertical: 2.0, horizontal: 10.0),
+                margin: const EdgeInsets.only(bottom: 10.0),
+                decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(20.0),
+                    color: Theme.of(context).primaryColor),
+                child: Text(
+                  remainingDays,
+                  style: const TextStyle(fontSize: 12.0, color: Colors.white),
                 ),
               ),
               Padding(

lib/src/widgets/loans/loan_list.dart

@@ -4,7 +4,6 @@ import 'package:library_app/src/providers/auth_provider.dart';
 import 'package:provider/provider.dart';
 
 import 'package:library_app/src/models/loan.dart';
-import 'package:library_app/src/widgets/forms/search_form.dart';
 import 'package:library_app/src/widgets/loans/loan_item.dart';
 
 class LoanList extends StatefulWidget {
@@ -79,6 +78,8 @@ class _TopAppBar extends State<TopAppBar> {
 
   @override
   Widget build(BuildContext context) {
+    final screenSize = MediaQuery.of(context).size;
+
     return SliverAppBar(
       title: Text(showWidget ? "" : title),
       actions: [
@@ -91,16 +92,41 @@ class _TopAppBar extends State<TopAppBar> {
                   showWidget = !showWidget;
                 });
               },
-              icon: Icon(showWidget ? Icons.close : Icons.search),
+              icon: Icon(showWidget ? Icons.close : Icons.filter_alt_outlined),
             ),
             Offstage(
               offstage: !showWidget,
-              child: const SearchForm(),
+              child: Row(
+                children: [
+                  FilledButton(
+                    style: TextButton.styleFrom(
+                      padding: EdgeInsets.symmetric(
+                          horizontal: screenSize.width * 0.04,
+                          vertical: screenSize.width * 0.02),
+                    ),
+                    onPressed: () {},
+                    child: const Text('Near Outstanding'),
+                  ),
+                  const SizedBox(
+                    width: 8.0,
+                  ),
+                  FilledButton(
+                    style: TextButton.styleFrom(
+                      padding: EdgeInsets.symmetric(
+                          horizontal: screenSize.width * 0.04,
+                          vertical: screenSize.width * 0.02),
+                    ),
+                    onPressed: () {},
+                    child: const Text(
+                      'Overdued',
+                    ),
+                  ),
+                ],
+              ),
             ),
           ],
         ),
       ],
-      bottom: showWidget ? const LoanTypeFilter() : null,
       elevation: 10.0,
       automaticallyImplyLeading: false,
       expandedHeight: 50,