text: import React from "react";
  import Layout from "../components/layout";
  import SEO from "../components/seo";
  import { graphql, Link } from "gatsby";
  
  const Plants = ({ data }) => {
    const plantList = data.allPlant.nodes.map(plant => (
      <li key={plant.id}>
        <Link to={`/plants/${plant.id}`}>{plant.name}</Link>
      </li>
    ));
    return (
      <Layout>
        <SEO title="Plants"></SEO>
        <h1>Plantas</h1>
        <input type="text" placeholder="Buscar.."></input>
        <ul>{plantList}</ul>
      </Layout>
    );
  };
  
  export default Plants;
  
  export const query = graphql`
    query {
      allPlant {
        nodes {
          id
          name
        }
      }
    }
  `;
  