clay-server 5.2.0-beta.1 → 5.2.0-beta.11

package/lib/public/modules/project-chat-identity.js

@@ -4,6 +4,9 @@ import { store } from './store.js';
 import { mateAvatarUrl } from './avatar.js';
 import { VENDOR_AVATARS, VENDOR_NAMES } from './chat-render-runtime.js';
 
+// A missing or failed profile image must never borrow another speaker's identity.
+var NEUTRAL_AVATAR = 'data:image/svg+xml,' + encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><rect width="32" height="32" rx="8" fill="#888" fill-opacity=".14"/><circle cx="16" cy="12" r="5" fill="#888"/><path d="M6 29a10 10 0 0 1 20 0" fill="#888"/></svg>');
+
 function mateById(state, mateId) {
   var mates = state.cachedMatesList || [];
   for (var i = 0; i < mates.length; i++) {
@@ -24,12 +27,11 @@ export function resolveProjectAssistantIdentity(state, vendor) {
   if (mateId) {
     var mate = mateById(state, mateId) || dmTarget;
     var fallbackName = dmTarget && dmTarget.displayName || state.activeSessionMateName || 'Mate';
-    var avatarMate = mate || { id: mateId, name: fallbackName, profile: { displayName: fallbackName } };
     return {
       kind: 'mate',
       mateId: mateId,
       name: mateName(mate, fallbackName),
-      avatarUrl: mateAvatarUrl(avatarMate, 34),
+      avatarUrl: mate ? mateAvatarUrl(mate, 34) : NEUTRAL_AVATAR,
     };
   }
   var vendorId = vendor || state.currentVendor || 'claude';
@@ -47,9 +49,16 @@ export function getProjectAssistantPlaceholder(state, vendor) {
 
 export function applyProjectAssistantIdentity(element, identity) {
   if (!element || !identity) return element;
-  var avatar = element.querySelector('.dm-bubble-avatar');
+  var avatar = element.querySelector('.dm-bubble-avatar') || element.querySelector('.activity-inline-avatar');
   var name = element.querySelector('.dm-bubble-name');
-  if (avatar) avatar.src = identity.avatarUrl;
+  if (avatar) {
+    avatar.onerror = identity.kind === 'mate' ? function () { avatar.onerror = null; avatar.src = NEUTRAL_AVATAR; } : null;
+    avatar.src = identity.avatarUrl;
+  }
+  if (element.className.indexOf('activity-inline') >= 0) {
+    var activityLabel = element.querySelector('.activity-state-label');
+    element.setAttribute('aria-label', identity.name + ' · ' + (activityLabel ? activityLabel.textContent : 'Responding'));
+  }
   if (name) name.textContent = identity.name;
   if (identity.kind === 'mate') {
     element.dataset.sessionMateId = identity.mateId;

package/lib/public/modules/project-logs-render.js

@@ -1,3 +1,4 @@
+import { store } from './store.js';
 // Project Logs rendering — ledger rows, entry detail, and discussion.
 //
 // Split from project-logs.js so both stay well inside the module size limit.
@@ -142,6 +143,8 @@ function renderRow(entry, onOpen) {
   row.type = "button";
   row.className = "project-log-row";
   row.dataset.ref = entry.ref;
+  row.dataset.controlRuntime = store.get("controlRuntimeId") || "";
+  row.dataset.controlRevision = String(entry.revisions);
   row.setAttribute("role", "listitem");
 
   var head = document.createElement("div");

package/lib/public/modules/project-mate-creation-workspace.js

@@ -81,6 +81,9 @@ function startMateCreation() {
   maybeStartPendingCreation();
 }
 
+// Entry for the zero-project welcome: the same Clay-guided flow the add button's Mate choice runs.
+export function startClayMateCreation() { startMateCreation(); }
+
 function maybeStartPendingCreation() {
   var state = store.snap();
   if (!state.projectMateCreationPendingStart || !state.connected || state.activeProjectSlug !== 'mate-' + state.projectMateCreationMateId) return;
@@ -89,11 +92,17 @@ function maybeStartPendingCreation() {
   store.set({ projectMateCreationPendingStart: false, projectMateCreationAwaitingHistory: true, projectMateCreationRequestId: requestId });
 }
 
-function choiceButton(icon, title, description) {
+function choiceButton(artwork, title, description) {
   var button = document.createElement('button');
   button.type = 'button';
   button.className = 'project-create-choice-option';
-  button.innerHTML = iconHtml(icon);
+  var image = document.createElement('img');
+  image.src = '/welcome-art/' + artwork + '.png';
+  image.alt = '';
+  image.width = 1536;
+  image.height = 1024;
+  image.decoding = 'async';
+  button.appendChild(image);
   var copy = document.createElement('span');
   var heading = document.createElement('strong');
   heading.textContent = title;
@@ -121,9 +130,9 @@ export function openProjectCreateChoice(opener, openProject) {
   var title = document.createElement('h2');
   title.id = 'project-create-choice-title';
   title.textContent = 'What would you like to add?';
-  var mate = choiceButton('users', 'Mate', 'Shape a new collaborator with Clay');
+  var mate = choiceButton('mate-clay', 'Create a Mate', 'A specialist to work alongside you.');
   mate.addEventListener('click', startMateCreation);
-  var project = choiceButton('folder-plus', 'Project', 'Add a local workspace');
+  var project = choiceButton('project-clay', 'Start a project', 'Work on code or files together.');
   project.addEventListener('click', function () {
     closeChoice(false);
     openProject();

package/lib/public/modules/project-mate-navigation.js

@@ -1,3 +1,6 @@
+import { contextualMateStamp, contextualMate } from './contextual-mate-identity.js';
+import { finishContextualWorkspace } from './contextual-clay-workspace.js';
+import { initContextualClay, cycleContextualClay, contextualClayMode } from './contextual-clay.js';
 // Existing Mates share the project rail while retaining their conversations.
 import { store } from './store.js';
 import { applyWorkspaceColor } from './mate-workspace-color.js';
@@ -8,6 +11,9 @@ import { switchProject } from './app-projects.js';
 import { closeTerminal } from './terminal.js';
 import { closeFileViewer } from './filebrowser.js';
 import { getActiveMentionMateIds, onMentionActiveChange, bindIconTooltip, hideIconTooltip, showMateCtxMenu } from './sidebar-mates.js';
+import { chooseProjectActivationTarget } from './project-activation.js';
+import { showProjectsHub } from './projects-hub.js';
+import { openProjectSession } from './project-session-navigation.js';
 
 var FILTER_MODES = ['all', 'projects', 'mates'];
 var FILTER_LABELS = { all: 'All', projects: 'Projects', mates: 'Mates' };
@@ -98,14 +104,109 @@ function renderMateHeaderDefault(state) {
   renderMateProjectHeader(state, mate);
 }
 
-export function openMateWorkspace(mateId) {
+function ordinaryProjects(state) {
+  return (state.projectsHubList || []).filter(function (project) {
+    return project && project.slug && project.isMate !== true && project.contentAccess !== false;
+  });
+}
+
+function clayIsActive(state, clay) {
+  return !!clay && !state.homeShellVisible && !state.dmMode && state.currentSlug === 'mate-' + clay.id;
+}
+
+export function clayReturnTargetForState(state) {
+  var target = state && state.clayReturnTarget;
+  var recordedSlug = target && target.projectSlug;
+  var candidates = recordedSlug ? [recordedSlug] : [];
+  var slug = chooseProjectActivationTarget(ordinaryProjects(state), candidates);
+  if (!slug) return null;
+  var sameProject = slug === recordedSlug;
+  return {
+    projectSlug: slug,
+    sessionId: sameProject && target && Number.isSafeInteger(Number(target.sessionId)) && Number(target.sessionId) > 0 ? Number(target.sessionId) : null,
+  };
+}
+
+export function rememberClayReturnTarget(state) {
+  if (!state || state.homeShellVisible || state.dmMode || isMateWorkspace(state) || !state.currentSlug ||
+      state.activeProjectSlug !== state.currentSlug || state.sessionActivatedProjectSlug !== state.currentSlug) return;
+  var projects = ordinaryProjects(state);
+  var found = projects.some(function (project) { return project.slug === state.currentSlug; });
+  if (!found) return;
+  var target = { projectSlug: state.currentSlug, sessionId: Number.isSafeInteger(Number(state.activeSessionId)) && Number(state.activeSessionId) > 0 ? Number(state.activeSessionId) : null };
+  store.set({ clayReturnTarget: target });
+  return target;
+}
+
+export function returnFromClay() {
+  var handoff = store.get('contextualWorkspace');
+  var originalMate = handoff && handoff.returnSlug && handoff.returnSlug.indexOf('mate-') === 0 && contextualMate(handoff.returnSlug.slice(5));
+  if (finishContextualWorkspace() === false) return false;
+  var state = store.snap();
+  var target = originalMate ? { projectSlug: handoff.returnSlug, sessionId: handoff.returnSessionId } : clayReturnTargetForState(state);
+  if (!target) {
+    store.set({ pendingProjectSessionNavigation: null, clayReturnPendingProjectSlug: null, clayReturnTarget: null });
+    showProjectsHub();
+    return false;
+  }
+  store.set({ clayReturnTarget: originalMate ? state.clayReturnTarget : null, clayReturnPendingProjectSlug: target.sessionId ? target.projectSlug : null });
+  if (target.sessionId) openProjectSession(target.projectSlug, target.sessionId);
+  else {
+    store.set({ pendingProjectSessionNavigation: null });
+    switchProject(target.projectSlug);
+  }
+  return true;
+}
+
+function updateClayBrand(state) {
+  var entry = document.querySelector('.icon-strip-brand');
+  if (!entry) return;
+  var clay = navigationMates(state.cachedMatesList).find(function (mate) { return mate.builtinKey === 'clay'; });
+  var ownPopover = (state.contextualClay || {}).mateId === (clay && clay.id) && contextualClayMode() !== 'closed';
+  var active = clayIsActive(state, clay) || ownPopover;
+  var speaking = !!(state.youActivity && state.youActivity.active);
+  entry.dataset.clayMode = active ? 'mate' : 'project';
+  entry.classList.toggle('clay-speaking', speaking);
+  var avatar = entry.querySelector('.clay-brand-avatar');
+  var logo = entry.querySelector('.clay-brand-logo');
+  if (avatar && clay) avatar.src = mateAvatarUrl(clay, 38);
+  if (logo) logo.src = 'clay-studio-symbol.png';
+  entry.disabled = !clay;
+  entry.classList.toggle('active', active);
+  entry.setAttribute('aria-label', clay ? (ownPopover && contextualClayMode() === 'popover' ? 'Open Clay workspace' : active ? 'Return to project' : 'Open Clay') : 'Clay is unavailable');
+  entry.setAttribute('aria-expanded', String(ownPopover));
+  entry.setAttribute('aria-controls', 'contextual-clay');
+  if (clayIsActive(state, clay)) entry.setAttribute('aria-current', 'page');
+  else entry.removeAttribute('aria-current');
+}
+
+export function openMateWorkspace(mateId, sessionId) {
   var mate = navigationMates(store.get('cachedMatesList')).find(function (item) { return item.id === mateId; });
-  if (!mate) return;
+  if (!mate || !contextualMate(mateId)) return;
+  if (mate.builtinKey === 'clay' && store.snap) rememberClayReturnTarget(store.snap());
   if (store.get('currentSlug') !== 'mate-' + mateId) {
     closeTerminal();
     closeFileViewer();
   }
-  switchProject('mate-' + mateId);
+  if (Number.isSafeInteger(sessionId) && sessionId > 0) openProjectSession('mate-' + mateId, sessionId);
+  else switchProject('mate-' + mateId);
+}
+
+export function activateContextualMate(mateId) {
+  var mate = contextualMate(mateId);
+  if (!mate) return;
+  var handoff = store.get('contextualWorkspace');
+  if (handoff && handoff.stage !== 'returning') {
+    if (handoff.stage !== 'workspace') return;
+    var popup = store.get('contextualClay') || {};
+    var otherSession = popup.mode === 'popover' && popup.mateId === mateId && popup.sessionId && popup.sessionId !== handoff.sessionId;
+    if (handoff.slug === 'mate-' + mateId && !otherSession && !(popup.mode === 'popover' && popup.mateId === mateId)) return returnFromClay();
+    cycleContextualClay(mate);
+    return;
+  }
+  if (handoff) { store.set({ contextualMatePending: mateId }); return; }
+  rememberClayReturnTarget(store.snap());
+  cycleContextualClay(mate);
 }
 
 function createMateIcon(mateId) {
@@ -116,9 +217,10 @@ function createMateIcon(mateId) {
   button.innerHTML = '<img class="icon-strip-mate-avatar" alt="" draggable="false"><span class="icon-strip-pill"></span><span class="icon-strip-status"></span><span class="icon-strip-project-badge"></span>';
   button.addEventListener('click', function () {
     hideIconTooltip();
-    openMateWorkspace(mateId);
+    activateContextualMate(mateId);
   });
   bindIconTooltip(button, function () {
+    if ((store.get('contextualClay') || {}).mode === 'popover' && (store.get('contextualClay') || {}).mateId === mateId) return { text: '' };
     var mate = navigationMates(store.get('cachedMatesList')).find(function (item) { return item.id === mateId; });
     return {
       text: mate ? getHomeMateName(mate) : 'Mate',
@@ -126,10 +228,14 @@ function createMateIcon(mateId) {
       avatarUrl: mate ? mateAvatarUrl(mate, 24) : '',
     };
   });
-  button.addEventListener('contextmenu', function (event) {
-    event.preventDefault();
+  function openContextMenu(event) {
+    event.preventDefault(); event.stopPropagation(); hideIconTooltip();
     var mate = navigationMates(store.get('cachedMatesList')).find(function (item) { return item.id === mateId; });
     if (mate) showMateCtxMenu(button, mate);
+  }
+  button.addEventListener('contextmenu', openContextMenu);
+  button.addEventListener('keydown', function (event) {
+    if (event.key === 'ContextMenu' || (event.shiftKey && event.key === 'F10')) openContextMenu(event);
   });
   return button;
 }
@@ -142,33 +248,30 @@ export function renderProjectMates() {
   var clay = navigationMates(state.cachedMatesList).find(function (mate) { return mate.builtinKey === 'clay'; });
   var clayActive = !!clay && !state.homeShellVisible && !state.dmMode && state.currentSlug === 'mate-' + clay.id;
   document.body.classList.toggle('clay-workspace-active', clayActive);
-  var clayEntry = document.querySelector('.icon-strip-brand');
-  if (clayEntry) {
-    clayEntry.disabled = !clay;
-    clayEntry.classList.toggle('active', clayActive);
-    clayEntry.setAttribute('aria-label', clay ? 'Open Clay' : 'Clay is unavailable');
-    if (clayActive) clayEntry.setAttribute('aria-current', 'page');
-    else clayEntry.removeAttribute('aria-current');
-  }
+  updateClayBrand(state);
   document.body.classList.toggle('mate-workspace-active', !state.homeShellVisible && isMateWorkspace(state));
   applyWorkspaceColor(mateForWorkspace(state));
   renderMateHeaderDefault(state);
   var mates = navigationMates(state.cachedMatesList).filter(function (mate) {
-    return mate.builtinKey !== 'clay';
+    return mate.builtinKey !== 'clay' && contextualMate(mate.id);
   });
   var mentionActive = getActiveMentionMateIds();
   var projects = state.projectsHubList || [];
   var unread = state.dmUnread || {};
   var icons = {};
-  rail.querySelectorAll('[data-mate-id]').forEach(function (button) { icons[button.dataset.mateId] = button; });
+  document.querySelectorAll('.icon-strip-project-mate[data-mate-id]').forEach(function (button) { icons[button.dataset.mateId] = button; });
   mates.forEach(function (mate) {
     var button = icons[mate.id] || createMateIcon(mate.id);
     delete icons[mate.id];
+    button.dataset.controlMateStamp = contextualMateStamp(mate);
     var active = !state.homeShellVisible && !state.dmMode && state.currentSlug === 'mate-' + mate.id;
     var project = projects.find(function (item) { return item.slug === 'mate-' + mate.id; });
     var busy = !!(project && project.isProcessing) || !!mentionActive[mate.id];
     var count = active ? 0 : (unread[mate.id] || 0);
-    button.classList.toggle('active', !!active);
+    var popover = (state.contextualClay || {}).mateId === mate.id && contextualClayMode() === 'popover';
+    button.classList.toggle('active', !!active || popover);
+    button.setAttribute('aria-expanded', String(popover));
+    button.setAttribute('aria-controls', 'contextual-clay');
     button.setAttribute('aria-label', getHomeMateName(mate) + ', Mate' + (busy ? ', working' : '') + (count ? ', ' + count + ' unread' : ''));
     if (active) button.setAttribute('aria-current', 'page');
     else button.removeAttribute('aria-current');
@@ -186,6 +289,7 @@ export function renderProjectMates() {
   Object.keys(icons).forEach(function (id) { icons[id].remove(); });
   var ordered = Array.from(rail.querySelectorAll('[data-mate-id]'));
   mates.forEach(function (mate, index) {
+    if (document.querySelector('.contextual-mate-mobile-trigger[data-mate-id="' + CSS.escape(mate.id) + '"]')) return;
     var button = ordered.find(function (item) { return item.dataset.mateId === mate.id; });
     if (ordered[index] === button) return;
     rail.insertBefore(button, ordered[index] || null);
@@ -213,22 +317,40 @@ export function renderProjectMates() {
 }
 
 export function initProjectMateNavigation() {
+  initContextualClay();
   var clayEntry = document.querySelector('.icon-strip-brand');
   if (clayEntry) {
-    clayEntry.addEventListener('click', function () {
-      var clay = navigationMates(store.get('cachedMatesList')).find(function (mate) { return mate.builtinKey === 'clay'; });
+    clayEntry.addEventListener('click', function (event) {
+      var state = store.snap();
+      var clay = navigationMates(state.cachedMatesList).find(function (mate) { return mate.builtinKey === 'clay'; });
       hideIconTooltip();
-      if (clay) openMateWorkspace(clay.id);
+      if (!clay) return;
+      var popup = state.contextualClay || {};
+      if (clayIsActive(state, clay) && !(popup.mode === 'popover' && popup.mateId === clay.id)) returnFromClay();
+      else {
+        activateContextualMate(clay.id);
+      }
+    });
+    bindIconTooltip(clayEntry, function () {
+      var state = store.snap();
+      var clay = navigationMates(state.cachedMatesList).find(function (mate) { return mate.builtinKey === 'clay'; });
+      if ((state.contextualClay || {}).mateId === (clay && clay.id) && contextualClayMode() === 'popover') return { text: '' };
+      return { text: (state.contextualClay || {}).mateId === (clay && clay.id) && contextualClayMode() === 'popover' ? 'Open Clay workspace' : clayIsActive(state, clay) ? 'Return to project' : 'Open Clay', kind: 'mate', avatarUrl: 'clay-studio-symbol.png' };
     });
-    bindIconTooltip(clayEntry, { text: 'Clay', kind: 'mate', avatarUrl: 'clay-studio-symbol.png' });
   }
   var knob = document.getElementById('icon-strip-filter-knob');
   if (knob) knob.addEventListener('click', activateProjectMateFilter);
   store.subscribe(function (state, previous) {
+    if (state.clayReturnPendingProjectSlug && state.currentSlug !== previous.currentSlug &&
+        state.currentSlug !== state.clayReturnPendingProjectSlug) {
+      store.set({ pendingProjectSessionNavigation: null, clayReturnPendingProjectSlug: null });
+    } else if (state.clayReturnPendingProjectSlug && !state.pendingProjectSessionNavigation && previous.pendingProjectSessionNavigation) {
+      store.set({ clayReturnPendingProjectSlug: null });
+    }
     if (state.cachedMatesList !== previous.cachedMatesList || state.homeChatMateId !== previous.homeChatMateId ||
         state.homeShellVisible !== previous.homeShellVisible || state.projectsHubList !== previous.projectsHubList ||
         state.dmUnread !== previous.dmUnread || state.currentSlug !== previous.currentSlug ||
-        state.dmMode !== previous.dmMode || state.connected !== previous.connected) renderProjectMates();
+        state.contextualClay !== previous.contextualClay || state.dmMode !== previous.dmMode || state.connected !== previous.connected || state.activeSessionId !== previous.activeSessionId || state.youActivity !== previous.youActivity) renderProjectMates();
     if (state.projectMateFilterMode !== previous.projectMateFilterMode ||
         state.projectMateFilterTurns !== previous.projectMateFilterTurns) applyProjectMateFilter();
   });

package/lib/public/modules/project-session-visibility-settings.js

@@ -27,12 +27,10 @@ function setSelectState(select, value, disabled) {
   select.disabled = !!disabled;
 }
 
-function isCurrentProject(active) {
-  return !!(active && active.slug && active.slug === store.get('currentSlug'));
-}
-
+// Editable for any authorised selected project: the server re-authorises the
+// exact slug (owner, permission, access, worktree) and echoes it back.
 function isReadOnly(active) {
-  return !active || !active.authorized || active.isWorktree || !isCurrentProject(active);
+  return !active || !active.authorized || active.isWorktree;
 }
 
 function renderActiveState() {
@@ -40,23 +38,26 @@ function renderActiveState() {
   var pending = pendingState();
   var select = selectElement();
   var inheritedHint = document.getElementById("ps-session-visibility-default-inherited-hint");
-  var nonCurrentHint = document.getElementById("ps-session-visibility-default-non-current-hint");
   if (inheritedHint) inheritedHint.classList.toggle("hidden", !(active && active.isWorktree));
-  if (nonCurrentHint) nonCurrentHint.classList.toggle("hidden", !(active && active.authorized && !active.isWorktree && !isCurrentProject(active)));
   if (!select || !active) return;
-  setSelectState(select, active.effectiveValue, isReadOnly(active) || !!(pending && pending.slug === active.slug));
+  // One request at a time: a pending change for any project holds the control.
+  setSelectState(select, active.effectiveValue, isReadOnly(active) || !!pending);
 }
 
-function isAuthorized(project) {
+// The server requires the project owner plus the projectSettings permission.
+// An administrator who is not the owner may see the value but not change it.
+function visibilityAccess(project) {
   var users = store.get('cachedAllUsers') || [];
   var userId = store.get('myUserId');
   var currentUser = null;
   for (var i = 0; i < users.length; i++) {
     if (users[i].id === userId) { currentUser = users[i]; break; }
   }
-  return !!(store.get('isMultiUserMode') && project &&
-    ((project.projectOwnerId && project.projectOwnerId === userId) || (currentUser && currentUser.role === "admin")) &&
-    (!store.get('permissions') || store.get('permissions').projectSettings !== false));
+  var permitted = !store.get('permissions') || store.get('permissions').projectSettings !== false;
+  var owner = !!(project && project.projectOwnerId && project.projectOwnerId === userId);
+  var admin = !!(currentUser && currentUser.role === "admin");
+  var multi = !!(store.get('isMultiUserMode') && project && permitted);
+  return { visible: multi && (owner || admin), editable: multi && owner };
 }
 
 export function initProjectSessionVisibilitySettings() {
@@ -80,7 +81,6 @@ export function initProjectSessionVisibilitySettings() {
   });
 
   store.subscribe(function (state, previous) {
-    if (state.currentSlug !== previous.currentSlug) renderActiveState();
     if (state.connected || previous.connected !== true) return;
     var pending = pendingState();
     if (!pending) return;
@@ -95,10 +95,13 @@ export function initProjectSessionVisibilitySettings() {
 export function populateProjectSessionVisibilitySettings(slug, project) {
   var field = document.getElementById("ps-session-visibility-default-field");
   var select = selectElement();
-  if (field) field.style.display = isAuthorized(project) ? "" : "none";
+  var access = visibilityAccess(project);
+  if (field) field.style.display = access.visible ? "" : "none";
+  var ownerHint = document.getElementById("ps-session-visibility-default-owner-hint");
+  if (ownerHint) ownerHint.classList.toggle("hidden", !(access.visible && !access.editable));
   if (!select) return;
   var value = project && project.sessionVisibilityDefault === "shared" ? "shared" : "private";
-  var active = { slug: slug || "", effectiveValue: value, isWorktree: !!(project && project.isWorktree), authorized: isAuthorized(project) };
+  var active = { slug: slug || "", effectiveValue: value, isWorktree: !!(project && project.isWorktree), authorized: access.editable };
   var pending = pendingState();
   setVisibilityState(active, pending);
   renderActiveState();
@@ -124,7 +127,7 @@ export function handleProjectSessionVisibilityDefault(msg) {
   var active = activeState();
   setVisibilityState(active, null);
   var select = selectElement();
-  if (!select || !active || active.slug !== msg.slug) return;
+  if (!select || !active || active.slug !== msg.slug) { renderActiveState(); return; }
   if (!msg.ok) {
     active = Object.assign({}, active, { effectiveValue: pending.previous });
     setVisibilityState(active, null);