From 1cfb4dfd8b615a3db007b7b1bbe790f2fdbd34a8 Mon Sep 17 00:00:00 2001 From: Aakansha Doshi Date: Wed, 16 Mar 2022 18:31:20 +0530 Subject: [PATCH] feat: Map shortcut O to ellipse and Add eraser shortcut E (#4930) * feat: Add erase shortcut Shift+E * map o to ellipse and E to Eraser * fix tests * use key * move eraser to tools and rename shape to tools --- src/actions/actionCanvas.tsx | 3 +- src/components/HelpDialog.tsx | 8 +- src/locales/en.json | 2 +- src/shapes.tsx | 2 +- .../regressionTests.test.tsx.snap | 112 +++++++++--------- src/tests/regressionTests.test.tsx | 2 +- 6 files changed, 67 insertions(+), 62 deletions(-) diff --git a/src/actions/actionCanvas.tsx b/src/actions/actionCanvas.tsx index ae3baf574b..dacdce0c59 100644 --- a/src/actions/actionCanvas.tsx +++ b/src/actions/actionCanvas.tsx @@ -304,12 +304,13 @@ export const actionErase = register({ commitToHistory: true, }; }, + keyTest: (event) => event.key === KEYS.E, PanelComponent: ({ elements, appState, updateData, data }) => ( { updateData(null); diff --git a/src/components/HelpDialog.tsx b/src/components/HelpDialog.tsx index a03c479926..66e90d55a9 100644 --- a/src/components/HelpDialog.tsx +++ b/src/components/HelpDialog.tsx @@ -139,7 +139,7 @@ export const HelpDialog = ({ onClose }: { onClose?: () => void }) => {
- + void }) => { shortcuts={["R", "2"]} /> - + void }) => { + ), value: "ellipse", - key: KEYS.E, + key: KEYS.O, }, { icon: ( diff --git a/src/tests/__snapshots__/regressionTests.test.tsx.snap b/src/tests/__snapshots__/regressionTests.test.tsx.snap index 47cbed6454..c719ccb510 100644 --- a/src/tests/__snapshots__/regressionTests.test.tsx.snap +++ b/src/tests/__snapshots__/regressionTests.test.tsx.snap @@ -11510,7 +11510,7 @@ exports[`regression tests key d selects diamond tool: [end of test] number of el exports[`regression tests key d selects diamond tool: [end of test] number of renders 1`] = `8`; -exports[`regression tests key e selects ellipse tool: [end of test] appState 1`] = ` +exports[`regression tests key l selects line tool: [end of test] appState 1`] = ` Object { "collaborators": Map {}, "currentChartType": "bar", @@ -11590,35 +11590,50 @@ Object { } `; -exports[`regression tests key e selects ellipse tool: [end of test] element 0 1`] = ` +exports[`regression tests key l selects line tool: [end of test] element 0 1`] = ` Object { "angle": 0, "backgroundColor": "transparent", "boundElements": null, + "endArrowhead": null, + "endBinding": null, "fillStyle": "hachure", "groupIds": Array [], "height": 10, "id": "id0", "isDeleted": false, + "lastCommittedPoint": null, "link": null, "opacity": 100, + "points": Array [ + Array [ + 0, + 0, + ], + Array [ + 10, + 10, + ], + ], "roughness": 1, "seed": 337897, + "startArrowhead": null, + "startBinding": null, "strokeColor": "#000000", - "strokeSharpness": "sharp", + "strokeSharpness": "round", "strokeStyle": "solid", "strokeWidth": 1, - "type": "ellipse", + "type": "line", "updated": 1, - "version": 2, - "versionNonce": 1278240551, + "version": 3, + "versionNonce": 449462985, "width": 10, "x": 10, "y": 10, } `; -exports[`regression tests key e selects ellipse tool: [end of test] history 1`] = ` +exports[`regression tests key l selects line tool: [end of test] history 1`] = ` Object { "recording": false, "redoStack": Array [], @@ -11650,23 +11665,38 @@ Object { "angle": 0, "backgroundColor": "transparent", "boundElements": null, + "endArrowhead": null, + "endBinding": null, "fillStyle": "hachure", "groupIds": Array [], "height": 10, "id": "id0", "isDeleted": false, + "lastCommittedPoint": null, "link": null, "opacity": 100, + "points": Array [ + Array [ + 0, + 0, + ], + Array [ + 10, + 10, + ], + ], "roughness": 1, "seed": 337897, + "startArrowhead": null, + "startBinding": null, "strokeColor": "#000000", - "strokeSharpness": "sharp", + "strokeSharpness": "round", "strokeStyle": "solid", "strokeWidth": 1, - "type": "ellipse", + "type": "line", "updated": 1, - "version": 2, - "versionNonce": 1278240551, + "version": 3, + "versionNonce": 449462985, "width": 10, "x": 10, "y": 10, @@ -11677,11 +11707,11 @@ Object { } `; -exports[`regression tests key e selects ellipse tool: [end of test] number of elements 1`] = `1`; +exports[`regression tests key l selects line tool: [end of test] number of elements 1`] = `1`; -exports[`regression tests key e selects ellipse tool: [end of test] number of renders 1`] = `8`; +exports[`regression tests key l selects line tool: [end of test] number of renders 1`] = `8`; -exports[`regression tests key l selects line tool: [end of test] appState 1`] = ` +exports[`regression tests key o selects ellipse tool: [end of test] appState 1`] = ` Object { "collaborators": Map {}, "currentChartType": "bar", @@ -11761,50 +11791,35 @@ Object { } `; -exports[`regression tests key l selects line tool: [end of test] element 0 1`] = ` +exports[`regression tests key o selects ellipse tool: [end of test] element 0 1`] = ` Object { "angle": 0, "backgroundColor": "transparent", "boundElements": null, - "endArrowhead": null, - "endBinding": null, "fillStyle": "hachure", "groupIds": Array [], "height": 10, "id": "id0", "isDeleted": false, - "lastCommittedPoint": null, "link": null, "opacity": 100, - "points": Array [ - Array [ - 0, - 0, - ], - Array [ - 10, - 10, - ], - ], "roughness": 1, "seed": 337897, - "startArrowhead": null, - "startBinding": null, "strokeColor": "#000000", - "strokeSharpness": "round", + "strokeSharpness": "sharp", "strokeStyle": "solid", "strokeWidth": 1, - "type": "line", + "type": "ellipse", "updated": 1, - "version": 3, - "versionNonce": 449462985, + "version": 2, + "versionNonce": 1278240551, "width": 10, "x": 10, "y": 10, } `; -exports[`regression tests key l selects line tool: [end of test] history 1`] = ` +exports[`regression tests key o selects ellipse tool: [end of test] history 1`] = ` Object { "recording": false, "redoStack": Array [], @@ -11836,38 +11851,23 @@ Object { "angle": 0, "backgroundColor": "transparent", "boundElements": null, - "endArrowhead": null, - "endBinding": null, "fillStyle": "hachure", "groupIds": Array [], "height": 10, "id": "id0", "isDeleted": false, - "lastCommittedPoint": null, "link": null, "opacity": 100, - "points": Array [ - Array [ - 0, - 0, - ], - Array [ - 10, - 10, - ], - ], "roughness": 1, "seed": 337897, - "startArrowhead": null, - "startBinding": null, "strokeColor": "#000000", - "strokeSharpness": "round", + "strokeSharpness": "sharp", "strokeStyle": "solid", "strokeWidth": 1, - "type": "line", + "type": "ellipse", "updated": 1, - "version": 3, - "versionNonce": 449462985, + "version": 2, + "versionNonce": 1278240551, "width": 10, "x": 10, "y": 10, @@ -11878,9 +11878,9 @@ Object { } `; -exports[`regression tests key l selects line tool: [end of test] number of elements 1`] = `1`; +exports[`regression tests key o selects ellipse tool: [end of test] number of elements 1`] = `1`; -exports[`regression tests key l selects line tool: [end of test] number of renders 1`] = `8`; +exports[`regression tests key o selects ellipse tool: [end of test] number of renders 1`] = `8`; exports[`regression tests key r selects rectangle tool: [end of test] appState 1`] = ` Object { diff --git a/src/tests/regressionTests.test.tsx b/src/tests/regressionTests.test.tsx index 1cc9571c54..bd768e6788 100644 --- a/src/tests/regressionTests.test.tsx +++ b/src/tests/regressionTests.test.tsx @@ -135,7 +135,7 @@ describe("regression tests", () => { for (const [keys, shape, shouldSelect] of [ [`2${KEYS.R}`, "rectangle", true], [`3${KEYS.D}`, "diamond", true], - [`4${KEYS.E}`, "ellipse", true], + [`4${KEYS.O}`, "ellipse", true], [`5${KEYS.A}`, "arrow", true], [`6${KEYS.L}`, "line", true], [`7${KEYS.X}`, "freedraw", false],