diff --git a/ui/core/app/components/bread-crumbs.hbs b/ui/core/app/components/bread-crumbs.hbs
index f969028c6..d902b4d1b 100644
--- a/ui/core/app/components/bread-crumbs.hbs
+++ b/ui/core/app/components/bread-crumbs.hbs
@@ -1,15 +1,35 @@
-{{#if this.breadCrumbs}}
-
- {{#each this.breadCrumbs as |crumb|}}
- {{#if crumb.model}}
-
- {{crumb.label}}
-
- {{else}}
-
- {{crumb.label}}
-
- {{/if}}
- {{/each}}
-
-{{/if}}
+
+
+ {{#if this.scope.org}}
+ {{#unless this.scope.org.isGlobal}}
+
+ {{t "resources.org.title_plural"}}
+
+
+ {{this.scope.org.displayName}}
+
+ {{/unless}}
+ {{/if}}
+
+ {{#if this.scope.project}}
+
+ {{t "resources.project.title_plural"}}
+
+
+ {{this.scope.project.displayName}}
+
+ {{/if}}
+
+ {{#each this.breadCrumbs as |crumb|}}
+ {{#if crumb.model}}
+
+ {{crumb.label}}
+
+ {{else}}
+
+ {{crumb.label}}
+
+ {{/if}}
+ {{/each}}
+
+
diff --git a/ui/core/app/components/bread-crumbs.js b/ui/core/app/components/bread-crumbs.js
new file mode 100644
index 000000000..be3c4921b
--- /dev/null
+++ b/ui/core/app/components/bread-crumbs.js
@@ -0,0 +1,10 @@
+import BreadCrumbsComponent from 'ember-breadcrumbs/components/bread-crumbs';
+import { inject as service } from '@ember/service';
+
+export default class crumbs extends BreadCrumbsComponent {
+
+ // =services
+
+ @service scope;
+
+}
diff --git a/ui/core/app/controllers/scopes/scope/scopes.js b/ui/core/app/controllers/scopes/scope/scopes.js
new file mode 100644
index 000000000..05060ebd8
--- /dev/null
+++ b/ui/core/app/controllers/scopes/scope/scopes.js
@@ -0,0 +1,27 @@
+import Controller from '@ember/controller';
+import { inject as service } from '@ember/service';
+import { computed } from '@ember/object';
+
+export default class ScopesScopeScopesController extends Controller {
+ // =services
+
+ @service intl;
+
+ // =attributes
+
+ /**
+ * @type {string}
+ */
+ @computed('model.currentScope.{isGlobal,isOrg}')
+ get breadCrumb() {
+ if (this.model.currentScope.isGlobal) {
+ return this.intl.t('resources.org.title_plural');
+ }
+ /* istanbul ignore else */
+ if (this.model.currentScope.isOrg) {
+ return this.intl.t('resources.project.title_plural');
+ }
+ /* istanbul ignore next */
+ return null;
+ }
+}
diff --git a/ui/core/app/routes/scopes/scope.js b/ui/core/app/routes/scopes/scope.js
index 3bc2e102f..9b6720dbd 100644
--- a/ui/core/app/routes/scopes/scope.js
+++ b/ui/core/app/routes/scopes/scope.js
@@ -11,6 +11,7 @@ export default class ScopesScopeRoute extends Route {
@service intl;
@service session;
+ @service scope;
// =methods
@@ -61,6 +62,9 @@ export default class ScopesScopeRoute extends Route {
selectedProject = model;
selectedOrg = this.store.peekRecord('scope', model.scopeID);
}
+ // Update the scope service with the current scope(s);
+ this.scope.org = selectedOrg;
+ this.scope.project = selectedProject;
this.scopes = { orgs, projects, selectedOrg, selectedProject };
}
diff --git a/ui/core/app/services/scope.js b/ui/core/app/services/scope.js
new file mode 100644
index 000000000..b4e93fe03
--- /dev/null
+++ b/ui/core/app/services/scope.js
@@ -0,0 +1,22 @@
+import Service from '@ember/service';
+import { tracked } from '@glimmer/tracking';
+
+/**
+ * This simple non-functional service is used to retain references to
+ * the currently active scope or scopes.
+ */
+export default class ScopeService extends Service {
+
+ // =attributes
+
+ /**
+ * @type {ScopeModel}
+ */
+ @tracked org;
+
+ /**
+ * @type {ScopeModel}
+ */
+ @tracked project;
+
+}
diff --git a/ui/core/tests/unit/controllers/scopes/scope/scopes-test.js b/ui/core/tests/unit/controllers/scopes/scope/scopes-test.js
new file mode 100644
index 000000000..6a6b181de
--- /dev/null
+++ b/ui/core/tests/unit/controllers/scopes/scope/scopes-test.js
@@ -0,0 +1,12 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Controller | scopes/scope/scopes', function(hooks) {
+ setupTest(hooks);
+
+ // TODO: Replace this with your real tests.
+ test('it exists', function(assert) {
+ let controller = this.owner.lookup('controller:scopes/scope/scopes');
+ assert.ok(controller);
+ });
+});
diff --git a/ui/core/tests/unit/services/scope-test.js b/ui/core/tests/unit/services/scope-test.js
new file mode 100644
index 000000000..95493c0b4
--- /dev/null
+++ b/ui/core/tests/unit/services/scope-test.js
@@ -0,0 +1,12 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Service | scope', function(hooks) {
+ setupTest(hooks);
+
+ // TODO: Replace this with your real tests.
+ test('it exists', function(assert) {
+ let service = this.owner.lookup('service:scope');
+ assert.ok(service);
+ });
+});
diff --git a/ui/core/translations/en-us.yaml b/ui/core/translations/en-us.yaml
index 22fd19edb..d208e7102 100644
--- a/ui/core/translations/en-us.yaml
+++ b/ui/core/translations/en-us.yaml
@@ -6,6 +6,7 @@ auth:
choose-org: Choose a scope to authenticate.
authenticating-with-org: "You are authenticating with {name}."
titles:
+ home: Home
iam: IAM
new: New
resources: Resources