From 6ed069d9241632e1e9a89dd0170719d2f5f1ffcd Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Sat, 29 Nov 2025 15:09:10 +0530 Subject: [PATCH] Replace CircularProgressIndicator with skeleton loaders in dashboard; reintroduce project dropdown list with search functionality --- lib/view/dashboard/dashboard_screen.dart | 120 ++++++++++++----------- 1 file changed, 63 insertions(+), 57 deletions(-) diff --git a/lib/view/dashboard/dashboard_screen.dart b/lib/view/dashboard/dashboard_screen.dart index e420913..2b79e7d 100644 --- a/lib/view/dashboard/dashboard_screen.dart +++ b/lib/view/dashboard/dashboard_screen.dart @@ -12,6 +12,7 @@ import 'package:on_field_work/helpers/widgets/dashbaord/expense_by_status_widget import 'package:on_field_work/helpers/widgets/dashbaord/monthly_expense_dashboard_chart.dart'; import 'package:on_field_work/view/layouts/layout.dart'; import 'package:on_field_work/helpers/utils/permission_constants.dart'; +import 'package:on_field_work/helpers/widgets/my_custom_skeleton.dart '; class DashboardScreen extends StatefulWidget { const DashboardScreen({super.key}); @@ -190,7 +191,9 @@ class _DashboardScreenState extends State with UIMixin { final selectedId = projectController.selectedProjectId.value; if (isLoading) { - return const Center(child: CircularProgressIndicator()); + // Use skeleton instead of CircularProgressIndicator + return SkeletonLoaders.dashboardCardsSkeleton( + maxWidth: MediaQuery.of(context).size.width); } return Column( @@ -247,61 +250,6 @@ class _DashboardScreenState extends State with UIMixin { }); } - Widget _projectDropdownList(projects, selectedId) { - return Container( - margin: const EdgeInsets.only(top: 10), - padding: const EdgeInsets.all(12), - decoration: BoxDecoration( - color: Colors.white, - borderRadius: BorderRadius.circular(5), - border: Border.all(color: Colors.black12.withOpacity(.2)), - boxShadow: [ - BoxShadow( - color: Colors.black12.withOpacity(.07), - blurRadius: 10, - offset: const Offset(0, 3), - ), - ], - ), - constraints: - BoxConstraints(maxHeight: MediaQuery.of(context).size.height * 0.33), - child: Column( - children: [ - TextField( - decoration: InputDecoration( - hintText: "Search project...", - isDense: true, - prefixIcon: const Icon(Icons.search), - border: - OutlineInputBorder(borderRadius: BorderRadius.circular(5)), - ), - ), - const SizedBox(height: 10), - Expanded( - child: ListView.builder( - itemCount: projects.length, - itemBuilder: (_, index) { - final project = projects[index]; - return RadioListTile( - dense: true, - value: project.id, - groupValue: selectedId, - onChanged: (v) { - if (v != null) { - projectController.updateSelectedProject(v); - projectController.isProjectSelectionExpanded.value = - false; - } - }, - title: Text(project.name), - ); - }, - ), - ), - ], - ), - ); - } //--------------------------------------------------------------------------- // DASHBOARD MODULE CARDS (UPDATED FOR MINIMAL PADDING / SLL SIZE) //--------------------------------------------------------------------------- @@ -309,7 +257,9 @@ class _DashboardScreenState extends State with UIMixin { Widget _dashboardCards() { return Obx(() { if (menuController.isLoading.value) { - return const Center(child: CircularProgressIndicator()); + // Show skeleton instead of CircularProgressIndicator + return SkeletonLoaders.dashboardCardsSkeleton( + maxWidth: MediaQuery.of(context).size.width); } final projectSelected = projectController.selectedProject != null; @@ -440,6 +390,62 @@ class _DashboardScreenState extends State with UIMixin { }); } + Widget _projectDropdownList(projects, selectedId) { + return Container( + margin: const EdgeInsets.only(top: 10), + padding: const EdgeInsets.all(12), + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.circular(5), + border: Border.all(color: Colors.black12.withOpacity(.2)), + boxShadow: [ + BoxShadow( + color: Colors.black12.withOpacity(.07), + blurRadius: 10, + offset: const Offset(0, 3), + ), + ], + ), + constraints: + BoxConstraints(maxHeight: MediaQuery.of(context).size.height * 0.33), + child: Column( + children: [ + TextField( + decoration: InputDecoration( + hintText: "Search project...", + isDense: true, + prefixIcon: const Icon(Icons.search), + border: + OutlineInputBorder(borderRadius: BorderRadius.circular(5)), + ), + ), + const SizedBox(height: 10), + Expanded( + child: ListView.builder( + itemCount: projects.length, + itemBuilder: (_, index) { + final project = projects[index]; + return RadioListTile( + dense: true, + value: project.id, + groupValue: selectedId, + onChanged: (v) { + if (v != null) { + projectController.updateSelectedProject(v); + projectController.isProjectSelectionExpanded.value = + false; + } + }, + title: Text(project.name), + ); + }, + ), + ), + ], + ), + ); + } + //--------------------------------------------------------------------------- // MAIN UI //---------------------------------------------------------------------------