diff --git a/TODO b/TODO index 7afb942..6743d95 100644 --- a/TODO +++ b/TODO @@ -1,33 +1,25 @@ -//TODO readme +// TODO change tests to follow best practices https://docs.cypress.io/guides/references/best-practices +// TODO tests for tournament page: + - map and table mounts in tournament page <- get data to send to map/table ---------------------------------------------------------------- - -//TODO hover on table needs fixing - this only seemed to happen once I moved the logic into its own hook <- error is occurring on all hovers at the moment. Client/SSR issue? - +//TODO hover on table needs fixing - this only seemed to happen once I moved the logic into its own hook <- error is occurring on all hovers at the moment. +//TODO fix table hover colours +----------------------------------------------------------------- +//TODO about page +//TODO contact page needs working mailer //TODO font size on mobile screen - //TODO need a 'return to top' arrow button on smaller screens - +//TODO SEO - next headers etc +---------------------------------------------------------------- +//TODO logo for navbar and favicon //TODO mobile map needs improving //TODO multi-language i18n support - https://nextjs.org/docs/app/building-your-application/routing/internationalization -//TODO tests for tournois, testing the loading of map and table, then counting the markers - -//TODO logo for navbar and favicon - -//TODO document my new hook <- consider removing as I believe this is the reason hover is broken - //TODO error handling -//TODO e2e tests for tournament page: - - make sure number of markers = tournamentData.length - -//TODO about page - -//TODO contact page needs working mailer - -//TODO SEO - //TODO consider offering GraphQL support //TODO move smaller ui components into a new folder, and make them reusable - such as using generic prop names + +//TODO readme diff --git a/app/api/tournaments/france/route.ts b/app/api/v1/tournaments/france/route.ts similarity index 92% rename from app/api/tournaments/france/route.ts rename to app/api/v1/tournaments/france/route.ts index c6f5c05..4310230 100644 --- a/app/api/tournaments/france/route.ts +++ b/app/api/v1/tournaments/france/route.ts @@ -3,8 +3,8 @@ import { dateOrderingFrance } from "@/utils/dbDateOrdering"; /** * Tournament data API endpoint - * @route /api/tournaments/france - * @internal + * @route /api/v1/tournaments/france + * @public */ export const revalidate = 3600; // revalidate cache every 6 hours export async function GET() { diff --git a/components/TournamentTable.tsx b/components/TournamentTable.tsx index e1dd49b..c250db5 100644 --- a/components/TournamentTable.tsx +++ b/components/TournamentTable.tsx @@ -2,19 +2,60 @@ import { TournamentDataProps } from "@/types"; import { useEffect, useState } from "react"; -import useTournamentDataFilter from "@/hooks/useTournamentFilter"; import SearchBar from "@/components/SearchBar"; export default function TournamentTable({ tournamentData, }: TournamentDataProps) { - const [tournamentFilter, setTournamentFilter] = useState(""); // text from search bar + let tableData; + const [searchQuery, setSearchQuery] = useState(""); // text from search bar const [filteredTournamentData, setFilteredTournamentData] = - useTournamentDataFilter(tournamentData); + useState(tournamentData); useEffect(() => { - setFilteredTournamentData(tournamentFilter); - }, [tournamentFilter]); + setFilteredTournamentData( + tournamentData.filter((t) => t.town.includes(searchQuery.toUpperCase())) + ); + }, [searchQuery]); + + // TODO move this section into its own function + if (filteredTournamentData.length === 0) { + tableData = ( + + + No tournaments found + + + ); + } else { + tableData = filteredTournamentData.map((t) => ( + + + + {t.date} + + + + + {t.town} + + + + + {t.tournament} + + + + + {t.time_control} + + + + )); + } const stickyHeader = "sticky top-0 p-3 bg-teal-600 text-white dark:bg-gray-600"; @@ -22,10 +63,13 @@ export default function TournamentTable({ return (
- +
@@ -34,7 +78,7 @@ export default function TournamentTable({ - {filteredTournamentData} + {tableData}
DateCadence
); diff --git a/cypress/e2e/data.cy.tsx b/cypress/e2e/data.cy.tsx new file mode 100644 index 0000000..c6cb1a3 --- /dev/null +++ b/cypress/e2e/data.cy.tsx @@ -0,0 +1,27 @@ +let tableRows: number; +describe("Data fetching for map", () => { + it("map markers is equal to table rows", () => { + cy.visit("/tournois"); + cy.get('[data-cy="tournament-table"]') + .find("tr") + .then((rows) => { + tableRows = rows.length - 1; + }); + cy.get(".leaflet-marker-icon").then((markers) => { + expect(markers.length).to.eq(tableRows); + }); + }); +}); + +describe("Data fetching from API endpoints", () => { + it("api call should equal website data count", () => { + cy.request("GET", "http://localhost:3000/api/v1/tournaments/france").then( + (response) => { + expect(response.status).to.eq(200); + const responseData = response.body; + const itemCount = responseData.length; + expect(itemCount).to.eq(tableRows); + } + ); + }); +}); diff --git a/cypress/videos/data.cy.tsx.mp4 b/cypress/videos/data.cy.tsx.mp4 new file mode 100644 index 0000000..32ea032 Binary files /dev/null and b/cypress/videos/data.cy.tsx.mp4 differ diff --git a/cypress/videos/links.cy.ts.mp4 b/cypress/videos/links.cy.ts.mp4 index 65aab18..922b010 100644 Binary files a/cypress/videos/links.cy.ts.mp4 and b/cypress/videos/links.cy.ts.mp4 differ diff --git a/cypress/videos/navbar.cy.tsx.mp4 b/cypress/videos/navbar.cy.tsx.mp4 index 74304c9..2b370c7 100644 Binary files a/cypress/videos/navbar.cy.tsx.mp4 and b/cypress/videos/navbar.cy.tsx.mp4 differ diff --git a/hooks/useTournamentFilter.tsx b/hooks/useTournamentFilter.tsx index 368803c..dcf830e 100644 --- a/hooks/useTournamentFilter.tsx +++ b/hooks/useTournamentFilter.tsx @@ -1,8 +1,7 @@ import { Tournament } from "@/types"; import { useState } from "react"; -// TODO change 'any' -// TODO document this hook with TSDoc +// TODO delete after testing const useTournamentDataFilter = ( initialState: Tournament[] ): (any | ((searchQuery: string) => void))[] => { diff --git a/tests/http-requests/franceTournaments.http b/tests/http-requests/franceTournaments.http new file mode 100644 index 0000000..cdb4228 --- /dev/null +++ b/tests/http-requests/franceTournaments.http @@ -0,0 +1,2 @@ +GET http://localhost:3000/api/v1/tournaments/france +Accept: application/json