diff --git a/src/components/sections/Schedule.tsx b/src/components/sections/Schedule.tsx
index dbef668..8bfbb96 100644
--- a/src/components/sections/Schedule.tsx
+++ b/src/components/sections/Schedule.tsx
@@ -1,6 +1,6 @@
"use client";
-import { useState, useMemo } from "react";
+import { useState, useMemo, useCallback } from "react";
import { CalendarDays, Users, LayoutGrid } from "lucide-react";
import { SectionHeading } from "@/components/ui/SectionHeading";
import { Reveal } from "@/components/ui/Reveal";
@@ -31,6 +31,21 @@ export function Schedule({ data: schedule, classItems }: ScheduleProps) {
const isAllMode = locationMode === "all";
+ const scrollToSchedule = useCallback(() => {
+ const el = document.getElementById("schedule");
+ if (el) el.scrollIntoView({ behavior: "smooth", block: "start" });
+ }, []);
+
+ const setFilterTrainerFromCard = useCallback((trainer: string | null) => {
+ setFilterTrainer(trainer);
+ if (trainer) scrollToSchedule();
+ }, [scrollToSchedule]);
+
+ const setFilterTypeFromCard = useCallback((type: string | null) => {
+ setFilterType(type);
+ if (type) scrollToSchedule();
+ }, [scrollToSchedule]);
+
const typeDots = useMemo(() => buildTypeDots(classItems), [classItems]);
// Build days: either from one location or merged from all
@@ -271,9 +286,9 @@ export function Schedule({ data: schedule, classItems }: ScheduleProps) {
typeDots={typeDots}
filteredDays={filteredDays}
filterType={filterType}
- setFilterType={setFilterType}
+ setFilterType={setFilterTypeFromCard}
filterTrainer={filterTrainer}
- setFilterTrainer={setFilterTrainer}
+ setFilterTrainer={setFilterTrainerFromCard}
hasActiveFilter={hasActiveFilter}
clearFilters={clearFilters}
showLocation={isAllMode}
@@ -291,7 +306,7 @@ export function Schedule({ data: schedule, classItems }: ScheduleProps) {
key={day.day}
className={filteredDays.length === 1 ? "w-full max-w-[340px]" : ""}
>
-
+
))}
@@ -310,9 +325,9 @@ export function Schedule({ data: schedule, classItems }: ScheduleProps) {
typeDots={typeDots}
filteredDays={filteredDays}
filterType={filterType}
- setFilterType={setFilterType}
+ setFilterType={setFilterTypeFromCard}
filterTrainer={filterTrainer}
- setFilterTrainer={setFilterTrainer}
+ setFilterTrainer={setFilterTrainerFromCard}
showLocation={isAllMode}
/>