refact: upgrade Promise.then to async/await (#14798)

* refact: upgrade Promise.then to async/await

* naive solution (#14800)

* refact: use id instead of model

* chore:  add changelog entry

* refact: add conditional safety around alloc

.changelog/14798.txt

@@ -0,0 +1,3 @@
+```release-note:bug-fix
+ui:  always show ports on allocations page
+```

ui/app/routes/allocations/allocation.js

@@ -36,18 +36,18 @@ export default class AllocationRoute extends Route.extend(WithWatchers) {
     }
   }
 
-  model() {
-    // Preload the job for the allocation since it's required for the breadcrumb trail
-    return super
-      .model(...arguments)
-      .then((allocation) => {
-        const jobId = allocation.belongsTo('job').id();
-        return this.store
-          .findRecord('job', jobId)
-          .then(() => this.store.findAll('namespace')) // namespaces belong to a job and are an asynchronous relationship so we can peak them later on
-          .then(() => allocation);
-      })
-      .catch(notifyError(this));
+  async model() {
+    try {
+      // Preload the job for the allocation since it's required for the breadcrumb trail
+      const allocation = await super.model(...arguments);
+      const jobId = allocation?.belongsTo('job').id();
+      const getJob = this.store.findRecord('job', jobId);
+      const getNamespaces = this.store.findAll('namespace');
+      await Promise.all([getJob, getNamespaces]);
+      return allocation;
+    } catch {
+      notifyError(this);
+    }
   }
 
   @watchRecord('allocation') watch;

ui/app/templates/components/allocation-row.hbs

@@ -33,7 +33,7 @@
 <td data-test-short-id>
   <LinkTo
     @route="allocations.allocation"
-    @model={{this.allocation}}
+    @model={{this.allocation.id}}
     class="is-primary"
   >
     {{this.allocation.shortId}}