Related Query Demo

adapters.application\.js

import JSONAPIAdapter from '@ember-data/adapters/json-api';

// ideally write entirely your own thing, but you can do this just as well extending an existing adapter
export default class Adapter extends JSONAPIAdapter {
  async query(store, schema, query, recordArray, { adapterOptions }) {
  	if (adapterOptions.isRelationshipQuery) {
      // tbh depending on this link in this situation is probably not the way
        // to go. You probably want to construct the url yourself or access the full
        // set of links and choose the right one.
      
      // you may also want to do some processing of the response here vs doing it in the serializer
      // far easier to normalize when you have context of what the request made was.
        return this.findHasMany(store, schema, adapterOptions.link, adapterOptions.relationship);
    } else {
      return super.query(store, schema, query, recordArray, { adapterOptions });
    }
  }
}

controllers.application\.js

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  appName = 'Ember Twiddle';
}

models.event\.js

import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo, hasMany } from 'ember-data/relationships';

const QueryResults = new WeakMap();

export default class extends Model {
  @attr name;
  @hasMany('session', { inverse: null, async: false }) sessions;
  @hasMany('speaker', { inverse: null, async: false }) speakers;
  
  async query(relationshipName, options) {
    // implement a cacheKey that makes sense.
    // Remember you may not always get args in
    // the same order so do something to ensure stable serialization.
    let cacheKey = `${relationshipName}/${options.include}/${options['page[size]']}/${options.filter.map(v => JSON.stringify(v)).join(',')}`;
  	let results = QueryResults.get(this);
    if (!results) {
      results = new Map();
      QueryResults.set(this, results);
    }
    
    // probably give yourself a flag like "reload" as well to bust the cache
    let cached = results.get(cacheKey);
    if (cached) {
      return cached;
    }
    
    // auto assign whatever data from the event you want
    const type = this.constructor.modelName;
    const relationship = this.constructor.relationships.get(relationshipName);
    const link = this.hasMany(relationshipName).link;
 
    const adapterOptions = {
      isRelationshipQuery: true,
      relationship,
      link
    }
 
    let queryResult = await this.store.query(relationship.type, options, { adapterOptions });
    result.set(cacheKey, queryResult);
    return queryResult;
  }
}

event.query('speakers', {
  include      : 'sessions',
  filter       : [{ featured: true }],
  'page[size]' : 6
});

templates.application\.hbs

<h1>Welcome to {{this.appName}}</h1>
<br>
<br>
{{outlet}}
<br>
<br>

twiddle\.json

{
  "version": "0.17.1",
  "EmberENV": {
    "FEATURES": {},
    "_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false,
    "_APPLICATION_TEMPLATE_WRAPPER": true,
    "_JQUERY_INTEGRATION": true
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js",
    "ember": "3.18.1",
    "ember-template-compiler": "3.18.1",
    "ember-testing": "3.18.1"
  },
  "addons": {
    "@glimmer/component": "1.0.0"
  }
}