filter out parent page from ChildrenQuery response

[thescientist13]

Type of Change

• New Feature Request
• Documentation / Website
• Improvement / Suggestion
• Bug
• Other (please clarify below)

Summary

Right now ChildrenQuery is returning the index.md as part of the array of pages returned, which is effectively the parent route. I think in this case, it doesn't make sense to return the parent if you are asking for the children, or else to render the children as a list, you'll have to exclude the parent, e.g. ${parent}/index.md

So effectively the resolver should just filter out index.md then.

Details

Given a structure like this

pages/
  blog/
    first-post.md
    index.md
    second-post.md
    third-post.md

And render it like this

render() {
  return html`
    <ul>
      ${posts.map((post) => {
        return html`
          <li>
            <a href="${post.link}" title="Click to read my ${post.title} blog post">${post.title}</a>
          </li>
        `;
       })}
     </ul>
  `
}

You'll have to something like this in your component

class BlogPostsTemplate extends LitElement {
  ...
  
  async connectedCallback() {
    super.connectedCallback();
    const response = await client.query({
      query: ChildrenQuery,
      variables: {
        parent: 'blog'
      }
    });

    this.posts = response.data.children.filter(post => {
      return post.filePath.indexOf('/blog/index') < 0;
    });
  }

Or else you'll have a list like this, when you probably only want the posts themselves

1. First Post
2. Blog
3. Second Post
4. Third Post

[thescientist13]

Another case of where filtering this out would be nice. going to try and work on this.