feat(gui): comment on annotations

api-editor/gui/src/app/App.tsx

@@ -67,7 +67,9 @@ import { SaveFilterDialog } from '../features/filter/SaveFilterDialog';
 import { StatisticsView } from '../features/statistics/StatisticsView';
 import { useAnnotationToasts } from '../features/achievements/AnnotationToast';
 import { ValueForm } from '../features/annotations/forms/ValueForm';
-import { AnnotationStore } from '../features/annotations/versioning/AnnotationStoreV2';
+import { AnnotationStore, CalledAfterTarget } from '../features/annotations/versioning/AnnotationStoreV2';
+import { RemoveForm } from '../features/annotations/forms/RemoveForm';
+import { PureForm } from '../features/annotations/forms/PureForm';
 
 export const App: React.FC = function () {
     useIndexedDB();
@@ -122,7 +124,14 @@ export const App: React.FC = function () {
                         <BoundaryForm target={userActionTarget || rawPythonPackage} />
                     )}
                     {currentUserAction.type === 'calledAfter' && userActionTarget instanceof PythonFunction && (
-                        <CalledAfterForm target={userActionTarget} />
+                        <CalledAfterForm
+                            target={userActionTarget}
+                            calledAfterName={
+                                (currentUserAction as CalledAfterTarget)?.calledAfterName
+                                    ? (currentUserAction as CalledAfterTarget)?.calledAfterName
+                                    : ''
+                            }
+                        />
                     )}
                     {currentUserAction.type === 'description' &&
                         (userActionTarget instanceof PythonClass ||
@@ -143,6 +152,10 @@ export const App: React.FC = function () {
                     )}
                     {currentUserAction.type === 'move' && <MoveForm target={userActionTarget || rawPythonPackage} />}
                     {currentUserAction.type === 'none' && <TreeView />}
+                    {currentUserAction.type === 'pure' && <PureForm target={userActionTarget || rawPythonPackage} />}
+                    {currentUserAction.type === 'remove' && (
+                        <RemoveForm target={userActionTarget || rawPythonPackage} />
+                    )}
                     {currentUserAction.type === 'rename' && (
                         <RenameForm target={userActionTarget || rawPythonPackage} />
                     )}

api-editor/gui/src/features/annotations/AnnotationDropdown.tsx

@@ -2,14 +2,16 @@ import { Box, Button, Icon, Menu, MenuButton, MenuGroup, MenuItem, MenuList } fr
 import React from 'react';
 import { FaChevronDown } from 'react-icons/fa';
 import { useAppDispatch, useAppSelector } from '../../app/hooks';
-import { addPureAnnotation, addRemoveAnnotation, selectComplete, selectUsernameIsValid } from './annotationSlice';
+import { selectComplete, selectUsernameIsValid } from './annotationSlice';
 import {
     showBoundaryAnnotationForm,
     showCalledAfterAnnotationForm,
     showDescriptionAnnotationForm,
     showEnumAnnotationForm,
     showGroupAnnotationForm,
     showMoveAnnotationForm,
+    showPureAnnotationForm,
+    showRemoveAnnotationForm,
     showRenameAnnotationForm,
     showTodoAnnotationForm,
     showValueAnnotationForm,
@@ -133,12 +135,12 @@ export const AnnotationDropdown: React.FC<AnnotationDropdownProps> = function ({
                                 </MenuItem>
                             )}
                             {showPure && (
-                                <MenuItem onClick={() => dispatch(addPureAnnotation({ target }))} paddingLeft={8}>
+                                <MenuItem onClick={() => dispatch(showPureAnnotationForm(target))} paddingLeft={8}>
                                     @pure
                                 </MenuItem>
                             )}
                             {showRemove && (
-                                <MenuItem onClick={() => dispatch(addRemoveAnnotation({ target }))} paddingLeft={8}>
+                                <MenuItem onClick={() => dispatch(showRemoveAnnotationForm(target))} paddingLeft={8}>
                                     @remove
                                 </MenuItem>
                             )}

api-editor/gui/src/features/annotations/AnnotationView.tsx

@@ -42,10 +42,13 @@ import {
     hideAnnotationForm,
     selectCurrentUserAction,
     showBoundaryAnnotationForm,
+    showCalledAfterAnnotationForm,
     showDescriptionAnnotationForm,
     showEnumAnnotationForm,
     showGroupAnnotationForm,
     showMoveAnnotationForm,
+    showPureAnnotationForm,
+    showRemoveAnnotationForm,
     showRenameAnnotationForm,
     showTodoAnnotationForm,
     showValueAnnotationForm,
@@ -111,6 +114,7 @@ export const AnnotationView: React.FC<AnnotationViewProps> = function ({ target
                     name={calledAfterName}
                     key={calledAfterName}
                     annotation={calledAfterAnnotation[calledAfterName]}
+                    onEdit={() => dispatch(showCalledAfterAnnotationForm({ target, calledAfterName }))}
                     onDelete={() => dispatch(removeCalledAfterAnnotation({ target, calledAfterName }))}
                     onReview={() => dispatch(reviewCalledAfterAnnotation({ target, calledAfterName }))}
                 />
@@ -166,6 +170,7 @@ export const AnnotationView: React.FC<AnnotationViewProps> = function ({ target
                 <AnnotationTag
                     type="pure"
                     annotation={pureAnnotation}
+                    onEdit={() => dispatch(showPureAnnotationForm(target))}
                     onDelete={() => dispatch(removePureAnnotation(target))}
                     onReview={() => dispatch(reviewPureAnnotation(target))}
                 />
@@ -174,6 +179,7 @@ export const AnnotationView: React.FC<AnnotationViewProps> = function ({ target
                 <AnnotationTag
                     type="remove"
                     annotation={removeAnnotation}
+                    onEdit={() => dispatch(showRemoveAnnotationForm(target))}
                     onDelete={() => dispatch(removeRemoveAnnotation(target))}
                     onReview={() => dispatch(reviewRemoveAnnotation(target))}
                     reportable
@@ -271,7 +277,7 @@ interface AnnotationTagProps {
     type: string;
     name?: string;
     annotation: Annotation;
-    onEdit?: () => void;
+    onEdit: () => void;
     onDelete: () => void;
     onReview: () => void;
     reportable?: boolean;

api-editor/gui/src/features/annotations/annotationSlice.ts

@@ -189,22 +189,32 @@ const annotationsSlice = createSlice({
 
             updateQueue(state);
         },
-        upsertCalledAfterAnnotation(state, action: PayloadAction<CalledAfterAnnotation>) {
-            if (!state.annotations.calledAfterAnnotations[action.payload.target]) {
-                state.annotations.calledAfterAnnotations[action.payload.target] = {};
+        upsertCalledAfterAnnotation(
+            state,
+            action: PayloadAction<{ annotation: CalledAfterAnnotation; previousCalledAfterName?: string }>,
+        ) {
+            const oldAnnotation =
+                state.annotations.calledAfterAnnotations[action.payload.annotation.target][
+                    action.payload.previousCalledAfterName ?? ''
+                ];
+
+            if (!state.annotations.calledAfterAnnotations[action.payload.annotation.target]) {
+                state.annotations.calledAfterAnnotations[action.payload.annotation.target] = {};
             }
 
-            updateCreationOrChangedCount(
-                state,
-                state.annotations.calledAfterAnnotations[action.payload.target][action.payload.calledAfterName],
-            );
+            updateCreationOrChangedCount(state, oldAnnotation);
+
+            state.annotations.calledAfterAnnotations[action.payload.annotation.target][
+                action.payload.annotation.calledAfterName
+            ] = withAuthorAndReviewers(oldAnnotation, action.payload.annotation, state.username);
+
+            // Delete old annotation
+            if (action.payload.previousCalledAfterName !== action.payload.annotation.calledAfterName) {
+                delete state.annotations.calledAfterAnnotations[action.payload.annotation.target][
+                    action.payload.previousCalledAfterName ?? ''
+                ];
+            }
 
-            state.annotations.calledAfterAnnotations[action.payload.target][action.payload.calledAfterName] =
-                withAuthorAndReviewers(
-                    state.annotations.calledAfterAnnotations[action.payload.target][action.payload.calledAfterName],
-                    action.payload,
-                    state.username,
-                );
             updateQueue(state);
         },
         removeCalledAfterAnnotation(state, action: PayloadAction<CalledAfterTarget>) {
@@ -310,19 +320,27 @@ const annotationsSlice = createSlice({
 
             updateQueue(state);
         },
-        upsertGroupAnnotation(state, action: PayloadAction<GroupAnnotation>) {
-            if (!state.annotations.groupAnnotations[action.payload.target]) {
-                state.annotations.groupAnnotations[action.payload.target] = {};
+        upsertGroupAnnotation(
+            state,
+            action: PayloadAction<{ previousGroupName?: string; annotation: GroupAnnotation }>,
+        ) {
+            const oldAnnotation =
+                state.annotations.groupAnnotations[action.payload.annotation.target][
+                    action.payload.previousGroupName ?? ''
+                ];
+
+            if (!state.annotations.groupAnnotations[action.payload.annotation.target]) {
+                state.annotations.groupAnnotations[action.payload.annotation.target] = {};
             } else {
-                const targetGroups = state.annotations.groupAnnotations[action.payload.target];
+                const targetGroups = state.annotations.groupAnnotations[action.payload.annotation.target];
                 const otherGroupNames = Object.values(targetGroups)
-                    .filter((group) => group.groupName !== action.payload.groupName)
+                    .filter((group) => group.groupName !== action.payload.annotation.groupName)
                     .map((group) => group.groupName);
 
                 for (const nameOfGroup of otherGroupNames) {
                     let needsChange = false;
                     const group = targetGroups[nameOfGroup];
-                    const currentAnnotationParameter = action.payload.parameters;
+                    const currentAnnotationParameter = action.payload.annotation.parameters;
                     const currentGroupParameter = [...group.parameters];
                     for (const parameter of currentAnnotationParameter) {
                         const index = currentGroupParameter.indexOf(parameter);
@@ -333,7 +351,7 @@ const annotationsSlice = createSlice({
                     }
                     if (currentGroupParameter.length < 1) {
                         removeGroupAnnotation({
-                            target: action.payload.target,
+                            target: action.payload.annotation.target,
                             groupName: group.groupName,
                         });
                     } else if (needsChange) {
@@ -350,17 +368,17 @@ const annotationsSlice = createSlice({
                 }
             }
 
-            updateCreationOrChangedCount(
-                state,
-                state.annotations.groupAnnotations[action.payload.target][action.payload.groupName],
-            );
+            updateCreationOrChangedCount(state, oldAnnotation);
 
-            state.annotations.groupAnnotations[action.payload.target][action.payload.groupName] =
-                withAuthorAndReviewers(
-                    state.annotations.groupAnnotations[action.payload.target][action.payload.groupName],
-                    action.payload,
-                    state.username,
-                );
+            state.annotations.groupAnnotations[action.payload.annotation.target][action.payload.annotation.groupName] =
+                withAuthorAndReviewers(oldAnnotation, action.payload.annotation, state.username);
+
+            // Delete old annotation
+            if (action.payload.previousGroupName !== action.payload.annotation.groupName) {
+                delete state.annotations.groupAnnotations[action.payload.annotation.target][
+                    action.payload.previousGroupName ?? ''
+                ];
+            }
 
             updateQueue(state);
         },
@@ -424,7 +442,7 @@ const annotationsSlice = createSlice({
 
             updateQueue(state);
         },
-        addPureAnnotation(state, action: PayloadAction<PureAnnotation>) {
+        upsertPureAnnotation(state, action: PayloadAction<PureAnnotation>) {
             updateCreationOrChangedCount(state, state.annotations.pureAnnotations[action.payload.target]);
 
             state.annotations.pureAnnotations[action.payload.target] = withAuthorAndReviewers(
@@ -448,7 +466,7 @@ const annotationsSlice = createSlice({
 
             updateQueue(state);
         },
-        addRemoveAnnotation(state, action: PayloadAction<RemoveAnnotation>) {
+        upsertRemoveAnnotation(state, action: PayloadAction<RemoveAnnotation>) {
             updateCreationOrChangedCount(state, state.annotations.removeAnnotations[action.payload.target]);
 
             state.annotations.removeAnnotations[action.payload.target] = withAuthorAndReviewers(
@@ -459,7 +477,7 @@ const annotationsSlice = createSlice({
 
             updateQueue(state);
         },
-        addRemoveAnnotations(state, action: PayloadAction<RemoveAnnotation[]>) {
+        upsertRemoveAnnotations(state, action: PayloadAction<RemoveAnnotation[]>) {
             action.payload.forEach((annotation) => {
                 updateCreationOrChangedCount(state, state.annotations.removeAnnotations[annotation.target]);
 
@@ -697,11 +715,11 @@ export const {
     upsertMoveAnnotations,
     removeMoveAnnotation,
     reviewMoveAnnotation,
-    addPureAnnotation,
+    upsertPureAnnotation,
     removePureAnnotation,
     reviewPureAnnotation,
-    addRemoveAnnotation,
-    addRemoveAnnotations,
+    upsertRemoveAnnotation,
+    upsertRemoveAnnotations,
     removeRemoveAnnotation,
     reviewRemoveAnnotation,
     upsertRenameAnnotation,