{buttonList}
-
setIsOpen(!isOpen)}
- tooltip="More Options"
- >
+
+
{isOpen && (
diff --git a/src/components/header/HeaderButton.tsx b/src/components/header/HeaderButton.tsx
deleted file mode 100644
index 599a698..0000000
--- a/src/components/header/HeaderButton.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { cn } from "@/lib/classnames";
-
-interface HeaderButtonProps {
- onClick?: () => void;
- children: React.ReactNode;
- tooltip: string;
-}
-
-export default function HeaderButton({
- onClick,
- children,
- tooltip,
-}: HeaderButtonProps) {
- return (
-
-
-
- {/* Tooltip Container */}
-
-
}
- {!isDesktop && }
+ {!isDesktop && }
{showFilterPanel && !isDesktop && }
);
diff --git a/src/features/catalog/search/context/provider.tsx b/src/features/catalog/search/context/provider.tsx
index dc8d5d0..e708a7d 100644
--- a/src/features/catalog/search/context/provider.tsx
+++ b/src/features/catalog/search/context/provider.tsx
@@ -2,24 +2,14 @@ import { ReactNode, useState, useEffect, useRef, useMemo } from "react";
import { CatalogContext } from "@/features/catalog/search/context/context";
import api from "@/lib/axios";
-import { APICourse, FilterData, FilterCategory } from "@/lib/types";
-
-const formatApiData = (type: FilterCategory, data: Record
) => {
- return Object.entries(data).map(([code, value], index) => ({
- id: index,
- code,
- value,
- type,
- }));
-};
+import { useFilterStore } from "@/lib/stores/useFilterStore";
+import { APICourse, FilterData } from "@/lib/types";
export function CatalogProvider({ children }: { children: ReactNode }) {
+ const filters = useFilterStore((state) => state.filters);
+ const fetchFilters = useFilterStore((state) => state.fetchFilters);
+
const [showFilterPanel, setShowFilterPanel] = useState(false);
- const [filters, setFilters] = useState({
- subjects: [] as FilterData[],
- attributes: [] as FilterData[],
- semesters: [] as FilterData[],
- });
const [selectedFilters, setSelectedFilters] = useState([]);
const [searchResults, setSearchResults] = useState([]);
const [searchPrompt, setSearchPrompt] = useState("");
@@ -27,27 +17,11 @@ export function CatalogProvider({ children }: { children: ReactNode }) {
const [hasSearched, setHasSearched] = useState(false);
const debounceTimeout = useRef | null>(null);
- // const lastNoResultQuery = useRef(null);
+ // Fetch filter options on mount
useEffect(() => {
- const fetchAllFilters = async () => {
- try {
- const [sub, attr, sem] = await Promise.all([
- api.get("/course/filter/values/subjects"),
- api.get("/course/filter/values/attributes"),
- api.get("/course/filter/values/semesters"),
- ]);
- setFilters({
- subjects: formatApiData("Subject", sub.data),
- attributes: formatApiData("Attribute", attr.data),
- semesters: formatApiData("Semester", sem.data),
- });
- } catch (error) {
- console.error("Failed to fetch filters:", error);
- }
- };
- fetchAllFilters();
- }, []);
+ fetchFilters();
+ }, [fetchFilters]);
const toggleFilter = (filter: FilterData) => {
setSelectedFilters((prev) => {
@@ -100,7 +74,7 @@ export function CatalogProvider({ children }: { children: ReactNode }) {
const value = useMemo(
() => ({
- filters,
+ filters, // <-- Still providing this down to Context consumers so existing code doesn't break
selectedFilters,
toggleFilter,
clearFilters: () => setSelectedFilters([]),
diff --git a/src/features/catalog/search/filters/FilterSection.tsx b/src/features/catalog/search/filters/FilterSection.tsx
index bc1e8ba..4ff57a9 100644
--- a/src/features/catalog/search/filters/FilterSection.tsx
+++ b/src/features/catalog/search/filters/FilterSection.tsx
@@ -2,8 +2,8 @@ import { useState } from "react";
import { motion } from "framer-motion";
+import Tag from "@/components/Tag";
import { useCatalog } from "@/features/catalog/search/context/useCatalog";
-import Tag from "@/features/catalog/Tag";
import useIsDesktop from "@/lib/hooks/useIsDesktop";
import { FilterCategory, FilterData } from "@/lib/types";
@@ -18,7 +18,7 @@ export default function FilterSection({
tags,
showCode = false,
}: FilterSectionProps) {
- const { selectedFilters } = useCatalog();
+ const { toggleFilter, selectedFilters } = useCatalog();
const isDesktop = useIsDesktop();
const [isExpanded, setIsExpanded] = useState(false);
@@ -52,6 +52,7 @@ export default function FilterSection({
(sf) => sf.code === tag.code && sf.type === tag.type,
)}
showCode={showCode}
+ onToggle={toggleFilter}
/>
))}
diff --git a/src/features/catalog/search/filters/SelectedFilters.tsx b/src/features/catalog/search/filters/SelectedFilters.tsx
index 4603656..fc4c57a 100644
--- a/src/features/catalog/search/filters/SelectedFilters.tsx
+++ b/src/features/catalog/search/filters/SelectedFilters.tsx
@@ -1,8 +1,8 @@
+import Tag from "@/components/Tag";
import { useCatalog } from "@/features/catalog/search/context/useCatalog";
-import Tag from "@/features/catalog/Tag";
export default function SelectedFilters() {
- const { selectedFilters } = useCatalog();
+ const { toggleFilter, selectedFilters } = useCatalog();
if (selectedFilters.length === 0) return null;
@@ -13,6 +13,7 @@ export default function SelectedFilters() {
key={`${filter.type}-${filter.code}`}
filter={filter}
isRemovable={true}
+ onToggle={toggleFilter}
/>
))}
diff --git a/src/features/planner/usePlannerCourse.ts b/src/features/planner/usePlannerCourse.ts
index cce31ff..c3d4a9e 100644
--- a/src/features/planner/usePlannerCourse.ts
+++ b/src/features/planner/usePlannerCourse.ts
@@ -16,11 +16,13 @@ export interface MenuOption {
interface UsePlannerCourseProps {
course: UserCourse;
semesterId: string | null;
+ onOpenDetails: () => void;
}
export const usePlannerCourse = ({
course,
semesterId,
+ onOpenDetails,
}: UsePlannerCourseProps) => {
const {
addCourseToSemester,
@@ -88,9 +90,15 @@ export const usePlannerCourse = ({
/* MENU OPTIONS */
return useMemo