Sanity GROQ Referencing

Question

Inside of Sanity I have setup pages that have an array of page sections - a page sections is a section of the page that allows me to build dynamic pages by adding and organizing page sections however I want. Some sample page sections are: sectionHeroImage, sectionTitleContent, sectionImageSlider, sectionPageList, etc. I am using nextjs and when I make the GROQ query to get the data for the page sections, the data is returned, but sometimes I need to retrieve referenced data from that section. Here is a sample GROQ query to get the data:

*[_type == "page" && slug.current == 'home-page'][0]

This will return all of the data on the page document, along with the page section data. However, let's take sectionPageList, which is a sanity object that contains an array that references to a page. A sample use case would be wanting to display a list of specific pages somewhere on the page. With the query above, I only get the _ref, _type and _key properties returned. I've been able to figure out the following:

*[_type == "page" && slug.current == 'home-page'][0] {
  ...,
  "sections": sections[] {
    ...,
    "pages": pages[] -> {
      title
    }
  }
}

This will return the title for each referenced page, but I have two questions:

1. This also returns a pages property for every section even if the section does not have a pages section. How can I only return the pages property on specific page sections (ie: if `section._type === 'sectionPageList')?

2. Is this the right way to go about this?