tests and cleanup

Author: paula-stacho

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

@@ -128,7 +128,6 @@ const DiagramContent: React.FunctionComponent<{
   isNewlyCreatedDiagram?: boolean;
   model: StaticModel | null;
   isInRelationshipDrawingMode: boolean;
-  editErrors?: string[];
   newCollection?: string;
   onAddFieldToObjectField: (ns: string, parentPath: string[]) => void;
   onAddNewFieldToCollection: (ns: string) => void;
@@ -526,7 +525,6 @@ export default connect(
     const { diagram, step } = state;
     return {
       step: step,
-      editErrors: diagram?.editErrors,
       diagramId: diagram?.id,
     };
   },

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

@@ -18,6 +18,7 @@ import type {
   StaticModel,
 } from '../services/data-model-storage';
 import { UUID } from 'bson';
+import Sinon from 'sinon';
 
 const model: StaticModel = {
   collections: [
@@ -67,9 +68,11 @@ const loadedDiagram: MongoDBDataModelDescription = {
 
 describe('Data Modeling store', function () {
   let store: DataModelingStore;
+  let openToastSpy: Sinon.SinonSpy;
 
   beforeEach(function () {
-    store = setupStore();
+    openToastSpy = Sinon.spy();
+    store = setupStore({}, undefined, openToastSpy);
   });
 
   describe('New Diagram', function () {
@@ -157,7 +160,7 @@ describe('Data Modeling store', function () {
 
       const state = store.getState();
       const diagram = getCurrentDiagramFromState(state);
-      expect(state.diagram?.editErrors).to.be.undefined;
+      expect(openToastSpy).not.to.have.been.called;
       expect(diagram.edits).to.have.length(2);
       expect(diagram.edits[0]).to.deep.equal(loadedDiagram.edits[0]);
       expect(diagram.edits[1]).to.deep.include(edit);
@@ -193,7 +196,7 @@ describe('Data Modeling store', function () {
 
       const state = store.getState();
       const diagram = getCurrentDiagramFromState(state);
-      expect(state.diagram?.editErrors).to.be.undefined;
+      expect(openToastSpy).not.to.have.been.called;
       expect(diagram.edits).to.have.length(2);
       expect(diagram.edits[0]).to.deep.equal(loadedDiagram.edits[0]);
       expect(diagram.edits[1]).to.deep.include({
@@ -217,9 +220,8 @@ describe('Data Modeling store', function () {
       } as unknown as Edit;
       store.dispatch(applyEdit(edit));
 
-      const editErrors = store.getState().diagram?.editErrors;
-      expect(editErrors).to.have.length(1);
-      expect(editErrors && editErrors[0]).to.equal(
+      expect(openToastSpy).to.have.been.calledOnce;
+      expect(openToastSpy.firstCall.args[1].description).to.include(
         "'relationship,relationship' is required"
       );
       const diagram = getCurrentDiagramFromState(store.getState());
@@ -353,7 +355,7 @@ describe('Data Modeling store', function () {
 
       const state = store.getState();
       const diagram = getCurrentDiagramFromState(state);
-      expect(state.diagram?.editErrors).to.be.undefined;
+      expect(openToastSpy).not.to.have.been.called;
       expect(diagram.edits).to.have.length(2);
       expect(diagram.edits[0]).to.deep.equal(loadedDiagram.edits[0]);
       expect(diagram.edits[1]).to.deep.include(edit);
@@ -373,12 +375,22 @@ describe('Data Modeling store', function () {
       } as unknown as Edit;
       store.dispatch(applyEdit(edit));
 
-      const editErrors = store.getState().diagram?.editErrors;
-      expect(editErrors).to.have.length(1);
-      expect(editErrors && editErrors[0]).to.equal("'newPosition' is required");
+      expect(openToastSpy).to.have.been.calledOnce;
+      expect(openToastSpy.firstCall.args[1].description).to.include(
+        "'newPosition' is required"
+      );
       const diagram = getCurrentDiagramFromState(store.getState());
       expect(diagram.edits).to.deep.equal(loadedDiagram.edits);
     });
+
+    it('should handle an invalid RenameCollection edit', function () {
+      store.dispatch(openDiagram(loadedDiagram));
+      store.dispatch(renameCollection('nonExisting', 'newName'));
+      expect(openToastSpy).to.have.been.calledOnce;
+      expect(openToastSpy.firstCall.args[1].description).to.include(
+        "Collection 'nonExisting' not found"
+      );
+    });
   });
 
   it('undo & redo', function () {

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

@@ -18,7 +18,7 @@ import { memoize } from 'lodash';
 import type { DataModelingState, DataModelingThunkAction } from './reducer';
 import {
   getCoordinatesForNewNode,
-  openToast,
+  type openToast as _openToast,
   showConfirmation,
   showPrompt,
 } from '@mongodb-js/compass-components';
@@ -225,7 +225,6 @@ export const diagramReducer: Reducer<DiagramState> = (
         state.draftCollection,
         action.edit.toNS
       ),
-      editErrors: undefined,
       updatedAt: new Date().toISOString(),
       selectedItems: {
         type: 'collection',
@@ -242,7 +241,6 @@ export const diagramReducer: Reducer<DiagramState> = (
         current: [...state.edits.current, action.edit] as [Edit, ...Edit[]],
         next: [],
       },
-      editErrors: undefined,
       updatedAt: new Date().toISOString(),
       selectedItems: updateSelectedItemsFromAppliedEdit(
         state.selectedItems,
@@ -501,7 +499,7 @@ export function redoEdit(): DataModelingThunkAction<void, RedoEditAction> {
 export function onAddNestedField(
   ns: string,
   parentFieldPath: string[]
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return (dispatch, getState) => {
     const modelState = selectCurrentModelFromState(getState());
 
@@ -532,7 +530,7 @@ export function onAddNestedField(
 
 export function addNewFieldToCollection(
   ns: string
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return (dispatch, getState) => {
     const modelState = selectCurrentModelFromState(getState());
 
@@ -561,7 +559,7 @@ export function addNewFieldToCollection(
 export function moveCollection(
   ns: string,
   newPosition: [number, number]
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   const edit: Omit<
     Extract<Edit, { type: 'MoveCollection' }>,
     'id' | 'timestamp'
@@ -578,7 +576,7 @@ export function renameCollection(
   toNS: string
 ): DataModelingThunkAction<
   void,
-  ApplyEditAction | ApplyEditFailedAction | CollectionSelectedAction
+  ApplyEditAction | RevertFailedEditAction | CollectionSelectedAction
 > {
   const edit: Omit<
     Extract<Edit, { type: 'RenameCollection' }>,
@@ -592,18 +590,21 @@ export function renameCollection(
   return applyEdit(edit);
 }
 
-function handleError(messages: string[]) {
+function handleError(openToast: typeof _openToast, messages: string[]) {
   openToast('data-modeling-error', {
     variant: 'warning',
     title: 'Error opening diagram',
     description: messages.join(' '),
   });
 }
 
+/**
+ * Not intended to be called directly, only exported for testing.
+ */
 export function applyEdit(
   rawEdit: EditAction
 ): DataModelingThunkAction<boolean, ApplyEditAction | RevertFailedEditAction> {
-  return (dispatch, getState, { dataModelStorage }) => {
+  return (dispatch, getState, { dataModelStorage, openToast }) => {
     const edit = {
       ...rawEdit,
       id: new UUID().toString(),
@@ -612,7 +613,7 @@ export function applyEdit(
     const { result, errors } = validateEdit(edit);
     let isValid = result;
     if (!result) {
-      handleError(errors);
+      handleError(openToast, errors);
       return isValid;
     }
     dispatch({
@@ -624,7 +625,7 @@ export function applyEdit(
     try {
       selectCurrentModelFromState(getState());
     } catch (e) {
-      handleError([
+      handleError(openToast, [
         'Something went wrong when applying the changes.',
         (e as Error).message,
       ]);
@@ -689,7 +690,7 @@ export function renameDiagram(
 export function openDiagramFromFile(
   file: File
 ): DataModelingThunkAction<Promise<void>, OpenDiagramAction> {
-  return async (dispatch, getState, { dataModelStorage, track }) => {
+  return async (dispatch, getState, { dataModelStorage, track, openToast }) => {
     try {
       const { name, edits } = await getDiagramContentsFromFile(file);
 
@@ -720,7 +721,7 @@ export function openDiagramFromFile(
 
 export function updateRelationship(
   relationship: Relationship
-): DataModelingThunkAction<boolean, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<boolean, ApplyEditAction | RevertFailedEditAction> {
   return applyEdit({
     type: 'UpdateRelationship',
     relationship,
@@ -748,7 +749,7 @@ export function deleteRelationship(
 
 export function deleteCollection(
   ns: string
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return (dispatch, getState, { track }) => {
     track('Data Modeling Collection Removed', {
       source: 'side_panel',
@@ -761,14 +762,14 @@ export function deleteCollection(
 export function updateCollectionNote(
   ns: string,
   note: string
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return applyEdit({ type: 'UpdateCollectionNote', ns, note });
 }
 
 export function removeField(
   ns: string,
   field: FieldPath
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return (dispatch, getState, { track }) => {
     track('Data Modeling Field Removed', {
       source: 'side_panel',
@@ -782,7 +783,7 @@ export function renameField(
   ns: string,
   field: FieldPath,
   newName: string
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return (dispatch, getState, { track }) => {
     track('Data Modeling Field Renamed', {
       source: 'side_panel',
@@ -818,7 +819,7 @@ export function changeFieldType(
   ns: string,
   fieldPath: FieldPath,
   newTypes: string[]
-): DataModelingThunkAction<void, ApplyEditAction | ApplyEditFailedAction> {
+): DataModelingThunkAction<void, ApplyEditAction | RevertFailedEditAction> {
   return (dispatch, getState, { track }) => {
     const collectionSchema = selectCurrentModelFromState(
       getState()
@@ -886,7 +887,7 @@ export function addCollection(
   position?: [number, number]
 ): DataModelingThunkAction<
   void,
-  ApplyEditAction | ApplyEditFailedAction | CollectionSelectedAction
+  ApplyEditAction | RevertFailedEditAction | CollectionSelectedAction
 > {
   return (dispatch, getState, { track }) => {
     const existingCollections = selectCurrentModelFromState(

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

@@ -9,8 +9,11 @@ import reducer from './reducer';
 import type { DataModelingExtraArgs } from './reducer';
 import thunk from 'redux-thunk';
 import type { ActivateHelpers } from '@mongodb-js/compass-app-registry';
+import { openToast as _openToast } from '@mongodb-js/compass-components';
 
-export type DataModelingStoreOptions = Record<string, unknown>;
+export type DataModelingStoreOptions = {
+  openToast?: typeof _openToast;
+};
 
 export type DataModelingStoreServices = {
   preferences: PreferencesAccess;
@@ -22,7 +25,7 @@ export type DataModelingStoreServices = {
 };
 
 export function activateDataModelingStore(
-  _: DataModelingStoreOptions,
+  { openToast = _openToast }: DataModelingStoreOptions,
   services: DataModelingStoreServices,
   { cleanup }: ActivateHelpers
 ) {
@@ -35,6 +38,7 @@ export function activateDataModelingStore(
         ...services,
         cancelAnalysisControllerRef,
         cancelExportControllerRef,
+        openToast,
       })
     )
   );

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

@@ -20,6 +20,7 @@ import type {
   ExportDiagramActions,
 } from './export-diagram';
 import { exportDiagramReducer } from './export-diagram';
+import { type openToast as _openToast } from '@mongodb-js/compass-components';
 
 const reducer = combineReducers({
   step: stepReducer,
@@ -46,6 +47,7 @@ export type DataModelingState = ReturnType<typeof reducer>;
 export type DataModelingExtraArgs = DataModelingStoreServices & {
   cancelAnalysisControllerRef: { current: AbortController | null };
   cancelExportControllerRef: { current: AbortController | null };
+  openToast: typeof _openToast;
 };
 
 export type DataModelingThunkAction<R, A extends AnyAction> = ThunkAction<

packages/compass-data-modeling/test/setup-store.tsx

@@ -10,6 +10,7 @@ import { activateDataModelingStore } from '../src/store';
 import type { DataModelingStoreServices } from '../src/store';
 import { noopDataModelStorageService } from '../src/provider';
 import { Provider } from 'react-redux';
+import { openToast as _openToast } from '@mongodb-js/compass-components';
 
 type ConnectionInfoWithMockData = ConnectionInfo & {
   databases: Array<{
@@ -136,10 +137,13 @@ const testConnections = [
 
 export const setupStore = (
   services: Partial<DataModelingStoreServices> = {},
-  connections: ConnectionInfoWithMockData[] = testConnections
+  connections: ConnectionInfoWithMockData[] = testConnections,
+  openToast: typeof _openToast = _openToast
 ) => {
   return activateDataModelingStore(
-    {},
+    {
+      openToast,
+    },
     {
       logger: createNoopLogger('TEST'),
       track: createNoopTrack(),