Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show Notes Loading not No Notes when notes are loading #1649

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions RELEASE-NOTES.txt
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
- Updated colors to use Color Studio, the color palette for Automattic products
- [#1565](https://github.com/Automattic/simplenote-electron/pull/1565)
- [#1612](https://github.com/Automattic/simplenote-electron/pull/1612)
- Display a notice that notes are loading when notes are loading

### Fixes

Expand Down
2 changes: 2 additions & 0 deletions lib/flux/app-state.js
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ export const actionMap = new ActionMap({
revision: null,
showTrash: false,
listTitle: 'All Notes',
notesLoaded: false,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Did we consider starting notes: null?

There's a chance to indicate whether or not we've loaded using this tri-state value and that could preclude the need for creating a second value intrinsically bound to the same data.

const noteListStatus = notes =>
  null === notes ? 'Loading…' :
  0 === notes.length ? 'No Notes' :
  'Has notes'

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just an explanation: I usually try to find ways of gleaning more information from a value without adding additional flags or meta as they tend to get out of sync and because people tend to zoom-in on the value they think they need as soon as they find a value that seems to work, so for dev communication purposes I have found the tai-state value quite useful when there is a separate unknown or pending state from the empty state.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Making the default value for notes null causes some plumbing issues. Setting the default to null doesn't do much. It immediately gets overwritten to an array. Changing the way this works I think is outside the scope of this PR.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A month or so ago I spent several hours trying to get app state to function as you describe and I created more bugs than I was solving.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah interesting. I wondered what would break if we made the change.

where does it get immediately overwritten? on authChanged I can see we'd have to set it null there too.

I wouldn't question this further other than I recognize that we're adding new stuff into the app and doing so with two variables that are storing some of the same data, hypothetically.

I'll do some quick checks in a running copy locally and then report back.

Nice work, and I did at one point see your old state PR. state here in general is in a place it shouldn't be. long-term we can trim it way down

showNavigation: false,
showNoteInfo: false,
isViewingRevisions: false,
Expand Down Expand Up @@ -296,6 +297,7 @@ export const actionMap = new ActionMap({
notes: { $set: pinSortedNotes },
note: { $set: selectedNote },
selectedNoteId: { $set: get(selectedNote, 'id', null) },
notesLoaded: { $set: true },
});
},

Expand Down
4 changes: 3 additions & 1 deletion lib/note-list/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -334,6 +334,7 @@ export class NoteList extends Component {
onSelectNote,
onEmptyTrash,
noteDisplay,
notesLoaded,
showTrash,
notes,
isSmallScreen,
Expand Down Expand Up @@ -368,7 +369,7 @@ export class NoteList extends Component {
return (
<div className={classNames('note-list', { 'is-empty': isEmptyList })}>
{isEmptyList ? (
<span className="note-list-placeholder">No Notes</span>
<span className="note-list-placeholder">{ notesLoaded ? 'No Notes' : 'Loading Notes'}</span>
) : (
<Fragment>
<div className={listItemsClasses}>
Expand Down Expand Up @@ -456,6 +457,7 @@ const mapStateToProps = ({ appState: state, settings: { noteDisplay } }) => {
nextNote,
noteDisplay,
notes: filteredNotes,
notesLoaded: state.notesLoaded,
prevNote,
selectedNotePreview,
selectedNoteContent: get(selectedNote, 'data.content'),
Expand Down