Testing: hook some of the new functionality in to the frontend

NOT finished, and contains some testing code.
PIVX-Labs · Nov 18, 2024 · 1f821a4 · 1f821a4
1 parent acb7102
commit 1f821a4
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 3 deletions.
diff --git a/scripts/alerts/Alert.vue b/scripts/alerts/Alert.vue
@@ -5,6 +5,7 @@ const props = defineProps({
     message: String,
     level: String,
     notificationCount: Number,
+    actionName: String,
 });
 
 const { message, level } = toRefs(props);
@@ -49,5 +50,13 @@ const icon = computed(() => {
                 CLOSE
             </button>
         </div>
+        <div v-if="actionName" style="display: flex; flex-direction: column">
+            <button
+                class="btn btn-notification-close"
+                @click="$emit('hideAlert')"
+            >
+                {{ actionName }}
+            </button>
+        </div>
     </div>
 </template>
diff --git a/scripts/alerts/Alerts.vue b/scripts/alerts/Alerts.vue
@@ -20,6 +20,7 @@ watch(alerts, () => {
                 message: `${previousAlert.message}`,
                 show,
                 count,
+                actionName: previousAlert.actionName,
                 // Store original message so we can use it as key.
                 // This skips the animation in case of multiple errors
                 original: previousAlert.message,
@@ -57,6 +58,7 @@ watch(alerts, () => {
                 :message="alert.value.message"
                 :level="alert.value.level"
                 :notificationCount="alert.value.count"
+                :actionName="alert.value.actionName"
                 @hideAlert="alert.value.show = false"
             />
         </div>

diff --git a/scripts/composables/use_alerts.js b/scripts/composables/use_alerts.js
@@ -15,9 +15,17 @@ export const useAlerts = defineStore('alerts', () => {
      * @param {'success'|'info'|'warning'} type - The alert level
      * @param {string} message - The message to relay to the user
      * @param {number?} timeout - The time in `ms` until the alert expires (Defaults to never expiring)
+     * @param {string?} actionName - The button title of an optional Action to perform
+     * @param {function?} actionFunc - The function to execute if the Action button is used
      */
-    const createAlert = (type, message, timeout) => {
-        alertController.createAlert(type, message, timeout);
+    const createAlert = (type, message, timeout, actionName, actionFunc) => {
+        alertController.createAlert(
+            type,
+            message,
+            timeout,
+            actionName,
+            actionFunc
+        );
     };
 
     alertController.subscribe(() => {

diff --git a/scripts/dashboard/Dashboard.vue b/scripts/dashboard/Dashboard.vue
@@ -142,7 +142,12 @@ async function importWallet({
 
         // Start syncing in the background
         wallet.sync().then(() => {
-            createAlert('success', translation.syncStatusFinished, 12500);
+            createAlert(
+                'success',
+                translation.syncStatusFinished,
+                12500,
+                'Test Button'
+            );
         });
         getEventEmitter().emit('wallet-import');
         return true;