[Projeto] Projeto finalizado

Olá, tudo bom pessoal?

Projeto finalizado. Não modifiquei muita coisa pois estava tentando fazer o input de pesquisa funcionar.

Eu utilizei o useEffect para poder filtrar as fotos pelo input de pesquisa.

Está funcionando! mas acho que ele se sobrepõe as tags (queria que ao selecionar as tags ele só pesquise o que está na tag) Talvez eu deva criar um estado para as tags... não sei se é isso.

Tentei usar o normalize() para pesquisar independente se tem acento, mas não funcionou.

Também fui fazendo o projeto tentando (o máximo possível) colocar o código em inglês (variáveis, nome das pastas e arquivos) e coloquei o nome nas fotos.

Na página principal ficou o useState e passei os valores para os componentes cabeçalho e galeria

export default function FrontPage() {
  const [search, setSearch] = useState('')
  //console.log(search);
  return (
    <>
      <Header search={search} setSearch={setSearch} />
      <main>
        <section className={styles.main__section}>
          <Menu />
          <Banner />
        </section>
        <div className={styles.gallery}>
          <Gallery typed={search} />
          {/* <Popular /> */}
        </div>
      </main>
      <Footer />
    </>
  )
}

No componente Galeria depois do filtro.

export default function Gallery({ typed }) {
  const [photosObj, setPhotosObj] = useState(photos)

  /* código omitido */

useEffect(() => {
    const searching = (text) => {
      const regex = new RegExp(typed, 'i')
      return regex.test(text)
    }
    const newPhotosObj = photos.filter(photo => searching(photo.titulo))

    setPhotosObj(newPhotosObj)

  }, [typed])

  /* código omitido */

Repositório: https://github.com/Cruz-Andre/alura-space

E o deploy: https://alura-space-theta.vercel.app/

Logo mais, tem mais. Abraços