From 434470a73d93ae3f788e3e135d3e8c38fbc99ed6 Mon Sep 17 00:00:00 2001
From: tarunsinghofficial <tarunsinghwap7@gmail.com>
Date: Tue, 21 Jan 2025 20:03:21 +0530
Subject: [PATCH] Refactor UI: Combine 'Collapse All' and 'Show All' buttons
 into a single toggle button for improved usability

---
 .../stops/[stopID]/schedule/+page.svelte      | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/routes/stops/[stopID]/schedule/+page.svelte b/src/routes/stops/[stopID]/schedule/+page.svelte
index 627f2b2..fa4e913 100644
--- a/src/routes/stops/[stopID]/schedule/+page.svelte
+++ b/src/routes/stops/[stopID]/schedule/+page.svelte
@@ -21,6 +21,7 @@
 	let stopDirection = $state('');
 	let loading = $state(true);
 	let accordionComponent = $state();
+	let allRoutesExpanded = $state(false);
 
 	let schedulesMap = new Map();
 	let routeReference = new Map();
@@ -105,6 +106,15 @@
 		return grouped;
 	}
 
+	function toggleAllRoutes() {
+		if (allRoutesExpanded) {
+			accordionComponent.closeAll();
+		} else {
+			accordionComponent.openAll();
+		}
+		allRoutesExpanded = !allRoutesExpanded;
+	}
+
 	onMount(async () => {
 		const formattedDate = currentDate.toISOString().split('T')[0];
 		await fetchScheduleForStop(stopId, formattedDate);
@@ -148,11 +158,10 @@
 					</div>
 
 					<div class="flex-1 text-right">
-						<button class="button" onclick={() => accordionComponent.openAll()}>
-							{$t('schedule_for_stop.show_all_routes')}
-						</button>
-						<button class="button" onclick={() => accordionComponent.closeAll()}>
-							{$t('schedule_for_stop.collapse_all_routes')}
+						<button class="button" onclick={toggleAllRoutes}>
+							{allRoutesExpanded
+								? $t('schedule_for_stop.collapse_all_routes')
+								: $t('schedule_for_stop.show_all_routes')}
 						</button>
 					</div>
 				</div>