ui: Native-ize class based helpers (#9337)
* Install ember-decorators/observes * Remove filter-predicate * Nativize `env` and inject env service * Nativize all other class based helpers
This commit is contained in:
parent
bf71d76709
commit
0ca087cc77
|
@ -1,8 +1,10 @@
|
|||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
export default Helper.extend({
|
||||
dom: service('dom'),
|
||||
compute: function([target, from], hash) {
|
||||
|
||||
export default class DomPosition extends Helper {
|
||||
@service('dom') dom;
|
||||
|
||||
compute([target, from], hash) {
|
||||
const $target = this.dom.element(target);
|
||||
const $from = this.dom.element(from);
|
||||
const fromRect = $from.getBoundingClientRect();
|
||||
|
@ -10,5 +12,5 @@ export default Helper.extend({
|
|||
rect.x = rect.x - fromRect.x;
|
||||
rect.y = rect.y - fromRect.y;
|
||||
return rect;
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,11 @@
|
|||
import { helper } from '@ember/component/helper';
|
||||
import { env } from 'consul-ui/env';
|
||||
export default helper(function([name, def = ''], hash) {
|
||||
const val = env(name);
|
||||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
|
||||
export default class EnvHelper extends Helper {
|
||||
@service('env') env;
|
||||
|
||||
compute([name, def = ''], hash) {
|
||||
const val = this.env.var(name);
|
||||
return val != null ? val : def;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,9 +0,0 @@
|
|||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
|
||||
export default Helper.extend({
|
||||
filter: service('filter'),
|
||||
compute([type, filters], hash) {
|
||||
return this.filter.predicate(type)(filters);
|
||||
},
|
||||
});
|
|
@ -4,8 +4,9 @@ import { hrefTo } from 'consul-ui/helpers/href-to';
|
|||
import { getOwner } from '@ember/application';
|
||||
import transitionable from 'consul-ui/utils/routing/transitionable';
|
||||
|
||||
export default Helper.extend({
|
||||
router: service('router'),
|
||||
export default class HrefMutHelper extends Helper {
|
||||
@service('router') router;
|
||||
|
||||
compute([params], hash) {
|
||||
return hrefTo(
|
||||
this,
|
||||
|
@ -13,5 +14,5 @@ export default Helper.extend({
|
|||
transitionable(this.router.currentRoute, params, getOwner(this)),
|
||||
hash
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
// (dynamic or wildcard) and encode or not depending on the type
|
||||
import { inject as service } from '@ember/service';
|
||||
import Helper from '@ember/component/helper';
|
||||
import { observer } from '@ember/object';
|
||||
import { observes } from '@ember-decorators/object';
|
||||
import { hrefTo as _hrefTo } from 'ember-href-to/helpers/href-to';
|
||||
|
||||
import wildcard from 'consul-ui/utils/routing/wildcard';
|
||||
|
@ -38,12 +38,15 @@ export const hrefTo = function(owned, router, [targetRouteName, ...rest], namedA
|
|||
}
|
||||
};
|
||||
|
||||
export default Helper.extend({
|
||||
router: service('router'),
|
||||
export default class HrefToHelper extends Helper {
|
||||
@service('router') router;
|
||||
|
||||
compute(params, hash) {
|
||||
return hrefTo(this, this.router, params, hash);
|
||||
},
|
||||
onURLChange: observer('router.currentURL', function() {
|
||||
}
|
||||
|
||||
@observes('router.currentURL')
|
||||
onURLChange() {
|
||||
this.recompute();
|
||||
}),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,17 +2,20 @@
|
|||
// TODO: Remove ^
|
||||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
import { observer } from '@ember/object';
|
||||
import { observes } from '@ember-decorators/object';
|
||||
|
||||
export default class IsHrefHelper extends Helper {
|
||||
@service('router') router;
|
||||
|
||||
export default Helper.extend({
|
||||
router: service('router'),
|
||||
compute([targetRouteName, ...rest]) {
|
||||
if (this.router.currentRouteName.startsWith('nspace.') && targetRouteName.startsWith('dc.')) {
|
||||
targetRouteName = `nspace.${targetRouteName}`;
|
||||
}
|
||||
return this.router.isActive(...[targetRouteName, ...rest]);
|
||||
},
|
||||
onURLChange: observer('router.currentURL', function() {
|
||||
}
|
||||
|
||||
@observes('router.currentURL')
|
||||
onURLChange() {
|
||||
this.recompute();
|
||||
}),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,13 +2,14 @@ import Helper from '@ember/component/helper';
|
|||
import { inject as service } from '@ember/service';
|
||||
import { getOwner } from '@ember/application';
|
||||
|
||||
export default Helper.extend({
|
||||
router: service('router'),
|
||||
export default class RefreshRouteHelper extends Helper {
|
||||
@service('router') router;
|
||||
|
||||
compute(params, hash) {
|
||||
return () => {
|
||||
const container = getOwner(this);
|
||||
const routeName = this.router.currentRoute.name;
|
||||
return container.lookup(`route:${routeName}`).refresh();
|
||||
};
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
|
||||
export default Helper.extend({
|
||||
state: service('state'),
|
||||
export default class StateMatchesHelper extends Helper {
|
||||
@service('state') state;
|
||||
|
||||
compute([state, values], hash) {
|
||||
return this.state.matches(state, values);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
|
||||
export default Helper.extend({
|
||||
ticker: service('ticker'),
|
||||
compute: function([props, id], hash) {
|
||||
export default class TweenToHelper extends Helper {
|
||||
@service('ticker') ticker;
|
||||
|
||||
compute([props, id], hash) {
|
||||
return this.ticker.tweenTo(props, id);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
import Helper from '@ember/component/helper';
|
||||
import { inject as service } from '@ember/service';
|
||||
|
||||
export default Helper.extend({
|
||||
encoder: service('encoder'),
|
||||
export default class UriHelper extends Helper {
|
||||
@service('encoder') encoder;
|
||||
|
||||
compute(params, hash) {
|
||||
return this.encoder.uriJoin(params);
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -106,6 +106,7 @@
|
|||
"ember-composable-helpers": "~4.0.0",
|
||||
"ember-data": "~3.20.4",
|
||||
"ember-data-model-fragments": "5.0.0-beta.0",
|
||||
"ember-decorators": "^6.1.1",
|
||||
"ember-exam": "^4.0.0",
|
||||
"ember-export-application-global": "^2.0.1",
|
||||
"ember-href-to": "^3.1.0",
|
||||
|
|
19
ui/yarn.lock
19
ui/yarn.lock
|
@ -1213,7 +1213,7 @@
|
|||
ember-cli-typescript "^3.1.3"
|
||||
heimdalljs "^0.3.0"
|
||||
|
||||
"@ember-decorators/component@^6.1.0":
|
||||
"@ember-decorators/component@^6.1.0", "@ember-decorators/component@^6.1.1":
|
||||
version "6.1.1"
|
||||
resolved "https://registry.yarnpkg.com/@ember-decorators/component/-/component-6.1.1.tgz#b360dc4fa8e576ee1c840879399ef1745fd96e06"
|
||||
integrity sha512-Cj8tY/c0MC/rsipqsiWLh3YVN72DK92edPYamD/HzvftwzC6oDwawWk8RmStiBnG9PG/vntAt41l3S7HSSA+1Q==
|
||||
|
@ -1221,6 +1221,14 @@
|
|||
"@ember-decorators/utils" "^6.1.1"
|
||||
ember-cli-babel "^7.1.3"
|
||||
|
||||
"@ember-decorators/object@^6.1.1":
|
||||
version "6.1.1"
|
||||
resolved "https://registry.yarnpkg.com/@ember-decorators/object/-/object-6.1.1.tgz#50c922f5ac9af3ddd381cb6a43a031dfd9a70c7a"
|
||||
integrity sha512-cb4CNR9sRoA31J3FCOFLDuR9ztM4wO9w1WlS4JeNRS7Z69SlB/XSXB/vplA3i9OOaXEy/zKWbu5ndZrHz0gvLw==
|
||||
dependencies:
|
||||
"@ember-decorators/utils" "^6.1.1"
|
||||
ember-cli-babel "^7.1.3"
|
||||
|
||||
"@ember-decorators/utils@^6.1.0", "@ember-decorators/utils@^6.1.1":
|
||||
version "6.1.1"
|
||||
resolved "https://registry.yarnpkg.com/@ember-decorators/utils/-/utils-6.1.1.tgz#6b619814942b4fb3747cfa9f540c9f05283d7c5e"
|
||||
|
@ -7987,6 +7995,15 @@ ember-data@~3.20.4:
|
|||
ember-cli-typescript "^3.1.3"
|
||||
ember-inflector "^3.0.1"
|
||||
|
||||
ember-decorators@^6.1.1:
|
||||
version "6.1.1"
|
||||
resolved "https://registry.yarnpkg.com/ember-decorators/-/ember-decorators-6.1.1.tgz#6d770f8999cf5a413a1ee459afd520838c0fc470"
|
||||
integrity sha512-63vZPntPn1aqMyeNRLoYjJD+8A8obd+c2iZkJflswpDRNVIsp2m7aQdSCtPt4G0U/TEq2251g+N10maHX3rnJQ==
|
||||
dependencies:
|
||||
"@ember-decorators/component" "^6.1.1"
|
||||
"@ember-decorators/object" "^6.1.1"
|
||||
ember-cli-babel "^7.7.3"
|
||||
|
||||
ember-destroyable-polyfill@^2.0.2:
|
||||
version "2.0.2"
|
||||
resolved "https://registry.yarnpkg.com/ember-destroyable-polyfill/-/ember-destroyable-polyfill-2.0.2.tgz#2cc7532bd3c00e351b4da9b7fc683f4daff79671"
|
||||
|
|
Loading…
Reference in New Issue