1 files changed, 13 insertions, 24 deletions

diff --git a/packages/taler-wallet-webextension/src/components/WalletActivity.tsx b/packages/taler-wallet-webextension/src/components/WalletActivity.tsx
index a370e859d..1dde08010 100644
--- a/packages/taler-wallet-webextension/src/components/WalletActivity.tsx
+++ b/packages/taler-wallet-webextension/src/components/WalletActivity.tsx
@@ -86,7 +86,7 @@ export function WalletActivity({ }: Props): VNode {
       {(function (): VNode {
         switch (table) {
           case "events": {
-            return <ObservavilityEventsTable />
+            return <ObservabilityEventsTable />
           }
           case "tasks": {
             return <ActiveTasksTable />
@@ -614,42 +614,32 @@ function getNotificationFor(id: string, event: WalletNotification, start: Absolu
   }
 }
 
-let lastTimeout: ReturnType<typeof setTimeout>;
-export function ObservavilityEventsTable({ }: {}): VNode {
+export function ObservabilityEventsTable({ }: {}): VNode {
   const { i18n } = useTranslationContext()
   const api = useBackendContext();
 
   const [notifications, setNotifications] = useState<Notif[]>([])
+  const [showDetails, setShowDetails] = useState<VNode>()
 
   useEffect(() => {
-    //initial call
-    api.background.call("getNotifications", undefined).then(notif => {
-      const list: Notif[] = []
-      for (const pepe of notif) {
-        const event = getNotificationFor(String(list.length), pepe.notification, pepe.when, list)
-        // pepe.
-        if (event) {
-          list.push(event)
-        }
-      }
-    setNotifications(list);
-    })
-
+    let lastTimeout: ReturnType<typeof setTimeout>;
     function periodicRefresh() {
-      lastTimeout = setTimeout(async () => {
-
-        const notif = await api.background.call("getNotifications", undefined);
+      api.background.call("getNotifications", undefined).then(notif => {
 
         const list: Notif[] = []
         for (const pepe of notif) {
           const event = getNotificationFor(String(list.length), pepe.notification, pepe.when, list)
           // pepe.
           if (event) {
-            list.push(event)
+            list.unshift(event)
           }
         }
-
         setNotifications(list);
+      }).catch(error => {
+        console.log(error)
+      })
+
+      lastTimeout = setTimeout(() => {
         periodicRefresh();
       }, 1000)
 
@@ -657,9 +647,8 @@ export function ObservavilityEventsTable({ }: {}): VNode {
       return () => { clearTimeout(lastTimeout) }
     }
     return periodicRefresh()
-  });
+  }, [1]);
 
-  const [showDetails, setShowDetails] = useState<VNode>()
   return <div>
     <div style={{ display: "flex", justifyContent: "space-between" }}>
 
@@ -732,7 +721,7 @@ export function ActiveTasksTable({ }: {}): VNode {
   );
   const [showError, setShowError] = useState<TalerErrorDetail>()
   const tasks = state && !state.hasError ? state.response.tasks : [];
-  
+
   // const listenAllEvents = Array.from<NotificationType>({ length: 1 });
   // listenAllEvents.includes = () => true
   // useEffect(() => {