From d254780ee98e7cee10655eaf39adf94936254d80 Mon Sep 17 00:00:00 2001
From: Owen Rees <owenrees82@gmail.com>
Date: Wed, 5 Jul 2023 21:56:30 +0200
Subject: [PATCH] remove clear button

---
 app/[lang]/tournois/SearchBar.tsx       | 11 ++++-------
 app/[lang]/tournois/TournamentTable.tsx | 16 +---------------
 2 files changed, 5 insertions(+), 22 deletions(-)

diff --git a/app/[lang]/tournois/SearchBar.tsx b/app/[lang]/tournois/SearchBar.tsx
index 249eb21..418e96f 100644
--- a/app/[lang]/tournois/SearchBar.tsx
+++ b/app/[lang]/tournois/SearchBar.tsx
@@ -1,13 +1,10 @@
-import { Dispatch, SetStateAction } from "react";
 import { useTranslations } from "next-intl";
+import { useAtom } from "jotai/index";
+import { searchStringAtom } from "@/app/atoms";
 
-interface SearchBarProps {
-  searchString: string;
-  setSearchString: Dispatch<SetStateAction<string>>;
-}
-
-const SearchBar = ({ searchString, setSearchString }: SearchBarProps) => {
+const SearchBar = () => {
   const t = useTranslations("Tournaments");
+  const [searchString, setSearchString] = useAtom(searchStringAtom);
 
   return (
     <div className="bg-white dark:bg-gray-800">
diff --git a/app/[lang]/tournois/TournamentTable.tsx b/app/[lang]/tournois/TournamentTable.tsx
index 044f79c..4f72e90 100644
--- a/app/[lang]/tournois/TournamentTable.tsx
+++ b/app/[lang]/tournois/TournamentTable.tsx
@@ -21,7 +21,6 @@ import ScrollToTopButton from "./ScrollToTopButton";
 export default function TournamentTable() {
   const t = useTranslations("Tournaments");
 
-  const [searchString, setSearchString] = useAtom(searchStringAtom);
   const filteredTournaments = useAtomValue(filteredTournamentsListAtom);
   const [syncVisible, setSyncVisible] = useAtom(syncVisibleAtom);
   const hoveredMapTournamentId = useAtomValue(hoveredMapTournamentIdAtom);
@@ -41,10 +40,6 @@ export default function TournamentTable() {
     tournamentRow?.scrollIntoView({ behavior: "smooth" });
   }, [debouncedHoveredMapTournamentId]);
 
-  const handleClearSearch = () => {
-    setSearchString("");
-  };
-
   return (
     <section
       className="tournament-table grid w-full auto-rows-max pb-20 lg:col-start-2 lg:col-end-3 lg:h-[calc(100vh-144px)] lg:overflow-y-scroll"
@@ -52,16 +47,7 @@ export default function TournamentTable() {
       data-test="tournament-table-div"
     >
       <div className="z-10 flex w-full flex-wrap items-center justify-between gap-3 p-3">
-        <SearchBar
-          searchString={searchString}
-          setSearchString={setSearchString}
-        />
-        <button
-          className="mr-auto rounded-full bg-teal-600 px-3 py-1 text-white hover:bg-teal-700"
-          onClick={() => handleClearSearch()}
-        >
-          {t("clearButton")}
-        </button>
+        <SearchBar />
         <div className="text-gray-900 dark:text-white">
           <label>
             <input