crate: Show "Crate not found" error page instead of notification

Author: Turbo87

app/routes/crate.js

@@ -3,20 +3,18 @@ import { inject as service } from '@ember/service';
 
 export default class CrateRoute extends Route {
   @service headData;
-  @service notifications;
+  @service router;
   @service store;
 
-  async model(params) {
+  async model(params, transition) {
     try {
       return await this.store.find('crate', params.crate_id);
     } catch (error) {
       if (error.errors?.some(e => e.detail === 'Not Found')) {
-        this.notifications.error(`Crate '${params.crate_id}' does not exist`);
+        this.router.replaceWith('catch-all', { transition, error, title: 'Crate not found' });
       } else {
-        this.notifications.error(`Loading data for the '${params.crate_id}' crate failed. Please try again later!`);
+        this.router.replaceWith('catch-all', { transition, error, title: 'Crate failed to load', tryAgain: true });
       }
-
-      this.replaceWith('index');
     }
   }
 

tests/acceptance/crate-test.js

@@ -83,18 +83,22 @@ module('Acceptance | crate page', function (hooks) {
 
   test('unknown crate shows an error message', async function (assert) {
     await visit('/crates/nanomsg');
-    assert.equal(currentURL(), '/');
-    assert.dom('[data-test-notification-message]').hasText("Crate 'nanomsg' does not exist");
+    assert.equal(currentURL(), '/crates/nanomsg');
+    assert.dom('[data-test-404-page]').exists();
+    assert.dom('[data-test-title]').hasText('Crate not found');
+    assert.dom('[data-test-go-back]').exists();
+    assert.dom('[data-test-try-again]').doesNotExist();
   });
 
   test('other crate loading error shows an error message', async function (assert) {
     this.server.get('/api/v1/crates/:crate_name', {}, 500);
 
     await visit('/crates/nanomsg');
-    assert.equal(currentURL(), '/');
-    assert
-      .dom('[data-test-notification-message]')
-      .hasText("Loading data for the 'nanomsg' crate failed. Please try again later!");
+    assert.equal(currentURL(), '/crates/nanomsg');
+    assert.dom('[data-test-404-page]').exists();
+    assert.dom('[data-test-title]').hasText('Crate failed to load');
+    assert.dom('[data-test-go-back]').doesNotExist();
+    assert.dom('[data-test-try-again]').exists();
   });
 
   test('unknown versions fall back to latest version and show an error message', async function (assert) {