Skip to content

Commit

Permalink
Fix issues with LinkTo and LinkToExternal on Ember 3.24.0.
Browse files Browse the repository at this point in the history 
Also includes a work around for 3.24.0 (which should be fixed in Ember
3.24.1 once released).
  • Loading branch information
@rwjblue
rwjblue committed Jan 14, 2021
1 parent 5433656 commit bdc186e
Show file tree
Hide file tree
Showing 4 changed files with 1,320 additions and 83 deletions.
134 changes: 80 additions & 54 deletions packages/ember-engines/addon/components/link-to-component.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,73 +4,99 @@ import { computed, get, set } from '@ember/object';
import { typeOf } from '@ember/utils';
import { assert } from '@ember/debug';

export default LinkComponent.extend({
_route: computed('route', '_mountPoint', '_currentRouteState', function () {
let routeName = this._super(...arguments);
let mountPoint = get(this, '_mountPoint');
import { macroCondition, dependencySatisfies } from '@embroider/macros';

if (mountPoint && routeName !== get(this, '_currentRoute')) {
return this._namespacePropertyValue(mountPoint, routeName);
let LinkTo;

if (macroCondition(dependencySatisfies('ember-source', '> 3.24.0-alpha.1'))) {
LinkTo = class EnginesLinkComponent extends LinkComponent {
// temporarily work around an issue in Ember 3.24.0 where when a route name is
// **not** defined (e.g. a QP only transition) we re-wrap the current name (essentially
// double namespacing it)
//
// can be removed once https://github.com/emberjs/ember.js/pull/19337 is landed and released as 3.24.1
@computed('route', '_currentRouterState')
get _route() {
let { route } = this;

if (route.toString() === 'UNDEFINED') {
return this._currentRoute;
} else {
return this._namespaceRoute(route);
}
}
};
} else {
LinkTo = LinkComponent.extend({
_route: computed('route', '_mountPoint', '_currentRouteState', function () {
let routeName = this._super(...arguments);
let mountPoint = get(this, '_mountPoint');

if (mountPoint && routeName !== get(this, '_currentRoute')) {
return this._namespacePropertyValue(mountPoint, routeName);
}

return routeName;
}),
return routeName;
}),

_mountPoint: computed(function () {
return getOwner(this).mountPoint;
}),
_mountPoint: computed(function () {
return getOwner(this).mountPoint;
}),

didReceiveAttrs() {
this._super(...arguments);
didReceiveAttrs() {
this._super(...arguments);

let owner = getOwner(this);
let owner = getOwner(this);

assert(
`You attempted to use {{link-to}} within a routeless engine, this is not supported. Use {{link-to-external}} to construct links within a routeless engine. See http://ember-engines.com/guide/linking-and-external-links for more info.`,
owner.mountPoint !== undefined
);
assert(
`You attempted to use {{link-to}} within a routeless engine, this is not supported. Use {{link-to-external}} to construct links within a routeless engine. See http://ember-engines.com/guide/linking-and-external-links for more info.`,
owner.mountPoint !== undefined
);

if (owner.mountPoint) {
// Prepend engine mount point to targetRouteName
if ('targetRouteName' in this) {
this._prefixProperty(owner.mountPoint, 'targetRouteName');
}
if (owner.mountPoint) {
// Prepend engine mount point to targetRouteName
if ('targetRouteName' in this) {
this._prefixProperty(owner.mountPoint, 'targetRouteName');
}

// Prepend engine mount point to current-when if set
if (get(this, 'current-when') !== null) {
this._prefixProperty(owner.mountPoint, 'current-when');
// Prepend engine mount point to current-when if set
if (get(this, 'current-when') !== null) {
this._prefixProperty(owner.mountPoint, 'current-when');
}
}
}
},
},

_prefixProperty(prefix, prop) {
let propValue = get(this, prop);
_prefixProperty(prefix, prop) {
let propValue = get(this, prop);

// Sometimes `targetRouteName` will be a class
if (typeOf(propValue) !== 'string') {
return;
}
// Sometimes `targetRouteName` will be a class
if (typeOf(propValue) !== 'string') {
return;
}

let namespacedPropValue;
if (prop === 'current-when') {
// `current-when` is a space-separated list of routes
namespacedPropValue = propValue.split(' ');
namespacedPropValue = namespacedPropValue.map(propValue =>
this._namespacePropertyValue(prefix, propValue)
);
namespacedPropValue = namespacedPropValue.join(' ');
} else {
namespacedPropValue = this._namespacePropertyValue(prefix, propValue);
}
let namespacedPropValue;
if (prop === 'current-when') {
// `current-when` is a space-separated list of routes
namespacedPropValue = propValue.split(' ');
namespacedPropValue = namespacedPropValue.map(propValue =>
this._namespacePropertyValue(prefix, propValue)
);
namespacedPropValue = namespacedPropValue.join(' ');
} else {
namespacedPropValue = this._namespacePropertyValue(prefix, propValue);
}

set(this, prop, namespacedPropValue);
},
set(this, prop, namespacedPropValue);
},

_namespacePropertyValue(prefix, propValue) {
if (propValue === 'application') {
return prefix;
} else {
return prefix + '.' + propValue;
_namespacePropertyValue(prefix, propValue) {
if (propValue === 'application') {
return prefix;
} else {
return prefix + '.' + propValue;
}
}
}
});
});
}

export default LinkTo;
40 changes: 28 additions & 12 deletions packages/ember-engines/addon/components/link-to-external.js
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,35 @@
import LinkComponent from '@ember/routing/link-component';
import { getOwner } from '@ember/application';
import { set, get } from '@ember/object';
import { macroCondition, dependencySatisfies } from '@embroider/macros';

export default LinkComponent.extend({
didReceiveAttrs() {
this._super(...arguments);
let LinkToExternal;

const owner = getOwner(this);
if (macroCondition(dependencySatisfies('ember-source', '> 3.24.0-alpha.1'))) {
LinkToExternal = class LinkToExternal extends LinkComponent {
_namespaceRoute(targetRouteName) {
const owner = getOwner(this);
const externalRoute = owner._getExternalRoute(targetRouteName);

if (owner.mountPoint) {
// https://emberjs.github.io/rfcs/0459-angle-bracket-built-in-components.html
const routeKey = 'targetRouteName' in this ? 'targetRouteName' : 'route';
const routeName = get(this, routeKey);
const externalRoute = owner._getExternalRoute(routeName);
set(this, routeKey, externalRoute);
return externalRoute;
}
}
});
};
} else {
LinkToExternal = LinkComponent.extend({
didReceiveAttrs() {
this._super(...arguments);

const owner = getOwner(this);

if (owner.mountPoint) {
// https://emberjs.github.io/rfcs/0459-angle-bracket-built-in-components.html
const routeKey = 'targetRouteName' in this ? 'targetRouteName' : 'route';
const routeName = get(this, routeKey);
const externalRoute = owner._getExternalRoute(routeName);
set(this, routeKey, externalRoute);
}
}
});
}

export default LinkToExternal;
1 change: 1 addition & 0 deletions packages/ember-engines/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@
"ember-addon"
],
"dependencies": {
"@embroider/macros": "^0.35.1",
"amd-name-resolver": "1.3.1",
"babel-plugin-compact-reexports": "^1.1.0",
"broccoli-babel-transpiler": "^7.2.0",
Expand Down
Loading

0 comments on commit bdc186e

Please sign in to comment.