passbolt-styleguide 3.5.2 → 3.6.0-alpha2

package/src/react-extension/components/Resource/CreateResource/CreateResource.test.stories.js

@@ -3,7 +3,8 @@ import React from "react";
 import AppContext from "../../../contexts/AppContext";
 import PropTypes from "prop-types";
 import CreateResource from "./CreateResource";
-
+import MockPort from "../../../test/mock/MockPort";
+import {defaultProps} from "./CreateResource.test.data";
 
 export default {
   title: 'Passbolt/Resource/CreateResource',
@@ -18,6 +19,9 @@ export default {
   }
 };
 
+const mockedPort = new MockPort();
+mockedPort.addRequestListener("passbolt.resources.create", data => data);
+
 const context = {
   userSettings: {
     getSecurityTokenBackgroundColor: () => '#FFFF',
@@ -26,9 +30,18 @@ const context = {
   },
   resourceTypesSettings: {
     areResourceTypesEnabled: () => true,
-    isEncryptedDescriptionEnabled: () => true
+    isEncryptedDescriptionEnabled: () => true,
+    findResourceTypeIdBySlug: () => "type id",
+    DEFAULT_RESOURCE_TYPES_SLUGS: {
+      PASSWORD_AND_DESCRIPTION: "password and description"
+    },
+    isLegacyResourceTypeEnabled: () => true
+  },
+  resourceCreateDialogProps: {
+    folderParentId: "folder parent id test",
   },
   siteSettings: {
+    canIUse: () => true,
     generatorConfiguration: {
       "default_generator": "passphrase",
       "generators": [
@@ -83,7 +96,9 @@ const context = {
         }
       ]
     }
-  }
+  },
+  setContext: () => {},
+  port: mockedPort
 };
 
 
@@ -101,4 +116,5 @@ Template.propTypes = {
 export const Initial = Template.bind({});
 Initial.args = {
   context: context,
+  ...defaultProps()
 };

package/src/react-extension/components/Resource/DeleteResource/DeleteResource.js

@@ -116,11 +116,9 @@ class DeleteResource extends Component {
    */
   handleError(error) {
     const errorDialogProps = {
-      title: this.translate("There was an unexpected error..."),
-      message: error.message
+      error: error
     };
-    this.props.context.setContext({errorDialogProps});
-    this.props.dialogContext.open(NotifyError);
+    this.props.dialogContext.open(NotifyError, errorDialogProps);
   }
 
   /**

package/src/react-extension/components/Resource/DeleteResource/DeleteResource.test.js

@@ -20,12 +20,13 @@
 import {defaultAppContext, defaultPropsOneResource} from "./DeleteResource.test.data";
 import {ActionFeedbackContext} from "../../../contexts/ActionFeedbackContext";
 import DeleteResourcePage from "./DeleteResource.test.page";
-import {fireEvent} from "@testing-library/react";
+import {fireEvent, waitFor} from "@testing-library/react";
 import PassboltApiFetchError from "../../../../shared/lib/Error/PassboltApiFetchError";
 import {defaultPropsMultipleResource} from "../DisplayResourcesWorkspace/DisplayResourcesWorkspaceMenu.test.data";
 
 beforeEach(() => {
   jest.resetModules();
+  jest.resetAllMocks();
 });
 
 describe("See Password Delete Dialog", () => {
@@ -47,6 +48,7 @@ describe("See Password Delete Dialog", () => {
     });
 
     it('As LU I should know what resource I am deleting', () => {
+      expect.assertions(9);
       expect(page.deleteResourcePageObject.exists()).toBeTruthy();
       // title
       expect(page.deleteResourcePageObject.dialogTitle).not.toBeNull();
@@ -66,18 +68,27 @@ describe("See Password Delete Dialog", () => {
     it('As LU I should see a toaster message after deleting a resource', async() => {
       const submitButton = page.deleteResourcePageObject.saveButton;
       // Mock the request function to make it the expected result
-      jest.spyOn(ActionFeedbackContext._currentValue, 'displaySuccess').mockImplementation(() => {
+      expect.assertions(1);
+      jest.spyOn(ActionFeedbackContext._currentValue, 'displaySuccess').mockImplementation(message => {
+        expect(message).toBe("The password has been deleted successfull");
       });
 
       await page.deleteResourcePageObject.click(submitButton);
-      expect(ActionFeedbackContext._currentValue.displaySuccess).toHaveBeenCalled();
+      // ensure that the process really finishes before leaving the unit test.
+      await waitFor(() => {
+        if (ActionFeedbackContext._currentValue.displaySuccess.mock.calls.length == 0) {
+          throw new Error("Reousrce deletion didn't finish its process.");
+        }
+      });
     });
 
     it('As LU I should be able to cancel the operation by clicking on the cancel button', async() => {
       const cancelButton = page.deleteResourcePageObject.cancelButton;
 
       await page.deleteResourcePageObject.click(cancelButton);
-      expect(propsOneResource.onClose).toBeCalled();
+
+      expect.assertions(1);
+      expect(propsOneResource.onClose).toHaveBeenCalledTimes(1);
     });
 
     it('As LU I should be able to cancel the edition with the keyboard (escape)', () => {
@@ -85,7 +96,8 @@ describe("See Password Delete Dialog", () => {
       const escapeKeyDown = {keyCode: 27};
       fireEvent.keyDown(page.deleteResourcePageObject.dialogTitle, escapeKeyDown);
 
-      expect(propsOneResource.onClose).toBeCalled();
+      expect.assertions(1);
+      expect(propsOneResource.onClose).toHaveBeenCalledTimes(1);
     });
 
     it('Displays an error when the API call fail', async() => {
@@ -98,6 +110,7 @@ describe("See Password Delete Dialog", () => {
       await page.deleteResourcePageObject.click(submitButton);
 
       // Throw general error message
+      expect.assertions(2);
       expect(page.deleteResourcePageObject.errorDialog).not.toBeNull();
       expect(page.deleteResourcePageObject.errorDialogMessage).not.toBeNull();
     });
@@ -123,7 +136,8 @@ describe("See Password Delete Dialog", () => {
       });
 
       await page.deleteResourcePageObject.click(submitButton);
-      expect(ActionFeedbackContext._currentValue.displaySuccess).toHaveBeenCalled();
+      expect.assertions(1);
+      expect(ActionFeedbackContext._currentValue.displaySuccess).toHaveBeenCalledTimes(1);
     });
   });
 });

package/src/react-extension/components/Resource/DeleteResource/DeleteResource.test.stories.js

@@ -2,6 +2,7 @@ import {MemoryRouter, Route} from "react-router-dom";
 import React from "react";
 import AppContext from "../../../contexts/AppContext";
 import DeleteResource from "./DeleteResource";
+import MockPort from "../../../test/mock/MockPort";
 
 
 export default {
@@ -22,8 +23,13 @@ const singleContext = {
       {name: "My Password"}
     ]
   },
+  setContext: () => {},
+  port: new MockPort(),
 };
 export const SinglePassword = Template(singleContext).bind({});
+SinglePassword.args = {
+  onClose: () => {}
+};
 
 const multipleContext = {
   passwordDeleteDialogProps: {
@@ -32,5 +38,11 @@ const multipleContext = {
       {name: "My Another Password"}
     ]
   },
+  setContext: () => {},
+  port: new MockPort(),
 };
 export const MultiplePassword = Template(multipleContext).bind({});
+MultiplePassword.args = {
+  onClose: () => {}
+};
+

package/src/react-extension/components/Resource/DisplayResourcesList/DisplayResourcesList.test.stories.js

@@ -3,6 +3,7 @@ import React from "react";
 import {MemoryRouter, Route} from "react-router-dom";
 import {ResourceWorkspaceFilterTypes} from "../../../contexts/ResourceWorkspaceContext";
 import AppContext from "../../../contexts/AppContext";
+import MockPort from "../../../test/mock/MockPort";
 
 export default {
   title: 'Passbolt/Resource/DisplayResourcesList',
@@ -13,20 +14,35 @@ const defaultContext = {
   siteSettings: {
     getServerTimezone: () => new Date().toLocaleString(),
     canIUse: () => true,
-  }
+  },
+  port: new MockPort()
 };
 
 
 const Template = args =>
   <AppContext.Provider value={defaultContext}>
     <MemoryRouter initialEntries={['/']}>
-      <div className="panel">
-        <Route component={routerProps => <DisplayResourcesList {...args} {...routerProps}/>}></Route>
+      <div className="page">
+        <div className="panel">
+          <Route component={routerProps => <DisplayResourcesList {...args} {...routerProps}/>}></Route>
+        </div>
       </div>
     </MemoryRouter>
   </AppContext.Provider>;
 
-export const Empty = Template.bind({});
+export const Empty = Template.bind();
+Empty.args = {
+  resourceWorkspaceContext: {
+    filteredResources: [],
+    selectedResources: [],
+    filter: {
+      type: ResourceWorkspaceFilterTypes.ALL
+    },
+    sorter: {
+      propertyName: 'asc'
+    }
+  }
+};
 
 export const Populated = Template.bind({});
 Populated.args = {
@@ -61,14 +77,99 @@ Populated.args = {
           "created": "2020-08-27T08:35:19+00:00",
           "modified": "2020-08-27T08:35:19+00:00"
         }
+      },
+      {
+        "id": "8e3874ae-4b40-590b-968a-418f704b9d9b",
+        "name": "apache",
+        "username": "www-data",
+        "uri": "http:\/\/www.apache.org\/",
+        "description": "Apache is the world\u0027s most used web server software.",
+        "deleted": false,
+        "created": "2020-08-25T08:35:19+00:00",
+        "modified": "2020-08-26T08:35:19+00:00",
+        "created_by": "f848277c-5398-58f8-a82a-72397af2d450",
+        "modified_by": "f848277c-5398-58f8-a82a-72397af2d450",
+        "permission": {
+          "id": "8dfd59a7-852d-5c57-bd45-75c28bbb3f6c",
+          "aco": "Resource",
+          "aco_foreign_key": "8e3874ae-4b40-590b-968a-418f704b9d9a",
+          "aro": "User",
+          "aro_foreign_key": "f848277c-5398-58f8-a82a-72397af2d450",
+          "type": 15,
+          "created": "2020-08-27T08:35:19+00:00",
+          "modified": "2020-08-27T08:35:19+00:00"
+        }
+      },
+      {
+        "id": "8e3874ae-4b40-590b-968a-418f704b9d9c",
+        "name": "apache",
+        "username": "www-data",
+        "uri": "http:\/\/www.apache.org\/",
+        "description": "Apache is the world\u0027s most used web server software.",
+        "deleted": false,
+        "created": "2020-08-25T08:35:19+00:00",
+        "modified": "2020-08-26T08:35:19+00:00",
+        "created_by": "f848277c-5398-58f8-a82a-72397af2d450",
+        "modified_by": "f848277c-5398-58f8-a82a-72397af2d450",
+        "favorite": {
+          "id": "56216dba-b6da-592b-87cb-fb5cbbd0a424",
+          "user_id": "f848277c-5398-58f8-a82a-72397af2d450",
+          "foreign_key": "8e3874ae-4b40-590b-968a-418f704b9d9a",
+          "foreign_model": "Resource",
+          "created": "2020-08-27T08:35:21+00:00",
+          "modified": "2020-08-27T08:35:21+00:00"
+        },
+        "permission": {
+          "id": "8dfd59a7-852d-5c57-bd45-75c28bbb3f6c",
+          "aco": "Resource",
+          "aco_foreign_key": "8e3874ae-4b40-590b-968a-418f704b9d9a",
+          "aro": "User",
+          "aro_foreign_key": "f848277c-5398-58f8-a82a-72397af2d450",
+          "type": 15,
+          "created": "2020-08-27T08:35:19+00:00",
+          "modified": "2020-08-27T08:35:19+00:00"
+        }
+      },
+      {
+        "id": "8e3874ae-4b40-590b-968a-418f704b9d9d",
+        "name": "apache",
+        "username": "www-data",
+        "uri": "http:\/\/www.apache.org\/",
+        "description": "Apache is the world\u0027s most used web server software.",
+        "deleted": false,
+        "created": "2020-08-25T08:35:19+00:00",
+        "modified": "2020-08-26T08:35:19+00:00",
+        "created_by": "f848277c-5398-58f8-a82a-72397af2d450",
+        "modified_by": "f848277c-5398-58f8-a82a-72397af2d450",
+        "permission": {
+          "id": "8dfd59a7-852d-5c57-bd45-75c28bbb3f6c",
+          "aco": "Resource",
+          "aco_foreign_key": "8e3874ae-4b40-590b-968a-418f704b9d9a",
+          "aro": "User",
+          "aro_foreign_key": "f848277c-5398-58f8-a82a-72397af2d450",
+          "type": 15,
+          "created": "2020-08-27T08:35:19+00:00",
+          "modified": "2020-08-27T08:35:19+00:00"
+        }
       }
     ],
-    selectedResources: [],
+    selectedResources: [
+      {id: '8e3874ae-4b40-590b-968a-418f704b9d9a'},
+      {id: '8e3874ae-4b40-590b-968a-418f704b9d9b'},
+    ],
     filter: {
       type: ResourceWorkspaceFilterTypes.ALL
     },
     sorter: {
       propertyName: 'asc'
-    }
+    },
+    onResourceSelected: {
+      multiple: () => {},
+      single: () => {},
+      all: () => {},
+      none: () => {}
+    },
+    onGoToResourceUriRequested: () => {},
+    onSorterChanged: () => {}
   }
 };

package/src/react-extension/components/Resource/EditResource/EditResource.js

@@ -377,11 +377,9 @@ class EditResource extends Component {
    */
   handleError(error) {
     const errorDialogProps = {
-      title: this.translate("There was an unexpected error..."),
-      message: error.message
+      error: error
     };
-    this.props.context.setContext({errorDialogProps});
-    this.props.dialogContext.open(NotifyError);
+    this.props.dialogContext.open(NotifyError, errorDialogProps);
   }
 
   /**

package/src/react-extension/components/Resource/EditResource/EditResource.test.data.js

@@ -109,9 +109,9 @@ export function defaultProps() {
         ]
       }
     },
-    onClose: jest.fn(),
+    onClose: () => {},
     dialogContext: {
-      open: jest.fn()
+      open: () => {}
     }
   };
 }

package/src/react-extension/components/Resource/EditResource/EditResource.test.js

@@ -29,6 +29,9 @@ beforeEach(() => {
 describe("See the Edit Resource", () => {
   let page; // The page to test against
   const props = defaultProps(); // The props to pass
+  props.onClose = jest.fn();
+  props.dialogContext.open = jest.fn();
+
   const passwordEditDialogProps = {
     id: "8e3874ae-4b40-590b-968a-418f704b9d9a"
   };

package/src/react-extension/components/Resource/EditResource/EditResource.test.stories.js

@@ -1,7 +1,9 @@
-import {defaultAppContext} from "./EditResource.test.data";
+import React from "react";
+import {MemoryRouter, Route} from "react-router-dom";
+import {defaultProps} from "./EditResource.test.data";
 import EditResource from "./EditResource";
-import {EditResourcePageTemplate} from "./EditResource.test.page";
-
+import AppContext from "../../../contexts/AppContext";
+import PropTypes from "prop-types";
 
 /**
  * EditResource stories
@@ -11,7 +13,19 @@ export default {
   component: EditResource
 };
 
+const props = defaultProps();
+props.context.setContext = () => {};
+
+const Template = ({context, ...args}) =>
+  <AppContext.Provider value={context}>
+    <MemoryRouter initialEntries={['/']}>
+      <Route component={routerProps => <EditResource {...args} {...routerProps}/>}></Route>
+    </MemoryRouter>
+  </AppContext.Provider>;
 
-const Template = () => EditResourcePageTemplate(defaultAppContext(), {});
+Template.propTypes = {
+  context: PropTypes.object
+};
 
 export const Initial = Template.bind({});
+Initial.args = {...props};

package/src/react-extension/components/Resource/ExportResources/ExportResources.js

@@ -248,20 +248,18 @@ class ExportResources extends React.Component {
   /**
    * Whenever the export has been performed with failure
    */
-  async onExportFailure(error) {
+  onExportFailure(error) {
     const isUserAbortsOperation = error.name === "UserAbortsOperationError";
     if (isUserAbortsOperation) {
-      await this.setState({actions: {processing: false}});
+      this.setState({actions: {processing: false}});
       return;
     }
 
     const errorDialogProps = {
-      title: this.translate("There was an unexpected error..."),
-      message: error.message
+      error: error
     };
-    await this.setState({actions: {processing: false}});
-    await this.props.context.setContext({errorDialogProps});
-    this.props.dialogContext.open(NotifyError);
+    this.setState({actions: {processing: false}});
+    this.props.dialogContext.open(NotifyError, errorDialogProps);
   }
 
   /**

package/src/react-extension/components/Resource/ExportResources/ExportResources.test.js

@@ -43,6 +43,7 @@ describe("As LU I should see the password export dialog", () => {
     });
 
     it('As LU I see a success toaster after exporting resources in csv with success', async() => {
+      expect.assertions(6);
       expect(page.exists()).toBeTruthy();
       expect(page.title).toBe("Export passwords");
 
@@ -69,6 +70,7 @@ describe("As LU I should see the password export dialog", () => {
     });
 
     it('As LU I see a export resources credential dialog after exporting resources in kdbx with success', async() => {
+      expect.assertions(4);
       expect(page.exists()).toBeTruthy();
       expect(page.title).toBe("Export passwords");
 
@@ -104,36 +106,41 @@ describe("As LU I should see the password export dialog", () => {
     });
 
     it('As LU I can stop exporting passwords by clicking on the cancel button', async() => {
+      expect.assertions(2);
       await page.cancelExport();
       expect(props.resourceWorkspaceContext.onResourcesToExport).toHaveBeenCalledWith({resourcesIds: null, foldersIds: null});
       expect(props.onClose).toBeCalled();
     });
 
     it('As LU I can stop exporting passwords by closing the dialog', async() => {
+      expect.assertions(2);
       await page.closeDialog();
       expect(props.resourceWorkspaceContext.onResourcesToExport).toHaveBeenCalledWith({resourcesIds: null, foldersIds: null});
       expect(props.onClose).toBeCalled();
     });
 
     it('As LU I can stop exporting passwords with the keyboard (escape)', async() => {
+      expect.assertions(2);
       await page.escapeKey();
       expect(props.resourceWorkspaceContext.onResourcesToExport).toHaveBeenCalledWith({resourcesIds: null, foldersIds: null});
       expect(props.onClose).toBeCalled();
     });
 
     it('As LU I should see an error dialog if the submit operation fails for an unexpected reason', async() => {
+      expect.assertions(1);
       // Fill the form
       await page.selectFormat('csv-lastpass');
       // Mock the request function to make it return an error.
+      const error = new PassboltApiFetchError("Jest simulate API error.");
       jest.spyOn(context.port, 'request').mockImplementationOnce(() => {
-        throw new PassboltApiFetchError("Jest simulate API error.");
+        throw error;
       });
 
       await page.submitExport();
       await waitFor(() => {});
 
       // Throw dialog general error message
-      expect(props.dialogContext.open).toHaveBeenCalledWith(NotifyError);
+      expect(props.dialogContext.open).toHaveBeenCalledWith(NotifyError, {error: error});
     });
   });
 });

package/src/react-extension/components/Resource/ExportResources/ExportResources.test.stories.js

@@ -52,7 +52,8 @@ const context = {
     {
       id: 2
     }
-  ]
+  ],
+  setContext: () => {}
 };
 
 
@@ -71,5 +72,6 @@ Initial.args = {
       foldersIds: [1, 2]
     },
     onResourcesToExport: () => {}
-  }
+  },
+  onClose: () => {}
 };

package/src/react-extension/components/Resource/ExportResources/ExportResourcesCredentials.js

@@ -189,20 +189,18 @@ class ExportResourcesCredentials extends Component {
   /**
    * Whenever the export has been performed with failure
    */
-  async onExportFailure(error) {
+  onExportFailure(error) {
     const isUserAbortsOperation = error.name === "UserAbortsOperationError";
     if (isUserAbortsOperation) {
-      await this.setState({actions: {processing: false}});
+      this.setState({actions: {processing: false}});
       return;
     }
 
     const errorDialogProps = {
-      title: this.translate("There was an unexpected error..."),
-      message: error.message
+      error: error
     };
-    await this.setState({actions: {processing: false}});
-    await this.props.context.setContext({errorDialogProps});
-    this.props.dialogContext.open(NotifyError);
+    this.setState({actions: {processing: false}});
+    this.props.dialogContext.open(NotifyError, errorDialogProps);
   }
 
   /**

package/src/react-extension/components/Resource/ExportResources/ExportResourcesCredentials.test.js

@@ -42,6 +42,7 @@ describe("As LU I should see the export resources credentials dialog", () => {
     });
 
     it('As LU I see a success dialog after unlocking keypass file with success', async() => {
+      expect.assertions(7);
       expect(page.exists()).toBeTruthy();
       expect(page.title).toBe("Enter the password and/or key file");
       const file = new File(['test'], 'keyfile.txt', {type: 'txt'});
@@ -95,34 +96,39 @@ describe("As LU I should see the export resources credentials dialog", () => {
     });
 
     it('As LU I can stop importing passwords by clicking on the cancel button', async() => {
+      expect.assertions(1);
       await page.cancelExport();
       expect(props.onClose).toBeCalled();
     });
 
     it('As LU I can stop importing passwords by closing the dialog', async() => {
+      expect.assertions(1);
       await page.closeDialog();
       expect(props.onClose).toBeCalled();
     });
 
     it('As LU I can stop importing passwords with the keyboard (escape)', async() => {
+      expect.assertions(1);
       await page.escapeKey();
       expect(props.onClose).toBeCalled();
     });
 
     it('As LU I should see an error dialog if the submit operation fails for an unexpected reason', async() => {
+      expect.assertions(1);
       const file = new File(['test'], 'keyfile.txt', {type: 'txt'});
       await page.fillPassword("test");
       await page.selectKeypassFile(file);
       // Mock the request function to make it return an error.
+      const error = new PassboltApiFetchError("Jest simulate API error.");
       jest.spyOn(context.port, 'request').mockImplementationOnce(() => {
-        throw new PassboltApiFetchError("Jest simulate API error.");
+        throw error;
       });
 
       await page.selectExport();
       await waitFor(() => {});
 
       // Throw dialog general error message
-      expect(props.dialogContext.open).toHaveBeenCalledWith(NotifyError);
+      expect(props.dialogContext.open).toHaveBeenCalledWith(NotifyError, {error: error});
     });
   });
 });

package/src/react-extension/components/Resource/ExportResources/ExportResourcesCredentials.test.stories.js

@@ -12,7 +12,8 @@ export default {
 const context = {
   siteSettings: {
     canIUse: () => true
-  }
+  },
+  setContext: () => {}
 };
 
 
@@ -33,5 +34,6 @@ Initial.args = {
         resourcesCount: 15
       }
     }
-  }
+  },
+  onClose: () => {}
 };

package/src/react-extension/components/Resource/FilterResourcesByFolders/FilterResourcesByFolders.test.stories.js

@@ -2,6 +2,8 @@ import React from "react";
 import {MemoryRouter, Route} from "react-router-dom";
 import AppContext from "../../../contexts/AppContext";
 import FilterResourcesByFolders from "./FilterResourcesByFolders";
+import {DragContext} from "../../../contexts/DragContext";
+import MockPort from "../../../test/mock/MockPort";
 
 
 export default {
@@ -15,16 +17,30 @@ const context = {
     {id: 2, name: 'My Folder', folder_parent_id: 1},
     {id: 3, name: 'My Folder 2', folder_parent_id: 1},
     {id: 4, name: 'My Sub-Folder 1', folder_parent_id: 2}
-  ]
+  ],
+  port: new MockPort()
 };
 
-const Template = args =>
-  <AppContext.Provider value={context}>
-    <MemoryRouter initialEntries={['/']}>
-      <div className="panel">
-        <Route component={routerProps => <FilterResourcesByFolders {...args} {...routerProps}/>}></Route>
-      </div>
-    </MemoryRouter>
+const Template = ({...args}) =>
+  <AppContext.Provider value={args.context}>
+    <DragContext.Provider value={args.dragContext}>
+      <MemoryRouter initialEntries={['/']}>
+        <div className="panel">
+          <Route component={routerProps => <FilterResourcesByFolders {...args} {...routerProps}/>}></Route>
+        </div>
+      </MemoryRouter>
+    </DragContext.Provider>
   </AppContext.Provider>;
 
 export const Initial = Template.bind({});
+Initial.args = {
+  context: context,
+  dragContext: {
+    draggedItems: {
+      folders: [],
+      resources: []
+    },
+    onDragStart: () => {},
+    onDragEnd: () => {}
+  }
+};

package/src/react-extension/components/Resource/FilterResourcesByTags/FilterResourcesByTagsList.js

@@ -153,11 +153,9 @@ class FilterResourcesByTagsList extends React.Component {
    */
   onUnexpectedError(error) {
     const errorDialogProps = {
-      title: "There was an unexpected error...",
-      message: error.message
+      error: error
     };
-    this.props.context.setContext({errorDialogProps});
-    this.props.dialogContext.open(NotifyError);
+    this.props.dialogContext.open(NotifyError, errorDialogProps);
   }
 
   /**