From 29962bb4b2e81312698bdcc1c8db56ed4f45481a Mon Sep 17 00:00:00 2001
From: Tim Fry <tim@fusionpbx.com>
Date: Fri, 13 Dec 2024 16:45:02 -0400
Subject: [PATCH] add a Loading indicator to show fetching data in progress

---
 app/phrases/phrase_edit.php                     |  2 ++
 app/phrases/resources/javascript/phrase_edit.js | 10 ++++++++++
 2 files changed, 12 insertions(+)

diff --git a/app/phrases/phrase_edit.php b/app/phrases/phrase_edit.php
index e878f04247..e5167be1f3 100644
--- a/app/phrases/phrase_edit.php
+++ b/app/phrases/phrase_edit.php
@@ -507,6 +507,8 @@ if (count($_POST) > 0) {
 	//draggable rows are initially empty
 	echo "<tbody id='structure'>\n";
 	echo "</tbody>";
+	//show loading
+	echo "<tbody id='loading'><tr><td>&nbsp;</td><td><center>Loading...</center></td><td>&nbsp;</td></tr></tbody>\n";
 	//cloning row and buttons created outside of 'structure' table body
 	echo "<tbody>";
 	echo "<tr id='empty_row' style='display: none;'>\n";
diff --git a/app/phrases/resources/javascript/phrase_edit.js b/app/phrases/resources/javascript/phrase_edit.js
index e226919a39..025cd6f718 100644
--- a/app/phrases/resources/javascript/phrase_edit.js
+++ b/app/phrases/resources/javascript/phrase_edit.js
@@ -41,6 +41,14 @@ document.addEventListener("DOMContentLoaded", async function () {
 	add_draggable_rows();
 });
 
+function remove_loading() {
+	//remove loading
+	const loading = document.getElementById('loading');
+	if (loading) {
+		loading.remove();
+	}
+}
+
 async function fetch_data(command) {
     try {
         const response = await fetch('phrase_responder.php', {
@@ -104,6 +112,8 @@ async function add_existing() {
 			select_action.dispatchEvent(changeEvent);
 		}
 	}
+
+	remove_loading();
 }
 
 //