DEV: Simplify breadcrumbs by using `path` arg (#27744)
Example: ```hbs <DBreadcrumbItem @path="/admin/plugins/{{@plugin.name}}" @label={{@plugin.nameTitleized}} /> ``` Using `@path` instead of `@route`+`@model` combo makes it impossible to pass temporarily unresolvable routes. This fixes a bug with navigating from a model-based route to a parent route.
This commit is contained in:
parent
49f6e1133a
commit
ae79ba1447
|
@ -27,14 +27,13 @@ export default class AdminPluginConfigPage extends Component {
|
|||
<div class="admin-plugin-config-page">
|
||||
<DBreadcrumbsContainer />
|
||||
|
||||
<DBreadcrumbsItem @route="admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem
|
||||
@route="adminPlugins"
|
||||
@path="/admin/plugins"
|
||||
@label={{i18n "admin.plugins.title"}}
|
||||
/>
|
||||
<DBreadcrumbsItem
|
||||
@route="adminPlugins.show"
|
||||
@model={{@plugin}}
|
||||
@path="/admin/plugins/{{@plugin.name}}"
|
||||
@label={{@plugin.nameTitleized}}
|
||||
/>
|
||||
|
||||
|
|
|
@ -1,7 +1,10 @@
|
|||
<DBreadcrumbsContainer />
|
||||
|
||||
<DBreadcrumbsItem @route="admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem @route="adminPlugins" @label={{i18n "admin.plugins.title"}} />
|
||||
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem
|
||||
@path="/admin/plugins"
|
||||
@label={{i18n "admin.plugins.title"}}
|
||||
/>
|
||||
|
||||
<div class="admin-plugins-list-container">
|
||||
{{#if this.model.length}}
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
<DBreadcrumbsItem
|
||||
@route="adminPlugins.show.settings"
|
||||
@model={{@model.plugin}}
|
||||
@path="/admin/plugins/{{@model.plugin.name}}/settings"
|
||||
@label={{i18n "admin.plugins.change_settings_short"}}
|
||||
/>
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import Component from "@glimmer/component";
|
||||
import { cached } from "@glimmer/tracking";
|
||||
import { service } from "@ember/service";
|
||||
import getURL from "discourse-common/lib/get-url";
|
||||
|
||||
export default class DBreadcrumbsItem extends Component {
|
||||
@service breadcrumbs;
|
||||
|
@ -16,23 +16,14 @@ export default class DBreadcrumbsItem extends Component {
|
|||
this.breadcrumbs.items.delete(this);
|
||||
}
|
||||
|
||||
get url() {
|
||||
if (this.args.model) {
|
||||
return this.router.urlFor(this.args.route, this.args.model);
|
||||
} else {
|
||||
return this.router.urlFor(this.args.route);
|
||||
}
|
||||
}
|
||||
|
||||
@cached
|
||||
// @cached
|
||||
get templateForContainer() {
|
||||
// Those are evaluated in a different context than the `@linkClass`
|
||||
const { label } = this.args;
|
||||
const url = this.url;
|
||||
const { label, path } = this.args;
|
||||
|
||||
return <template>
|
||||
<li ...attributes>
|
||||
<a href={{url}} class={{@linkClass}}>
|
||||
<a href={{getURL path}} class={{@linkClass}}>
|
||||
{{label}}
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
@ -13,8 +13,8 @@ module(
|
|||
test("it renders a DBreadcrumbsContainer with multiple DBreadcrumbsItems", async function (assert) {
|
||||
await render(<template>
|
||||
<DBreadcrumbsContainer />
|
||||
<DBreadcrumbsItem @route="admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem @route="about" @label={{i18n "about.simple_title"}} />
|
||||
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem @path="/about" @label={{i18n "about.simple_title"}} />
|
||||
</template>);
|
||||
|
||||
assert
|
||||
|
@ -28,7 +28,7 @@ module(
|
|||
@additionalLinkClasses="some-class"
|
||||
@additionalItemClasses="other-class"
|
||||
/>
|
||||
<DBreadcrumbsItem @route="admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
|
||||
</template>);
|
||||
|
||||
assert.dom(".d-breadcrumbs .d-breadcrumbs__item.other-class").exists();
|
||||
|
@ -43,7 +43,7 @@ module(
|
|||
await render(<template>
|
||||
<DBreadcrumbsContainer />
|
||||
<DBreadcrumbsContainer />
|
||||
<DBreadcrumbsItem @route="admin" @label={{i18n "admin_title"}} />
|
||||
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
|
||||
</template>);
|
||||
|
||||
assert.dom(".d-breadcrumbs").exists({ count: 2 });
|
||||
|
|
Loading…
Reference in New Issue