@dhis2/analytics 28.1.2 → 29.0.0

package/build/cjs/components/Interpretations/InterpretationModal/CommentUpdateForm.js

@@ -5,46 +5,35 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CommentUpdateForm = void 0;
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-var _appRuntime = require("@dhis2/app-runtime");
 var _d2I18n = _interopRequireDefault(require("@dhis2/d2-i18n"));
 var _ui = require("@dhis2/ui");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _index = require("../../RichText/index.js");
 var _index2 = require("../common/index.js");
+var _hooks = require("../InterpretationsProvider/hooks.js");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const CommentUpdateForm = ({
-  interpretationId,
-  commentId,
-  currentUser,
+  id,
   text,
-  close,
   onComplete
 }) => {
+  const currentUser = (0, _hooks.useInterpretationsCurrentUser)();
   const [commentText, setCommentText] = (0, _react.useState)(text || '');
-  const updateMutationRef = (0, _react.useRef)({
-    resource: `interpretations/${interpretationId}/comments/${commentId}`,
-    type: 'update',
-    partial: false,
-    data: ({
-      commentText
-    }) => commentText
-  });
   const [update, {
     loading,
     error
-  }] = (0, _appRuntime.useDataMutation)(updateMutationRef.current, {
-    onComplete: () => {
-      onComplete();
-      close();
-    }
+  }] = (0, _hooks.useUpdateCommentForActiveInterpretation)({
+    id,
+    text: commentText,
+    onComplete
   });
   const errorText = error ? _d2I18n.default.t('Could not update comment') : '';
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.dynamic([["2690082310", [_ui.spacers.dp8, _ui.spacers.dp8, _ui.colors.grey100]]]) + " " + "message"
   }, /*#__PURE__*/_react.default.createElement(_index2.MessageEditorContainer, {
-    currentUser: currentUser
+    currentUserName: currentUser.name
   }, /*#__PURE__*/_react.default.createElement(_index.RichTextEditor, {
     inputPlaceholder: _d2I18n.default.t('Enter comment text'),
     onChange: setCommentText,
@@ -55,14 +44,12 @@ const CommentUpdateForm = ({
     loading: loading,
     primary: true,
     small: true,
-    onClick: () => update({
-      commentText
-    })
+    onClick: update
   }, _d2I18n.default.t('Update')), /*#__PURE__*/_react.default.createElement(_ui.Button, {
     disabled: loading,
     secondary: true,
     small: true,
-    onClick: close
+    onClick: onComplete
   }, _d2I18n.default.t('Cancel')))), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "2690082310",
     dynamic: [_ui.spacers.dp8, _ui.spacers.dp8, _ui.colors.grey100]
@@ -70,10 +57,7 @@ const CommentUpdateForm = ({
 };
 exports.CommentUpdateForm = CommentUpdateForm;
 CommentUpdateForm.propTypes = {
-  close: _propTypes.default.func.isRequired,
-  commentId: _propTypes.default.string.isRequired,
-  currentUser: _propTypes.default.object.isRequired,
-  interpretationId: _propTypes.default.string.isRequired,
+  id: _propTypes.default.string.isRequired,
   onComplete: _propTypes.default.func.isRequired,
   text: _propTypes.default.string
 };

package/build/cjs/components/Interpretations/InterpretationModal/InterpretationModal.js

@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.InterpretationModal = void 0;
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-var _appRuntime = require("@dhis2/app-runtime");
 var _d2I18n = _interopRequireDefault(require("@dhis2/d2-i18n"));
 var _ui = require("@dhis2/ui");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
+var _hooks = require("../InterpretationsProvider/hooks.js");
 var _InterpretationThread = require("./InterpretationThread.js");
 var _useModalContentWidth = require("./useModalContentWidth.js");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
@@ -30,25 +30,12 @@ function getModalContentCSS(width) {
     className: _style.default.dynamic([["2099285089", [width]]])
   };
 }
-const query = {
-  interpretation: {
-    resource: 'interpretations',
-    id: ({
-      id
-    }) => id,
-    params: {
-      fields: ['access[write,manage]', 'id', 'text', 'created', 'createdBy[id,displayName]', 'likes', 'likedBy', 'comments[id,text,created,createdBy[id,displayName]]']
-    }
-  }
-};
 const InterpretationModal = ({
-  currentUser,
   isVisualizationLoading,
   visualization,
   onResponsesReceived,
   downloadMenuComponent,
   onClose,
-  onInterpretationUpdate,
   interpretationId,
   initialFocus,
   pluginComponent: VisualizationPlugin
@@ -56,53 +43,14 @@ const InterpretationModal = ({
   var _currentUser$settings;
   const modalContentWidth = (0, _useModalContentWidth.useModalContentWidth)();
   const modalContentCSS = getModalContentCSS(modalContentWidth);
-  const [isDirty, setIsDirty] = (0, _react.useState)(false);
+  const currentUser = (0, _hooks.useInterpretationsCurrentUser)();
   const {
-    data,
-    error,
+    data: interpretation,
     loading,
-    fetching,
-    refetch
-  } = (0, _appRuntime.useDataQuery)(query, {
-    lazy: true
-  });
-  const interpretation = data === null || data === void 0 ? void 0 : data.interpretation;
+    error
+  } = (0, _hooks.useActiveInterpretation)(interpretationId);
   const shouldRenderModalContent = !error && interpretation;
   const loadingInProgress = loading || isVisualizationLoading;
-  const handleClose = () => {
-    if (isDirty) {
-      onInterpretationUpdate();
-      setIsDirty(false);
-    }
-    onClose();
-  };
-  const onThreadUpdated = affectsInterpretation => {
-    if (affectsInterpretation) {
-      setIsDirty(true);
-    }
-    refetch({
-      id: interpretationId
-    });
-  };
-  const onLikeToggled = ({
-    likedBy
-  }) => {
-    setIsDirty(true);
-    interpretation.likedBy = likedBy;
-    interpretation.likes = likedBy.length;
-  };
-  const onInterpretationDeleted = () => {
-    setIsDirty(false);
-    onInterpretationUpdate();
-    onClose();
-  };
-  (0, _react.useEffect)(() => {
-    if (interpretationId) {
-      refetch({
-        id: interpretationId
-      });
-    }
-  }, [interpretationId, refetch]);
   const filters = (0, _react.useMemo)(() => {
     return {
       relativePeriodDate: interpretation === null || interpretation === void 0 ? void 0 : interpretation.created
@@ -110,7 +58,7 @@ const InterpretationModal = ({
   }, [interpretation === null || interpretation === void 0 ? void 0 : interpretation.created]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, loadingInProgress && /*#__PURE__*/_react.default.createElement(_ui.Layer, null, /*#__PURE__*/_react.default.createElement(_ui.CenteredContent, null, /*#__PURE__*/_react.default.createElement(_ui.CircularLoader, null))), /*#__PURE__*/_react.default.createElement(_ui.Modal, {
     fluid: true,
-    onClose: handleClose,
+    onClose: onClose,
     className: (0, _classnames.default)(modalCSS.className, {
       hidden: loadingInProgress
     }),
@@ -143,17 +91,14 @@ const InterpretationModal = ({
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.dynamic([["2014146191", [_ui.colors.grey900, _ui.spacers.dp24, _ui.spacers.dp4, _ui.spacers.dp4]]]) + " " + "thread-wrap"
   }, /*#__PURE__*/_react.default.createElement(_InterpretationThread.InterpretationThread, {
-    currentUser: currentUser,
-    fetching: fetching,
+    loading: loading,
     interpretation: interpretation,
-    onInterpretationDeleted: onInterpretationDeleted,
-    onThreadUpdated: onThreadUpdated,
     initialFocus: initialFocus,
     downloadMenuComponent: downloadMenuComponent,
-    onLikeToggled: onLikeToggled
+    onInterpretationDeleted: onClose
   }))))), /*#__PURE__*/_react.default.createElement(_ui.ModalActions, null, /*#__PURE__*/_react.default.createElement(_ui.Button, {
-    disabled: fetching,
-    onClick: handleClose
+    disabled: loading,
+    onClick: onClose
   }, _d2I18n.default.t('Hide interpretation'))), modalCSS.styles, modalContentCSS.styles, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "2014146191",
     dynamic: [_ui.colors.grey900, _ui.spacers.dp24, _ui.spacers.dp4, _ui.spacers.dp4]
@@ -161,7 +106,6 @@ const InterpretationModal = ({
 };
 exports.InterpretationModal = InterpretationModal;
 InterpretationModal.propTypes = {
-  currentUser: _propTypes.default.object.isRequired,
   interpretationId: _propTypes.default.string.isRequired,
   isVisualizationLoading: _propTypes.default.bool.isRequired,
   pluginComponent: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func]).isRequired,
@@ -169,6 +113,5 @@ InterpretationModal.propTypes = {
   onClose: _propTypes.default.func.isRequired,
   onResponsesReceived: _propTypes.default.func.isRequired,
   downloadMenuComponent: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func]),
-  initialFocus: _propTypes.default.bool,
-  onInterpretationUpdate: _propTypes.default.func
+  initialFocus: _propTypes.default.bool
 };

package/build/cjs/components/Interpretations/InterpretationModal/InterpretationThread.js

@@ -12,36 +12,35 @@ var _moment = _interopRequireDefault(require("moment"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _index = require("../common/index.js");
+var _hooks = require("../InterpretationsProvider/hooks.js");
 var _Comment = require("./Comment.js");
 var _CommentAddForm = require("./CommentAddForm.js");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const InterpretationThread = ({
-  currentUser,
-  fetching,
+  loading,
   interpretation,
   onInterpretationDeleted,
-  onLikeToggled,
   initialFocus,
-  onThreadUpdated,
   downloadMenuComponent: DownloadMenu,
   dashboardRedirectUrl
 }) => {
+  const currentUser = (0, _hooks.useInterpretationsCurrentUser)();
   const {
     fromServerDate
   } = (0, _appRuntime.useTimeZoneConversion)();
   const focusRef = (0, _react.useRef)();
   (0, _react.useEffect)(() => {
     if (initialFocus && focusRef.current) {
-      window.requestAnimationFrame(() => {
+      window.setTimeout(() => {
         focusRef.current.focus();
-      });
+      }, 25);
     }
   }, [initialFocus]);
   const interpretationAccess = (0, _index.getInterpretationAccess)(interpretation, currentUser);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "jsx-3292109121" + " " + ((0, _classnames.default)('container', {
-      fetching,
+      fetching: loading,
       dashboard: !!dashboardRedirectUrl
     }) || "")
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -54,30 +53,21 @@ const InterpretationThread = ({
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: "jsx-3292109121" + " " + 'thread'
   }, /*#__PURE__*/_react.default.createElement(_index.Interpretation, {
-    currentUser: currentUser,
-    interpretation: interpretation,
-    onLikeToggled: onLikeToggled,
+    id: interpretation.id,
     onReplyIconClick: interpretationAccess.comment ? () => {
       var _focusRef$current;
       return (_focusRef$current = focusRef.current) === null || _focusRef$current === void 0 ? void 0 : _focusRef$current.focus();
     } : null,
-    onUpdated: () => onThreadUpdated(true),
-    onDeleted: onInterpretationDeleted,
     dashboardRedirectUrl: dashboardRedirectUrl,
-    isInThread: true
+    isInThread: true,
+    onDeleted: onInterpretationDeleted
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: "jsx-3292109121" + " " + 'comments'
   }, interpretation.comments.map(comment => /*#__PURE__*/_react.default.createElement(_Comment.Comment, {
     key: comment.id,
     comment: comment,
-    currentUser: currentUser,
-    interpretationId: interpretation.id,
-    onThreadUpdated: onThreadUpdated,
     canComment: interpretationAccess.comment
   })))), interpretationAccess.comment && /*#__PURE__*/_react.default.createElement(_CommentAddForm.CommentAddForm, {
-    currentUser: currentUser,
-    interpretationId: interpretation.id,
-    onSave: () => onThreadUpdated(true),
     focusRef: focusRef
   }), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "3292109121"
@@ -85,13 +75,10 @@ const InterpretationThread = ({
 };
 exports.InterpretationThread = InterpretationThread;
 InterpretationThread.propTypes = {
-  currentUser: _propTypes.default.object.isRequired,
-  fetching: _propTypes.default.bool.isRequired,
   interpretation: _propTypes.default.object.isRequired,
+  loading: _propTypes.default.bool.isRequired,
   onInterpretationDeleted: _propTypes.default.func.isRequired,
-  onLikeToggled: _propTypes.default.func.isRequired,
   dashboardRedirectUrl: _propTypes.default.string,
   downloadMenuComponent: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func]),
-  initialFocus: _propTypes.default.bool,
-  onThreadUpdated: _propTypes.default.func
+  initialFocus: _propTypes.default.bool
 };

package/build/cjs/components/Interpretations/InterpretationsProvider/InterpretationsManager.js

@@ -0,0 +1,275 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InterpretationsManager = void 0;
+var _groupInterpretationIdsByDate = require("./groupInterpretationIdsByDate.js");
+class InterpretationsManager {
+  constructor(dataEngine, currentUser) {
+    if (!dataEngine || !currentUser) {
+      throw new Error('Initialised InterpretationsManager without dataEngine or currentUser');
+    }
+    this.query = dataEngine.query.bind(dataEngine);
+    this.mutate = dataEngine.mutate.bind(dataEngine);
+    this.currentUser = currentUser;
+    this.currentVisualizationId = null;
+    this.currentType = null;
+    this.interpretations = new Map();
+    this.activeInterpretationId = null;
+    this.interpretationsListCallback = null;
+    this.interpretationObservers = new Map();
+  }
+  getInterpretation(id) {
+    const interpretation = this.interpretations.get(id);
+    if (!interpretation) {
+      throw new Error(`Could not get interpretation with id ${id}`);
+    }
+    return interpretation;
+  }
+  getCurrentUser() {
+    return this.currentUser;
+  }
+  getActiveInterpretation() {
+    const activeInterpretation = this.interpretations.get(this.activeInterpretationId);
+    if (!activeInterpretation) {
+      throw new Error('There currently is no active interpretation');
+    }
+    return activeInterpretation;
+  }
+  subscribeToInterpretationsListUpdates(callback) {
+    this.interpretationsListCallback = callback;
+
+    // return cleanup function for useEffect hooks
+    return () => {
+      this.interpretationsListCallback = null;
+    };
+  }
+  subscribeToInterpretationUpdates(id, callback) {
+    // create callback Set if needed on the fly
+    if (!this.interpretationObservers.has(id)) {
+      this.interpretationObservers.set(id, new Set());
+    }
+    this.interpretationObservers.get(id).add(callback);
+
+    // return cleanup function for useEffect hooks
+    return () => {
+      this.interpretationObservers.get(id).delete(callback);
+    };
+  }
+  notifyInterpretationsListObserver() {
+    if (this.interpretationsListCallback) {
+      this.interpretationsListCallback((0, _groupInterpretationIdsByDate.groupInterpretationIdsByDate)(Array.from(this.interpretations.values())));
+    }
+  }
+  notifyInterpretationObservers(id) {
+    const callbacks = this.interpretationObservers.get(id);
+    if (callbacks) {
+      for (const callback of callbacks) {
+        callback(this.getInterpretation(id));
+      }
+    }
+  }
+  clearActiveInterpretation() {
+    this.activeInterpretationId = null;
+  }
+  clearInterpretations() {
+    this.clearActiveInterpretation();
+    this.currentVisualizationId = null;
+    this.currentType = null;
+    this.interpretations.clear();
+  }
+  resetInterpretations(newInterpretations) {
+    this.interpretations.clear();
+    for (const interpretation of newInterpretations) {
+      this.interpretations.set(interpretation.id, interpretation);
+    }
+  }
+  async fetchInterpretationDetails(id) {
+    const result = await this.query({
+      interpretation: {
+        resource: 'interpretations',
+        id,
+        params: {
+          fields: ['access[write,manage]', 'comments[id,text,created,createdBy[id,displayName]]', 'created', 'createdBy[id,displayName]', 'id', 'likedBy', 'likes', 'text']
+        }
+      }
+    });
+    return result.interpretation;
+  }
+  async fetchInterpretationsList() {
+    if (!this.currentType || !this.currentVisualizationId) {
+      throw new Error('Called fetchInterpretationsList before currentType or currentVisualizationId was set');
+    }
+    const result = await this.query({
+      interpretations: {
+        resource: 'interpretations',
+        params: {
+          fields: ['access[write,manage]', 'comments[id]', 'created', 'createdBy[id,displayName]', 'id', 'likedBy[id]', 'likes', 'text'],
+          filter: `${this.currentType}.id:eq:${this.currentVisualizationId}`,
+          paging: false
+        }
+      }
+    });
+    return result.interpretations.interpretations;
+  }
+  async loadActiveInterpretation(id) {
+    const interpretation = await this.fetchInterpretationDetails(id);
+    this.interpretations.set(id, interpretation);
+    this.activeInterpretationId = id;
+    return this.getActiveInterpretation();
+  }
+  async loadInterpretationsForVisualization(type, id) {
+    this.currentType = type;
+    this.currentVisualizationId = id;
+    const interpretations = await this.fetchInterpretationsList();
+    this.resetInterpretations(interpretations);
+    return (0, _groupInterpretationIdsByDate.groupInterpretationIdsByDate)(interpretations);
+  }
+  async createInterpretation({
+    type,
+    id,
+    text,
+    onComplete
+  }) {
+    await this.mutate({
+      resource: `interpretations/${type}/${id}`,
+      type: 'create',
+      data: text
+    }, {
+      onComplete
+    });
+    /* since the create request does not return an ID we must refetch the list
+     * and cannot return the created interpretation */
+    const interpretations = await this.fetchInterpretationsList();
+    this.resetInterpretations(interpretations);
+    this.notifyInterpretationsListObserver();
+    return null;
+  }
+  async deleteInterpretation({
+    id,
+    onComplete,
+    onError
+  }) {
+    await this.mutate({
+      resource: 'interpretations',
+      id,
+      type: 'delete'
+    }, {
+      onComplete,
+      onError
+    });
+    // This happens when deleting the interpretation from the modal
+    if (this.activeInterpretationId && id === this.activeInterpretationId) {
+      this.clearActiveInterpretation();
+    }
+    this.interpretations.delete(id);
+    this.notifyInterpretationsListObserver();
+    return null;
+  }
+  async updateInterpretationText({
+    id,
+    text,
+    onComplete,
+    onError
+  }) {
+    await this.mutate({
+      resource: 'interpretations',
+      type: 'update',
+      partial: false,
+      id,
+      data: text
+    }, {
+      onComplete,
+      onError
+    });
+    const updatedInterpretation = {
+      ...this.getInterpretation(id),
+      text
+    };
+    this.interpretations.set(id, updatedInterpretation);
+    this.notifyInterpretationObservers(id);
+    return updatedInterpretation;
+  }
+  async toggleInterpretationLike(id) {
+    const interpretation = this.getInterpretation(id);
+    const wasLikedByCurrentUser = interpretation.likedBy.some(likedBy => likedBy.id === this.currentUser.id);
+    await this.mutate({
+      resource: `interpretations/${id}/like`,
+      type: wasLikedByCurrentUser ? 'delete' : 'create'
+    });
+    const isLikedByCurrentUser = !wasLikedByCurrentUser;
+    const updatedInterpretation = {
+      ...interpretation,
+      likedBy: isLikedByCurrentUser ? interpretation.likedBy.concat({
+        id: this.currentUser.id
+      }) : interpretation.likedBy.filter(lb => lb.id !== this.currentUser.id),
+      likes: isLikedByCurrentUser ? interpretation.likes + 1 : interpretation.likes - 1
+    };
+    this.interpretations.set(id, updatedInterpretation);
+    this.notifyInterpretationObservers(id);
+    return updatedInterpretation;
+  }
+  async addCommentToActiveInterpretation({
+    text,
+    onComplete
+  }) {
+    const {
+      id
+    } = this.getActiveInterpretation();
+    await this.mutate({
+      resource: `interpretations/${id}/comments`,
+      type: 'create',
+      data: text
+    }, {
+      onComplete
+    });
+    const interpretation = await this.fetchInterpretationDetails(id);
+    this.interpretations.set(id, interpretation);
+    this.notifyInterpretationObservers(id);
+    return interpretation;
+  }
+  async deleteCommentFromActiveInterpretation({
+    id
+  }) {
+    const activeInterpretation = this.getActiveInterpretation();
+    await this.mutate({
+      resource: `interpretations/${activeInterpretation.id}/comments/${id}`,
+      type: 'delete'
+    });
+    const updatedInterpretation = {
+      ...activeInterpretation,
+      comments: activeInterpretation.comments.filter(({
+        id: commentId
+      }) => commentId !== id)
+    };
+    this.interpretations.set(activeInterpretation.id, updatedInterpretation);
+    this.notifyInterpretationObservers(activeInterpretation.id);
+    return updatedInterpretation;
+  }
+  async updateCommentForActiveInterpretation({
+    id,
+    text,
+    onComplete
+  }) {
+    const activeInterpretation = this.getActiveInterpretation();
+    this.mutate({
+      resource: `interpretations/${activeInterpretation.id}/comments/${id}`,
+      type: 'update',
+      partial: false,
+      data: text
+    }, {
+      onComplete: () => onComplete(text)
+    });
+    const updatedInterpretation = {
+      ...activeInterpretation,
+      comments: activeInterpretation.comments.map(comment => comment.id === id ? {
+        ...comment,
+        text
+      } : comment)
+    };
+    this.interpretations.set(activeInterpretation.id, updatedInterpretation);
+    return updatedInterpretation;
+  }
+}
+exports.InterpretationsManager = InterpretationsManager;

package/build/cjs/components/Interpretations/InterpretationsProvider/InterpretationsProvider.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InterpretationsProvider = exports.InterpretationsContext = void 0;
+var _appRuntime = require("@dhis2/app-runtime");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
+var _InterpretationsManager = require("./InterpretationsManager.js");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const InterpretationsContext = exports.InterpretationsContext = /*#__PURE__*/(0, _react.createContext)(null);
+const InterpretationsProvider = ({
+  currentUser,
+  children
+}) => {
+  const dataEngine = (0, _appRuntime.useDataEngine)();
+  const [interpretationsManager] = (0, _react.useState)(() => new _InterpretationsManager.InterpretationsManager(dataEngine, currentUser));
+  return /*#__PURE__*/_react.default.createElement(InterpretationsContext.Provider, {
+    value: interpretationsManager
+  }, children);
+};
+exports.InterpretationsProvider = InterpretationsProvider;
+InterpretationsProvider.propTypes = {
+  children: _propTypes.default.node,
+  currentUser: _propTypes.default.object
+};

package/build/cjs/components/Interpretations/InterpretationsProvider/__tests__/groupInterpretationIdsByDate.spec.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _groupInterpretationIdsByDate = require("../groupInterpretationIdsByDate.js");
+describe('groupInterpretationIdsByDate', () => {
+  it('should group interpretations by date and sort them correctly', () => {
+    const interpretations = [{
+      id: 'id1',
+      created: '2025-09-04T07:47:12.477'
+    }, {
+      id: 'id2',
+      created: '2025-09-04T15:30:45.123'
+    }, {
+      id: 'id3',
+      created: '2025-09-03T10:20:30.456'
+    }, {
+      id: 'id4',
+      created: '2025-09-05T09:15:22.789'
+    }, {
+      id: 'id5',
+      created: '2025-09-03T18:45:15.012'
+    }];
+    const result = (0, _groupInterpretationIdsByDate.groupInterpretationIdsByDate)(interpretations);
+
+    // Check that dates are grouped correctly
+    expect(Object.keys(result)).toEqual(['2025-09-05', '2025-09-04', '2025-09-03']);
+
+    // Check that within each date group, items are sorted from most recent to oldest
+    expect(result['2025-09-04']).toEqual(['id2', 'id1']); // 15:30 before 07:47
+    expect(result['2025-09-03']).toEqual(['id5', 'id3']); // 18:45 before 10:20
+    expect(result['2025-09-05']).toEqual(['id4']);
+  });
+  it('should handle empty array', () => {
+    const interpretations = [];
+    const result = (0, _groupInterpretationIdsByDate.groupInterpretationIdsByDate)(interpretations);
+    expect(result).toEqual({});
+  });
+});