From 08d98ad4242e67c73f1388bd637dd8e65737febe Mon Sep 17 00:00:00 2001
From: "Kyle J. Kemp" <kyle@seiyria.com>
Date: Thu, 19 Dec 2024 12:15:58 -0600
Subject: [PATCH] add ability for FAQ to have card display names, sort by those
 if supplied

---
 interfaces/faq.ts                 | 1 +
 src/app/_shared/pipes/faq.pipe.ts | 8 +++++---
 src/app/faq.service.ts            | 2 +-
 src/app/faq/faq.page.html         | 2 +-
 4 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/interfaces/faq.ts b/interfaces/faq.ts
index e06277e..9958a1d 100644
--- a/interfaces/faq.ts
+++ b/interfaces/faq.ts
@@ -5,5 +5,6 @@ export interface ICardFAQEntry {
 
 export interface ICardFAQ {
   card: string;
+  cardDisplay?: string;
   faq: ICardFAQEntry[];
 }
diff --git a/src/app/_shared/pipes/faq.pipe.ts b/src/app/_shared/pipes/faq.pipe.ts
index 3109c4c..91d09ab 100644
--- a/src/app/_shared/pipes/faq.pipe.ts
+++ b/src/app/_shared/pipes/faq.pipe.ts
@@ -10,7 +10,7 @@ export class FaqPipe implements PipeTransform {
   private cardsService = inject(CardsService);
 
   transform(value: string, ...args: (string | undefined)[]): string {
-    const [productId] = args;
+    const [productId, cardDisplay] = args;
     if (!productId) return value ?? '';
 
     const ruleRegex = /\$rule:([\d.]+)\$/gm;
@@ -20,7 +20,9 @@ export class FaqPipe implements PipeTransform {
       const rulesUrl = this.metaService.getRulesByProductId(productId);
       if (!rulesUrl) return p1;
 
-      return `<a href="${rulesUrl}/#${p1}" target="_blank">${p1}</a>`;
+      return `<a href="${rulesUrl}/#${p1}" target="_blank">${
+        cardDisplay || p1
+      }</a>`;
     });
 
     const linkRegex = /\$link:([\w'"\-& ]+)\$/gm;
@@ -32,7 +34,7 @@ export class FaqPipe implements PipeTransform {
 
       return `<a href="card/${encodeURIComponent(
         foundCard.id
-      )}" target="_blank">${foundCard.name}</a>`;
+      )}" target="_blank">${cardDisplay || foundCard.name}</a>`;
     });
 
     value = value.replace('\n', '<br>');
diff --git a/src/app/faq.service.ts b/src/app/faq.service.ts
index b6caba0..ce75934 100644
--- a/src/app/faq.service.ts
+++ b/src/app/faq.service.ts
@@ -51,7 +51,7 @@ export class FAQService {
       Object.keys(faqData[productId]).forEach((locale) => {
         baseFAQs[productId][locale] = sortBy(
           faqData[productId][locale],
-          'card'
+          (cardFAQ) => cardFAQ.cardDisplay || cardFAQ.card
         );
 
         faqData[productId][locale].forEach((cardFAQ) => {
diff --git a/src/app/faq/faq.page.html b/src/app/faq/faq.page.html
index 6103e65..f1f3a26 100644
--- a/src/app/faq/faq.page.html
+++ b/src/app/faq/faq.page.html
@@ -25,7 +25,7 @@
             <ion-item-group>
               <ion-item-divider>
                 <ion-label [id]="entry.card | cardid">
-                  <span [innerHTML]="'$link:' + entry.card + '$' | faq:productId()"></span>
+                  <span [innerHTML]="'$link:' + entry.card + '$' | faq:productId():entry.cardDisplay"></span>
                 </ion-label>
               </ion-item-divider>