mirror of
https://github.com/TheRealOwenRees/echecsfrance.git
synced 2026-07-23 12:36:57 +00:00
Localisation (#39)
* Localisation * Update tests * Fix map markers in English view * Fix typo
This commit is contained in:
@@ -2,6 +2,8 @@
|
||||
|
||||
import { TournamentDataProps } from "@/types";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useTranslations } from "next-intl";
|
||||
|
||||
import SearchBar from "@/components/SearchBar";
|
||||
import ScrollToTopButton from "@/components/ScrollToTopButton";
|
||||
|
||||
@@ -9,6 +11,7 @@ export default function TournamentTable({
|
||||
tournamentData,
|
||||
}: TournamentDataProps) {
|
||||
let tableData;
|
||||
const t = useTranslations("Competitions");
|
||||
const [searchQuery, setSearchQuery] = useState(""); // text from search bar
|
||||
const [filteredTournamentData, setFilteredTournamentData] =
|
||||
useState(tournamentData);
|
||||
@@ -17,41 +20,41 @@ export default function TournamentTable({
|
||||
setFilteredTournamentData(
|
||||
tournamentData.filter((t) => t.town.includes(searchQuery.toUpperCase()))
|
||||
);
|
||||
}, [searchQuery]);
|
||||
}, [searchQuery, tournamentData]);
|
||||
|
||||
// TODO move this section into its own function
|
||||
if (filteredTournamentData.length === 0) {
|
||||
tableData = (
|
||||
<tr className="bg-white text-gray-900 dark:bg-gray-800 dark:text-white">
|
||||
<td colSpan={4} className="p-3">
|
||||
No tournaments found
|
||||
{t("noneFound")}
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
} else {
|
||||
tableData = filteredTournamentData.map((t) => (
|
||||
tableData = filteredTournamentData.map((data) => (
|
||||
<tr
|
||||
className="text-gray-900 bg-white dark:bg-gray-800 dark:text-white hover:bg-gray-200 dark:hover:bg-gray-900"
|
||||
key={t._id}
|
||||
className="bg-white text-gray-900 hover:bg-gray-200 dark:bg-gray-800 dark:text-white dark:hover:bg-gray-900"
|
||||
key={data._id}
|
||||
>
|
||||
<td className="p-3">
|
||||
<a href={t.url} target="_blank">
|
||||
{t.date}
|
||||
<a href={data.url} target="_blank">
|
||||
{data.date}
|
||||
</a>
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<a href={t.url} target="_blank">
|
||||
{t.town}
|
||||
<a href={data.url} target="_blank">
|
||||
{data.town}
|
||||
</a>
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<a href={t.url} target="_blank">
|
||||
{t.tournament}
|
||||
<a href={data.url} target="_blank">
|
||||
{data.tournament}
|
||||
</a>
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<a href={t.url} target="_blank">
|
||||
{t.time_control}
|
||||
<a href={data.url} target="_blank">
|
||||
{data.time_control}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -60,11 +63,11 @@ export default function TournamentTable({
|
||||
|
||||
return (
|
||||
<section
|
||||
className="tournament-table w-full grid auto-rows-max pb-20 lg:h-[calc(100vh-173px)] lg:col-start-2 lg:col-end-3 lg:overflow-y-scroll"
|
||||
className="tournament-table grid w-full auto-rows-max pb-20 lg:col-start-2 lg:col-end-3 lg:h-[calc(100vh-173px)] lg:overflow-y-scroll"
|
||||
id="tournament-table"
|
||||
data-test="tournament-table-div"
|
||||
>
|
||||
<div className="flex z-10">
|
||||
<div className="z-10 flex">
|
||||
<SearchBar
|
||||
tournamentFilter={searchQuery}
|
||||
setTournamentFilter={setSearchQuery}
|
||||
@@ -74,22 +77,22 @@ export default function TournamentTable({
|
||||
</div>
|
||||
</div>
|
||||
<table
|
||||
className="relative table-fixed w-full text-center text-xs"
|
||||
className="relative w-full table-fixed text-center text-xs"
|
||||
data-test="tournament-table"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th className="sticky top-0 p-3 bg-teal-600 text-white dark:bg-gray-600">
|
||||
Date
|
||||
<th className="sticky top-0 bg-teal-600 p-3 text-white dark:bg-gray-600">
|
||||
{t("date")}
|
||||
</th>
|
||||
<th className="sticky top-0 p-3 bg-teal-600 text-white dark:bg-gray-600">
|
||||
Ville
|
||||
<th className="sticky top-0 bg-teal-600 p-3 text-white dark:bg-gray-600">
|
||||
{t("town")}
|
||||
</th>
|
||||
<th className="sticky top-0 p-3 bg-teal-600 text-white dark:bg-gray-600">
|
||||
Tournois
|
||||
<th className="sticky top-0 bg-teal-600 p-3 text-white dark:bg-gray-600">
|
||||
{t("competition")}
|
||||
</th>
|
||||
<th className="sticky top-0 p-3 bg-teal-600 text-white dark:bg-gray-600">
|
||||
Cadence
|
||||
<th className="sticky top-0 bg-teal-600 p-3 text-white dark:bg-gray-600">
|
||||
{t("timeControl")}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
Reference in New Issue
Block a user