style changes to silentAudioList

main.js

@@ -108,7 +108,8 @@ ipcMain.handle("getTotalSilence", async (_, args) => {
 })
 
 ipcMain.handle("getCountAudioSplits", async (_, destPath) => {
-  let filesPrinted = readdirSync(destPath), // https://stackoverflow.com/questions/32511789/looping-through-files-in-a-folder-node-js
+  // https://stackoverflow.com/questions/32511789/looping-through-files-in-a-folder-node-js
+  let filesPrinted = readdirSync(destPath),
     totalPrintedStems = 0,
     stemsList = [
       "2MIX",

renderer.js

@@ -169,8 +169,8 @@ async function splitAudioFiles(e) {
   MAIN_APP.innerText = "Finalizing Audio..."
   INNER_BAR_LOADING.style.width = `100%`
 
-  FINAL_MESSAGE.innerText =
-    "List of Silent Audio Stems Below:\n" + JSON.stringify(silentAudioList)
+  FINAL_MESSAGE.innerHTML =
+    "<b>List of Silent Audio Stems Below:</b>\n" + getSilentAudioList(silentAudioList)
 
   // let countAudioSplits = getCountAudioSplits(destPath),
   let countAudioSplits = await api.getCountAudioSplits(destPath),
@@ -187,6 +187,26 @@ async function splitAudioFiles(e) {
   resetProgressBar()
 }
 
+function getSilentAudioList(data) {
+  return data.length
+    ? getSilentAudioListTable(data)
+    : "<i>No audio files were silent...</i>"
+}
+
+function getSilentAudioListTable(data) {
+  var result = "<table border=1>"
+  for (var i = 0; i < myArray.length; i++) {
+    result += "<tr>"
+    for (var j = 0; j < myArray[i].length; j++) {
+      result += "<td>" + myArray[i][j] + "</td>"
+    }
+    result += "</tr>"
+  }
+  result += "</table>"
+
+  return result
+}
+
 async function progressBarUpdate(percentage, totalAudio) {
   let percentageFraction = (percentage / totalAudio).toFixed(2) * 100
   let completionTimer = 0

style.css

@@ -98,3 +98,8 @@ input {
   cursor: text !important;
   font-size: 1rem !important;
 }
+
+.finalMessage {
+  display: grid;
+  place-items: center;
+}