From 56dc8858957568f1f72d25a020695dd940cc412d Mon Sep 17 00:00:00 2001
From: John Simons <john.simons@particular.net>
Date: Fri, 6 Jun 2025 16:00:51 +1000
Subject: [PATCH] Remove bootstrap-icons dependency and update icon references
 to Font Awesome in various components

---
 src/Frontend/package-lock.json                  | 17 -----------------
 src/Frontend/package.json                       |  1 -
 src/Frontend/src/assets/main.css                |  1 -
 src/Frontend/src/components/OrderBy.vue         |  6 +++---
 .../failedmessages/FailedMessageGroups.vue      | 10 +++++-----
 .../failedmessages/FailedMessages.vue           |  4 ++--
 .../components/failedmessages/MessageList.vue   | 10 +++++-----
 .../failedmessages/PendingRetries.vue           |  6 +++---
 src/Frontend/vite.config.ts                     |  4 ----
 9 files changed, 18 insertions(+), 41 deletions(-)

diff --git a/src/Frontend/package-lock.json b/src/Frontend/package-lock.json
index 43cd5d0bf..c20e8e9aa 100644
--- a/src/Frontend/package-lock.json
+++ b/src/Frontend/package-lock.json
@@ -17,7 +17,6 @@
         "@vue-flow/core": "^1.44.0",
         "@vuepic/vue-datepicker": "^11.0.2",
         "bootstrap": "^5.3.5",
-        "bootstrap-icons": "^1.13.1",
         "codemirror": "^6.0.1",
         "diff": "^7.0.0",
         "hex-to-css-filter": "^6.0.0",
@@ -3066,22 +3065,6 @@
         "@popperjs/core": "^2.11.8"
       }
     },
-    "node_modules/bootstrap-icons": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.13.1.tgz",
-      "integrity": "sha512-ijombt4v6bv5CLeXvRWKy7CuM3TRTuPEuGaGKvTV5cz65rQSY8RQ2JcHt6b90cBBAC7s8fsf2EkQDldzCoXUjw==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/twbs"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/bootstrap"
-        }
-      ],
-      "license": "MIT"
-    },
     "node_modules/brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
diff --git a/src/Frontend/package.json b/src/Frontend/package.json
index 495fa7315..52113e759 100644
--- a/src/Frontend/package.json
+++ b/src/Frontend/package.json
@@ -26,7 +26,6 @@
     "@vue-flow/core": "^1.44.0",
     "@vuepic/vue-datepicker": "^11.0.2",
     "bootstrap": "^5.3.5",
-    "bootstrap-icons": "^1.13.1",
     "codemirror": "^6.0.1",
     "diff": "^7.0.0",
     "hex-to-css-filter": "^6.0.0",
diff --git a/src/Frontend/src/assets/main.css b/src/Frontend/src/assets/main.css
index 559eedee6..8cf79d473 100644
--- a/src/Frontend/src/assets/main.css
+++ b/src/Frontend/src/assets/main.css
@@ -1,5 +1,4 @@
 @import "bootstrap/dist/css/bootstrap.css";
-@import "bootstrap-icons/font/bootstrap-icons.css";
 @import "font-awesome/css/font-awesome.css";
 @import "footer.css";
 @import "tabs.css";
diff --git a/src/Frontend/src/components/OrderBy.vue b/src/Frontend/src/components/OrderBy.vue
index 9d4a9f78a..0bad88436 100644
--- a/src/Frontend/src/components/OrderBy.vue
+++ b/src/Frontend/src/components/OrderBy.vue
@@ -85,10 +85,10 @@ onMounted(() => {
     <ul class="dropdown-menu">
       <span v-for="(sort, index) in getSortOptions()" :key="index">
         <li>
-          <button @click="sortUpdated(sort, SortDirection.Ascending)"><i class="bi" :class="`${sort.icon}up`"></i>{{ sort.description }}</button>
+          <button @click="sortUpdated(sort, SortDirection.Ascending)"><i class="fa" :class="`${sort.icon}asc`"></i>{{ sort.description }}</button>
         </li>
         <li>
-          <button @click="sortUpdated(sort, SortDirection.Descending)"><i class="bi" :class="`${sort.icon}down`"></i>{{ sort.description }}<span> (Descending)</span></button>
+          <button @click="sortUpdated(sort, SortDirection.Descending)"><i class="fa" :class="`${sort.icon}desc`"></i>{{ sort.description }}<span> (Descending)</span></button>
         </li>
       </span>
     </ul>
@@ -98,7 +98,7 @@ onMounted(() => {
 <style scoped>
 @import "@/assets/dropdown.css";
 
-.dropdown-menu .bi {
+.dropdown-menu .fa {
   padding-right: 5px;
 }
 
diff --git a/src/Frontend/src/components/failedmessages/FailedMessageGroups.vue b/src/Frontend/src/components/failedmessages/FailedMessageGroups.vue
index 3622046e6..0fc51856b 100644
--- a/src/Frontend/src/components/failedmessages/FailedMessageGroups.vue
+++ b/src/Frontend/src/components/failedmessages/FailedMessageGroups.vue
@@ -29,27 +29,27 @@ const sortOptions: SortOptions<GroupOperation>[] = [
   {
     description: "Name",
     selector: (group) => group.title,
-    icon: "bi-sort-alpha-",
+    icon: "fa-sort-alpha-",
   },
   {
     description: "Number of messages",
     selector: (group) => group.count,
-    icon: "bi-sort-numeric-",
+    icon: "fa-sort-numeric-",
   },
   {
     description: "First Failed Time",
     selector: (group) => group.first!,
-    icon: "bi-sort-",
+    icon: "fa-sort-amount-",
   },
   {
     description: "Last Failed Time",
     selector: (group) => group.last!,
-    icon: "bi-sort-",
+    icon: "fa-sort-amount-",
   },
   {
     description: "Last Retried Time",
     selector: (group) => group.last_operation_completion_time!,
-    icon: "bi-sort-",
+    icon: "fa-sort-amount-",
   },
 ];
 
diff --git a/src/Frontend/src/components/failedmessages/FailedMessages.vue b/src/Frontend/src/components/failedmessages/FailedMessages.vue
index 6ceb69d78..704100402 100644
--- a/src/Frontend/src/components/failedmessages/FailedMessages.vue
+++ b/src/Frontend/src/components/failedmessages/FailedMessages.vue
@@ -36,11 +36,11 @@ const messages = ref<ExtendedFailedMessage[]>([]);
 const sortOptions: SortOptions<GroupOperation>[] = [
   {
     description: "Time of failure",
-    icon: "bi-sort-",
+    icon: "fa-sort-amount-",
   },
   {
     description: "Message Type",
-    icon: "bi-sort-alpha-",
+    icon: "fa-sort-alpha-",
   },
 ];
 
diff --git a/src/Frontend/src/components/failedmessages/MessageList.vue b/src/Frontend/src/components/failedmessages/MessageList.vue
index 216559345..6e4aa9dce 100644
--- a/src/Frontend/src/components/failedmessages/MessageList.vue
+++ b/src/Frontend/src/components/failedmessages/MessageList.vue
@@ -111,16 +111,16 @@ const endpointColor = hexToCSSFilter("#929E9E").filter;
               <p class="lead break">{{ message.message_type || "Message Type Unknown - missing metadata EnclosedMessageTypes" }}</p>
               <p class="metadata">
                 <span v-if="message.submittedForRetrial" :title="'Message was submitted for retrying'" class="label sidebar-label label-info metadata-label">To retry</span>
-                <span v-if="message.retryInProgress" :title="'Message is being retried'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="bi-arrow-clockwise"></i> Retry in progress</span>
-                <span v-if="message.retried" :title="'Message is being retried'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="bi-arrow-clockwise"></i> Retried</span>
+                <span v-if="message.retryInProgress" :title="'Message is being retried'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="fa fa-repeat"></i> Retry in progress</span>
+                <span v-if="message.retried" :title="'Message is being retried'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="fa fa-repeat"></i> Retried</span>
                 <span v-if="message.resolved" class="label sidebar-label label-info metadata-label">Resolved</span>
 
-                <span v-if="message.deleteInProgress" :title="'Message is being deleted'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="bi-trash"></i> Scheduled for deletion</span>
-                <span v-if="message.archived" :title="'Message is being deleted'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="bi-trash"></i> Deleted</span>
+                <span v-if="message.deleteInProgress" :title="'Message is being deleted'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="fa fa-trash"></i> Scheduled for deletion</span>
+                <span v-if="message.archived" :title="'Message is being deleted'" class="label sidebar-label label-info metadata-label metadata in-progress"><i class="fa fa-trash"></i> Deleted</span>
                 <span v-if="message.number_of_processing_attempts > 1" :title="`This message has already failed ${message.number_of_processing_attempts} times`" class="label sidebar-label label-important metadata-label"
                   >{{ message.number_of_processing_attempts === 10 ? "9+" : message.number_of_processing_attempts - 1 }} Retry Failures</span
                 >
-                <span v-if="message.restoreInProgress" v-tippy="`Message is being restored`" class="label sidebar-label label-warning metadata-label metadata in-progress"><i class="bi-recycle"></i> Restore in progress</span>
+                <span v-if="message.restoreInProgress" v-tippy="`Message is being restored`" class="label sidebar-label label-warning metadata-label metadata in-progress"><i class="fa fa-recycle"></i> Restore in progress</span>
                 <span v-if="message.edited" :title="'Message was edited'" class="label sidebar-label label-info metadata-label">Edited</span>
 
                 <span class="metadata"><i class="fa fa-clock-o"></i> Failed: <time-since :dateUtc="message.time_of_failure"></time-since></span>
diff --git a/src/Frontend/src/components/failedmessages/PendingRetries.vue b/src/Frontend/src/components/failedmessages/PendingRetries.vue
index 30d6f608c..830e4fca1 100644
--- a/src/Frontend/src/components/failedmessages/PendingRetries.vue
+++ b/src/Frontend/src/components/failedmessages/PendingRetries.vue
@@ -38,15 +38,15 @@ const isInitialLoad = ref(true);
 const sortOptions: SortOptions<GroupOperation>[] = [
   {
     description: "Time of failure",
-    icon: "bi-sort-",
+    icon: "fa-sort-amount-",
   },
   {
     description: "Message Type",
-    icon: "bi-sort-alpha-",
+    icon: "fa-sort-alpha-",
   },
   {
     description: "Time of retry request",
-    icon: "bi-sort-",
+    icon: "fa-sort-amount-",
   },
 ];
 const periodOptions = ["All Pending Retries", "Retried in the last 2 Hours", "Retried in the last 1 Day", "Retried in the last 7 Days"];
diff --git a/src/Frontend/vite.config.ts b/src/Frontend/vite.config.ts
index dcc4989de..60242c81c 100644
--- a/src/Frontend/vite.config.ts
+++ b/src/Frontend/vite.config.ts
@@ -52,10 +52,6 @@ export default defineConfig({
         find: "~bootstrap",
         replacement: path.resolve(__dirname, "node_modules/bootstrap"),
       },
-      {
-        find: "~bootstrap-icons",
-        replacement: path.resolve(__dirname, "node_modules/bootstrap-icons"),
-      },
     ],
   },
   base: "./",