From 8703e1461239c0e250afd98c2a4c215029a830ce Mon Sep 17 00:00:00 2001 From: Paulo Gustavo Veiga Date: Fri, 19 Feb 2021 18:41:49 -0800 Subject: [PATCH] WIP: Add delete action for sharing --- packages/webapp/lang/en.json | 77 +++++++- packages/webapp/src/classes/client/index.ts | 2 + .../src/classes/client/mock-client/index.ts | 18 +- .../src/classes/client/rest-client/index.ts | 4 + packages/webapp/src/compiled-lang/en.json | 170 +++++++++++++++++- .../action-dispatcher/share-dialog/index.tsx | 48 +++-- 6 files changed, 302 insertions(+), 17 deletions(-) diff --git a/packages/webapp/lang/en.json b/packages/webapp/lang/en.json index 8253f7b6..80af1285 100644 --- a/packages/webapp/lang/en.json +++ b/packages/webapp/lang/en.json @@ -1,4 +1,22 @@ { + "account.delete-warning": { + "defaultMessage": "Keep in mind that you will not be able retrieve any mindmap you have added. All your information will be deleted and it can not be restored." + }, + "accountinfo.button": { + "defaultMessage": "Accept" + }, + "accountinfo.email": { + "defaultMessage": "Email" + }, + "accountinfo.firstname": { + "defaultMessage": "First Name" + }, + "accountinfo.lastname": { + "defaultMessage": "Last Name" + }, + "accountinfo.title": { + "defaultMessage": "Account info" + }, "action.cancel-button": { "defaultMessage": "Cancel" }, @@ -62,6 +80,24 @@ "action.share": { "defaultMessage": "Share" }, + "changepwd.button": { + "defaultMessage": "Change" + }, + "changepwd.confirm-password": { + "defaultMessage": "Confirm Password" + }, + "changepwd.description": { + "defaultMessage": "Please, provide the new password for your account." + }, + "changepwd.password": { + "defaultMessage": "Password" + }, + "changepwd.password-match": { + "defaultMessage": "Password do not match. Please, try again." + }, + "changepwd.title": { + "defaultMessage": "Change Password" + }, "common.wait": { "defaultMessage": "Please wait ..." }, @@ -149,6 +185,9 @@ "header.haveaccount": { "defaultMessage": "Already have an account?" }, + "help.support": { + "defaultMessage": "Support" + }, "history.no-changes": { "defaultMessage": "There is no changes available" }, @@ -203,7 +242,7 @@ "language.change": { "defaultMessage": "Change Language" }, - "languange.help": { + "language.help": { "defaultMessage": "Help to Translate" }, "login.desc": { @@ -279,6 +318,9 @@ "menu.account": { "defaultMessage": "Account" }, + "menu.change-password": { + "defaultMessage": "Change password" + }, "menu.signout": { "defaultMessage": "Sign Out" }, @@ -341,5 +383,38 @@ }, "resetpassword.success.title": { "defaultMessage": "Your account has been created successfully" + }, + "role.editor": { + "defaultMessage": "Editor" + }, + "role.owner": { + "defaultMessage": "Onwer" + }, + "role.viewer": { + "defaultMessage": "Viewer" + }, + "share.add-button": { + "defaultMessage": "Add" + }, + "share.add-message": { + "defaultMessage": "Add message" + }, + "share.can-edit": { + "defaultMessage": "Can edit" + }, + "share.can-view": { + "defaultMessage": "Can view" + }, + "share.delete": { + "defaultMessage": "Delete collaborator" + }, + "share.delete-description": { + "defaultMessage": "Invite people to collaborate with you in the creation of your midnmap. They will be notified by email." + }, + "share.delete-title": { + "defaultMessage": "Share with people" + }, + "share.message": { + "defaultMessage": "Message" } } \ No newline at end of file diff --git a/packages/webapp/src/classes/client/index.ts b/packages/webapp/src/classes/client/index.ts index a54cd408..50c0069b 100644 --- a/packages/webapp/src/classes/client/index.ts +++ b/packages/webapp/src/classes/client/index.ts @@ -80,8 +80,10 @@ interface Client { deleteMap(id: number): Promise; renameMap(id: number, basicInfo: BasicMapInfo): Promise; fetchAllMaps(): Promise; + fetchMapPermissions(id: number): Promise; addMapPermissions(id: number, message: string, permissions: Permission[]): Promise; + deleteMapPermission(id: number, email: string): Promise; duplicateMap(id: number, basicInfo: BasicMapInfo): Promise; diff --git a/packages/webapp/src/classes/client/mock-client/index.ts b/packages/webapp/src/classes/client/mock-client/index.ts index 56baef53..af4c661a 100644 --- a/packages/webapp/src/classes/client/mock-client/index.ts +++ b/packages/webapp/src/classes/client/mock-client/index.ts @@ -36,6 +36,12 @@ class MockClient implements Client { { id: 2, title: "Blue Label", iconName: "", color: 'blue' } ]; } + deleteMapPermission(id: number, email: string): Promise { + let perm = this.permissionsByMap.get(id) || []; + perm = perm.filter(p=>p.email!=email) + this.permissionsByMap.set(id, perm); + return Promise.resolve(); + } addMapPermissions(id: number, message: string, permissions: Permission[]): Promise { let perm = this.permissionsByMap.get(id) || []; @@ -50,9 +56,17 @@ class MockClient implements Client { let perm = this.permissionsByMap.get(id); if (!perm) { perm = [{ - name: 'Cosme Sharing', - email: 'pepe@gmail.com', + name: 'Cosme Editor', + email: 'pepe@example.com', role: 'editor' + }, { + name: 'Cosme Owner', + email: 'pepe2@example.com', + role: 'owner' + }, { + name: 'Cosme Viewer', + email: 'pepe3@example.com', + role: 'viewer' }]; this.permissionsByMap.set(id, perm); } diff --git a/packages/webapp/src/classes/client/rest-client/index.ts b/packages/webapp/src/classes/client/rest-client/index.ts index b9835b95..cd4d812d 100644 --- a/packages/webapp/src/classes/client/rest-client/index.ts +++ b/packages/webapp/src/classes/client/rest-client/index.ts @@ -11,6 +11,10 @@ export default class RestClient implements Client { this.sessionExpired = sessionExpired; } // eslint-disable-next-line @typescript-eslint/no-unused-vars + deleteMapPermission(id: number, email: string): Promise { + throw new Error('Method not implemented.'); + } + // eslint-disable-next-line @typescript-eslint/no-unused-vars addMapPermissions(id: number, message: string, permissions: Permission[]): Promise { throw new Error('Method not implemented.'); } diff --git a/packages/webapp/src/compiled-lang/en.json b/packages/webapp/src/compiled-lang/en.json index ce82c52c..5e5740a2 100644 --- a/packages/webapp/src/compiled-lang/en.json +++ b/packages/webapp/src/compiled-lang/en.json @@ -1,4 +1,40 @@ { + "account.delete-warning": [ + { + "type": 0, + "value": "Keep in mind that you will not be able retrieve any mindmap you have added. All your information will be deleted and it can not be restored." + } + ], + "accountinfo.button": [ + { + "type": 0, + "value": "Accept" + } + ], + "accountinfo.email": [ + { + "type": 0, + "value": "Email" + } + ], + "accountinfo.firstname": [ + { + "type": 0, + "value": "First Name" + } + ], + "accountinfo.lastname": [ + { + "type": 0, + "value": "Last Name" + } + ], + "accountinfo.title": [ + { + "type": 0, + "value": "Account info" + } + ], "action.cancel-button": [ { "type": 0, @@ -125,6 +161,42 @@ "value": "Share" } ], + "changepwd.button": [ + { + "type": 0, + "value": "Change" + } + ], + "changepwd.confirm-password": [ + { + "type": 0, + "value": "Confirm Password" + } + ], + "changepwd.description": [ + { + "type": 0, + "value": "Please, provide the new password for your account." + } + ], + "changepwd.password": [ + { + "type": 0, + "value": "Password" + } + ], + "changepwd.password-match": [ + { + "type": 0, + "value": "Password do not match. Please, try again." + } + ], + "changepwd.title": [ + { + "type": 0, + "value": "Change Password" + } + ], "common.wait": [ { "type": 0, @@ -179,6 +251,12 @@ "value": "Mindmap Tools: Export your mindmap in thirdparty mindmap tool formats" } ], + "export.document-label": [ + { + "type": 0, + "value": "Document: Export your mindmap in a self-contained document ready to share" + } + ], "export.image": [ { "type": 0, @@ -194,7 +272,7 @@ "export.warning": [ { "type": 0, - "value": "Exporting to Image (SVG,PNG,JPEG )is available only in the editor toolbar." + "value": "Exporting to Image (SVG,PNG,JPEG,PDF) is only available in the editor toolbar." } ], "footer.aboutus": [ @@ -293,6 +371,12 @@ "value": "Already have an account?" } ], + "help.support": [ + { + "type": 0, + "value": "Support" + } + ], "history.no-changes": [ { "type": 0, @@ -395,6 +479,18 @@ "value": "Info" } ], + "language.change": [ + { + "type": 0, + "value": "Change Language" + } + ], + "language.help": [ + { + "type": 0, + "value": "Help to Translate" + } + ], "login.desc": [ { "type": 0, @@ -539,6 +635,12 @@ "value": "Account" } ], + "menu.change-password": [ + { + "type": 0, + "value": "Change password" + } + ], "menu.signout": [ { "type": 0, @@ -664,5 +766,71 @@ "type": 0, "value": "Your account has been created successfully" } + ], + "role.editor": [ + { + "type": 0, + "value": "Editor" + } + ], + "role.owner": [ + { + "type": 0, + "value": "Onwer" + } + ], + "role.viewer": [ + { + "type": 0, + "value": "Viewer" + } + ], + "share.add-button": [ + { + "type": 0, + "value": "Add" + } + ], + "share.add-message": [ + { + "type": 0, + "value": "Add message" + } + ], + "share.can-edit": [ + { + "type": 0, + "value": "Can edit" + } + ], + "share.can-view": [ + { + "type": 0, + "value": "Can view" + } + ], + "share.delete": [ + { + "type": 0, + "value": "Delete collaborator" + } + ], + "share.delete-description": [ + { + "type": 0, + "value": "Invite people to collaborate with you in the creation of your midnmap. They will be notified by email." + } + ], + "share.delete-title": [ + { + "type": 0, + "value": "Share with people" + } + ], + "share.message": [ + { + "type": 0, + "value": "Message" + } ] } \ No newline at end of file diff --git a/packages/webapp/src/components/maps-page/action-dispatcher/share-dialog/index.tsx b/packages/webapp/src/components/maps-page/action-dispatcher/share-dialog/index.tsx index 53563668..69df5178 100644 --- a/packages/webapp/src/components/maps-page/action-dispatcher/share-dialog/index.tsx +++ b/packages/webapp/src/components/maps-page/action-dispatcher/share-dialog/index.tsx @@ -23,6 +23,7 @@ import Checkbox from "@material-ui/core/Checkbox"; import Typography from "@material-ui/core/Typography"; import { useStyles } from "./style"; import RoleIcon from "../../role-icon"; +import { Tooltip } from "@material-ui/core"; type ShareModel = { @@ -41,7 +42,22 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement const [model, setModel] = React.useState(defaultModel); const [error, setError] = React.useState(); - const mutation = useMutation( + const deleteMutation = useMutation( + (email: string) => { + return client.deleteMapPermission(mapId, email); + }, + { + onSuccess: () => { + queryClient.invalidateQueries(`perm-${mapId}`); + setModel(defaultModel); + }, + onError: (error: ErrorInfo) => { + setError(error); + } + } + ); + + const addMutation = useMutation( (model: ShareModel) => { const emails = model.emails.split("'"); const permissions = emails.map((email) => { return { email: email, role: model.role } }); @@ -70,9 +86,14 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement setModel({ ...model, [name as keyof ShareModel]: value }); } - const handleOnClick = (event: React.MouseEvent): void => { + const handleOnAddClick = (event: React.MouseEvent): void => { event.stopPropagation(); - mutation.mutate(model); + addMutation.mutate(model); + }; + + const handleOnDeleteClick = (event: React.MouseEvent, email: string): void => { + event.stopPropagation(); + deleteMutation.mutate(email); }; const { isLoading, data: permissions = [] } = useQuery(`perm-${mapId}`, () => { @@ -84,7 +105,7 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement @@ -98,7 +119,7 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement size="small" type="email" variant="outlined" - placeholder="Add collaboration email" + placeholder="Add collaborator email" label="Emails" onChange={handleOnChange} value={model.emails} @@ -129,7 +150,7 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement type="button" variant="contained" disableElevation={true} - onClick={handleOnClick}> + onClick={handleOnAddClick}> @@ -143,7 +164,7 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement name="message" onChange={handleOnChange} value={model.message} - placeholder="Include a customize message to ..." + label={intl.formatMessage({ id: 'share.message', defaultMessage: 'Message' })} /> } @@ -154,14 +175,15 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement {permissions && permissions.map((permission) => { return ( - `} primary={permission.email} /> + `} /> - - - - - + < ListItemSecondaryAction > + }> + handleOnDeleteClick(e, permission.email)}> + + + );