GraphQL: Nesting Reusable Interface Fragment within a Type Fragment

Question

I'm new to GraphQL and Apollo Client.

I'm trying to write DRY queries as much possible and found that Fragments can be of great help.

Here is how my GraphQL schema would look like:

interface header { # Implemented by multiple types
  uuid: ID!
  created_at: DateTime 
  created_by: String 
  updated_at: DateTime
  updated_by: String
}

type account implements header @withSubscription {
  id: String! @id @search(by:[term])
  name: String @search(by:[fulltext])
  description: String @search(by:[fulltext])
  ...
}

on the client side, I'm trying to setup my operations.graphql as follows:

fragment headerData on header {
  uuid
  created_at
  created_by
  updated_at
  updated_by
}

fragment accountNode on account { 
  ...headerData
  id
  name
  description
  #.. rest of the fields
}

query getPaginatedAccounts(first: Int, offset: Int) {
  queryaccount {
    ...accountNode
    # .. rest of the fields
  }
}

However, when I execute the query, the results set doesn't fetch any data from the accountNode fragment.

Is this correct way to nest the fragments?

I realize that if I change the accountNode fragment as follows, it works and gets me the data:

fragment accountNode on account { 
      ... on header {
        uuid
        created_at
        #..rest of header fields
      }
      id
      name
      description
      #.. rest of the fields
    }

But since header interface is implemented by multiple types, its not DRY to repeat those fields on every Type Fragment.

Thanks in advance.