@monterosa/sdk-interact-kit 0.19.0-rc.5 → 2.0.0-rc.1

package/dist/index.esm.js

@@ -1,6 +1,8 @@
 import { getConnect as getConnect$1, login as login$1, connect, disconnect, subscribe as subscribe$1, unsubscribe as unsubscribe$1, send, ConnState, onConnected } from '@monterosa/sdk-connect-kit';
-import { Emitter, memoizePromise, subscribe as subscribe$2, checksum, onTick, now, checkAvailability, calculatePercentage, getItem, setItem, createError } from '@monterosa/sdk-util';
+import { Emitter, memoizePromise, subscribe as subscribe$2, checksum, onTick, now, calculatePercentage, getErrorMessage, createError } from '@monterosa/sdk-util';
 import { getSdk, Logger } from '@monterosa/sdk-core';
+import { fetchSettings } from '@monterosa/sdk-interact-interop';
+import { storageRead, storageWrite } from '@monterosa/sdk-storage-kit';
 
 /**
  * @license
@@ -286,20 +288,6 @@ function onConnectionHealthState(connectionHealth, callback) {
     return subscribe$2(connectionHealth, 'state', callback);
 }
 
-/**
- * @license
- * @monterosa/sdk-interact-kit
- *
- * Copyright © 2022 Monterosa Productions Limited. All rights reserved.
- *
- * More details on the license can be found at https://www.monterosa.co/sdk/license
- */
-async function fetchSettings(host, id) {
-    const response = await fetch(`https://${host}/projects/${id.substring(0, 2)}/${id}/settings.json`);
-    const data = await response.json();
-    return data;
-}
-
 /**
  * @license
  * @monterosa/sdk-interact-kit
@@ -413,11 +401,12 @@ class ProjectImpl extends Emitter {
     }
     set listings(newListings) {
         const createdEvents = this._calculateCreatedEvents(newListings);
+        const updatedEvents = this._calculateUpdatedEvents(newListings);
         const deletedEvents = this._calculateDeletedEvents(newListings);
         this._listings = Object.assign({}, newListings);
         this._updateLocales(newListings);
         this._updateEventsChecksum(newListings);
-        this._emitListingsEvents(createdEvents, deletedEvents);
+        this._emitListingsEvents(createdEvents, updatedEvents, deletedEvents);
     }
     /**
      * Calculates events that were created (present in new listings but not in old)
@@ -428,6 +417,21 @@ class ProjectImpl extends Emitter {
         }
         return newListings.events.filter(({ id }) => !this._listings.events.some((event) => id === event.id));
     }
+    /**
+     * Calculates events that were updated (present in old listings and new,
+     * but with different digest)
+     */
+    _calculateUpdatedEvents(newListings) {
+        if (!this._listings) {
+            return [];
+        }
+        return newListings.events.filter((event) => {
+            // find event data in new listings
+            const existingEvent = this._listings.events.find(({ id }) => event.id === id);
+            // return true if event data is found and digest is different
+            return existingEvent && event.digest !== existingEvent.digest;
+        });
+    }
     /**
      * Calculates events that were deleted (present in old listings but not in new)
      */
@@ -459,16 +463,20 @@ class ProjectImpl extends Emitter {
     /**
      * Emits events based on created and deleted events
      */
-    _emitListingsEvents(createdEvents, deletedEvents) {
+    _emitListingsEvents(createdEvents, updatedEvents, deletedEvents) {
         const hasCreatedEvents = createdEvents.length > 0;
         const hasDeletedEvents = deletedEvents.length > 0;
-        const hasChanges = hasCreatedEvents || hasDeletedEvents;
+        const hasUpdatedEvents = updatedEvents.length > 0;
+        const hasChanges = hasCreatedEvents || hasDeletedEvents || hasUpdatedEvents;
         if (hasCreatedEvents) {
             this.emit('listings_events_created', createdEvents);
         }
         if (hasDeletedEvents) {
             this.emit('listings_events_deleted', deletedEvents);
         }
+        if (hasUpdatedEvents) {
+            this.emit('listings_events_updated', updatedEvents);
+        }
         if (hasChanges) {
             this.emit('listings');
         }
@@ -650,14 +658,6 @@ const getProjectMemoized = memoizePromise(async (sdk) => {
 function getProject(sdk = getSdk()) {
     return getProjectMemoized(sdk);
 }
-/**
- * @internal
- */
-async function fetchListings(host, projectId) {
-    const response = await fetch(`https://${host}/projects/${projectId.substring(0, 2)}/${projectId}/listings.json`);
-    const data = (await response.json());
-    return data;
-}
 /**
  * Adds an observer for when {@link InteractProject.fields |  project fields}
  * are updated
@@ -666,9 +666,13 @@ function onProjectFieldsUpdated(project, callback) {
     return subscribe$2(project, 'updated', callback);
 }
 /**
- * @internal
+ * Adds an observer that is called when the project listings are updated.
+ *
+ * @deprecated Use {@link onEventAdded()}, {@link onEventUpdated()} and
+ * {@link onEventRemoved()} instead
  */
 function onProjectListingsUpdated(project, callback) {
+    console.warn('onProjectListingsUpdated() is deprecated. Please use onEventAdded(), onEventUpdated() and onEventRemoved() instead');
     return subscribe$2(project, 'listings', callback);
 }
 
@@ -790,11 +794,12 @@ class EventImpl extends Emitter {
         this._context = context;
         this._state = this.calculateState();
         this._internalState = this.calculateInternalState();
-        this.unsubscribeStateHandler = onTick(() => this.handleState());
-        this.unsubscribeInternalStateHandler = onTick(() => {
-            this.handleInternalState();
-        });
-        this.unsubscribeListingsHandler = onProjectListingsUpdated(context.project, () => this.handleListings());
+        this.boundHandleState = this.handleState.bind(this);
+        this.boundHandleInternalState = this.handleInternalState.bind(this);
+        this.boundHandleEventsUpdated = this.handleEventsUpdated.bind(this);
+        this.unsubscribeStateHandler = onTick(this.boundHandleState);
+        this.unsubscribeInternalStateHandler = onTick(this.boundHandleInternalState);
+        this.unsubscribeListingsHandler = subscribe$2(this.context.project, 'listings_events_updated', this.boundHandleEventsUpdated);
     }
     calculateState() {
         if (!this._data.started || now() < this.startAt) {
@@ -837,11 +842,13 @@ class EventImpl extends Emitter {
             this.emit('internal_state', internalState);
         }
     }
-    handleListings() {
-        const { project } = this.context;
-        const data = project.events.find(({ id }) => id === this.id);
+    handleEventsUpdated(events) {
+        const data = events.find(({ id }) => id === this.id);
         if (data && this._data.digest !== data.digest) {
             this._data = data;
+            // Forcing state recalculation to ensure the event is in the correct state
+            this.handleState();
+            this.handleInternalState();
             this.emit('updated');
         }
     }
@@ -1431,6 +1438,7 @@ class ElementImpl extends Emitter {
     }
     update(data) {
         this._data = data;
+        this.handleState();
     }
     destroy() {
         this.unsubscribeStateHandler();
@@ -1569,13 +1577,12 @@ class ElementImpl extends Emitter {
  * More details on the license can be found at https://www.monterosa.co/sdk/license
  */
 const elements = new Map();
-const storageAvailable = checkAvailability();
-function buildElement(options, context) {
+async function buildElement(options, context) {
     if (elements.has(options.id)) {
         return elements.get(options.id);
     }
     const element = new ElementImpl(options, context);
-    restoreAnswer(element);
+    await restoreAnswer(element);
     elements.set(element.id, element);
     return element;
 }
@@ -1626,14 +1633,21 @@ async function handleCreateMessage(message) {
     }
     if (elements.has(options.id)) {
         const element = elements.get(options.id);
-        if (options.updated_at > element.updatedAt) {
+        if (options.updated_at > element.updatedAt ||
+            // This is a workaround to handle a Studio issue when two /create/ messages
+            // are sent upon correct option reveal. The first /create/ message contains
+            // the same duration but a different updated_at timestamp. The second /create/
+            // message contains the same updated_at timestamp but a different duration.
+            // Therefore, we need to check if the duration is different to ensure that
+            // the element is updated correctly.
+            options.duration !== element.duration) {
             element.update(options);
             event.emit('update', element);
         }
     }
     else {
         const context = Object.assign(Object.assign({}, event.context), { event });
-        const element = buildElement(options, context);
+        const element = await buildElement(options, context);
         event.emit('publish', element);
     }
 }
@@ -1678,10 +1692,13 @@ function handleRevealMessage(message) {
     if (!element) {
         return;
     }
-    element.correctOption = correctOption;
-    element.context.event.emit('update', element);
+    if (element.correctOption !== correctOption) {
+        element.correctOption = correctOption;
+        element.context.event.emit('update', element);
+    }
 }
 async function handleEventHistory(history) {
+    var _a, e_1, _b, _c;
     if (history.timeline.length === 0) {
         return;
     }
@@ -1690,11 +1707,28 @@ async function handleEventHistory(history) {
         return;
     }
     const context = Object.assign(Object.assign({}, event.context), { event });
-    for (const snapshot of history.timeline) {
-        if (!elements.has(snapshot.id)) {
-            buildElement(snapshot, context);
+    try {
+        for (var _d = true, _e = __asyncValues(history.timeline), _f; _f = await _e.next(), _a = _f.done, !_a;) {
+            _c = _f.value;
+            _d = false;
+            try {
+                const snapshot = _c;
+                if (!elements.has(snapshot.id)) {
+                    await buildElement(snapshot, context);
+                }
+            }
+            finally {
+                _d = true;
+            }
         }
     }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (!_d && !_a && (_b = _e.return)) await _b.call(_e);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
 }
 async function sendAnswer(element, userAnswer) {
     const { project, event } = element.context;
@@ -1705,27 +1739,19 @@ async function sendAnswer(element, userAnswer) {
         .join(':');
     connect.sendVote(event.id, element.pollId, answer);
 }
-function storeAnswer(element, userAnswer) {
+async function storeAnswer(element, userAnswer) {
     try {
         element.userAnswer = userAnswer;
-        if (storageAvailable) {
-            // Can throw a "QuotaExceededError" DOMException exception
-            // if the quota has been exceeded.
-            setItem(`element_${element.id}_vote`, JSON.stringify(userAnswer));
-        }
+        await storageWrite(`element_${element.id}_vote`, JSON.stringify(userAnswer));
     }
     catch (err) {
-        if (err instanceof Error) {
-            console.warn(`Can't store user answer: ${err.message}`);
-        }
+        console.warn(`Failed to store user answer: ${getErrorMessage(err)}`);
     }
 }
-function restoreAnswer(element) {
-    if (storageAvailable) {
-        const userAnswer = getItem(`element_${element.id}_vote`);
-        if (userAnswer !== null) {
-            element.userAnswer = Answer.fromJSON(userAnswer);
-        }
+async function restoreAnswer(element) {
+    const userAnswer = await storageRead(`element_${element.id}_vote`);
+    if (userAnswer !== null) {
+        element.userAnswer = Answer.fromJSON(userAnswer);
     }
 }
 
@@ -2031,5 +2057,5 @@ function onPresenceCounterClose(presenceCounter, callback) {
     return () => presenceCounter.off('state', handler);
 }
 
-export { Answer, AnswerError, Channel, ConnectionHealthState, ElementImpl, ElementState, ElementType, EventImpl, EventState, Klass, PresenceCounterState, ProjectImpl, State, answer, fetchListings, getConnect, getConnectionHealth, getElement, getElementMemoized, getElements, getElementsMemoized, getEvent, getEventMemoized, getEvents, getEventsMemoized, getPresenceCounter, getProject, getProjectMemoized, login, onConnectionHealthState, onElementPublished, onElementResults, onElementRevoked, onElementStateChanged, onElementUpdated, onEventAdded, onEventPublished, onEventRemoved, onEventState, onEventUpdated, onPresenceCounterClose, onPresenceCounterOpen, onPresenceCounterUpdate, onProjectFieldsUpdated, onProjectListingsUpdated, validateAnswer };
+export { Answer, AnswerError, Channel, ConnectionHealthState, ElementImpl, ElementState, ElementType, EventImpl, EventState, Klass, PresenceCounterState, ProjectImpl, State, answer, getConnect, getConnectionHealth, getElement, getElementMemoized, getElements, getElementsMemoized, getEvent, getEventMemoized, getEvents, getEventsMemoized, getPresenceCounter, getProject, getProjectMemoized, login, onConnectionHealthState, onElementPublished, onElementResults, onElementRevoked, onElementStateChanged, onElementUpdated, onEventAdded, onEventPublished, onEventRemoved, onEventState, onEventUpdated, onPresenceCounterClose, onPresenceCounterOpen, onPresenceCounterUpdate, onProjectFieldsUpdated, onProjectListingsUpdated, validateAnswer };
 //# sourceMappingURL=index.esm.js.map