[5.x] Refreshes tags periodically

public/mix-manifest.json

@@ -1,5 +1,5 @@
 {
-    "/app.js": "/app.js?id=45904d8bd75c65ee5c136a52a5e8ead6",
+    "/app.js": "/app.js?id=98ba2411bc7ee3ceb50eb3d1ae7ac923",
     "/app-dark.css": "/app-dark.css?id=15c72df05e2b1147fa3e4b0670cfb435",
     "/app.css": "/app.css?id=4d6a1a7fe095eedc2cb2a4ce822ea8a5",
     "/img/favicon.png": "/img/favicon.png?id=1542bfe8a0010dcbee710da13cce367f",

resources/js/screens/monitoring/index.vue

@@ -21,19 +21,25 @@
 
             this.loadTags();
 
+            this.refreshTagsPeriodically();
+
             this.$on('addTagModalClosed', data => {
                 this.addTagModalOpened = false;
             });
         },
 
+        /**
+         * Clean up after the component is destroyed.
+         */
+        destroyed() {
+            clearInterval(this.interval);
+        },
 
         methods: {
             /**
              * Load the monitored tags.
              */
             loadTags() {
-                this.ready = false;
-
                 this.$http.get(Horizon.basePath + '/api/monitoring')
                     .then(response => {
                         this.tags = response.data;
@@ -42,6 +48,14 @@
                     });
             },
 
+            /**
+             * Refresh the tags every period of time.
+             */
+            refreshTagsPeriodically() {
+                this.interval = setInterval(() => {
+                    this.loadTags();
+                }, 3000);
+            },
 
             /**
              * Open the modal for adding a new tag.