From 833d908a32150b739a9bf642d1f818e52229f4e0 Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <info@fabiomanganiello.com>
Date: Sun, 13 Nov 2022 01:39:40 +0100
Subject: [PATCH] Blink entities body upon update

---
 .../src/components/panels/Entities/Entity.vue | 22 ++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue
index 24480977..23af0930 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="row item entity-container">
+  <div class="row item entity-container" :class="{blink: justUpdated}">
     <component :is="component"
       :value="value"
       :loading="loading"
@@ -22,6 +22,7 @@ export default {
   data() {
     return {
       component: null,
+      justUpdated: false,
     }
   },
 
@@ -31,6 +32,15 @@ export default {
           t[0].toUpperCase() + t.slice(1)
       ).join('')
 
+      this.$watch(
+          () => this.value,
+          () => {
+              this.justUpdated = true
+              const self = this;
+              setTimeout(() => self.justUpdated = false, 1000)
+          }
+      )
+
       this.component = defineAsyncComponent(
         () => import(`@/components/panels/Entities/${type}`)
       )
@@ -47,4 +57,14 @@ export default {
   position: relative;
   padding: 0 !important;
 }
+
+.blink {
+  animation: blink-animation 1s steps(20, start);
+}
+
+@keyframes blink-animation {
+  to {
+    background: $active-bg;
+  }
+}
 </style>