routes/user: Show error page if user is missing or fails to load

Author: Turbo87

app/routes/user.js

@@ -12,7 +12,7 @@ export default class UserRoute extends Route {
     sort: { refreshModel: true },
   };
 
-  async model(params) {
+  async model(params, transition) {
     const { user_id } = params;
     try {
       let user = await this.store.queryRecord('user', { user_id });
@@ -24,11 +24,12 @@ export default class UserRoute extends Route {
       return { crates, user };
     } catch (error) {
       if (error instanceof NotFoundError) {
-        this.notifications.error(`User '${params.user_id}' does not exist`);
-        return this.router.replaceWith('index');
+        let title = `${user_id}: User not found`;
+        this.router.replaceWith('catch-all', { transition, error, title });
+      } else {
+        let title = `${user_id}: Failed to load user data`;
+        this.router.replaceWith('catch-all', { transition, error, title, tryAgain: true });
       }
-
-      throw error;
     }
   }
 }

tests/routes/user-test.js

@@ -0,0 +1,30 @@
+import { currentURL } from '@ember/test-helpers';
+import { module, test } from 'qunit';
+
+import { setupApplicationTest } from 'crates-io/tests/helpers';
+
+import { visit } from '../helpers/visit-ignoring-abort';
+
+module('Route | user', function (hooks) {
+  setupApplicationTest(hooks);
+
+  test("shows an error message if the user can't be found", async function (assert) {
+    await visit('/users/foo');
+    assert.strictEqual(currentURL(), '/users/foo');
+    assert.dom('[data-test-404-page]').exists();
+    assert.dom('[data-test-title]').hasText('foo: User not found');
+    assert.dom('[data-test-go-back]').exists();
+    assert.dom('[data-test-try-again]').doesNotExist();
+  });
+
+  test('server error causes the error page to be shown', async function (assert) {
+    this.server.get('/api/v1/users/:userId', {}, 500);
+
+    await visit('/users/foo');
+    assert.strictEqual(currentURL(), '/users/foo');
+    assert.dom('[data-test-404-page]').exists();
+    assert.dom('[data-test-title]').hasText('foo: Failed to load user data');
+    assert.dom('[data-test-go-back]').doesNotExist();
+    assert.dom('[data-test-try-again]').exists();
+  });
+});