fix: search compomemts

messages/br.json

@@ -16,7 +16,8 @@
     "responsible": "Responsible Gaming Policy",
     "esportes":  "Esportes Regras",
     "search": "Procure Jogos ou Provedores",
-    "searchHint": "A pesquisa requer pelo menos 3 caracteres",
+    "searchTips": "A pesquisa requer pelo menos 3 caracteres",
+
     "licencia":  "LICENÇA",
     "desc": "XQEsoft.com  é operada conjunta pela Dubet n.v. e pela MLsoft, número de registro da empresa 142919, com endereço registrado em Zuikertuintjeweg Z/N (Zuikertuin Tower) Curação e é licenciada e autorizada pelo governo de Curação. A XQEsoft.com  opera sob a Master License of Gaming Services Provider, N.V. Número da Licença: ",
     "desclink":  "GLH-OCCHKTW0705152022",

src/app/[locale]/(extend)/_home/HomeSearch.tsx

@@ -5,8 +5,13 @@ import { useTranslations } from "next-intl";
 import { FC, PropsWithChildren, useState } from "react";
 interface Props {}
 
-const Content: FC = () => {
+interface ContentProps {
+    closeHandler: () => void;
+}
+const Content: FC<ContentProps> = (props) => {
     const t = useTranslations("HomePage");
+    const { closeHandler } = props;
+    const changeHandler = (value: string) => {};
 
     // @ts-ignore
     return (
@@ -20,13 +25,15 @@ const Content: FC = () => {
                     }}
                     placeholder={t("search")}
                     showCancelButton={() => true}
+                    onChange={changeHandler}
+                    onCancel={closeHandler}
                 />
                 <div
                     className={
                         "h-[.5rem] text-center text-[0.12rem] text-[#6e6e6e]" + " leading-[.5rem]"
                     }
                 >
-                    A pesquisa requer pelo menos 3 caracteres
+                    {t("searchTips")}
                 </div>
             </section>
         </Box>
@@ -52,7 +59,7 @@ const HomeSearch: FC<PropsWithChildren<Props>> = (props) => {
                 <span className={"text-[0.12rem]"}>{t("search")}</span>
             </div>
             <Mask visible={visible} opacity={0.9}>
-                <Content />
+                <Content closeHandler={() => setVisible(false)} />
             </Mask>
         </>
     );