Implement the new currency config into the graphics and helper methods

For now all the code still uses `formatUSD` but it's getting "forwarded" onto the new `formatCurrency` method which supports overrides as well

src/graphics/_misc/helpers.ts

@@ -29,8 +29,36 @@ export function msToTimeStr(ms: number): string {
   const minutes = Math.floor((ms / (1000 * 60)) % 60);
   const hours = Math.floor(ms / (1000 * 60 * 60));
   return `${padTimeNumber(hours)
-  }:${padTimeNumber(minutes)
+    }:${padTimeNumber(minutes)
-  }:${padTimeNumber(seconds)}`;
+    }:${padTimeNumber(seconds)}`;
+}
+
+/**
+ * Simple formatter for displaying currency amounts.
+ * @param amount Amount as a integer/float.
+ * @param _symbol The currency symbol
+ * (defaults to what's set in the config, or `$` if the config isn't set)
+ * @param _countryCode The country code
+ * (defaults to what's set in the config, or `en-US` if the config isn't set)
+ */
+export function formatCurrency(
+  amount: number,
+  _symbol?: string,
+  _countryCode?: string,
+): string {
+  const cfg = (config as DeepWritable<Configschema>).event.currency;
+  const symbol = _symbol || cfg?.symbol || '$';
+  const countryCode = _countryCode || cfg?.countryCode || 'en-US';
+
+  if (amount >= 100) {
+    return `${symbol}${Math.floor(amount).toLocaleString(
+      countryCode,
+      {
+        maximumFractionDigits: 0,
+      },
+    )}`;
+  }
+  return `${symbol}${amount.toFixed(2)}`;
 }
 
 /**
@@ -38,10 +66,10 @@ export function msToTimeStr(ms: number): string {
  * @param amount Amount as a integer/float.
  */
 export function formatUSD(amount: number): string {
-  if (amount >= 100) {
+  return formatCurrency(amount);
-    return `$${Math.floor(amount).toLocaleString('en-US', { maximumFractionDigits: 0 })}`;
+
-  }
+  // We would use this as the fallback, but we have overrides in the config now
-  return `$${amount.toFixed(2)}`;
+  // return formatCurrency(amount, '$', 'en-US');
 }
 
 /**

src/graphics/omnibar/components/Ticker/Prize.vue

@@ -13,7 +13,9 @@
       Prize Available: {{ prize.name }}
     </div>
     <div :style="{ 'font-size': '20px' }">
-      Provided by {{ prize.provided }}, minimum donation amount: ${{ prize.minimumBid.toFixed(2) }}
+      Provided by {{ prize.provided }}, minimum donation amount: {{ symbol }}{{
+        prize.minimumBid.toFixed(2)
+      }}
       (donate in the next {{ timeUntilString }})
     </div>
   </div>
@@ -59,6 +61,10 @@ export default class extends Vue {
       : '';
   }
 
+  get symbol(): string {
+    return nodecg.bundleConfig.event.currency?.symbol || '$';
+  }
+
   async created(): Promise<void> {
     await wait(this.seconds * 1000); // Wait the specified length.
     this.$emit('end');

src/graphics/omnibar/components/Total.vue

@@ -155,11 +155,16 @@ export default class extends Vue {
 
   get totalStr(): string {
     // "Reset" value every 10k, specific to ESA Legends 2023.
+    const symbol = nodecg.bundleConfig.event.currency?.symbol || '$';
+    const countryCode = nodecg.bundleConfig.event.currency?.countryCode || 'en-US';
+
     const esal23 = nodecg.bundleConfig.event.shorts === 'esal23';
-    return `kr ${Math.floor(esal23 ? this.total % 10000 : this.total).toLocaleString('de-DE', {
+
-      maximumFractionDigits: 0,
+    return `${symbol}${
-      minimumIntegerDigits: esal23 && this.total >= 10000 ? 4 : undefined,
+      Math.floor(esal23 ? this.total % 10000 : this.total).toLocaleString(countryCode, {
-    })}`;
+        maximumFractionDigits: 0,
+        minimumIntegerDigits: esal23 && this.total >= 10000 ? 4 : undefined,
+      })}`;
   }
 
   getClassForChar(char: string): string | undefined {