From 5be5b9de075073bab37211608ac850b28aa79c4e Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 8 Sep 2020 15:38:21 +0530 Subject: [PATCH 01/23] GUI setup --- browser/main/Detail/MarkdownNoteDetail.js | 3 + .../main/Detail/MultipleSelectionDialog.js | 60 +++++++++++++++++++ .../main/Detail/MultipleSelectionDialog.styl | 41 +++++++++++++ 3 files changed, 104 insertions(+) create mode 100644 browser/main/Detail/MultipleSelectionDialog.js create mode 100644 browser/main/Detail/MultipleSelectionDialog.styl diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js index be76e35c4..6c6a3b544 100755 --- a/browser/main/Detail/MarkdownNoteDetail.js +++ b/browser/main/Detail/MarkdownNoteDetail.js @@ -23,6 +23,7 @@ import RestoreButton from './RestoreButton' import PermanentDeleteButton from './PermanentDeleteButton' import InfoButton from './InfoButton' import ToggleModeButton from './ToggleModeButton' +import MultipleSelectionDialog from './MultipleSelectionDialog' import InfoPanel from './InfoPanel' import InfoPanelTrashed from './InfoPanelTrashed' import { formatDate } from 'browser/lib/date-formatter' @@ -622,6 +623,8 @@ class MarkdownNoteDetail extends React.Component { type={note.type} print={this.print} /> + + ) diff --git a/browser/main/Detail/MultipleSelectionDialog.js b/browser/main/Detail/MultipleSelectionDialog.js new file mode 100644 index 000000000..4b9ed782d --- /dev/null +++ b/browser/main/Detail/MultipleSelectionDialog.js @@ -0,0 +1,60 @@ +import PropTypes from 'prop-types' +import React from 'react' +import CSSModules from 'browser/lib/CSSModules' +import styles from './MultipleSelectionDialog.styl' +import i18n from 'browser/lib/i18n' +/** + * Dialog shown when multiple notes are selected + */ +class MultipleSelectionDialog extends React.Component { + constructor(props) { + super(props) + this.state = { + nSelectedNotes: 7 + } + } + render() { + return ( +
+
{`${this.state.nSelectedNotes} ${i18n.__( + 'notes selected' + )}`}
+
+
+ + +
+
+ + +
+
+
+
+ + +
+
+ + +
+
+
+ ) + } +} + +export default CSSModules(MultipleSelectionDialog, styles) diff --git a/browser/main/Detail/MultipleSelectionDialog.styl b/browser/main/Detail/MultipleSelectionDialog.styl new file mode 100644 index 000000000..01a63c663 --- /dev/null +++ b/browser/main/Detail/MultipleSelectionDialog.styl @@ -0,0 +1,41 @@ +.multipleSelectionDialog + position absolute + top 50vh + left 50% + transform translate(-50%, -50%) + color $ui-text-color + background-color $ui-noteList-backgroundColor + padding 1em + + box-shadow 2px 12px 15px 2px rgba(0, 0, 0, 0.1), 2px 1px 50px 2px rgba(0, 0, 0, 0.1) + .row + display flex + justify-content space-between + .button-box + display flex + border-radius 5px + button + color $ui-text-color + border none + + font-size 24px + padding 0.5em + img + height 1em + +apply-theme(theme) + body[data-theme={theme}] + .multipleSelectionDialog + color get-theme-var(theme, 'text-color') + background-color get-theme-var(theme, 'noteList-backgroundColor') + .row + .button-box + button + color get-theme-var(theme, 'text-color') + background-color get-theme-var(theme, 'noteList-backgroundColor') + +for theme in 'dark' 'solarized-dark' 'dracula' + apply-theme(theme) + +for theme in $themes + apply-theme(theme) From 159bf58d945c54944ebf2f3eb63a971b3b8c243a Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Mon, 14 Sep 2020 20:39:47 +0530 Subject: [PATCH 02/23] Removed dialog from MarkdownDetails page --- browser/main/Detail/MarkdownNoteDetail.js | 3 --- browser/main/{Detail => NoteList}/MultipleSelectionDialog.js | 0 browser/main/{Detail => NoteList}/MultipleSelectionDialog.styl | 0 3 files changed, 3 deletions(-) rename browser/main/{Detail => NoteList}/MultipleSelectionDialog.js (100%) rename browser/main/{Detail => NoteList}/MultipleSelectionDialog.styl (100%) diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js index 6c6a3b544..be76e35c4 100755 --- a/browser/main/Detail/MarkdownNoteDetail.js +++ b/browser/main/Detail/MarkdownNoteDetail.js @@ -23,7 +23,6 @@ import RestoreButton from './RestoreButton' import PermanentDeleteButton from './PermanentDeleteButton' import InfoButton from './InfoButton' import ToggleModeButton from './ToggleModeButton' -import MultipleSelectionDialog from './MultipleSelectionDialog' import InfoPanel from './InfoPanel' import InfoPanelTrashed from './InfoPanelTrashed' import { formatDate } from 'browser/lib/date-formatter' @@ -623,8 +622,6 @@ class MarkdownNoteDetail extends React.Component { type={note.type} print={this.print} /> - - ) diff --git a/browser/main/Detail/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js similarity index 100% rename from browser/main/Detail/MultipleSelectionDialog.js rename to browser/main/NoteList/MultipleSelectionDialog.js diff --git a/browser/main/Detail/MultipleSelectionDialog.styl b/browser/main/NoteList/MultipleSelectionDialog.styl similarity index 100% rename from browser/main/Detail/MultipleSelectionDialog.styl rename to browser/main/NoteList/MultipleSelectionDialog.styl From 6e95b90c2773fd6d5ed51f6654c3bca501768699 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Mon, 14 Sep 2020 21:27:19 +0530 Subject: [PATCH 03/23] Added multiple selection dialog to noteList --- browser/main/NoteList/MultipleSelectionDialog.js | 6 +++++- browser/main/NoteList/MultipleSelectionDialog.styl | 5 +++-- browser/main/NoteList/index.js | 2 ++ 3 files changed, 10 insertions(+), 3 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 4b9ed782d..ae803d2b3 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -10,7 +10,8 @@ class MultipleSelectionDialog extends React.Component { constructor(props) { super(props) this.state = { - nSelectedNotes: 7 + nSelectedNotes: 7, + isVisible: true // change to false } } render() { @@ -18,6 +19,9 @@ class MultipleSelectionDialog extends React.Component {
{`${this.state.nSelectedNotes} ${i18n.__( 'notes selected' diff --git a/browser/main/NoteList/MultipleSelectionDialog.styl b/browser/main/NoteList/MultipleSelectionDialog.styl index 01a63c663..f4af2186b 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.styl +++ b/browser/main/NoteList/MultipleSelectionDialog.styl @@ -1,8 +1,9 @@ .multipleSelectionDialog position absolute top 50vh - left 50% - transform translate(-50%, -50%) + left 100% + z-index 9 + transform translateY(-50%) color $ui-text-color background-color $ui-noteList-backgroundColor padding 1em diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 51dfe0d85..61205f6cb 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -9,6 +9,7 @@ import ee from 'browser/main/lib/eventEmitter' import dataApi from 'browser/main/lib/dataApi' import attachmentManagement from 'browser/main/lib/dataApi/attachmentManagement' import ConfigManager from 'browser/main/lib/ConfigManager' +import MultipleSelectionDialog from './MultipleSelectionDialog' import NoteItem from 'browser/components/NoteItem' import NoteItemSimple from 'browser/components/NoteItemSimple' import searchFromNotes from 'browser/lib/search' @@ -1391,6 +1392,7 @@ class NoteList extends React.Component { > {noteList}
+
) } From 57436c318a1086f3818e5ff866bf27c14c0dc368 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 00:07:12 +0530 Subject: [PATCH 04/23] using number of selected notes to determine if MultipleSelectionDialog should be visible --- browser/main/NoteList/MultipleSelectionDialog.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index ae803d2b3..99322d47f 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -10,8 +10,7 @@ class MultipleSelectionDialog extends React.Component { constructor(props) { super(props) this.state = { - nSelectedNotes: 7, - isVisible: true // change to false + nSelectedNotes: 7 } } render() { @@ -20,7 +19,7 @@ class MultipleSelectionDialog extends React.Component { className='multipleSelectionDialog' styleName='multipleSelectionDialog' style={{ - display: this.state.isVisible ? 'block' : 'none' + display: this.state.nSelectedNotes > 1 ? 'block' : 'none' }} >
{`${this.state.nSelectedNotes} ${i18n.__( From 7d19931a6386c222c19273624859748feeed8fe3 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 01:37:27 +0530 Subject: [PATCH 05/23] toggling only when multiple notes selected, linked N notes selected to actual selection --- browser/main/NoteList/MultipleSelectionDialog.js | 13 +++++-------- browser/main/NoteList/index.js | 2 +- 2 files changed, 6 insertions(+), 9 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 99322d47f..6ec79897e 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -7,22 +7,19 @@ import i18n from 'browser/lib/i18n' * Dialog shown when multiple notes are selected */ class MultipleSelectionDialog extends React.Component { - constructor(props) { - super(props) - this.state = { - nSelectedNotes: 7 - } - } + // constructor(props) { + // super(props) + // } render() { return (
1 ? 'block' : 'none' + display: this.props.nSelectedNotes > 1 ? 'block' : 'none' }} > -
{`${this.state.nSelectedNotes} ${i18n.__( +
{`${this.props.nSelectedNotes} ${i18n.__( 'notes selected' )}`}
diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 61205f6cb..2b285c05d 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -1392,7 +1392,7 @@ class NoteList extends React.Component { > {noteList}
- +
) } From 2dfd5c2cf76b7e2589cf2d21ddc3d0e823fac294 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 06:49:53 +0530 Subject: [PATCH 06/23] Pin and Unpin made functional --- .../main/NoteList/MultipleSelectionDialog.js | 4 +-- browser/main/NoteList/index.js | 28 ++++++++++++++++--- 2 files changed, 26 insertions(+), 6 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 6ec79897e..f724e7267 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -32,10 +32,10 @@ class MultipleSelectionDialog extends React.Component {
- - +
diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 2b285c05d..963dce9ef 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -95,7 +95,9 @@ class NoteList extends React.Component { this.cloneNote = this.cloneNote.bind(this) this.deleteNote = this.deleteNote.bind(this) this.focusNote = this.focusNote.bind(this) - this.pinToTop = this.pinToTop.bind(this) + this.togglePinToTop = this.togglePinToTop.bind(this) // pin if unpined, unpin if pinned + this.pinToTop = this.pinToTop.bind(this) // pin all selected + this.unpin = this.unpin.bind(this) // unpin all selected this.getNoteStorage = this.getNoteStorage.bind(this) this.getNoteFolder = this.getNoteFolder.bind(this) this.getViewType = this.getViewType.bind(this) @@ -706,7 +708,7 @@ class NoteList extends React.Component { if (!location.pathname.match(/\/starred/)) { templates.push({ label: pinLabel, - click: this.pinToTop + click: this.togglePinToTop }) } templates.push( @@ -814,13 +816,27 @@ class NoteList extends React.Component { } } - pinToTop() { + togglePinToTop() { this.updateSelectedNotes(note => { note.isPinned = !note.isPinned return note }) } + pinToTop() { + this.updateSelectedNotes(note => { + note.isPinned = true + return note + }) + } + + unpin() { + this.updateSelectedNotes(note => { + note.isPinned = false + return note + }) + } + restoreNote() { this.updateSelectedNotes(note => { note.isTrashed = false @@ -1392,7 +1408,11 @@ class NoteList extends React.Component { > {noteList}
- + ) } From ee182b6aae6b6681d770fe70198a54aa2140a2e1 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 07:05:07 +0530 Subject: [PATCH 07/23] Added starring and unstarring feature --- .../main/NoteList/MultipleSelectionDialog.js | 6 ++--- browser/main/NoteList/index.js | 24 ++++++++++++++++--- 2 files changed, 24 insertions(+), 6 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index f724e7267..21223ad0c 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -24,10 +24,10 @@ class MultipleSelectionDialog extends React.Component { )}`}
- -
@@ -35,7 +35,7 @@ class MultipleSelectionDialog extends React.Component { - +
diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 963dce9ef..12aa387b3 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -97,7 +97,9 @@ class NoteList extends React.Component { this.focusNote = this.focusNote.bind(this) this.togglePinToTop = this.togglePinToTop.bind(this) // pin if unpined, unpin if pinned this.pinToTop = this.pinToTop.bind(this) // pin all selected - this.unpin = this.unpin.bind(this) // unpin all selected + this.unPin = this.unPin.bind(this) // unpin all selected + this.star = this.star.bind(this) // pin all selected + this.unStar = this.unStar.bind(this) // unpin all selected this.getNoteStorage = this.getNoteStorage.bind(this) this.getNoteFolder = this.getNoteFolder.bind(this) this.getViewType = this.getViewType.bind(this) @@ -830,13 +832,27 @@ class NoteList extends React.Component { }) } - unpin() { + unPin() { this.updateSelectedNotes(note => { note.isPinned = false return note }) } + star() { + this.updateSelectedNotes(note => { + note.isStarred = true + return note + }) + } + + unStar() { + this.updateSelectedNotes(note => { + note.isStarred = false + return note + }) + } + restoreNote() { this.updateSelectedNotes(note => { note.isTrashed = false @@ -1411,7 +1427,9 @@ class NoteList extends React.Component {
) From 4fdf66e10626c22114a8a58a0fb0c006e01cbc90 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 12:39:15 +0530 Subject: [PATCH 08/23] Added tool tips --- .../main/NoteList/MultipleSelectionDialog.js | 20 +++++++++++++--- .../NoteList/MultipleSelectionDialog.styl | 23 +++++++++++++++++++ 2 files changed, 40 insertions(+), 3 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 21223ad0c..94f595f4e 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -26,30 +26,44 @@ class MultipleSelectionDialog extends React.Component {
+ -
+ -
+ -
diff --git a/browser/main/NoteList/MultipleSelectionDialog.styl b/browser/main/NoteList/MultipleSelectionDialog.styl index f4af2186b..8b42366b7 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.styl +++ b/browser/main/NoteList/MultipleSelectionDialog.styl @@ -16,6 +16,10 @@ display flex border-radius 5px button + position relative + &:hover .tooltip + opacity 1 + color $ui-text-color border none @@ -24,6 +28,25 @@ img height 1em +.tooltip + tooltip() + position absolute + pointer-events none + white-space nowrap + top 100% + left 50% + transform translateX(-50%) + z-index 200 + padding 5px + line-height normal + border-radius 2px + opacity 0 + transition 0.1s + +.tooltip:lang(ja) + @extend .tooltip + right 46px + apply-theme(theme) body[data-theme={theme}] .multipleSelectionDialog From 33723d0649e32611c4e31c8f2147f59225c1eeae Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 15:10:53 +0530 Subject: [PATCH 09/23] Added new permanently delete icon --- browser/main/NoteList/MultipleSelectionDialog.js | 2 +- resources/icon/icon-permanent-delete.svg | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) create mode 100644 resources/icon/icon-permanent-delete.svg diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 94f595f4e..e161e611a 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -51,7 +51,7 @@ class MultipleSelectionDialog extends React.Component { {i18n.__('Trash')} diff --git a/resources/icon/icon-permanent-delete.svg b/resources/icon/icon-permanent-delete.svg new file mode 100644 index 000000000..b435a749b --- /dev/null +++ b/resources/icon/icon-permanent-delete.svg @@ -0,0 +1 @@ + \ No newline at end of file From 9ee1a77720206e90da4a1da8746a89932424d2b6 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 17:05:09 +0530 Subject: [PATCH 10/23] Added trash feature --- browser/main/NoteList/MultipleSelectionDialog.js | 6 ++---- browser/main/NoteList/MultipleSelectionDialog.styl | 3 +++ browser/main/NoteList/index.js | 11 +++++++++++ 3 files changed, 16 insertions(+), 4 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index e161e611a..9869d772c 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -19,9 +19,7 @@ class MultipleSelectionDialog extends React.Component { display: this.props.nSelectedNotes > 1 ? 'block' : 'none' }} > -
{`${this.props.nSelectedNotes} ${i18n.__( - 'notes selected' - )}`}
+

{`${this.props.nSelectedNotes} ${i18n.__('notes selected')}`}

- diff --git a/browser/main/NoteList/MultipleSelectionDialog.styl b/browser/main/NoteList/MultipleSelectionDialog.styl index 8b42366b7..0d465de80 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.styl +++ b/browser/main/NoteList/MultipleSelectionDialog.styl @@ -9,6 +9,8 @@ padding 1em box-shadow 2px 12px 15px 2px rgba(0, 0, 0, 0.1), 2px 1px 50px 2px rgba(0, 0, 0, 0.1) + h3 + font-size 1.5em .row display flex justify-content space-between @@ -21,6 +23,7 @@ opacity 1 color $ui-text-color + background-color inherit border none font-size 24px diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 12aa387b3..6835e2b70 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -100,6 +100,7 @@ class NoteList extends React.Component { this.unPin = this.unPin.bind(this) // unpin all selected this.star = this.star.bind(this) // pin all selected this.unStar = this.unStar.bind(this) // unpin all selected + this.trash = this.trash.bind(this) this.getNoteStorage = this.getNoteStorage.bind(this) this.getNoteFolder = this.getNoteFolder.bind(this) this.getViewType = this.getViewType.bind(this) @@ -853,6 +854,15 @@ class NoteList extends React.Component { }) } + trash() { + const { confirmDeletion } = this.props.config.ui + if (!confirmDeleteNote(confirmDeletion, true)) return + this.updateSelectedNotes(note => { + note.isTrashed = true + return note + }) + } + restoreNote() { this.updateSelectedNotes(note => { note.isTrashed = false @@ -1430,6 +1440,7 @@ class NoteList extends React.Component { onUnPined={this.unPin} onStarred={this.star} onUnStarred={this.unStar} + onTrashed={this.trash} />
) From 859a41f683de86163a39e9ff696ccd9f4a8e81ff Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 19:43:31 +0530 Subject: [PATCH 11/23] added permanetly delete feature, splited delete function in this.trash and this.permanentlyDelete --- .../main/NoteList/MultipleSelectionDialog.js | 2 +- browser/main/NoteList/index.js | 122 ++++++++++-------- 2 files changed, 69 insertions(+), 55 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 9869d772c..28dfd6422 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -48,7 +48,7 @@ class MultipleSelectionDialog extends React.Component { {i18n.__('Trash')} - diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 6835e2b70..950a43821 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -98,9 +98,10 @@ class NoteList extends React.Component { this.togglePinToTop = this.togglePinToTop.bind(this) // pin if unpined, unpin if pinned this.pinToTop = this.pinToTop.bind(this) // pin all selected this.unPin = this.unPin.bind(this) // unpin all selected - this.star = this.star.bind(this) // pin all selected - this.unStar = this.unStar.bind(this) // unpin all selected + this.star = this.star.bind(this) + this.unStar = this.unStar.bind(this) this.trash = this.trash.bind(this) + this.permanentlyDelete = this.permanentlyDelete.bind(this) this.getNoteStorage = this.getNoteStorage.bind(this) this.getNoteFolder = this.getNoteFolder.bind(this) this.getViewType = this.getViewType.bind(this) @@ -855,12 +856,70 @@ class NoteList extends React.Component { } trash() { + const { dispatch } = this.props + const { selectedNoteKeys } = this.state + const notes = this.notes.map(note => Object.assign({}, note)) + const selectedNotes = findNotesByKeys(notes, selectedNoteKeys) + const firstNote = selectedNotes[0] const { confirmDeletion } = this.props.config.ui + + if (!confirmDeleteNote(confirmDeletion, false)) return + + Promise.all( + selectedNotes.map(note => { + note.isTrashed = true + + return dataApi.updateNote(note.storage, note.key, note) + }) + ) + .then(newNotes => { + newNotes.forEach(newNote => { + dispatch({ + type: 'UPDATE_NOTE', + note: newNote + }) + }) + AwsMobileAnalyticsConfig.recordDynamicCustomEvent('EDIT_NOTE') + }) + .then(() => ee.emit('list:next')) + .catch(err => { + console.error('Notes could not go to trash: ' + err) + }) + this.setState({ selectedNoteKeys: [] }) + } + + permanentlyDelete() { + const { dispatch } = this.props + const { selectedNoteKeys } = this.state + const notes = this.notes.map(note => Object.assign({}, note)) + const selectedNotes = findNotesByKeys(notes, selectedNoteKeys) + const firstNote = selectedNotes[0] + const { confirmDeletion } = this.props.config.ui + if (!confirmDeleteNote(confirmDeletion, true)) return - this.updateSelectedNotes(note => { - note.isTrashed = true - return note - }) + + Promise.all( + selectedNotes.map(note => { + return dataApi.deleteNote(note.storage, note.key) + }) + ) + .then(data => { + const dispatchHandler = () => { + data.forEach(item => { + dispatch({ + type: 'DELETE_NOTE', + storageKey: item.storageKey, + noteKey: item.noteKey + }) + }) + } + ee.once('list:next', dispatchHandler) + }) + .then(() => ee.emit('list:next')) + .catch(err => { + console.error('Cannot Delete note: ' + err) + }) + this.setState({ selectedNoteKeys: [] }) } restoreNote() { @@ -871,62 +930,16 @@ class NoteList extends React.Component { } deleteNote() { - const { dispatch } = this.props const { selectedNoteKeys } = this.state const notes = this.notes.map(note => Object.assign({}, note)) const selectedNotes = findNotesByKeys(notes, selectedNoteKeys) const firstNote = selectedNotes[0] - const { confirmDeletion } = this.props.config.ui if (firstNote.isTrashed) { - if (!confirmDeleteNote(confirmDeletion, true)) return - - Promise.all( - selectedNotes.map(note => { - return dataApi.deleteNote(note.storage, note.key) - }) - ) - .then(data => { - const dispatchHandler = () => { - data.forEach(item => { - dispatch({ - type: 'DELETE_NOTE', - storageKey: item.storageKey, - noteKey: item.noteKey - }) - }) - } - ee.once('list:next', dispatchHandler) - }) - .then(() => ee.emit('list:next')) - .catch(err => { - console.error('Cannot Delete note: ' + err) - }) + this.permanentlyDelete() } else { - if (!confirmDeleteNote(confirmDeletion, false)) return - - Promise.all( - selectedNotes.map(note => { - note.isTrashed = true - - return dataApi.updateNote(note.storage, note.key, note) - }) - ) - .then(newNotes => { - newNotes.forEach(newNote => { - dispatch({ - type: 'UPDATE_NOTE', - note: newNote - }) - }) - AwsMobileAnalyticsConfig.recordDynamicCustomEvent('EDIT_NOTE') - }) - .then(() => ee.emit('list:next')) - .catch(err => { - console.error('Notes could not go to trash: ' + err) - }) + this.trash() } - this.setState({ selectedNoteKeys: [] }) } cloneNote() { @@ -1441,6 +1454,7 @@ class NoteList extends React.Component { onStarred={this.star} onUnStarred={this.unStar} onTrashed={this.trash} + onDeleted={this.permanentlyDelete} />
) From 7dc9942a55c8d1f30998447e17e77e1e0d3a7f51 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Tue, 15 Sep 2020 19:48:07 +0530 Subject: [PATCH 12/23] made props name grammatically more sensible --- browser/main/NoteList/MultipleSelectionDialog.js | 12 ++++++------ browser/main/NoteList/index.js | 12 ++++++------ 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 28dfd6422..1f8ed21d8 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -22,21 +22,21 @@ class MultipleSelectionDialog extends React.Component {

{`${this.props.nSelectedNotes} ${i18n.__('notes selected')}`}

- -
- - @@ -44,11 +44,11 @@ class MultipleSelectionDialog extends React.Component {
- - diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 950a43821..8d0b358fd 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -1449,12 +1449,12 @@ class NoteList extends React.Component {
) From 72efcdde16acc4a5e94e6eafd8e97d8a2040e42c Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Wed, 16 Sep 2020 17:35:36 +0530 Subject: [PATCH 13/23] Added proper pin and unpin icons --- browser/main/NoteList/MultipleSelectionDialog.js | 4 ++-- resources/icon/icon-pin.svg | 1 + resources/icon/icon-unpin.svg | 1 + 3 files changed, 4 insertions(+), 2 deletions(-) create mode 100644 resources/icon/icon-pin.svg create mode 100644 resources/icon/icon-unpin.svg diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 1f8ed21d8..8a651da7e 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -33,11 +33,11 @@ class MultipleSelectionDialog extends React.Component {
diff --git a/resources/icon/icon-pin.svg b/resources/icon/icon-pin.svg new file mode 100644 index 000000000..090f959af --- /dev/null +++ b/resources/icon/icon-pin.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/resources/icon/icon-unpin.svg b/resources/icon/icon-unpin.svg new file mode 100644 index 000000000..cd1423fc3 --- /dev/null +++ b/resources/icon/icon-unpin.svg @@ -0,0 +1 @@ + \ No newline at end of file From 5afe4b8f5b1d571687c7c9c7fde84e1e9883f378 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Wed, 16 Sep 2020 17:37:12 +0530 Subject: [PATCH 14/23] Added export type icons and updated design --- .../main/NoteList/MultipleSelectionDialog.js | 18 ++++++++++++++++-- .../main/NoteList/MultipleSelectionDialog.styl | 4 +++- 2 files changed, 19 insertions(+), 3 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 8a651da7e..7c1858326 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -55,9 +55,23 @@ class MultipleSelectionDialog extends React.Component {
+ + + +
+
From 5d5d50b43567dbfbb9ec3eda04dd58c94ca6a1e4 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Thu, 17 Sep 2020 04:09:59 +0530 Subject: [PATCH 16/23] added propTypes description --- browser/main/NoteList/MultipleSelectionDialog.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 12abfbfc4..f1917ff7c 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -83,4 +83,14 @@ class MultipleSelectionDialog extends React.Component { } } +MultipleSelectionDialog.propTypes = { + nSelectedNotes: PropTypes.number.isRequired, + onStar: PropTypes.func.isRequired, + onUnStar: PropTypes.func.isRequired, + onPin: PropTypes.func.isRequired, + onUnPin: PropTypes.func.isRequired, + onTrash: PropTypes.func.isRequired, + onDelete: PropTypes.func.isRequired +} + export default CSSModules(MultipleSelectionDialog, styles) From b3f3633d91091fc5d19d48ead8d6bbb3d918fa2d Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Fri, 18 Sep 2020 01:58:38 +0530 Subject: [PATCH 17/23] Added export feature --- .../main/NoteList/MultipleSelectionDialog.js | 11 ++- browser/main/NoteList/index.js | 93 +++++++++++++++++++ 2 files changed, 99 insertions(+), 5 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index f1917ff7c..9b712d534 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -54,19 +54,19 @@ class MultipleSelectionDialog extends React.Component {
- - - - @@ -90,7 +90,8 @@ MultipleSelectionDialog.propTypes = { onPin: PropTypes.func.isRequired, onUnPin: PropTypes.func.isRequired, onTrash: PropTypes.func.isRequired, - onDelete: PropTypes.func.isRequired + onDelete: PropTypes.func.isRequired, + onExport: PropTypes.func.isRequired } export default CSSModules(MultipleSelectionDialog, styles) diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 8d0b358fd..9581ab346 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -102,6 +102,7 @@ class NoteList extends React.Component { this.unStar = this.unStar.bind(this) this.trash = this.trash.bind(this) this.permanentlyDelete = this.permanentlyDelete.bind(this) + this.exportAllSelected = this.exportAllSelected.bind(this) this.getNoteStorage = this.getNoteStorage.bind(this) this.getNoteFolder = this.getNoteFolder.bind(this) this.getViewType = this.getViewType.bind(this) @@ -674,6 +675,97 @@ class NoteList extends React.Component { }) } + exportAllSelected(e, fileType) { + // Select directory + // trying export all notes one by one + // if a file already exists, ask resolution method [replace, replace all, skip, skip all, quit] + // replace all: replace all conflicting files + // skip all: skip all conflicting files + const options = { + title: i18n.__('Select folder for the exports'), + properties: ['openDirectory', 'createDirectory'] + } + + // Find the target folder + dialog.showOpenDialog(remote.getCurrentWindow(), options, folderPaths => { + if (folderPaths) { + // To show succesful and un-succesful attempts + let replaceAll = false + let skipAll = false + + // Export each note one by one + const folderPath = folderPaths[0] + const { selectedNoteKeys } = this.state + selectedNoteKeys.every(noteKey => { + // Find the name + const note = findNoteByKey(this.notes, noteKey) + // generate full path and add extensions to + const filename = + filenamify(note.title, { replacement: '_' }) + `.${fileType}` + const filepath = path.join(folderPath, filename) + + if (fs.existsSync(filepath)) { + if (skipAll) { + return + } else if (replaceAll) { + // pass through, file will be over-written + } else { + const options = { + buttons: [ + // if you change the order, change switch(response) too + i18n.__('Replace'), + i18n.__('Replace All'), + i18n.__('Skip'), + i18n.__('Skip All'), + i18n.__('Abort') + ], + message: `${filename} ${i18n.__( + 'already exists in selected folder.' + )}` + } + const response = dialog.showMessageBox( + remote.getCurrentWindow(), + options + ) + switch (response) { + case 0: + // do nothing file will be over-written + break + case 1: + replaceAll = true + break + case 2: + return true // return to skip to next item in mapped array + case 3: + skipAll = true + return true + case 4: + return false // break out of for each + } + } + } + + const { config } = this.props + dataApi + .exportNoteAs(note, filepath, fileType, config) + .then(res => { + console.log( + `${filepath} ${i18n.__('was exported successsfully')}` + ) + }) + .catch(err => { + console.log( + `${i18n.__('Error while expoting')} ${filepath} : ${ + err ? err.message || err : 'Unexpected error during export' + }` + ) + }) + return true + }) + } + }) + } + handleNoteContextMenu(e, uniqueKey) { const { location } = this.props const { selectedNoteKeys } = this.state @@ -1455,6 +1547,7 @@ class NoteList extends React.Component { onUnStar={this.unStar} onTrash={this.trash} onDelete={this.permanentlyDelete} + onExport={this.exportAllSelected} />
) From 46aefee528f99d19f500db617cf4496898ef65fb Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Fri, 18 Sep 2020 01:59:25 +0530 Subject: [PATCH 18/23] removed un-used variable --- browser/main/NoteList/index.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 9581ab346..e9f6c6bcf 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -952,7 +952,6 @@ class NoteList extends React.Component { const { selectedNoteKeys } = this.state const notes = this.notes.map(note => Object.assign({}, note)) const selectedNotes = findNotesByKeys(notes, selectedNoteKeys) - const firstNote = selectedNotes[0] const { confirmDeletion } = this.props.config.ui if (!confirmDeleteNote(confirmDeletion, false)) return @@ -985,7 +984,6 @@ class NoteList extends React.Component { const { selectedNoteKeys } = this.state const notes = this.notes.map(note => Object.assign({}, note)) const selectedNotes = findNotesByKeys(notes, selectedNoteKeys) - const firstNote = selectedNotes[0] const { confirmDeletion } = this.props.config.ui if (!confirmDeleteNote(confirmDeletion, true)) return From 257c96e3715ec2d6a849b1fab88adeadd55aef06 Mon Sep 17 00:00:00 2001 From: Abhay Raj Singh Date: Fri, 30 Oct 2020 14:30:37 +0530 Subject: [PATCH 19/23] Publish support --- browser/main/NoteList/MultipleSelectionDialog.js | 5 +++-- browser/main/NoteList/index.js | 1 + 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 9b712d534..58762c3da 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -72,7 +72,7 @@ class MultipleSelectionDialog extends React.Component {
- @@ -91,7 +91,8 @@ MultipleSelectionDialog.propTypes = { onUnPin: PropTypes.func.isRequired, onTrash: PropTypes.func.isRequired, onDelete: PropTypes.func.isRequired, - onExport: PropTypes.func.isRequired + onExport: PropTypes.func.isRequired, + onPublish: PropTypes.func.isRequired } export default CSSModules(MultipleSelectionDialog, styles) diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index e9f6c6bcf..09a8ea7ed 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -1546,6 +1546,7 @@ class NoteList extends React.Component { onTrash={this.trash} onDelete={this.permanentlyDelete} onExport={this.exportAllSelected} + onPublish={this.publishMarkdown.bind(this)} />
) From 3c8be7a5f359b584de89ecf7df78a82a412a1c21 Mon Sep 17 00:00:00 2001 From: Abhay Date: Sun, 27 Dec 2020 13:37:50 +0530 Subject: [PATCH 20/23] added adding and removing tags feature --- .../main/NoteList/MultipleSelectionDialog.js | 28 ++++- .../NoteList/MultipleSelectionDialog.styl | 37 +++--- browser/main/NoteList/index.js | 32 +++++ resources/icon/addtag.svg | 113 +++++++++++++++++ resources/icon/removetag.svg | 116 ++++++++++++++++++ 5 files changed, 309 insertions(+), 17 deletions(-) create mode 100644 resources/icon/addtag.svg create mode 100644 resources/icon/removetag.svg diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 58762c3da..40497f200 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -72,12 +72,36 @@ class MultipleSelectionDialog extends React.Component {
-
+
+ + +
+
+ + +
) } @@ -85,6 +109,8 @@ class MultipleSelectionDialog extends React.Component { MultipleSelectionDialog.propTypes = { nSelectedNotes: PropTypes.number.isRequired, + addTag: PropTypes.func.isRequired, + removeTag: PropTypes.func.isRequired, onStar: PropTypes.func.isRequired, onUnStar: PropTypes.func.isRequired, onPin: PropTypes.func.isRequired, diff --git a/browser/main/NoteList/MultipleSelectionDialog.styl b/browser/main/NoteList/MultipleSelectionDialog.styl index 38c1f5391..85f1af007 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.styl +++ b/browser/main/NoteList/MultipleSelectionDialog.styl @@ -12,26 +12,32 @@ h3 font-size 1.5em text-align center - .row + .row display flex justify-content space-between .button-box display flex margin 0.5em margin-bottom 0 - button - position relative - &:hover .tooltip - opacity 1 + button + position relative + &:hover .tooltip + opacity 1 - color $ui-text-color - background-color inherit - border none + color $ui-text-color + background-color inherit + border none - font-size 24px - padding 0.5em - img - height 1em + font-size 24px + padding 0.5em + img + height 1em + + .input-row + input + background-color inherit + border 2px solid $ui-text-color + color $ui-text-color .tooltip tooltip() @@ -58,10 +64,9 @@ apply-theme(theme) color get-theme-var(theme, 'text-color') background-color get-theme-var(theme, 'noteList-backgroundColor') .row - .button-box - button - color get-theme-var(theme, 'text-color') - background-color get-theme-var(theme, 'noteList-backgroundColor') + button + color get-theme-var(theme, 'text-color') + background-color get-theme-var(theme, 'noteList-backgroundColor') for theme in 'dark' 'solarized-dark' 'dracula' apply-theme(theme) diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js index 09a8ea7ed..a8f552c63 100644 --- a/browser/main/NoteList/index.js +++ b/browser/main/NoteList/index.js @@ -103,6 +103,8 @@ class NoteList extends React.Component { this.trash = this.trash.bind(this) this.permanentlyDelete = this.permanentlyDelete.bind(this) this.exportAllSelected = this.exportAllSelected.bind(this) + this.addTag = this.addTag.bind(this) + this.removeTag = this.removeTag.bind(this) this.getNoteStorage = this.getNoteStorage.bind(this) this.getNoteFolder = this.getNoteFolder.bind(this) this.getViewType = this.getViewType.bind(this) @@ -947,6 +949,34 @@ class NoteList extends React.Component { }) } + addTag(newTag) { + newTag = newTag.trim().replace(/ +/g, '_') + if (newTag.charAt(0) === '#') { + newTag.substring(1) + } + + if (newTag.length <= 0) { + return + } + + this.updateSelectedNotes(note => { + note.tags = _.isArray(note.tags) ? note.tags.slice() : [] + + if (!_.includes(note.tags, newTag)) { + note.tags.push(newTag) + } + return note + }) + } + + removeTag(tagname) { + this.updateSelectedNotes(note => { + note.tags = _.isArray(note.tags) ? note.tags.slice() : [] + note.tags.splice(note.tags.indexOf(tagname), 1) + return note + }) + } + trash() { const { dispatch } = this.props const { selectedNoteKeys } = this.state @@ -1539,6 +1569,8 @@ class NoteList extends React.Component { + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + diff --git a/resources/icon/removetag.svg b/resources/icon/removetag.svg new file mode 100644 index 000000000..1a0c5cb3d --- /dev/null +++ b/resources/icon/removetag.svg @@ -0,0 +1,116 @@ + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + From e1009d4637e4a02c82d7f3a23352a1b44467f388 Mon Sep 17 00:00:00 2001 From: Abhay Date: Sun, 27 Dec 2020 17:21:46 +0530 Subject: [PATCH 21/23] Fixed not starting bug, stylized input fields --- browser/main/NoteList/MultipleSelectionDialog.js | 6 ++++-- browser/main/NoteList/MultipleSelectionDialog.styl | 14 +++++++++++--- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/browser/main/NoteList/MultipleSelectionDialog.js b/browser/main/NoteList/MultipleSelectionDialog.js index 40497f200..c6aeb2f2b 100644 --- a/browser/main/NoteList/MultipleSelectionDialog.js +++ b/browser/main/NoteList/MultipleSelectionDialog.js @@ -78,9 +78,10 @@ class MultipleSelectionDialog extends React.Component { -
+
-
+
- + e.target.select()} + placeholder={i18n.__('Add tag...')} + />
- + e.target.select()} + placeholder={i18n.__('Remove tag...')} + />