Página Home: lista

Debido a que las funciones de JavaScript son “ciudadanos de primera clase”, al momento de hacer el then, como el parámetro que tiene es el mismo que usamos dentro del setData, podemos simplificarlo de la siguiente manera:

  useEffect(() => {
    getPlantList({ limit: 10 })
      .then(setData)
  }, [])

Lo importante es la legibilidad, si te parece mejor la otra forma, no tienes porque cambiarlo 😁

import { useEffect, useState } from 'react'
import { Grid } from '@ui/Grid'
import { Button } from '@ui/Button'
import { Typography } from '@ui/Typography'
import { Layout } from '@components/Layout'
import { PlantCollection } from "@components/PlantCollection";
import { getPlantList } from "@api";



export default function Home() {
  const [data, setData] = useState<Plant[]>([])

  useEffect(() => {
    getPlantList({ limit: 10 }).then((receiveData) => setData(receiveData))
  }, [])

  return (
    <Layout>
      <PlantCollection plants={data} variant="square"></PlantCollection>
    </Layout>
  )
}