fix: delete old breadcrumbs and replace with bucket

ui/app/components/breadcrumb.js

@@ -3,14 +3,14 @@ import { action } from '@ember/object';
 import { inject as service } from '@ember/service';
 
 export default class Breadcrumb extends Component {
-  @service bucket;
+  @service breadcrumbs;
 
   @action register() {
-    this.bucket.registerBreadcrumb(this);
+    this.breadcrumbs.registerBreadcrumb(this);
   }
 
   @action deregister() {
-    this.bucket.deregisterBreadcrumb(this);
+    this.breadcrumbs.deregisterBreadcrumb(this);
   }
 
   constructor() {

ui/app/components/breadcrumbs.js

@@ -2,9 +2,9 @@ import Component from '@glimmer/component';
 import { inject as service } from '@ember/service';
 
 export default class Breadcrumbs extends Component {
-  @service bucket;
+  @service breadcrumbs;
 
   get crumbs() {
-    return this.bucket.crumbs;
+    return this.breadcrumbs.crumbs;
   }
 }

ui/app/services/breadcrumbs.js

@@ -1,45 +1,21 @@
-import { getOwner } from '@ember/application';
-import Service, { inject as service } from '@ember/service';
-import { computed } from '@ember/object';
-import classic from 'ember-classic-decorator';
+import Service from '@ember/service';
+import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
+import { schedule } from '@ember/runloop';
 
-@classic
-export default class BreadcrumbsService extends Service {
-  @service router;
+export default class BucketService extends Service {
+  @tracked crumbs = [];
 
-  // currentURL is only used to listen to all transitions.
-  // currentRouteName has all information necessary to compute breadcrumbs,
-  // but it doesn't change when a transition to the same route with a different
-  // model occurs.
-  @computed('router.{currentURL,currentRouteName}')
-  get breadcrumbs() {
-    const owner = getOwner(this);
-    const allRoutes = (this.get('router.currentRouteName') || '')
-      .split('.')
-      .without('')
-      .map((segment, index, allSegments) => allSegments.slice(0, index + 1).join('.'));
-
-    let crumbs = [];
-    allRoutes.forEach(routeName => {
-      const route = owner.lookup(`route:${routeName}`);
-
-      // Routes can reset the breadcrumb trail to start anew even
-      // if the route is deeply nested.
-      if (route.resetBreadcrumbs) {
-        crumbs = [];
-      }
-
-      // Breadcrumbs are either an array of static crumbs
-      // or a function that returns breadcrumbs given the current
-      // model for the route's controller.
-      let breadcrumbs = route.breadcrumbs || [];
-      if (typeof breadcrumbs === 'function') {
-        breadcrumbs = breadcrumbs(route.get('controller.model')) || [];
-      }
-
-      crumbs.push(...breadcrumbs);
+  @action registerBreadcrumb(crumb) {
+    schedule('actions', this, () => {
+      console.log('register crumb:  ', crumb);
+      this.crumbs = [...this.crumbs, crumb];
     });
+  }
+
+  @action deregisterBreadcrumb(crumb) {
+    const newCrumbs = this.crumbs.filter(c => c !== crumb);
 
-    return crumbs;
+    this.crumbs = newCrumbs;
   }
 }