diff --git a/browser/components/NoteItem.js b/browser/components/NoteItem.js
index 31769abf..2c93dc18 100644
--- a/browser/components/NoteItem.js
+++ b/browser/components/NoteItem.js
@@ -46,11 +46,22 @@ const TagElementList = (tags) => {
* @param {Function} handleDragStart
* @param {string} dateDisplay
*/
-const NoteItem = ({ isActive, note, dateDisplay, handleNoteClick, handleNoteContextMenu, handleDragStart, pathname }) => (
+const NoteItem = ({
+ isActive,
+ note,
+ dateDisplay,
+ handleNoteClick,
+ handleNoteContextMenu,
+ handleDragStart,
+ pathname,
+ storageName,
+ folderName,
+ viewType
+}) => (
handleNoteClick(e, `${note.storage}-${note.key}`)}
onContextMenu={e => handleNoteContextMenu(e, `${note.storage}-${note.key}`)}
@@ -68,23 +79,33 @@ const NoteItem = ({ isActive, note, dateDisplay, handleNoteClick, handleNoteCont
: Empty
}
+ {['ALL', 'STORAGE'].includes(viewType) &&
+
{dateDisplay}
+
+
+ {viewType === 'ALL' && storageName}
+ {viewType === 'STORAGE' && folderName}
+
+
+
}
- {dateDisplay}
- {note.isStarred
- ?
: ''
- }
- {note.isPinned && !pathname.match(/\/starred|\/trash/)
- ? : ''
- }
- {note.type === 'MARKDOWN_NOTE'
- ?
- : ''
- }
{note.tags.length > 0
? TagElementList(note.tags)
- :
+ : No tags
+ }
+
+
+ {note.isStarred
+ ?

: ''
+ }
+ {note.isPinned && !pathname.match(/\/home|\/starred|\/trash/)
+ ?
: ''
+ }
+ {note.type === 'MARKDOWN_NOTE'
+ ?
+ : ''
}
diff --git a/browser/components/NoteItem.styl b/browser/components/NoteItem.styl
index c57908b0..f213348a 100644
--- a/browser/components/NoteItem.styl
+++ b/browser/components/NoteItem.styl
@@ -90,6 +90,26 @@ $control-height = 30px
font-weight normal
color $ui-inactive-text-color
+.item-middle
+ font-size 13px
+ padding-left 2px
+ padding-bottom 2px
+
+.item-middle-time
+ color $ui-inactive-text-color
+ display inline-block
+
+.item-middle-app-meta
+ float right
+ .item-middle-app-meta-label
+ opacity 0.4
+ color $ui-inactive-text-color
+ padding 0 3px
+ white-space nowrap
+ text-overflow ellipsis
+ overflow hidden
+ max-width 200px
+
.item-bottom
position relative
bottom 0px
@@ -124,9 +144,7 @@ $control-height = 30px
padding-bottom 2px
.item-star
- position absolute
- right -6px
- bottom 23px
+ position relative
width 16px
height 16px
color alpha($ui-favorite-star-button-color, 60%)
@@ -135,9 +153,7 @@ $control-height = 30px
border-radius 17px
.item-pin
- position absolute
- right 0px
- bottom 2px
+ position relative
width 34px
height 34px
color #E54D42
@@ -192,7 +208,7 @@ body[data-theme="dark"]
.item-bottom-tagList-item
transition 0.15s
background-color alpha(white, 10%)
- color $ui-dark-text-color
+ color $ui-dark-text-color
.item-wrapper
border-color alpha($ui-dark-button--active-backgroundColor, 60%)
@@ -266,7 +282,7 @@ body[data-theme="solarized-dark"]
.item-bottom-tagList-item
transition 0.15s
background-color alpha($ui-solarized-dark-noteList-backgroundColor, 10%)
- color $ui-solarized-dark-text-color
+ color $ui-solarized-dark-text-color
.item-wrapper
border-color alpha($ui-solarized-dark-button--active-backgroundColor, 60%)
@@ -304,4 +320,4 @@ body[data-theme="solarized-dark"]
.item-bottom-tagList-empty
color $ui-inactive-text-color
- vertical-align middle
\ No newline at end of file
+ vertical-align middle
diff --git a/browser/components/NoteItemSimple.js b/browser/components/NoteItemSimple.js
index 6b0dd4e0..0d2465e9 100644
--- a/browser/components/NoteItemSimple.js
+++ b/browser/components/NoteItemSimple.js
@@ -14,11 +14,20 @@ import styles from './NoteItemSimple.styl'
* @param {Function} handleNoteContextMenu
* @param {Function} handleDragStart
*/
-const NoteItemSimple = ({ isActive, note, handleNoteClick, handleNoteContextMenu, handleDragStart, pathname }) => (
+const NoteItemSimple = ({
+ isActive,
+ isAllNotesView,
+ note,
+ handleNoteClick,
+ handleNoteContextMenu,
+ handleDragStart,
+ pathname,
+ storage
+}) => (
handleNoteClick(e, `${note.storage}-${note.key}`)}
onContextMenu={e => handleNoteContextMenu(e, `${note.storage}-${note.key}`)}
@@ -38,6 +47,11 @@ const NoteItemSimple = ({ isActive, note, handleNoteClick, handleNoteContextMenu
? note.title
:
Empty
}
+ {isAllNotesView &&
+
+ {storage.name}
+
+
}
)
diff --git a/browser/components/NoteItemSimple.styl b/browser/components/NoteItemSimple.styl
index fdf0c2e3..3097b82c 100644
--- a/browser/components/NoteItemSimple.styl
+++ b/browser/components/NoteItemSimple.styl
@@ -124,7 +124,7 @@ body[data-theme="dark"]
.item-simple-bottom-tagList-item
transition 0.15s
background-color alpha(white, 10%)
- color $ui-dark-text-color
+ color $ui-dark-text-color
.item-simple--active
border-color $ui-dark-borderColor
@@ -188,7 +188,7 @@ body[data-theme="solarized-dark"]
.item-simple-bottom-tagList-item
transition 0.15s
background-color alpha(white, 10%)
- color $ui-solarized-dark-text-color
+ color $ui-solarized-dark-text-color
.item-simple--active
border-color $ui-solarized-dark-borderColor
@@ -206,4 +206,9 @@ body[data-theme="solarized-dark"]
// background-color alpha($ui-dark-button--active-backgroundColor, 60%)
color #c0392b
.item-simple-bottom-tagList-item
- background-color alpha(#fff, 20%)
\ No newline at end of file
+ background-color alpha(#fff, 20%)
+.item-simple-right
+ float right
+ .item-simple-right-storageName
+ padding-left 4px
+ opacity 0.4
diff --git a/browser/main/NoteList/index.js b/browser/main/NoteList/index.js
index 345dfe0d..8c3e8790 100644
--- a/browser/main/NoteList/index.js
+++ b/browser/main/NoteList/index.js
@@ -66,6 +66,9 @@ class NoteList extends React.Component {
this.deleteNote = this.deleteNote.bind(this)
this.focusNote = this.focusNote.bind(this)
this.pinToTop = this.pinToTop.bind(this)
+ this.getNoteStorage = this.getNoteStorage.bind(this)
+ this.getNoteFolder = this.getNoteFolder.bind(this)
+ this.getViewType = this.getViewType.bind(this)
this.restoreNote = this.restoreNote.bind(this)
// TODO: not Selected noteKeys but SelectedNote(for reusing)
@@ -723,6 +726,24 @@ class NoteList extends React.Component {
})
}
+ getNoteStorage (note) { // note.storage = storage key
+ return this.props.data.storageMap.toJS()[note.storage]
+ }
+
+ getNoteFolder (note) { // note.folder = folder key
+ return _.find(this.getNoteStorage(note).folders, ({ key }) => key === note.folder)
+ }
+
+ getViewType () {
+ const { pathname } = this.props.location
+ const folder = /\/folders\/[a-zA-Z0-9]+/.test(pathname)
+ const storage = /\/storages\/[a-zA-Z0-9]+/.test(pathname) && !folder
+ const allNotes = pathname === '/home'
+ if (allNotes) return 'ALL'
+ if (folder) return 'FOLDER'
+ if (storage) return 'STORAGE'
+ }
+
render () {
const { location, config } = this.props
let { notes } = this.props
@@ -759,6 +780,8 @@ class NoteList extends React.Component {
}
})
+ const viewType = this.getViewType()
+
const noteList = notes
.map(note => {
if (note == null) {
@@ -784,6 +807,9 @@ class NoteList extends React.Component {
handleNoteClick={this.handleNoteClick.bind(this)}
handleDragStart={this.handleDragStart.bind(this)}
pathname={location.pathname}
+ folderName={this.getNoteFolder(note).name}
+ storageName={this.getNoteStorage(note).name}
+ viewType={viewType}
/>
)
}
@@ -797,6 +823,9 @@ class NoteList extends React.Component {
handleNoteClick={this.handleNoteClick.bind(this)}
handleDragStart={this.handleDragStart.bind(this)}
pathname={location.pathname}
+ folderName={this.getNoteFolder(note).name}
+ storageName={this.getNoteStorage(note).name}
+ viewType={viewType}
/>
)
})