feat: handle unprotected session expiration (#779)

* feat: hide note contents if the protection expires when the protected note is open and wasn't edited for a while

* feat: handle session expiration for opened protected note for both plain advanced editors

* fix: if after canceling  session expiry modal only one unprotected note stays selected, show its contents in the editor

* refactor: handle session expiration for opened protected note (move the logic to web client)

* feat: handle the case of selecting "Don't remember" option in session expiry dialog

* test (WIP): add unit tests for protecting opened note after the session has expired

* test: add remaining unit tests

* refactor: move the opened note protection logic to "editor_view"

* refactor: reviewer comments
- don't rely on user signed-in/out status to require authentication for protected note
- remove unnecessary async/awaits
- better wording on ui

* refactor: reviewer's comments:
 - use snjs method to check if "Don't remember" option is selected in authentication modal
 - move the constant to snjs
 - fix eslint error

* refactor: avoid `any` type for `appEvent` payload

* test: add unit tests

* chore: update function name

* refactor: use simpler protection session event types

* refactor: protected access terminology

* refactor: start counting idle timer after every edit (instead of counting by interval in spite of edits)

* test: unit tests

* style: don't give extra brightness to the "View Note"/"Authenticate" button on hover/focus

* chore: bump snjs version

* chore: put snjs "beta" version

* fix: run protection timeout when the note is marked as protected

* chore: snjs version bump

* refactor: immediately lock the note if it's marked as "Protected"

* refactor: rename component, directive and some props

* refactor: remove extra check

* refactor: rename the method

* chore: update snjs version

Co-authored-by: Mo Bitar <[email protected]>

.eslintrc

@@ -11,7 +11,7 @@
   "parserOptions": {
     "project": "./app/assets/javascripts/tsconfig.json"
   },
-  "ignorePatterns": [".eslintrc.js", "webpack.*.js", "webpack-defaults.js", "jest.config.js"],
+  "ignorePatterns": [".eslintrc.js", "webpack.*.js", "webpack-defaults.js", "jest.config.js", "__mocks__"],
   "rules": {
     "standard/no-callback-literal": 0, // Disable this as we have too many callbacks relying on literals
     "no-throw-literal": 0,

.gitignore

@@ -50,3 +50,5 @@ yarn-error.log
 package-lock.json
 
 codeqldb
+
+coverage

app/assets/javascripts/__mocks__/@standardnotes/snjs.js

@@ -0,0 +1,11 @@
+const {
+  ApplicationEvent,
+  ProtectionSessionDurations,
+  ProposedSecondsToDeferUILevelSessionExpirationDuringActiveInteraction,
+} = require('@standardnotes/snjs');
+
+module.exports = {
+  ApplicationEvent: ApplicationEvent,
+  ProtectionSessionDurations: ProtectionSessionDurations,
+  ProposedSecondsToDeferUILevelSessionExpirationDuringActiveInteraction,
+};

app/assets/javascripts/app.ts

@@ -65,7 +65,7 @@ import { StartApplication } from './startApplication';
 import { Bridge } from './services/bridge';
 import { SessionsModalDirective } from './components/SessionsModal';
 import { NoAccountWarningDirective } from './components/NoAccountWarning';
-import { NoProtectionsdNoteWarningDirective } from './components/NoProtectionsNoteWarning';
+import { ProtectedNoteOverlayDirective } from './components/ProtectedNoteOverlay';
 import { SearchOptionsDirective } from './components/SearchOptions';
 import { AccountMenuDirective } from './components/AccountMenu';
 import { ConfirmSignoutDirective } from './components/ConfirmSignoutModal';
@@ -174,7 +174,7 @@ const startApplication: StartApplication = async function startApplication(
     .directive('accountMenu', AccountMenuDirective)
     .directive('quickSettingsMenu', QuickSettingsMenuDirective)
     .directive('noAccountWarning', NoAccountWarningDirective)
-    .directive('protectedNotePanel', NoProtectionsdNoteWarningDirective)
+    .directive('protectedNotePanel', ProtectedNoteOverlayDirective)
     .directive('searchOptions', SearchOptionsDirective)
     .directive('confirmSignout', ConfirmSignoutDirective)
     .directive('multipleSelectedNotesPanel', MultipleSelectedNotesDirective)