From 4428963314c290353ba36c46670743097ed48dac Mon Sep 17 00:00:00 2001 From: Khaliq Gant Date: Fri, 3 May 2019 17:29:52 +0200 Subject: [PATCH 01/16] allow a tag to be renamed and update all notes that use that tag MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit • repurpose RenameFolderModal.styl to RenameModal so it is more generic --- browser/main/SideNav/index.js | 16 +++ browser/main/modals/RenameFolderModal.js | 2 +- ...enameFolderModal.styl => RenameModal.styl} | 0 browser/main/modals/RenameTagModal.js | 128 ++++++++++++++++++ 4 files changed, 145 insertions(+), 1 deletion(-) rename browser/main/modals/{RenameFolderModal.styl => RenameModal.styl} (100%) create mode 100644 browser/main/modals/RenameTagModal.js diff --git a/browser/main/SideNav/index.js b/browser/main/SideNav/index.js index 640bedbf5..ada3c764d 100644 --- a/browser/main/SideNav/index.js +++ b/browser/main/SideNav/index.js @@ -5,6 +5,7 @@ import dataApi from 'browser/main/lib/dataApi' import styles from './SideNav.styl' import { openModal } from 'browser/main/lib/modal' import PreferencesModal from '../modals/PreferencesModal' +import RenameTagModal from 'browser/main/modals/RenameTagModal' import ConfigManager from 'browser/main/lib/ConfigManager' import StorageItem from './StorageItem' import TagListItem from 'browser/components/TagListItem' @@ -126,6 +127,11 @@ class SideNav extends React.Component { click: this.displayColorPicker.bind(this, tag, e.target.getBoundingClientRect()) }) + menu.push({ + label: i18n.__('Rename Tag'), + click: this.handleRenameTagClick.bind(this, tag) + }) + context.popup(menu) } @@ -149,6 +155,16 @@ class SideNav extends React.Component { }) } + handleRenameTagClick (tagName) { + const { data, dispatch } = this.props + + openModal(RenameTagModal, { + tagName, + data, + dispatch + }) + } + handleColorPickerConfirm (color) { const { dispatch, config: {coloredTags} } = this.props const { colorPicker: { tagName } } = this.state diff --git a/browser/main/modals/RenameFolderModal.js b/browser/main/modals/RenameFolderModal.js index edbcee670..c58807f98 100644 --- a/browser/main/modals/RenameFolderModal.js +++ b/browser/main/modals/RenameFolderModal.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types' import React from 'react' import CSSModules from 'browser/lib/CSSModules' -import styles from './RenameFolderModal.styl' +import styles from './RenameModal.styl' import dataApi from 'browser/main/lib/dataApi' import store from 'browser/main/store' import ModalEscButton from 'browser/components/ModalEscButton' diff --git a/browser/main/modals/RenameFolderModal.styl b/browser/main/modals/RenameModal.styl similarity index 100% rename from browser/main/modals/RenameFolderModal.styl rename to browser/main/modals/RenameModal.styl diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js new file mode 100644 index 000000000..985bee533 --- /dev/null +++ b/browser/main/modals/RenameTagModal.js @@ -0,0 +1,128 @@ +import PropTypes from 'prop-types' +import React from 'react' +import CSSModules from 'browser/lib/CSSModules' +import styles from './RenameModal.styl' +import dataApi from 'browser/main/lib/dataApi' +import ModalEscButton from 'browser/components/ModalEscButton' +import i18n from 'browser/lib/i18n' + +class RenameTagModal extends React.Component { + constructor (props) { + super(props) + + this.state = { + name: props.tagName, + oldName: props.tagName + } + } + + componentDidMount () { + this.refs.name.focus() + this.refs.name.select() + } + + handleCloseButtonClick (e) { + this.props.close() + } + + handleChange (e) { + this.setState({ + name: this.refs.name.value + }) + } + + handleKeyDown (e) { + if (e.keyCode === 27) { + this.props.close() + } + } + + handleInputKeyDown (e) { + switch (e.keyCode) { + case 13: + this.confirm() + } + } + + handleConfirmButtonClick (e) { + this.confirm() + } + + confirm () { + if (this.state.name.trim().length > 0) { + const { name, oldName } = this.state + this.renameTag(oldName, name) + } + } + + renameTag (tag, updatedTag) { + const { data, dispatch } = this.props + + const notes = data.noteMap + .map(note => note) + .filter(note => note.tags.indexOf(tag) !== -1) + .map(note => { + note = Object.assign({}, note) + note.tags = note.tags.slice() + + note.tags[note.tags.indexOf(tag)] = updatedTag + + return note + }) + + Promise + .all(notes.map(note => dataApi.updateNote(note.storage, note.key, note))) + .then(updatedNotes => { + updatedNotes.forEach(note => { + dispatch({ + type: 'UPDATE_NOTE', + note + }) + }) + }) + .then(() => { + this.props.close() + }) + } + + render () { + return ( +
this.handleKeyDown(e)} + > +
+
{i18n.__('Rename Tag')}
+
+ this.handleCloseButtonClick(e)} /> + +
+ this.handleChange(e)} + onKeyDown={(e) => this.handleInputKeyDown(e)} + /> + +
+
+ ) + } +} + +RenameTagModal.propTypes = { + storage: PropTypes.shape({ + key: PropTypes.string + }), + folder: PropTypes.shape({ + key: PropTypes.string, + name: PropTypes.string + }) +} + +export default CSSModules(RenameTagModal, styles) From 242e8b6e33a50037c9aef89851814d7c02b1a7f8 Mon Sep 17 00:00:00 2001 From: Khaliq Gant Date: Sun, 5 May 2019 11:15:53 +0200 Subject: [PATCH 02/16] call handleConfirmButtonClick directly instead of sending through a confirm method --- browser/main/modals/RenameTagModal.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index 985bee533..c63141482 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -40,15 +40,11 @@ class RenameTagModal extends React.Component { handleInputKeyDown (e) { switch (e.keyCode) { case 13: - this.confirm() + this.handleConfirmButtonClick() } } handleConfirmButtonClick (e) { - this.confirm() - } - - confirm () { if (this.state.name.trim().length > 0) { const { name, oldName } = this.state this.renameTag(oldName, name) From 0f6e2181911554d386d51ccd3facaec2d4c0a51e Mon Sep 17 00:00:00 2001 From: Khaliq Gant Date: Sun, 5 May 2019 11:25:53 +0200 Subject: [PATCH 03/16] better name for method to confirm the rename --- browser/main/modals/RenameTagModal.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index c63141482..978bb2ee9 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -40,11 +40,11 @@ class RenameTagModal extends React.Component { handleInputKeyDown (e) { switch (e.keyCode) { case 13: - this.handleConfirmButtonClick() + this.handleConfirm() } } - handleConfirmButtonClick (e) { + handleConfirm () { if (this.state.name.trim().length > 0) { const { name, oldName } = this.state this.renameTag(oldName, name) @@ -101,7 +101,7 @@ class RenameTagModal extends React.Component { onKeyDown={(e) => this.handleInputKeyDown(e)} /> From e985f1226a342b7a77190ec9c5a6832eae38ab25 Mon Sep 17 00:00:00 2001 From: Khaliq Gant Date: Sat, 11 May 2019 15:51:19 +0200 Subject: [PATCH 04/16] use close prop instead of a new method --- browser/main/modals/RenameTagModal.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index 978bb2ee9..f16dc68cb 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -21,8 +21,6 @@ class RenameTagModal extends React.Component { this.refs.name.select() } - handleCloseButtonClick (e) { - this.props.close() } handleChange (e) { @@ -82,6 +80,8 @@ class RenameTagModal extends React.Component { } render () { + const { close } = this.props + return (
{i18n.__('Rename Tag')}
- this.handleCloseButtonClick(e)} /> +
Date: Sat, 11 May 2019 15:52:13 +0200 Subject: [PATCH 05/16] use callback ref instead of legacy string refs --- browser/main/modals/RenameTagModal.js | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index f16dc68cb..c1ab2e343 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -10,6 +10,11 @@ class RenameTagModal extends React.Component { constructor (props) { super(props) + this.nameInput = null + this.setTextInputRef = el => { + this.nameInput = el + } + this.state = { name: props.tagName, oldName: props.tagName @@ -17,15 +22,13 @@ class RenameTagModal extends React.Component { } componentDidMount () { - this.refs.name.focus() - this.refs.name.select() - } - + this.nameInput.focus() + this.nameInput.select() } handleChange (e) { this.setState({ - name: this.refs.name.value + name: this.nameInput.value }) } @@ -95,7 +98,7 @@ class RenameTagModal extends React.Component {
this.handleChange(e)} onKeyDown={(e) => this.handleInputKeyDown(e)} From ce5d4acc11f3c436a5e915510bfb5720ae67ac54 Mon Sep 17 00:00:00 2001 From: Khaliq Gant Date: Sat, 11 May 2019 15:53:08 +0200 Subject: [PATCH 06/16] bind the handleChange in the constructor to allow for direct function assignment --- browser/main/modals/RenameTagModal.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index c1ab2e343..e6a4795c3 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -11,6 +11,9 @@ class RenameTagModal extends React.Component { super(props) this.nameInput = null + + this.handleChange = this.handleChange.bind(this) + this.setTextInputRef = el => { this.nameInput = el } @@ -100,7 +103,7 @@ class RenameTagModal extends React.Component { placeholder={i18n.__('Tag Name')} ref={this.setTextInputRef} value={this.state.name} - onChange={(e) => this.handleChange(e)} + onChange={this.handleChange} onKeyDown={(e) => this.handleInputKeyDown(e)} />
) } From c0d22dbfb89405e076a8c816515b0f3f9dcbd16a Mon Sep 17 00:00:00 2001 From: Khaliq Gant Date: Sun, 15 Sep 2019 10:13:31 +0200 Subject: [PATCH 11/16] lint fix, const over let --- browser/main/Detail/TagSelect.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/browser/main/Detail/TagSelect.js b/browser/main/Detail/TagSelect.js index df6612d20..6b6a122a2 100644 --- a/browser/main/Detail/TagSelect.js +++ b/browser/main/Detail/TagSelect.js @@ -100,7 +100,7 @@ class TagSelect extends React.Component { } handleRenameTag (event, tagChange) { - let { value } = this.props + const { value } = this.props const { tag, updatedTag } = tagChange const newTags = value.slice() From a4532f14210a91fd50b4ea335a6d6f2fbb70779b Mon Sep 17 00:00:00 2001 From: AWolf81 Date: Fri, 14 Feb 2020 23:08:47 +0100 Subject: [PATCH 12/16] add missing letter --- browser/lib/confirmDeleteNote.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/browser/lib/confirmDeleteNote.js b/browser/lib/confirmDeleteNote.js index 80d1ffc78..b67ed7e32 100644 --- a/browser/lib/confirmDeleteNote.js +++ b/browser/lib/confirmDeleteNote.js @@ -6,7 +6,7 @@ const { dialog } = remote export function confirmDeleteNote (confirmDeletion, permanent) { if (confirmDeletion || permanent) { const alertConfig = { - ype: 'warning', + type: 'warning', message: i18n.__('Confirm note deletion'), detail: i18n.__('This will permanently remove this note.'), buttons: [i18n.__('Confirm'), i18n.__('Cancel')] From 686376a8dcece05dc83a467df7233cefc73d1432 Mon Sep 17 00:00:00 2001 From: AWolf81 Date: Fri, 14 Feb 2020 23:09:36 +0100 Subject: [PATCH 13/16] fix routing and add merge warning dialog --- browser/main/modals/RenameTagModal.js | 25 +++++++++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index 422eeebb5..a55f7ed4f 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -5,9 +5,13 @@ import styles from './RenameModal.styl' import dataApi from 'browser/main/lib/dataApi' import ModalEscButton from 'browser/components/ModalEscButton' import i18n from 'browser/lib/i18n' -import { hashHistory } from 'react-router' +import { replace } from 'connected-react-router' import ee from 'browser/main/lib/eventEmitter' import { isEmpty } from 'lodash' +import electron from 'electron' + +const { remote } = electron +const { dialog } = remote class RenameTagModal extends React.Component { constructor (props) { @@ -70,6 +74,23 @@ class RenameTagModal extends React.Component { renameTag (tag, updatedTag) { const { data, dispatch } = this.props + if (data.noteMap.map(note => note).some(note => note.tags.indexOf(updatedTag) !== -1)) { + const alertConfig = { + type: 'warning', + message: i18n.__('Confirm tag merge'), + detail: i18n.__(`Tag ${tag} will be merged with existing tag ${updatedTag}`), + buttons: [i18n.__('Confirm'), i18n.__('Cancel')] + } + + const dialogButtonIndex = dialog.showMessageBox( + remote.getCurrentWindow(), alertConfig + ) + + if (dialogButtonIndex === 1) { + return // bail early on cancel click + } + } + const notes = data.noteMap .map(note => note) .filter(note => note.tags.indexOf(tag) !== -1 && note.tags.indexOf(updatedTag)) @@ -100,7 +121,7 @@ class RenameTagModal extends React.Component { }) .then(() => { if (window.location.hash.includes(tag)) { - hashHistory.replace(`/tags/${updatedTag}`) + dispatch(replace(`/tags/${updatedTag}`)) } ee.emit('sidebar:rename-tag', { tag, updatedTag }) this.props.close() From d4ca69a4608c3aa9b5e53e494a65a7daa1609a78 Mon Sep 17 00:00:00 2001 From: AWolf81 Date: Sat, 15 Feb 2020 21:41:58 +0100 Subject: [PATCH 14/16] fix space-before-parens lint error --- browser/main/Detail/TagSelect.js | 106 +++++++++++++------------- browser/main/SideNav/index.js | 79 ++++++++++--------- browser/main/modals/RenameTagModal.js | 57 +++++++++----- 3 files changed, 132 insertions(+), 110 deletions(-) diff --git a/browser/main/Detail/TagSelect.js b/browser/main/Detail/TagSelect.js index 7a8941e9b..e1d11e0d3 100644 --- a/browser/main/Detail/TagSelect.js +++ b/browser/main/Detail/TagSelect.js @@ -11,7 +11,7 @@ import Autosuggest from 'react-autosuggest' import { push } from 'connected-react-router' class TagSelect extends React.Component { - constructor (props) { + constructor(props) { super(props) this.state = { @@ -33,7 +33,7 @@ class TagSelect extends React.Component { this.onSuggestionSelected = this.onSuggestionSelected.bind(this) } - addNewTag (newTag) { + addNewTag(newTag) { AwsMobileAnalyticsConfig.recordDynamicCustomEvent('ADD_TAG') newTag = newTag.trim().replace(/ +/g, '_') @@ -70,7 +70,7 @@ class TagSelect extends React.Component { ) } - buildSuggestions () { + buildSuggestions() { this.suggestions = _.sortBy( this.props.data.tagNoteMap .map((tag, name) => ({ @@ -83,7 +83,7 @@ class TagSelect extends React.Component { ) } - componentDidMount () { + componentDidMount() { this.value = this.props.value this.buildSuggestions() @@ -92,20 +92,20 @@ class TagSelect extends React.Component { ee.on('sidebar:rename-tag', this.handleRenameTag) } - componentDidUpdate () { + componentDidUpdate() { this.value = this.props.value } - componentWillUnmount () { + componentWillUnmount() { ee.off('editor:add-tag', this.handleAddTag) ee.off('sidebar:rename-tag', this.handleRenameTag) } - handleAddTag () { + handleAddTag() { this.refs.newTag.input.focus() } - handleRenameTag (event, tagChange) { + handleRenameTag(event, tagChange) { const { value } = this.props const { tag, updatedTag } = tagChange const newTags = value.slice() @@ -115,7 +115,7 @@ class TagSelect extends React.Component { this.props.onChange() } - handleTagLabelClick (tag) { + handleTagLabelClick(tag) { const { dispatch } = this.props // Note: `tag` requires encoding later. @@ -123,23 +123,23 @@ class TagSelect extends React.Component { dispatch(push(`/tags/${tag}`)) } - handleTagRemoveButtonClick (tag) { + handleTagRemoveButtonClick(tag) { this.removeTagByCallback((value, tag) => { value.splice(value.indexOf(tag), 1) }, tag) } - onInputBlur (e) { + onInputBlur(e) { this.submitNewTag() } - onInputChange (e, { newValue, method }) { + onInputChange(e, { newValue, method }) { this.setState({ newTag: newValue }) } - onInputKeyDown (e) { + onInputKeyDown(e) { switch (e.keyCode) { case 9: e.preventDefault() @@ -155,13 +155,13 @@ class TagSelect extends React.Component { } } - onSuggestionsClearRequested () { + onSuggestionsClearRequested() { this.setState({ suggestions: [] }) } - onSuggestionsFetchRequested ({ value }) { + onSuggestionsFetchRequested({ value }) { const valueLC = value.toLowerCase() const suggestions = _.filter( this.suggestions, @@ -174,17 +174,17 @@ class TagSelect extends React.Component { }) } - onSuggestionSelected (event, { suggestion, suggestionValue }) { + onSuggestionSelected(event, { suggestion, suggestionValue }) { this.addNewTag(suggestionValue) } - removeLastTag () { + removeLastTag() { this.removeTagByCallback(value => { value.pop() }) } - removeTagByCallback (callback, tag = null) { + removeTagByCallback(callback, tag = null) { let { value } = this.props value = _.isArray(value) ? value.slice() : [] @@ -195,7 +195,7 @@ class TagSelect extends React.Component { this.props.onChange() } - reset () { + reset() { this.buildSuggestions() this.setState({ @@ -203,52 +203,52 @@ class TagSelect extends React.Component { }) } - submitNewTag () { + submitNewTag() { this.addNewTag(this.refs.newTag.input.value) } - render () { + render() { const { value, className, showTagsAlphabetically, coloredTags } = this.props const tagList = _.isArray(value) ? (showTagsAlphabetically ? _.sortBy(value) : value).map(tag => { - const wrapperStyle = {} - const textStyle = {} - const BLACK = '#333333' - const WHITE = '#f1f1f1' - const color = coloredTags[tag] - const invertedColor = + const wrapperStyle = {} + const textStyle = {} + const BLACK = '#333333' + const WHITE = '#f1f1f1' + const color = coloredTags[tag] + const invertedColor = color && invertColor(color, { black: BLACK, white: WHITE }) - let iconRemove = '../resources/icon/icon-x.svg' - if (color) { - wrapperStyle.backgroundColor = color - textStyle.color = invertedColor - } - if (invertedColor === WHITE) { - iconRemove = '../resources/icon/icon-x-light.svg' - } - return ( - - this.handleTagLabelClick(tag)} + let iconRemove = '../resources/icon/icon-x.svg' + if (color) { + wrapperStyle.backgroundColor = color + textStyle.color = invertedColor + } + if (invertedColor === WHITE) { + iconRemove = '../resources/icon/icon-x-light.svg' + } + return ( + + this.handleTagLabelClick(tag)} > #{tag} - - - - ) - }) + + + ) + }) : [] const { newTag, suggestions } = this.state diff --git a/browser/main/SideNav/index.js b/browser/main/SideNav/index.js index ac716e671..51633a470 100644 --- a/browser/main/SideNav/index.js +++ b/browser/main/SideNav/index.js @@ -26,13 +26,13 @@ import { confirmDeleteNote } from 'browser/lib/confirmDeleteNote' import ColorPicker from 'browser/components/ColorPicker' import { every, sortBy } from 'lodash' -function matchActiveTags (tags, activeTags) { +function matchActiveTags(tags, activeTags) { return every(activeTags, v => tags.indexOf(v) >= 0) } class SideNav extends React.Component { // TODO: should not use electron stuff v0.7 - constructor (props) { + constructor(props) { super(props) this.state = { @@ -54,15 +54,15 @@ class SideNav extends React.Component { this.handleSearchInputClear = this.handleSearchInputClear.bind(this) } - componentDidMount () { + componentDidMount() { EventEmitter.on('side:preferences', this.handleMenuButtonClick) } - componentWillUnmount () { + componentWillUnmount() { EventEmitter.off('side:preferences', this.handleMenuButtonClick) } - deleteTag (tag) { + deleteTag(tag) { const selectedButton = remote.dialog.showMessageBox( remote.getCurrentWindow(), { @@ -120,11 +120,11 @@ class SideNav extends React.Component { } } - handleMenuButtonClick (e) { + handleMenuButtonClick(e) { openModal(PreferencesModal) } - handleSearchButtonClick (e) { + handleSearchButtonClick(e) { const { showSearch } = this.state this.setState({ showSearch: !showSearch, @@ -132,29 +132,29 @@ class SideNav extends React.Component { }) } - handleSearchInputClear (e) { + handleSearchInputClear(e) { this.setState({ searchText: '' }) } - handleSearchInputChange (e) { + handleSearchInputChange(e) { this.setState({ searchText: e.target.value }) } - handleHomeButtonClick (e) { + handleHomeButtonClick(e) { const { dispatch } = this.props dispatch(push('/home')) } - handleStarredButtonClick (e) { + handleStarredButtonClick(e) { const { dispatch } = this.props dispatch(push('/starred')) } - handleTagContextMenu (e, tag) { + handleTagContextMenu(e, tag) { const menu = [] menu.push({ @@ -179,7 +179,7 @@ class SideNav extends React.Component { context.popup(menu) } - dismissColorPicker () { + dismissColorPicker() { this.setState({ colorPicker: { show: false @@ -187,7 +187,7 @@ class SideNav extends React.Component { }) } - displayColorPicker (tagName, rect) { + displayColorPicker(tagName, rect) { const { config } = this.props this.setState({ colorPicker: { @@ -199,7 +199,7 @@ class SideNav extends React.Component { }) } - handleRenameTagClick (tagName) { + handleRenameTagClick(tagName) { const { data, dispatch } = this.props openModal(RenameTagModal, { @@ -209,10 +209,17 @@ class SideNav extends React.Component { }) } - handleColorPickerConfirm (color) { - const { dispatch, config: {coloredTags} } = this.props - const { colorPicker: { tagName } } = this.state - const newColoredTags = Object.assign({}, coloredTags, {[tagName]: color.hex}) + handleColorPickerConfirm(color) { + const { + dispatch, + config: { coloredTags } + } = this.props + const { + colorPicker: { tagName } + } = this.state + const newColoredTags = Object.assign({}, coloredTags, { + [tagName]: color.hex + }) const config = { coloredTags: newColoredTags } ConfigManager.set(config) @@ -223,7 +230,7 @@ class SideNav extends React.Component { this.dismissColorPicker() } - handleColorPickerReset () { + handleColorPickerReset() { const { dispatch, config: { coloredTags } @@ -244,7 +251,7 @@ class SideNav extends React.Component { this.dismissColorPicker() } - handleToggleButtonClick (e) { + handleToggleButtonClick(e) { const { dispatch, config } = this.props const { showSearch, searchText } = this.state @@ -261,22 +268,22 @@ class SideNav extends React.Component { } } - handleTrashedButtonClick (e) { + handleTrashedButtonClick(e) { const { dispatch } = this.props dispatch(push('/trashed')) } - handleSwitchFoldersButtonClick () { + handleSwitchFoldersButtonClick() { const { dispatch } = this.props dispatch(push('/home')) } - handleSwitchTagsButtonClick () { + handleSwitchTagsButtonClick() { const { dispatch } = this.props dispatch(push('/alltags')) } - onSortEnd (storage) { + onSortEnd(storage) { return ({ oldIndex, newIndex }) => { const { dispatch } = this.props dataApi.reorderFolder(storage.key, oldIndex, newIndex).then(data => { @@ -285,7 +292,7 @@ class SideNav extends React.Component { } } - SideNavComponent (isFolded) { + SideNavComponent(isFolded) { const { location, data, config, dispatch } = this.props const { showSearch, searchText } = this.state @@ -390,7 +397,7 @@ class SideNav extends React.Component { return component } - tagListComponent () { + tagListComponent() { const { data, location, config } = this.props const { colorPicker, showSearch, searchText } = this.state const activeTags = this.getActiveTags(location.pathname) @@ -445,7 +452,7 @@ class SideNav extends React.Component { }) } - getRelatedTags (activeTags, noteMap) { + getRelatedTags(activeTags, noteMap) { if (activeTags.length === 0) { return new Set() } @@ -457,22 +464,22 @@ class SideNav extends React.Component { return relatedTags } - getTagActive (path, tag) { + getTagActive(path, tag) { return this.getActiveTags(path).includes(tag) } - getActiveTags (path) { + getActiveTags(path) { const pathSegments = path.split('/') const tags = pathSegments[pathSegments.length - 1] return tags === 'alltags' ? [] : decodeURIComponent(tags).split(' ') } - handleClickTagListItem (name) { + handleClickTagListItem(name) { const { dispatch } = this.props dispatch(push(`/tags/${encodeURIComponent(name)}`)) } - handleSortTagsByChange (e) { + handleSortTagsByChange(e) { const { dispatch } = this.props const config = { @@ -486,7 +493,7 @@ class SideNav extends React.Component { }) } - handleClickNarrowToTag (tag) { + handleClickNarrowToTag(tag) { const { dispatch, location } = this.props const listOfTags = this.getActiveTags(location.pathname) const indexOfTag = listOfTags.indexOf(tag) @@ -498,7 +505,7 @@ class SideNav extends React.Component { dispatch(push(`/tags/${encodeURIComponent(listOfTags.join(' '))}`)) } - emptyTrash (entries) { + emptyTrash(entries) { const { dispatch } = this.props const deletionPromises = entries.map(note => { return dataApi.deleteNote(note.storage, note.key) @@ -516,7 +523,7 @@ class SideNav extends React.Component { }) } - handleFilterButtonContextMenu (event) { + handleFilterButtonContextMenu(event) { const { data } = this.props const trashedNotes = data.trashedSet .toJS() @@ -529,7 +536,7 @@ class SideNav extends React.Component { ]) } - render () { + render() { const { location, config } = this.props const { showSearch, searchText, colorPicker: colorPickerState } = this.state diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index a55f7ed4f..4595dd303 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -14,7 +14,7 @@ const { remote } = electron const { dialog } = remote class RenameTagModal extends React.Component { - constructor (props) { + constructor(props) { super(props) this.nameInput = null @@ -31,12 +31,12 @@ class RenameTagModal extends React.Component { } } - componentDidMount () { + componentDidMount() { this.nameInput.focus() this.nameInput.select() } - handleChange (e) { + handleChange(e) { this.setState({ name: this.nameInput.value, showerror: false, @@ -44,46 +44,53 @@ class RenameTagModal extends React.Component { }) } - handleKeyDown (e) { + handleKeyDown(e) { if (e.keyCode === 27) { this.props.close() } } - handleInputKeyDown (e) { + handleInputKeyDown(e) { switch (e.keyCode) { case 13: this.handleConfirm() } } - handleConfirm () { + handleConfirm() { if (this.state.name.trim().length > 0) { const { name, oldName } = this.state this.renameTag(oldName, name) } } - showError (message) { + showError(message) { this.setState({ showerror: true, errormessage: message }) } - renameTag (tag, updatedTag) { + renameTag(tag, updatedTag) { const { data, dispatch } = this.props - if (data.noteMap.map(note => note).some(note => note.tags.indexOf(updatedTag) !== -1)) { + if ( + data.noteMap + .map(note => note) + .some(note => note.tags.indexOf(updatedTag) !== -1) + ) { const alertConfig = { type: 'warning', message: i18n.__('Confirm tag merge'), - detail: i18n.__(`Tag ${tag} will be merged with existing tag ${updatedTag}`), + detail: i18n.__( + `Tag ${tag} will be merged with existing tag ${updatedTag}` + ), buttons: [i18n.__('Confirm'), i18n.__('Cancel')] } const dialogButtonIndex = dialog.showMessageBox( - remote.getCurrentWindow(), alertConfig + remote.getCurrentWindow(), + alertConfig ) if (dialogButtonIndex === 1) { @@ -93,7 +100,9 @@ class RenameTagModal extends React.Component { const notes = data.noteMap .map(note => note) - .filter(note => note.tags.indexOf(tag) !== -1 && note.tags.indexOf(updatedTag)) + .filter( + note => note.tags.indexOf(tag) !== -1 && note.tags.indexOf(updatedTag) + ) .map(note => { note = Object.assign({}, note) note.tags = note.tags.slice() @@ -109,8 +118,9 @@ class RenameTagModal extends React.Component { return } - Promise - .all(notes.map(note => dataApi.updateNote(note.storage, note.key, note))) + Promise.all( + notes.map(note => dataApi.updateNote(note.storage, note.key, note)) + ) .then(updatedNotes => { updatedNotes.forEach(note => { dispatch({ @@ -128,14 +138,15 @@ class RenameTagModal extends React.Component { }) } - render () { + render() { const { close } = this.props const { errormessage } = this.state return ( -
this.handleKeyDown(e)} + onKeyDown={e => this.handleKeyDown(e)} >
{i18n.__('Rename Tag')}
@@ -143,20 +154,24 @@ class RenameTagModal extends React.Component {
- this.handleInputKeyDown(e)} + onKeyDown={e => this.handleInputKeyDown(e)} /> -
-
{errormessage}
+
+ {errormessage} +
) } From d2b48f4072765e2bb4cb11da6e83333ca4d6d9b6 Mon Sep 17 00:00:00 2001 From: AWolf81 Date: Sat, 28 Mar 2020 00:08:43 +0100 Subject: [PATCH 15/16] change theming --- browser/main/modals/RenameModal.styl | 57 +--------------------------- 1 file changed, 1 insertion(+), 56 deletions(-) diff --git a/browser/main/modals/RenameModal.styl b/browser/main/modals/RenameModal.styl index 948444243..f1a37b339 100644 --- a/browser/main/modals/RenameModal.styl +++ b/browser/main/modals/RenameModal.styl @@ -51,17 +51,13 @@ color #F44336 height 20px -body[data-theme="dark"] - .root - modalDark() - apply-theme(theme) body[data-theme={theme}] .root background-color transparent .header - background-color get-theme-var(theme, 'button--hover-backgroundColor') + background-color transparent border-color get-theme-var(theme, 'borderColor') color get-theme-var(theme, 'text-color') @@ -75,57 +71,6 @@ apply-theme(theme) .control-confirmButton colorThemedPrimaryButton(theme) - .control-confirmButton - colorDarkPrimaryButton() - -body[data-theme="solarized-dark"] - .root - modalSolarizedDark() - - .header - background-color transparent - border-color $ui-dark-borderColor - color $ui-solarized-dark-text-color - - .control-input - border 1px solid $ui-dark-borderColor - color white - - .control-confirmButton - colorSolarizedDarkPrimaryButton() - -body[data-theme="monokai"] - .root - modalMonokai() - - .header - background-color transparent - border-color $ui-dark-borderColor - color $ui-monokai-text-color - - .control-input - border 1px solid $ui-dark-borderColor - color white - - .control-confirmButton - colorMonokaiPrimaryButton() - -body[data-theme="dracula"] - .root - modalDracula() - - .header - background-color transparent - border-color $ui-dark-borderColor - color $ui-dracula-text-color - - .control-input - border 1px solid $ui-dark-borderColor - color white - - .control-confirmButton - colorDraculaPrimaryButton() - for theme in 'dark' 'solarized-dark' 'dracula' apply-theme(theme) From de3cd71e2d6f3d0dae51532c16118de753617fc1 Mon Sep 17 00:00:00 2001 From: AWolf81 Date: Sat, 28 Mar 2020 00:22:38 +0100 Subject: [PATCH 16/16] add check if tag changed --- browser/main/modals/RenameTagModal.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/browser/main/modals/RenameTagModal.js b/browser/main/modals/RenameTagModal.js index 4595dd303..8d2d02493 100644 --- a/browser/main/modals/RenameTagModal.js +++ b/browser/main/modals/RenameTagModal.js @@ -74,6 +74,12 @@ class RenameTagModal extends React.Component { renameTag(tag, updatedTag) { const { data, dispatch } = this.props + if (tag === updatedTag) { + // confirm with-out any change - just dismiss the modal + this.props.close() + return + } + if ( data.noteMap .map(note => note)