feat: MoveCollection COMPASS-9434

Author: paula-stacho

packages/compass-data-modeling/src/components/diagram-editor.tsx

@@ -11,6 +11,7 @@ import type { DataModelingState } from '../store/reducer';
 import {
   applyEdit,
   applyInitialLayout,
+  moveCollection,
   getCurrentDiagramFromState,
   selectCurrentModel,
 } from '../store/diagram';
@@ -153,6 +154,7 @@ const DiagramEditor: React.FunctionComponent<{
   onCancelClick: () => void;
   onApplyClick: (edit: Omit<Edit, 'id' | 'timestamp'>) => void;
   onApplyInitialLayout: (positions: Record<string, [number, number]>) => void;
+  onMoveCollection: (ns: string, newPosition: [number, number]) => void;
 }> = ({
   diagramLabel,
   step,
@@ -162,6 +164,7 @@ const DiagramEditor: React.FunctionComponent<{
   onCancelClick,
   onApplyClick,
   onApplyInitialLayout,
+  onMoveCollection,
 }) => {
   const { log, mongoLogId } = useLogger('COMPASS-DATA-MODELING-DIAGRAM-EDITOR');
   const isDarkMode = useDarkMode();
@@ -357,6 +360,9 @@ const DiagramEditor: React.FunctionComponent<{
               maxZoom: 1,
               minZoom: 0.25,
             }}
+            onNodeDragStop={(evt, node) => {
+              onMoveCollection(node.id, [node.position.x, node.position.y]);
+            }}
             onEdgeClick={(evt, edge) => {
               setApplyInput(
                 JSON.stringify(
@@ -436,5 +442,6 @@ export default connect(
     onCancelClick: cancelAnalysis,
     onApplyClick: applyEdit,
     onApplyInitialLayout: applyInitialLayout,
+    onMoveCollection: moveCollection,
   }
 )(DiagramEditor);

packages/compass-data-modeling/src/services/data-model-storage.ts

@@ -55,6 +55,11 @@ const EditSchemaVariants = z.discriminatedUnion('type', [
     type: z.literal('RemoveRelationship'),
     relationshipId: z.string().uuid(),
   }),
+  z.object({
+    type: z.literal('MoveCollection'),
+    ns: z.string(),
+    newPosition: z.tuple([z.number(), z.number()]),
+  }),
 ]);
 
 export const EditSchema = z.intersection(EditSchemaBase, EditSchemaVariants);

packages/compass-data-modeling/src/store/diagram.ts

@@ -260,6 +260,23 @@ export function redoEdit(): DataModelingThunkAction<void, RedoEditAction> {
   };
 }
 
+export function moveCollection(
+  ns: string,
+  newPosition: [number, number]
+): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+  return (dispatch) => {
+    const edit: Omit<
+      Extract<Edit, { type: 'MoveCollection' }>,
+      'id' | 'timestamp'
+    > = {
+      type: 'MoveCollection',
+      ns,
+      newPosition,
+    };
+    dispatch(applyEdit(edit));
+  };
+}
+
 export function applyEdit(
   rawEdit: Omit<Edit, 'id' | 'timestamp'>
 ): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
@@ -367,6 +384,20 @@ function _applyEdit(edit: Edit, model?: StaticModel): StaticModel {
         ),
       };
     }
+    case 'MoveCollection': {
+      return {
+        ...model,
+        collections: model.collections.map((collection) => {
+          if (collection.ns === edit.ns) {
+            return {
+              ...collection,
+              displayPosition: edit.newPosition,
+            };
+          }
+          return collection;
+        }),
+      };
+    }
     default: {
       return model;
     }