Contentful Tags not rendering on page

I'm creating article cards, and I want the tags to get rendered within the card. I'm using NextJS and GraphQLClient to fetch data from Contentful. Everything gets rendered but not the Tags.

This is my query:

export async function getArticles() {    const articlesQuery = gql`      {        articleCollection {          items {            title            slug            excerpt            date            contentfulMetadata {              tags {                name                id              }            }            featuredImage {              title              url              width              height            }          }        }      }    `;    return graphQLClient.request(articlesQuery);  }  

This is the results using GraphiQL:

This is my article page where I want the tags to appear on the article post cards:

export async function getStaticProps() {    const articles = await getArticles();      return {      props: {        articles: articles.articleCollection.items,      },    };  }    export default function ArticlesPage({ articles }) {    return (      <Wrapper>        <div>          <div>            <div/>          </div>          <div>            <div>              {articles.map((article) => (                <Link key={article.slug} href={`/articles/${article.slug}`}>                  <div key={article.title}>                    <div>                      <img                        src={article.featuredImage.url}                        alt=""                      />                    </div>                    <div>                      <div>                        <p>                          <a href={article.contentfulMetadata.tags.name}>                            {article.contentfulMetadata.tags.name}                          </a>                        </p>                        <a>                          <p>                            {article.title}                          </p>                          <p>                            {article.excerpt}                          </p>                        </a>                      </div>                      <div>                        <div>                        </div>                        <div>                          <p>                          </p>                        </div>                      </div>                    </div>                  </div>                </Link>              ))}            </div>          </div>        </div>      </Wrapper>    );  }  

Can you help me spot what I'm doing wrong?

https://stackoverflow.com/questions/67239491/contentful-tags-not-rendering-on-page April 24, 2021 at 01:05PM