Replace CircularProgressIndicator with skeleton loaders in dashboard; reintroduce project dropdown list with search functionality

This commit is contained in:
Vaibhav Surve 2025-11-29 15:09:10 +05:30
parent c9e73771b0
commit 6ed069d924

View File

@ -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<DashboardScreen> 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<DashboardScreen> 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<String>(
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<DashboardScreen> 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<DashboardScreen> 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<String>(
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
//---------------------------------------------------------------------------