move isMutexAcquired to store

Author: philippotto

frontend/javascripts/viewer/default_state.ts

@@ -178,6 +178,7 @@ const defaultState: WebknossosState = {
     contributors: [],
     othersMayEdit: false,
     blockedByUser: null,
+    isMutexAcquired: false,
     annotationLayers: [],
     version: 0,
     earliestAccessibleVersion: 0,

frontend/javascripts/viewer/model/actions/annotation_actions.ts

@@ -52,6 +52,7 @@ export type EditAnnotationLayerAction = ReturnType<typeof editAnnotationLayerAct
 export type SetAnnotationDescriptionAction = ReturnType<typeof setAnnotationDescriptionAction>;
 type SetAnnotationAllowUpdateAction = ReturnType<typeof setAnnotationAllowUpdateAction>;
 type SetBlockedByUserAction = ReturnType<typeof setBlockedByUserAction>;
+export type SetIsMutexAcquiredAction = ReturnType<typeof setIsMutexAcquiredAction>;
 type SetUserBoundingBoxesAction = ReturnType<typeof setUserBoundingBoxesAction>;
 type FinishedResizingUserBoundingBoxAction = ReturnType<
   typeof finishedResizingUserBoundingBoxAction
@@ -87,6 +88,7 @@ export type AnnotationActionTypes =
   | SetAnnotationDescriptionAction
   | SetAnnotationAllowUpdateAction
   | SetBlockedByUserAction
+  | SetIsMutexAcquiredAction
   | SetUserBoundingBoxesAction
   | ChangeUserBoundingBoxAction
   | FinishedResizingUserBoundingBoxAction
@@ -176,6 +178,12 @@ export const setBlockedByUserAction = (blockedByUser: APIUserCompact | null | un
     blockedByUser,
   }) as const;
 
+export const setIsMutexAcquiredAction = (isMutexAcquired: boolean) =>
+  ({
+    type: "SET_IS_MUTEX_ACQUIRED",
+    isMutexAcquired,
+  }) as const;
+
 // Strictly speaking this is no annotation action but a tracing action, as the boundingBox is saved with
 // the tracing, hence no ANNOTATION in the action type.
 export const setUserBoundingBoxesAction = (userBoundingBoxes: Array<UserBoundingBox>) =>

frontend/javascripts/viewer/model/reducers/annotation_reducer.ts

@@ -137,6 +137,13 @@ function AnnotationReducer(state: WebknossosState, action: Action): WebknossosSt
       });
     }
 
+    case "SET_IS_MUTEX_ACQUIRED": {
+      const { isMutexAcquired } = action;
+      return updateKey(state, "annotation", {
+        isMutexAcquired,
+      });
+    }
+
     case "SET_USER_BOUNDING_BOXES": {
       return updateUserBoundingBoxes(state, action.userBoundingBoxes);
     }

frontend/javascripts/viewer/model/reducers/reducer_helpers.ts

@@ -156,6 +156,7 @@ export function convertServerAnnotationToFrontendAnnotation(
     othersMayEdit,
     annotationLayers,
     blockedByUser: null,
+    isMutexAcquired: false,
   };
 }
 

frontend/javascripts/viewer/model/sagas/saving/save_mutex_saga.tsx

@@ -4,11 +4,12 @@ import Toast from "libs/toast";
 import messages from "messages";
 import React from "react";
 import { call, cancel, cancelled, delay, fork, put, retry, takeEvery } from "typed-redux-saga";
-import type { APIUserCompact } from "types/api_types";
 import {
+  type SetIsMutexAcquiredAction,
   type SetOthersMayEditForAnnotationAction,
   setAnnotationAllowUpdateAction,
   setBlockedByUserAction,
+  setIsMutexAcquiredAction,
 } from "viewer/model/actions/annotation_actions";
 import type { Saga } from "viewer/model/sagas/effect-generators";
 import { select } from "viewer/model/sagas/effect-generators";
@@ -25,12 +26,16 @@ const DISABLE_EAGER_MUTEX_ACQUISITION = true;
 type MutexLogicState = {
   isInitialRequest: boolean;
   doesHaveMutexFromBeginning: boolean;
-  doesHaveMutex: boolean;
   shallTryAcquireMutex: boolean;
 };
 
+function* getDoesHaveMutex(): Saga<boolean> {
+  return yield* select((state) => state.annotation.isMutexAcquired);
+}
+
 export function* acquireAnnotationMutexMaybe(): Saga<void> {
   yield* call(ensureWkReady);
+  yield* fork(watchMutexStateChanges);
   if (DISABLE_EAGER_MUTEX_ACQUISITION) {
     return;
   }
@@ -43,7 +48,6 @@ export function* acquireAnnotationMutexMaybe(): Saga<void> {
   const mutexLogicState: MutexLogicState = {
     isInitialRequest: true,
     doesHaveMutexFromBeginning: false,
-    doesHaveMutex: false,
     shallTryAcquireMutex: othersMayEdit,
   };
 
@@ -97,14 +101,11 @@ function* tryAcquireMutexContinuously(mutexLogicState: MutexLogicState): Saga<vo
         mutexLogicState.doesHaveMutexFromBeginning = false;
         yield* put(setAnnotationAllowUpdateAction(false));
       }
-      if (canEdit) {
-        yield* put(setBlockedByUserAction(activeUser));
-      } else {
-        yield* put(setBlockedByUserAction(blockedByUser));
-      }
-      if (canEdit !== mutexLogicState.doesHaveMutex || mutexLogicState.isInitialRequest) {
-        mutexLogicState.doesHaveMutex = canEdit;
-        onMutexStateChanged(mutexLogicState.isInitialRequest, canEdit, blockedByUser);
+
+      yield* put(setBlockedByUserAction(canEdit ? activeUser : blockedByUser));
+
+      if (canEdit !== (yield* call(getDoesHaveMutex)) || mutexLogicState.isInitialRequest) {
+        yield* put(setIsMutexAcquiredAction(canEdit));
       }
     } catch (error) {
       if (process.env.IS_TESTING) {
@@ -120,9 +121,8 @@ function* tryAcquireMutexContinuously(mutexLogicState: MutexLogicState): Saga<vo
         yield* put(setBlockedByUserAction(undefined));
         yield* put(setAnnotationAllowUpdateAction(false));
         mutexLogicState.doesHaveMutexFromBeginning = false;
-        if (mutexLogicState.doesHaveMutex || mutexLogicState.isInitialRequest) {
-          onMutexStateChanged(mutexLogicState.isInitialRequest, false, null);
-          mutexLogicState.doesHaveMutex = false;
+        if ((yield* call(getDoesHaveMutex)) || mutexLogicState.isInitialRequest) {
+          yield* put(setIsMutexAcquiredAction(false));
         }
       }
     }
@@ -131,31 +131,35 @@ function* tryAcquireMutexContinuously(mutexLogicState: MutexLogicState): Saga<vo
   }
 }
 
-// todop: this should automatically react to store changes / actions. there could be a "SET_MUTEX_INFO" action
-function onMutexStateChanged(
-  isInitialRequest: boolean,
-  canEdit: boolean,
-  blockedByUser: APIUserCompact | null | undefined,
-) {
-  if (canEdit) {
-    Toast.close(MUTEX_NOT_ACQUIRED_KEY);
-    if (!isInitialRequest) {
-      const message = (
-        <React.Fragment>
-          {messages["annotation.acquiringMutexSucceeded"]}" "
-          <Button onClick={() => location.reload()}>Reload the annotation</Button>
-        </React.Fragment>
-      );
-      Toast.success(message, { sticky: true, key: MUTEX_ACQUIRED_KEY });
-    }
-  } else {
-    Toast.close(MUTEX_ACQUIRED_KEY);
-    const message =
-      blockedByUser != null
-        ? messages["annotation.acquiringMutexFailed"]({
-            userName: `${blockedByUser.firstName} ${blockedByUser.lastName}`,
-          })
-        : messages["annotation.acquiringMutexFailed.noUser"];
-    Toast.warning(message, { sticky: true, key: MUTEX_NOT_ACQUIRED_KEY });
-  }
+function* watchMutexStateChanges(): Saga<void> {
+  // todop: wrong?
+  let isInitialRequest = true;
+  yield* takeEvery(
+    "SET_IS_MUTEX_ACQUIRED",
+    function* ({ isMutexAcquired }: SetIsMutexAcquiredAction) {
+      if (isMutexAcquired) {
+        Toast.close(MUTEX_NOT_ACQUIRED_KEY);
+        if (!isInitialRequest) {
+          const message = (
+            <React.Fragment>
+              {messages["annotation.acquiringMutexSucceeded"]}" "
+              <Button onClick={() => location.reload()}>Reload the annotation</Button>
+            </React.Fragment>
+          );
+          Toast.success(message, { sticky: true, key: MUTEX_ACQUIRED_KEY });
+        }
+      } else {
+        Toast.close(MUTEX_ACQUIRED_KEY);
+        const blockedByUser = yield* select((state) => state.annotation.blockedByUser);
+        const message =
+          blockedByUser != null
+            ? messages["annotation.acquiringMutexFailed"]({
+                userName: `${blockedByUser.firstName} ${blockedByUser.lastName}`,
+              })
+            : messages["annotation.acquiringMutexFailed.noUser"];
+        Toast.warning(message, { sticky: true, key: MUTEX_NOT_ACQUIRED_KEY });
+      }
+      isInitialRequest = false;
+    },
+  );
 }

frontend/javascripts/viewer/store.ts

@@ -146,6 +146,7 @@ export type Annotation = {
   readonly othersMayEdit: boolean;
   readonly blockedByUser: APIUserCompact | null | undefined;
   readonly isLockedByOwner: boolean;
+  readonly isMutexAcquired: boolean;
 };
 type TracingBase = {
   readonly createdTimestamp: number;