New Lix API

components.lix.is-enabled.js

import Ember from 'ember';
import { computed } from '@ember/object';

export default Ember.Component.extend({
  init() {
    this._super(...arguments);
    console.log('created');
  },
  isEnabled: computed('params.[]', function(){
    const treatment = this.params[0][this.params[1]]
    return treatment === 'enabled';
  })
}).reopenClass({
  positionalParams: 'params'
});

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Lix Demo App'
});

router.js

import EmberRouter from '@ember/routing/router';
import config from './config/environment';

const Router = EmberRouter.extend({
  location: 'none',
  rootURL: config.rootURL
});

Router.map(function() {
  this.route('my-route', function() {
  	this.route('child');
  });
});

export default Router;

routes.index.js

import RSVP from 'rsvp';
import Route from '@ember/routing/route';
import { assert } from '@ember/debug';
import { isNotControl } from './../utils/lix';
import { inject as service } from '@ember/service';

// function getRouteSnapshot(route, )

function getRouteSnapshot(route) {
  return route.lix._getRouteSnapshot(route, route.lixKeys);
}

function getRouteTreatment(route, lixKey) {
	assert('Can only look up lixes defined in lixKeys', route.lixKeys.includes(lixKey));
  return route.lix._getRouteTreatment(route, lixKey);
}

export default Route.extend({
  lix: service(),
  lixKeys: ['greet.user', 'voyager.my.feature'],
  model() {
    // Sometimes we need to evaluate a lix synchronously
    // If a lix is looked up synchronously in the route, the treatment value is
    // "frozen" and won't be updated for the route snapshot
    const guard = isNotControl(getRouteTreatment(this, 'my.infra.feature'));
    return RSVP.hash({
      lixes: getRouteSnapshot(this),
      data: guard ? fetch('foo') : fetch('bar')
    });
  },
  actions: {
    myAction() {
      if (getRouteTreatment(this, 'my.infra.feature')) {
      	// Do something
      }
    }
  }
});

services.lix.js

import Ember from 'ember';
import { assert } from '@ember/debug';
import RSVP from 'rsvp';

export default Ember.Service.extend({
  _cache: {
    'greet.user': 'enabled',
    'voyager.a': 'enabled',
    'my.infra.feature': 'enabled'
   },
  _getRouteSnapshot(route, lixes) {
    assert(route, 'You must provide the route object');
    assert(Array.isArray(lixes), 'You must provide a list of required lixes');
    return RSVP.resolve(this._cache);
  },
  lookupTreatmentSync(key) {
    return this._cache[key];
  }
});

templates.application.hbs

<h1>Welcome to {{appName}}</h1>
{{outlet}}

templates.components.lix.is-enabled.hbs

{{#if isEnabled}}
	{{yield}}
{{/if}}

templates.components.my-component.hbs

{{#lix/is-enabled lixes "voyager.a"}}
	Voyager A lix is enabled
{{/lix/is-enabled}}

templates.index.hbs

<p>
	<i>Try modifying the values in the lix service</i>
</p>
{{#lix/is-enabled model.lixes "greet.user"}}
	Hello, {{model.name}}
{{/lix/is-enabled}}
{{my-component lixes=model.lixes}}

twiddle.json

{
  "version": "0.15.1",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js",
    "ember": "3.4.3",
    "ember-template-compiler": "3.4.3",
    "ember-testing": "3.4.3"
  },
  "addons": {
    "ember-data": "3.4.2"
  }
}

utils.lix.js

export function isNotControl(treatment) {
  return treatment && treatment !== 'control';
}