Data loading

app/components/rfc-card.gjs

@@ -1,29 +1,22 @@
 import Component from '@glimmer/component';
+import { LinkTo } from '@ember/routing';
 
 export default class RfcCard extends Component {
 <template>
   <div class="rfc-card">
-    <a href={{this.getURL}}><h2>{{this.getTitle}}</h2></a>
-    <p class="summary">{{this.getSummary}}</p>
+    <LinkTo @route="rfc" @model={{@rfc.rfcFile}}><h2>#{{@rfc.number}} {{@rfc.title}}</h2></LinkTo>
+    <p class="summary">{{@rfc.summary}}...</p>
     {{#unless @compact}}
     <div class="rfc-champions">
-      <img width="100" height="100" class="eri-fixed team-image" loading="lazy" decoding="async" alt="" role="presentation" data-eri-bh="U9GkwhBJ9?=~OgNORQ^k_Ns+WBx^%hoHs:tQ" data-eri-bh-w="4" data-eri-bh-h="4" style="" src="https://avatars.githubusercontent.com/u/594890?v=4">
-      <img src="https://avatars.githubusercontent.com/u/5811560?v=4" />
+      {{#each @rfc.assignees as |assignee|}}
+        <img title={{assignee.login}} src={{assignee.avatarUrl}} />
+      {{/each}}
     </div>
     {{/unless}}
   </div>
 </template>
 
-get getURL() {
-    return `id/${this.args.title}`;
-  }
-
-  get getTitle() {
-    const [number, ...title] = this.args.title.split('-');
-    return `#${Number(number)} ${title.join(' ')}`
-  }
-
-  get getSummary() {
-    return this.args.compact ? "Identifiers provides infrastructure for handling identity within ember-data to satisfy requirements around improved caching, serializability, replication, and handling of remote data..." : "Identifiers provides infrastructure for handling identity within ember-data to satisfy requirements around improved caching, serializability, replication, and handling of remote data.This concept would parallel a similar structure proposed for json-api resource identifier lid property drafted for version 1.2 of the json-api spec.In doing so we provide a framework for future RFCs and/or addons to address many common feature requests."
+  get getURL() {
+    return `/id/${this.args.rfc.rfcFile}`;
   }
 }

app/routes/application.js

@@ -1,8 +1,4 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
 
 export default class ApplicationRoute extends Route {
-  async model() {
-    return toc;
-  }
 }

app/routes/rfcs-help.js

@@ -1,8 +1,11 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
 
 export default class RfcsHelpRoute extends Route {
   async model() {
-      return [...toc.stageLinks["accepted"], ...toc.stageLinks["released"]];
-    }
+    // doing it this way makes sure we request both files at the same time
+    return (await Promise.all([
+      import('rfcs-app-toc-builder:stage-accepted.json'),
+      import('rfcs-app-toc-builder:stage-released.json')]) // do we need this one? 🤔
+    ).map(item => item.default).flat();
+  }
 }

app/routes/rfcs-input.js

@@ -1,7 +1,11 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
+
 export default class RfcsInputRoute extends Route {
   async model() {
-        return toc.stageLinks["exploring"];
-      }
+    // doing it this way makes sure we request both files at the same time
+    return (await Promise.all([
+      import('rfcs-app-toc-builder:stage-proposed.json'),
+      import('rfcs-app-toc-builder:stage-exploring.json')])
+    ).map(item => item.default).flat();
+  }
 }

app/routes/stages/accepted.js

@@ -1,8 +1,8 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
 
 export default class StagesAcceptedRoute extends Route {
-async model() {
-    return toc.stageLinks["accepted"];
+  async model() {
+    const result = (await import('rfcs-app-toc-builder:stage-accepted.json')).default;
+    return result;
   }
 }

app/routes/stages/closed.js

@@ -1,3 +1,7 @@
 import Route from '@ember/routing/route';
 
-export default class StagesClosedRoute extends Route {}
+export default class StagesClosedRoute extends Route {
+  async model() {
+    return (await import('rfcs-app-toc-builder:stage-closed.json')).default;
+  }
+}

app/routes/stages/discontinued.js

@@ -1,8 +1,7 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
 
 export default class StagesDiscontinuedRoute extends Route {
   async model() {
-      return toc.stageLinks["discontinued"];
-    }
+    return (await import('rfcs-app-toc-builder:stage-discontinued.json')).default;
+  }
 }

app/routes/stages/exploring.js

@@ -1,3 +1,7 @@
 import Route from '@ember/routing/route';
 
-export default class StagesExploringRoute extends Route {}
+export default class StagesExploringRoute extends Route {
+  async model() {
+    return (await import('rfcs-app-toc-builder:stage-exploring.json')).default;
+  }
+}

app/routes/stages/proposed.js

@@ -1,3 +1,8 @@
 import Route from '@ember/routing/route';
 
-export default class StagesProposedRoute extends Route {}
+
+export default class StagesProposedRoute extends Route {
+  async model() {
+    return (await import('rfcs-app-toc-builder:stage-proposed.json')).default;
+  }
+}

app/routes/stages/ready-for-release.js

@@ -1,3 +1,8 @@
 import Route from '@ember/routing/route';
 
-export default class StagesReadyForReleaseRoute extends Route {}
+export default class StagesReadyForReleaseRoute extends Route {
+  async model() {
+    const result = (await import('rfcs-app-toc-builder:stage-ready-for-release.json')).default;
+    return result;
+  }
+}

app/routes/stages/recommended.js

@@ -1,8 +1,7 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
 
 export default class StagesRecommendedRoute extends Route {
   async model() {
-    return toc.stageLinks['recommended'];
+    return (await import('rfcs-app-toc-builder:stage-recommended.json')).default;
   }
 }

app/routes/stages/released.js

@@ -1,7 +1,7 @@
 import Route from '@ember/routing/route';
-import toc from 'rfcs-app-toc-builder:toc.json';
+
 export default class StagesReleasedRoute extends Route {
   async model() {
-      return toc.stageLinks["released"];
-    }
+    return (await import('rfcs-app-toc-builder:stage-released.json')).default;
+  }
 }

app/templates/rfc.gjs

@@ -93,67 +93,5 @@ export default class RFCRouteComponent extends Component {
         <MarkdownToHtml @markdown={{@model.content}} />
       </div>
     </div>
-
-    {{#if this.previousRFC}}
-      <LinkTo
-        @route="rfc"
-        @model={{this.previousRFC}}
-        class="nav-chapters previous"
-      >
-        <svg
-          class="svg-inline--fa fa-angle-left margin-auto"
-          data-prefix="fas"
-          data-icon="angle-left"
-          aria-hidden="true"
-          focusable="false"
-          role="img"
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 256 512"
-        >
-          <path
-            fill="currentColor"
-            d="M192 448c-8.188 0-16.38-3.125-22.62-9.375l-160-160c-12.5-12.5-12.5-32.75 0-45.25l160-160c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25L77.25 256l137.4 137.4c12.5 12.5 12.5 32.75 0 45.25C208.4 444.9 200.2 448 192 448z"
-          ></path>
-        </svg>
-      </LinkTo>
-    {{else}}
-      <LinkTo @route="index" class="nav-chapters previous">
-        <svg
-          class="svg-inline--fa fa-angle-left margin-auto"
-          data-prefix="fas"
-          data-icon="angle-left"
-          aria-hidden="true"
-          focusable="false"
-          role="img"
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 256 512"
-        >
-          <path
-            fill="currentColor"
-            d="M192 448c-8.188 0-16.38-3.125-22.62-9.375l-160-160c-12.5-12.5-12.5-32.75 0-45.25l160-160c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25L77.25 256l137.4 137.4c12.5 12.5 12.5 32.75 0 45.25C208.4 444.9 200.2 448 192 448z"
-          ></path>
-        </svg>
-      </LinkTo>
-    {{/if}}
-
-    {{#if this.nextRFC}}
-      <LinkTo @route="rfc" @model={{this.nextRFC}} class="nav-chapters next">
-        <svg
-          class="svg-inline--fa fa-angle-right margin-auto"
-          data-prefix="fas"
-          data-icon="angle-right"
-          aria-hidden="true"
-          focusable="false"
-          role="img"
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 256 512"
-        >
-          <path
-            fill="currentColor"
-            d="M64 448c-8.188 0-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L178.8 256L41.38 118.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l160 160c12.5 12.5 12.5 32.75 0 45.25l-160 160C80.38 444.9 72.19 448 64 448z"
-          ></path>
-        </svg>
-      </LinkTo>
-    {{/if}}
   </template>
 }

app/templates/rfcs-help.gjs

@@ -6,8 +6,8 @@ import RfcCard from '../components/rfc-card';
   <h1>RFCs that need your help</h1>
   <p>The list below consists of RFCs that need active development to move them to the next phase. This could be technical development of the feature or writing documentation.</p>
   <div class="rfc-grid">
-  {{#each @model as | rfc | }}
-    <RfcCard @title={{rfc}}></RfcCard>
-  {{/each}}
+    {{#each @model as | rfc | }}
+      <RfcCard @rfc={{rfc}}></RfcCard>
+    {{/each}}
   </div>
 </template>

app/templates/rfcs-input.gjs

@@ -7,7 +7,7 @@ import RfcCard from '../components/rfc-card';
   <p>The list below consists of RFCs that need input when it comes to coming up with the solution. This can be both the implementation, but also the caviats.</p>
   <div class="rfc-grid">
   {{#each @model as | rfc | }}
-    <RfcCard @title={{rfc}}></RfcCard>
+    <RfcCard @rfc={{rfc}}></RfcCard>
   {{/each}}
   </div>
 </template>

app/templates/stages/accepted.gjs

@@ -5,8 +5,8 @@ import RfcCard from '../../components/rfc-card';
   <h1>Accepted</h1>
   <p>The <a href="/stages#accepted">Accepted stage</a> is a phase where we need to start builing the implementation of the RFCs. See the list of accepted RFCs below.</p>
   <div class="rfc-grid">
-  {{#each @model as | rfc | }}
-    <RfcCard @title={{rfc}}></RfcCard>
-  {{/each}}
+    {{#each @model as | rfc | }}
+      <RfcCard @rfc={{rfc}}></RfcCard>
+    {{/each}}
   </div>
 </template>

app/templates/stages/closed.gjs

@@ -1,7 +1,13 @@
 import { pageTitle } from 'ember-page-title';
+import RfcCard from 'rfcs-app/components/rfc-card';
 
 <template>
   {{pageTitle "Closed"}}
   <h1>Closed</h1>
   <p>The <a href="/stages#closed">Closed stage</a> is a phase where a proposed or exploring RFC is no longer being pursued. See the list of closed RFCs below.</p>
+  <div class="rfc-grid">
+    {{#each @model as |rfc|}}
+      <RfcCard @rfc={{rfc}} />
+    {{/each}}
+  </div>
 </template>

app/templates/stages/discontinued.gjs

@@ -9,7 +9,7 @@ import RfcCard from '../../components/rfc-card';
     implemented. See the list of discontinued RFCs below.</p>
   <div class="rfc-grid">
     {{#each @model as |rfc|}}
-      <RfcCard @title={{rfc}} />
+      <RfcCard @rfc={{rfc}} />
     {{/each}}
   </div>
 </template>

app/templates/stages/exploring.gjs

@@ -1,7 +1,14 @@
 import { pageTitle } from 'ember-page-title';
+import RfcCard from 'rfcs-app/components/rfc-card';
 
 <template>
   {{pageTitle "Exploring"}}
   <h1>Exploring</h1>
   <p>The <a href="/stages#exploring">Exploring stage</a> is a phase where an idea is being refined and discussed further, but needs more clarity, answers, or a champion. See the list of exploring RFCs below.</p>
+
+  <div class="rfc-grid">
+    {{#each @model as | rfc | }}
+      <RfcCard @rfc={{rfc}} />
+    {{/each}}
+  </div>
 </template>

app/templates/stages/proposed.gjs

@@ -1,7 +1,14 @@
 import { pageTitle } from 'ember-page-title';
+import RfcCard from 'rfcs-app/components/rfc-card';
 
 <template>
   {{pageTitle "Proposed"}}
   <h1>Proposed</h1>
   <p>The <a href="/stages#proposed">Proposed stage</a> is where new ideas are introduced as pull requests to start discussion. See the list of proposed RFCs below.</p>
+
+  <div class="rfc-grid">
+    {{#each @model as | rfc | }}
+      <RfcCard @rfc={{rfc}} />
+    {{/each}}
+  </div>
 </template>

app/templates/stages/ready-for-release.gjs

@@ -1,4 +1,5 @@
 import { pageTitle } from 'ember-page-title';
+import RfcCard from 'rfcs-app/components/rfc-card';
 
 <template>
   {{pageTitle "Ready for Release"}}
@@ -7,4 +8,10 @@ import { pageTitle } from 'ember-page-title';
     <a href="/stages#ready-for-release">Ready for Release stage</a>
     is a phase where the implementation is complete and we're preparing it for
     an official release. See the list of RFCs ready for release below.</p>
+
+  <div class="rfc-grid">
+    {{#each @model as | rfc | }}
+      <RfcCard @rfc={{rfc}} />
+    {{/each}}
+  </div>
 </template>

app/templates/stages/recommended.gjs

@@ -9,7 +9,7 @@ import RfcCard from '../../components/rfc-card';
     the community. See the list of recommended RFCs below.</p>
   <div class="rfc-grid">
     {{#each @model as |rfc|}}
-      <RfcCard @title={{rfc}} />
+      <RfcCard @rfc={{rfc}} />
     {{/each}}
   </div>
 </template>

app/templates/stages/released.gjs

@@ -6,7 +6,7 @@ import RfcCard from '../../components/rfc-card';
   <p>The <a href="/stages#released">Released stage</a> is a phase where the work is available in a stable release and has been shipped. See the list of released RFCs below.</p>
   <div class="rfc-grid">
   {{#each @model as | rfc | }}
-    <RfcCard @title={{rfc}}></RfcCard>
+    <RfcCard @rfc={{rfc}}></RfcCard>
   {{/each}}
   </div>
 </template>