PLU-517: add BOM for excel to handle csv files (#1095)

## Problem
User reported seeing special characters when opening .csv files from the
Tiles export in Excel.
This was caused by Excel not correctly handling the UTF-8 encoded files.

## Solution
Prepend BOM (`\uFEFF`) to the CSV string before exporting.

## Before & After Screenshots
**Tiles**
<img width="5088" height="3404" alt="image"
src="https://github.com/user-attachments/assets/eb24ffc4-807f-4003-bf1d-ee11e2aeaa54"
/>

**BEFORE**:
<img width="297" height="535" alt="Screenshot 2025-07-14 at 2 22 17 PM"
src="https://github.com/user-attachments/assets/475fc75f-07cc-42e4-a36f-33d2a40f2668"
/>


**AFTER**
<img width="312" height="546" alt="Screenshot 2025-07-14 at 2 21 41 PM"
src="https://github.com/user-attachments/assets/0dfacb77-f6fe-420c-aab2-eb309efc4946"
/>

## Tests
- [ ] Special characters are decoded properly when opening the .csv in
Excel (e.g., `—`)
- [ ] Rows are exported and in order
- [ ] Columns are exported and in order
- [ ] Filters are applied accordingly

Author: kevinkim-ogp

packages/frontend/src/pages/Tile/components/TableBanner/ExportCsvButton.tsx

@@ -40,7 +40,13 @@ const ExportCsvButton = (props: ButtonProps) => {
         .trim()
         .replace(/[^a-z0-9]|\r?\n|\r/gim, '')
         .replace(/\s+/g, '_')}_${dateString()}.csv`
-      const blob = new Blob([csvString], { type: 'text/csv;charset=utf-8' })
+      /**
+       * CAVEAT: we manually add the BOM ('\uFEFF') to ensure that exported csv files can be properly handled in Excel.
+       * It avoids garbled characters and preserves special characters.
+       */
+      const blob = new Blob(['\uFEFF' + csvString], {
+        type: 'text/csv;charset=utf-8',
+      })
       saveAs(blob, filename)
     },
     [filteredDataRef, allDataRef, tableColumns, tableName],