//ListaDeEventos/index.tsx
import React from 'react'; import Evento from '../Evento'; import Filtro from '../Filtro'; import style from './ListaDeEventos.module.scss'; import useListaDeEventos from '../../state/hooks/useListaDeEventos';
const ListaDeEventos: React.FC = () => {
const eventos = useListaDeEventos();
return (
export default ListaDeEventos
//hook/UseListaDeEventos.ts
import { useRecoilValue } from "recoil"; import { eventosFiltradosState } from "../seletores";
const useListaDeEventos = () => { return useRecoilValue(eventosFiltradosState) }
export default useListaDeEventos
//select/index.ts
import { selector } from "recoil"; import { filtroDeEventos, listaDeEventosState } from "../atom";
export const eventosFiltradosState = selector({ key: 'eventosFiltradosState', get: ({ get }) => { const filtro = get(filtroDeEventos) const todosOsEventos = get(listaDeEventosState) const eventos = todosOsEventos.filter(evento => { if (!filtro.data) { return true } const ehOMesmoDia = filtro.data.toISOString().slice(0, 10) === evento.inicio.toISOString().slice(0, 10) return ehOMesmoDia }) return eventos } })
