fix: small bugs (#34)

* fix: styling and warnings

* style: h-full, w-full

* fix: start and end default values

* chore: update file names

* fix: adjust type for start and end

* fix: space in blurb

* chore: update metadata

* fix: git mv to rename files

* fix: correct imports

* chore: rename hero to Hero

* chore: fix Search import

* fix: undo w-full, h-full

__tests__/search-filters.test.ts

@@ -1,9 +1,9 @@
-import { FilterValues } from "@/components/search/search";
+import { FilterValues } from "@/components/search/Search";
 import {
     endsBefore,
     filterData,
     startsAfter,
-} from "@/components/search/filterUtils";
+} from "@/components/search/filter-utils";
 import "@testing-library/jest-dom";
 
 const data = {
@@ -81,7 +81,7 @@ const defaultFilterValues: FilterValues = {
     enrollment: [false],
     available: [false],
     start: "2023-12-20",
-    end: undefined,
+    end: "",
     institution: "Any Institution",
     min: 0,
     max: 20,
@@ -192,8 +192,8 @@ describe("Search Filters", () => {
 });
 
 describe("Filter Utils' Time Utilities", () => {
-    test("startsAfter undefined", async () => {
-        const result = startsAfter(undefined, data.courses[0]);
+    test("startsAfter none", async () => {
+        const result = startsAfter("", data.courses[0]);
         expect(result).toBe(true);
     });
 
@@ -207,8 +207,8 @@ describe("Filter Utils' Time Utilities", () => {
         expect(result).toBe(false);
     });
 
-    test("endsBefore undefined", async () => {
-        const result = endsBefore(undefined, data.courses[0]);
+    test("endsBefore none", async () => {
+        const result = endsBefore("", data.courses[0]);
         expect(result).toBe(true);
     });
 

app/layout.tsx

@@ -1,8 +1,8 @@
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
 import "./globals.css";
-import Header from "@/components/header";
-import Footer from "@/components/footer";
+import Header from "@/components/Header";
+import Footer from "@/components/Footer";
 import GoogleAnalytics from "@/components/GoogleAnalytics";
 import { Toaster } from "@/components/ui/toaster";
 
@@ -12,6 +12,7 @@ export const metadata: Metadata = {
     title: "GE-Z",
     description:
         "GE-Z sources data from Assist.org and CVC.edu to find the perfect community college courses for you to take.",
+    metadataBase: new URL("https://ge-z.vercel.app"),
     openGraph: {
         title: "GE-Z",
         description:

app/page.tsx

@@ -1,4 +1,4 @@
-import Hero from "@/components/hero/hero";
+import Hero from "@/components/hero/Hero";
 
 export default function Home() {
     return (

app/search/page.tsx

@@ -1,4 +1,4 @@
-import Search from "@/components/search/search";
+import Search from "@/components/search/Search";
 import React from "react";
 
 const SearchPage = () => {

components/search/blurb.tsx → components/search/Blurb.tsx

@@ -1,12 +1,12 @@
 import React from "react";
-import { CollegeObject, FilterValues } from "./search";
+import { CollegeObject, FilterValues } from "./Search";
 
 interface BlurbProps {
     filterData: (
         data: CollegeObject[],
         filterValues: FilterValues,
     ) => CollegeObject[];
-    data: CollegeObject[];
+    data: CollegeObject[] | undefined;
     filterValues: FilterValues;
     searchUniversity: string;
     searchGE: string;
@@ -26,7 +26,8 @@ const SearchBlurb = (props: BlurbProps) => {
                     <div>
                         We found{" "}
                         <b className="text-black">
-                            {filterData(data, filterValues).length} courses
+                            {data ? filterData(data, filterValues).length : "x"}{" "}
+                            courses
                         </b>{" "}
                         that may articulate to{" "}
                         <b className="text-black">{searchUniversity}</b> for{" "}

components/search/filterComponents.tsx → components/search/FilterComponents.tsx

@@ -2,7 +2,7 @@
 
 import React, { ChangeEvent, Dispatch, SetStateAction, useState } from "react";
 import { FaCheck, FaChevronDown } from "react-icons/fa";
-import { CollegeObject } from "./search";
+import { CollegeObject } from "./Search";
 
 interface FilterCheckboxProps {
     title: string;
@@ -59,7 +59,7 @@ export const CustomFilterCheckbox = (props: FilterCheckboxProps) => {
 
 interface CalendarFilterProps {
     onStartChange: Dispatch<SetStateAction<string>>;
-    onEndChange: Dispatch<SetStateAction<string | undefined>>;
+    onEndChange: Dispatch<SetStateAction<string>>;
     defaultStart: string | undefined;
     defaultEnd: string | undefined;
 }
@@ -118,7 +118,7 @@ export const CalendarFilter = (props: CalendarFilterProps) => {
 
 interface InstitutionDropdownProps {
     defaultValue: string;
-    courses: CollegeObject[];
+    courses: CollegeObject[] | undefined;
     onChange: Dispatch<SetStateAction<string>>;
 }
 
@@ -139,13 +139,15 @@ export const InstitutionDropdown = (props: InstitutionDropdownProps) => {
         (course: CollegeObject) => course.sendingInstitution,
     );
 
-    for (const college of sendingInstitutions) {
-        if (!uniqueColleges.includes(college)) {
-            uniqueColleges.push(college);
+    if (sendingInstitutions) {
+        for (const college of sendingInstitutions) {
+            if (!uniqueColleges.includes(college)) {
+                uniqueColleges.push(college);
+            }
         }
-    }
 
-    uniqueColleges.sort();
+        uniqueColleges.sort();
+    }
 
     return (
         <div className="relative flex flex-col">

components/search/filters.tsx → components/search/Filters.tsx

@@ -4,22 +4,22 @@ import {
     CustomFilterCheckbox,
     InstitutionDropdown,
     UnitsFilter,
-} from "./filterComponents";
+} from "./FilterComponents";
 import { FaCircleXmark } from "react-icons/fa6";
-import { CollegeObject, FilterValues } from "./search";
+import { CollegeObject, FilterValues } from "./Search";
 
 interface SearchFilterProps {
     handleClick: () => void;
     setFormat: Dispatch<SetStateAction<boolean[]>>;
     setEnrollment: Dispatch<SetStateAction<boolean[]>>;
     setAvailable: Dispatch<SetStateAction<boolean[]>>;
     setStart: Dispatch<SetStateAction<string>>;
-    setEnd: Dispatch<SetStateAction<string | undefined>>;
+    setEnd: Dispatch<SetStateAction<string>>;
     setInstitution: Dispatch<SetStateAction<string>>;
     setMin: Dispatch<SetStateAction<number>>;
     setMax: Dispatch<SetStateAction<number>>;
     filterValues: FilterValues;
-    courses: CollegeObject[];
+    courses: CollegeObject[] | undefined;
 }
 
 export const SearchFilters = (props: SearchFilterProps) => {

components/search/search.tsx → components/search/Search.tsx

@@ -2,14 +2,14 @@
 
 import React, { useEffect, useState } from "react";
 import { DropdownComponentSearch } from "../DropdownComponent";
-import { SortDropdown } from "./filterComponents";
+import { SortDropdown } from "./FilterComponents";
 import { useRouter, useSearchParams } from "next/navigation";
-import { queryDatabase } from "./queryDatabase";
-import SearchResults from "./searchResults";
+import { queryDatabase } from "./query-db";
+import SearchResults from "./SearchResults";
 import { FaFilter } from "react-icons/fa6";
-import { SearchFilterPage, SearchFilters } from "./filters";
-import SearchBlurb from "./blurb";
-import { filterData } from "./filterUtils";
+import { SearchFilterPage, SearchFilters } from "./Filters";
+import SearchBlurb from "./Blurb";
+import { filterData } from "./filter-utils";
 import { UNIVERSITY_GE } from "@/lib/constants";
 
 import { analyticsEnum, logAnalytics } from "@/lib/analytics";
@@ -43,8 +43,8 @@ export type FilterValues = {
     format: boolean[];
     enrollment: boolean[];
     available: boolean[];
-    start: string | undefined;
-    end: string | undefined;
+    start: string;
+    end: string;
     institution: string;
     min: number;
     max: number;
@@ -70,15 +70,21 @@ const Search = () => {
     const [format, setFormat] = useState([true, true]);
     const [enrollment, setEnrollment] = useState([true]);
     const [available, setAvailable] = useState([true]);
-    const [start, setStart] = useState(new Date().toLocaleDateString("en-CA"));
-    const [end, setEnd] = useState<string>();
+    const [start, setStart] = useState(() => {
+        const today = new Date();
+        const year = today.getFullYear();
+        const month = (today.getMonth() + 1).toString().padStart(2, "0");
+        const day = today.getDate().toString().padStart(2, "0");
+        return `${year}-${month}-${day}`;
+    });
+    const [end, setEnd] = useState("");
     const [institution, setInstitution] = useState("Any Institution");
     const [min, setMin] = useState(0);
     const [max, setMax] = useState(20);
 
     const [sort, setSort] = useState("Default Sort");
 
-    const [courses, setCourses] = useState<CollegeObject[]>([]);
+    const [courses, setCourses] = useState<CollegeObject[]>();
 
     const [filterValues, setFilterValues] = useState<FilterValues>({
         format: format,
@@ -236,7 +242,7 @@ const Search = () => {
         });
 
         fetchData();
-    }, [university, ge]);
+    }, [university, ge, toast]);
 
     return (
         <>

components/search/searchResults.tsx → components/search/SearchResults.tsx

@@ -1,7 +1,7 @@
 import LazyLoad from "react-lazy-load";
 import { FaUpRightFromSquare } from "react-icons/fa6";
-import { CollegeObject } from "./search";
-import Tags from "./tags";
+import { CollegeObject } from "./Search";
+import Tags from "./Tags";
 
 interface SearchResultsProps {
     results: CollegeObject[];

components/search/filterUtils.ts → components/search/filter-utils.ts

@@ -1,9 +1,6 @@
-import { CollegeObject, FilterValues } from "./search";
+import { CollegeObject, FilterValues } from "./Search";
 
-export const startsAfter = (
-    start: string | undefined,
-    result: CollegeObject,
-) => {
+export const startsAfter = (start: string, result: CollegeObject) => {
     if (start == undefined) return true;
 
     return (
@@ -13,8 +10,8 @@ export const startsAfter = (
     );
 };
 
-export const endsBefore = (end: string | undefined, result: CollegeObject) => {
-    if (end == undefined) return true;
+export const endsBefore = (end: string, result: CollegeObject) => {
+    if (end == "") return true;
 
     return (
         `2024-${result.endMonth.toString().padStart(2, "0")}-${result.endDay
@@ -23,7 +20,14 @@ export const endsBefore = (end: string | undefined, result: CollegeObject) => {
     );
 };
 
-export function filterData(data: CollegeObject[], filterValues: FilterValues) {
+export function filterData(
+    data: CollegeObject[] | undefined,
+    filterValues: FilterValues,
+) {
+    if (!data) {
+        return [];
+    }
+
     const filteredResults = data.filter((result) => {
         const onlineFormat =
             (filterValues.format[0] && filterValues.format[1]) ||