@searpent/react-image-annotate 2.3.5 → 2.3.6

package/Annotator/index.js

@@ -85,7 +85,8 @@ export var Annotator = function Annotator(_ref) {
       save = _ref$save === void 0 ? function () {} : _ref$save,
       _ref$fetchImage = _ref.fetchImage,
       fetchImage = _ref$fetchImage === void 0 ? function () {} : _ref$fetchImage,
-      updatedBy = _ref.updatedBy;
+      updatedBy = _ref.updatedBy,
+      mediaPresenterLeaseUntil = _ref.mediaPresenterLeaseUntil;
 
   if (typeof selectedImage === "string") {
     selectedImage = (images || []).findIndex(function (img) {
@@ -447,7 +448,8 @@ export var Annotator = function Annotator(_ref) {
       onMetadataChange: handleMetadataChange,
       onAddGroup: handleAddGroup,
       onRecalcClick: handleRecalcClicked,
-      updatedBy: updatedBy
+      updatedBy: updatedBy,
+      mediaPresenterLeaseUntil: mediaPresenterLeaseUntil
     }))
   );
 };

package/MainLayout/index.js

@@ -134,7 +134,8 @@ export var MainLayout = function MainLayout(_ref5) {
       onMetadataChange = _ref5.onMetadataChange,
       onAddGroup = _ref5.onAddGroup,
       onRecalcClick = _ref5.onRecalcClick,
-      updatedBy = _ref5.updatedBy;
+      updatedBy = _ref5.updatedBy,
+      mediaPresenterLeaseUntil = _ref5.mediaPresenterLeaseUntil;
   var classes = useStyles();
   var settings = useSettings();
   var fullScreenHandle = useFullScreenHandle();
@@ -377,7 +378,8 @@ export var MainLayout = function MainLayout(_ref5) {
       onMetadataChange: onMetadataChange,
       metadataConfigs: state.metadataConfigs || [],
       onRecalcClick: onRecalcClick,
-      updatedBy: updatedBy
+      updatedBy: updatedBy,
+      mediaPresenterLeaseUntil: mediaPresenterLeaseUntil
     }),
     /*#__PURE__*/
     React.createElement(WorkspaceWrapper, null,

package/PageSelector/UpdatedBySemaphore.js

@@ -1,29 +1,74 @@
-import React from "react";
-import classnames from "classnames";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useEffect, useMemo, useState } from "react";
 export function isUpdatedByAggregator(updatedBy) {
   if (updatedBy == null) return false;
   return String(updatedBy).trim() === "AGGREGATOR";
 }
+/** Non-empty lease string or null (treat undefined / "" / whitespace as no lock). */
+
+export function normalizeMediaPresenterLeaseUntil(raw) {
+  if (raw == null) return null;
+  var s = String(raw).trim();
+  return s === "" ? null : s;
+}
+/**
+ * True when Dynamo `mediaPresenterLeaseUntil` (ISO UTC string) is still in the future.
+ * Matches the media-presenter webhook lease written by BasicLinkingFunction.
+ */
+
+export function isMediaPresenterLockActive(mediaPresenterLeaseUntil) {
+  var s = normalizeMediaPresenterLeaseUntil(mediaPresenterLeaseUntil);
+  if (s == null) return false;
+  var t = Date.parse(s);
+  if (Number.isNaN(t)) return false;
+  return t > Date.now();
+}
 /**
  * Case-level “UPDATED BY” indicator for the page strip (left panel).
- * Red (left) / green (right) discs, left-aligned with the page-strip switch column; “Ready” after them.
- * Green lit only when value is exactly AGGREGATOR.
+ * Red (left) / green (right) discs, left-aligned with the page-strip switch column; status label after them.
+ * Green lit only when `updatedBy` is exactly AGGREGATOR and the media-presenter Dynamo lease is not active.
  * `selectionKey` should change per selected page so the control remounts when paging.
  */
 
 export default function UpdatedBySemaphore(_ref) {
   var updatedBy = _ref.updatedBy,
+      mediaPresenterLeaseUntil = _ref.mediaPresenterLeaseUntil,
       selectionKey = _ref.selectionKey;
-  var green = isUpdatedByAggregator(updatedBy);
+  var leaseStr = useMemo(function () {
+    return normalizeMediaPresenterLeaseUntil(mediaPresenterLeaseUntil);
+  }, [mediaPresenterLeaseUntil]); // While a lease string is present, re-evaluate every second so expiry clears without a parent refetch.
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      setLeasePulse = _useState2[1];
+
+  useEffect(function () {
+    if (leaseStr == null) return undefined;
+    var id = window.setInterval(function () {
+      return setLeasePulse(function (n) {
+        return n + 1;
+      });
+    }, 1000);
+    return function () {
+      return window.clearInterval(id);
+    };
+  }, [leaseStr]);
+  var lockActive = isMediaPresenterLockActive(leaseStr);
+  var green = isUpdatedByAggregator(updatedBy) && !lockActive;
   var source = updatedBy == null || updatedBy === "" ? "—" : String(updatedBy);
+  var leaseHint = lockActive ? " Media presenter lock active (lease until ".concat(leaseStr, ").") : "";
+  var statusLabel = green ? "Ready" : "Do not modify";
+  var title = "Case last updated by: ".concat(source, ".").concat(leaseHint, " Status: ").concat(statusLabel, ". Green lamp: safe to modify (AGGREGATOR and no active media-presenter lease). Red lamp: do not modify (other updater and/or lock).");
+  var redClass = "ps-semaphore-lamp ps-semaphore-red" + (green ? "" : " ps-semaphore-lit");
+  var greenClass = "ps-semaphore-lamp ps-semaphore-green" + (green ? " ps-semaphore-lit" : "");
   return (
     /*#__PURE__*/
     React.createElement("div", {
-      key: selectionKey,
+      key: "".concat(selectionKey, "|").concat(leaseStr !== null && leaseStr !== void 0 ? leaseStr : ""),
       className: "ps-updated-by-semaphore",
-      title: "Case last updated by: ".concat(source, ". Green disc: AGGREGATOR \u2014 OK to start manual edits. Red disc: other source \u2014 review before editing."),
+      title: title,
       role: "img",
-      "aria-label": green ? "OK to start manual edits (AGGREGATOR)" : "Review before manual edits (not AGGREGATOR)"
+      "aria-label": statusLabel
     },
     /*#__PURE__*/
     React.createElement("span", {
@@ -36,19 +81,15 @@ export default function UpdatedBySemaphore(_ref) {
     },
     /*#__PURE__*/
     React.createElement("span", {
-      className: classnames("ps-semaphore-lamp", "ps-semaphore-red", {
-        "ps-semaphore-lit": !green
-      })
+      className: redClass
     }),
     /*#__PURE__*/
     React.createElement("span", {
-      className: classnames("ps-semaphore-lamp", "ps-semaphore-green", {
-        "ps-semaphore-lit": green
-      })
+      className: greenClass
     }))),
     /*#__PURE__*/
     React.createElement("span", {
       className: "ps-top-bar-label ps-updated-by-semaphore__label"
-    }, "Ready"))
+    }, statusLabel))
   );
 }

package/PageSelector/index.js

@@ -4,7 +4,7 @@ import classnames from "classnames";
 import './page-selector.css';
 import Locker from '../Locker';
 import Errorer from '../Errorer';
-import UpdatedBySemaphore from './UpdatedBySemaphore';
+import UpdatedBySemaphore, { normalizeMediaPresenterLeaseUntil } from './UpdatedBySemaphore';
 
 function PageThumbnail(_ref) {
   var _metadata$find, _metadata$find$call;
@@ -148,6 +148,12 @@ function isLocked(page) {
   return false;
 }
 
+function showUpdatedBySemaphore(updatedBy, mediaPresenterLeaseUntil) {
+  if (updatedBy !== undefined && updatedBy !== null) return true;
+  if (normalizeMediaPresenterLeaseUntil(mediaPresenterLeaseUntil) != null) return true;
+  return false;
+}
+
 function PageSelector(_ref3) {
   var _ref4, _ref5;
 
@@ -156,7 +162,8 @@ function PageSelector(_ref3) {
       onMetadataChange = _ref3.onMetadataChange,
       metadataConfigs = _ref3.metadataConfigs,
       onRecalcClick = _ref3.onRecalcClick,
-      updatedBy = _ref3.updatedBy;
+      updatedBy = _ref3.updatedBy,
+      mediaPresenterLeaseUntil = _ref3.mediaPresenterLeaseUntil;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -208,7 +215,7 @@ function PageSelector(_ref3) {
     /*#__PURE__*/
     React.createElement("label", {
       className: "ps-top-bar-label"
-    }, "Metadata")), updatedBy !== undefined && updatedBy !== null &&
+    }, "Metadata")), showUpdatedBySemaphore(updatedBy, mediaPresenterLeaseUntil) &&
     /*#__PURE__*/
     React.createElement("div", {
       className: "ps-semaphore-below-metadata"
@@ -216,6 +223,7 @@ function PageSelector(_ref3) {
     /*#__PURE__*/
     React.createElement(UpdatedBySemaphore, {
       updatedBy: updatedBy,
+      mediaPresenterLeaseUntil: mediaPresenterLeaseUntil,
       selectionKey: selectionKey
     })))),
     /*#__PURE__*/

package/PageSelector/page-selector.css

@@ -185,9 +185,9 @@
   flex-shrink: 0;
 }
 
-/* Inactive: still a faint tint of the lamp’s hue */
+/* Inactive lamps read as “off” (neutral); lit lamp pops. */
 .ps-semaphore-lamp:not(.ps-semaphore-lit) {
-  opacity: 0.72;
+  opacity: 0.88;
 }
 
 .ps-semaphore-lamp.ps-semaphore-lit {
@@ -195,13 +195,14 @@
   transform: scale(1.02);
 }
 
-/* Inactive red: soft rose / dusty red */
-.ps-semaphore-red {
-  background: linear-gradient(165deg, #f0d4d4 0%, #d9a8a8 45%, #c08080 100%);
-  border-color: rgba(180, 90, 90, 0.35);
+/* Off state: neutral gray so only the lit lamp reads as red/green (traffic-light style). */
+.ps-semaphore-red:not(.ps-semaphore-lit),
+.ps-semaphore-green:not(.ps-semaphore-lit) {
+  background: linear-gradient(165deg, #ececec 0%, #d4d4d4 45%, #bdbdbd 100%);
+  border-color: rgba(0, 0, 0, 0.12);
   box-shadow:
-    inset 0 2px 5px rgba(255, 255, 255, 0.35),
-    inset 0 -2px 6px rgba(160, 60, 60, 0.2);
+    inset 0 2px 4px rgba(255, 255, 255, 0.55),
+    inset 0 -2px 5px rgba(0, 0, 0, 0.1);
 }
 
 .ps-semaphore-red.ps-semaphore-lit {
@@ -212,15 +213,6 @@
     inset 0 -2px 5px rgba(0, 0, 0, 0.18);
 }
 
-/* Inactive green: soft mint / dusty green */
-.ps-semaphore-green {
-  background: linear-gradient(165deg, #dff2df 0%, #b8dcb8 45%, #92c592 100%);
-  border-color: rgba(80, 140, 80, 0.35);
-  box-shadow:
-    inset 0 2px 5px rgba(255, 255, 255, 0.4),
-    inset 0 -2px 6px rgba(60, 120, 60, 0.18);
-}
-
 .ps-semaphore-green.ps-semaphore-lit {
   background: linear-gradient(180deg, #b9f6ca 0%, #00e676 40%, #00c853 100%);
   border-color: rgba(200, 255, 220, 0.9);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@searpent/react-image-annotate",
-  "version": "2.3.5",
+  "version": "2.3.6",
   "dependencies": {
     "@editorjs/editorjs": "^2.25.0",
     "@editorjs/paragraph": "^2.8.0",