rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'develop' into feature/multiple-selection

Browse Source
This commit is contained in:
Antonella Sgarlatta
2021-04-28 14:53:15 -03:00
parent abfc588368 7679ba7c61
commit a1d56abd2e
24 changed files with 392 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/app.ts
View File

@@ -60,6 +60,7 @@ import { NoAccountWarningDirective } from './components/NoAccountWarning';
import { NoProtectionsdNoteWarningDirective } from './components/NoProtectionsNoteWarning';
import { SearchOptionsDirective } from './components/SearchOptions';
import { MultipleSelectedNotesDirective } from './components/MultipleSelectedNotes';
import { ConfirmSignoutDirective } from './components/ConfirmSignoutModal';
function reloadHiddenFirefoxTab(): boolean {
/**
@@ -149,7 +150,8 @@ const startApplication: StartApplication = async function startApplication(
.directive('noAccountWarning', NoAccountWarningDirective)
.directive('protectedNotePanel', NoProtectionsdNoteWarningDirective)
.directive('searchOptions', SearchOptionsDirective)
.directive('multipleSelectedNotesPanel', MultipleSelectedNotesDirective);
.directive('multipleSelectedNotesPanel', MultipleSelectedNotesDirective)
.directive('confirmSignout', ConfirmSignoutDirective);
// Filters
angular.module('app').filter('trusted', ['$sce', trusted]);

119
app/assets/javascripts/components/ConfirmSignoutModal.tsx Normal file
View File

@@ -0,0 +1,119 @@
import { useEffect, useRef, useState } from 'preact/hooks';
import {
AlertDialog,
AlertDialogDescription,
AlertDialogLabel,
} from '@reach/alert-dialog';
import { STRING_SIGN_OUT_CONFIRMATION } from '@/strings';
import { WebApplication } from '@/ui_models/application';
import { toDirective } from './utils';
import { AppState } from '@/ui_models/app_state';
import { observer } from 'mobx-react-lite';
type Props = {
application: WebApplication;
appState: AppState;
};
const ConfirmSignoutContainer = observer((props: Props) => {
if (!props.appState.accountMenu.signingOut) {
return null;
}
return <ConfirmSignoutModal {...props} />;
});
const ConfirmSignoutModal = observer(({ application, appState }: Props) => {
const [deleteLocalBackups, setDeleteLocalBackups] = useState(
application.hasAccount()
);
const cancelRef = useRef<HTMLButtonElement>();
function close() {
appState.accountMenu.setSigningOut(false);
}
const [localBackupsCount, setLocalBackupsCount] = useState(0);
useEffect(() => {
application.bridge.localBackupsCount().then(setLocalBackupsCount);
}, [appState.accountMenu.signingOut, application.bridge]);
return (
<AlertDialog onDismiss={close} leastDestructiveRef={cancelRef}>
<div className="sk-modal-content">
<div className="sn-component">
<div className="sk-panel">
<div className="sk-panel-content">
<div className="sk-panel-section">
<AlertDialogLabel className="sk-h3 sk-panel-section-title capitalize">
End your session?
</AlertDialogLabel>
<AlertDialogDescription className="sk-panel-row">
<p className="color-foreground">
{STRING_SIGN_OUT_CONFIRMATION}
</p>
</AlertDialogDescription>
{localBackupsCount > 0 && (
<div className="flex">
<div className="sk-panel-row"></div>
<label className="flex items-center">
<input
type="checkbox"
checked={deleteLocalBackups}
onChange={(event) => {
setDeleteLocalBackups(
(event.target as HTMLInputElement).checked
);
}}
/>
<span className="ml-2">
Delete {localBackupsCount} local backup file
{localBackupsCount > 1 ? 's' : ''}
</span>
</label>
<button
className="capitalize sk-a ml-1.5 p-0 rounded cursor-pointer"
onClick={() => {
application.bridge.viewlocalBackups();
}}
>
View backup files
</button>
</div>
)}
<div className="flex my-1 mt-4">
<button
className="sn-button neutral"
ref={cancelRef}
onClick={close}
>
Cancel
</button>
<button
className="sn-button danger ml-2"
onClick={() => {
if (deleteLocalBackups) {
application.signOutAndDeleteLocalBackups();
} else {
application.signOut();
}
close();
}}
>
{application.hasAccount()
? 'Sign Out'
: 'Clear Session Data'}
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</AlertDialog>
);
});
export const ConfirmSignoutDirective = toDirective<Props>(
ConfirmSignoutContainer
);

29
app/assets/javascripts/directives/views/accountMenu.ts
View File

@@ -84,6 +84,8 @@ class AccountMenuCtrl extends PureViewCtrl<unknown, AccountMenuState> {
private closeFunction?: () => void;
private removeProtectionLengthObserver?: () => void;
public passcodeInput!: JQLite;
/* @ngInject */
constructor($timeout: ng.ITimeoutService, appVersion: string) {
super($timeout);
@@ -144,7 +146,7 @@ class AccountMenuCtrl extends PureViewCtrl<unknown, AccountMenuState> {
async $onInit() {
super.$onInit();
this.setState({
showSessions: await this.application.userCanManageSessions()
showSessions: await this.application.userCanManageSessions(),
});
const sync = this.appState.sync;
@@ -379,15 +381,8 @@ class AccountMenuCtrl extends PureViewCtrl<unknown, AccountMenuState> {
this.appState.openSessionsModal();
}
async destroyLocalData() {
if (
await confirmDialog({
text: STRING_SIGN_OUT_CONFIRMATION,
confirmButtonStyle: 'danger',
})
) {
this.application.signOut();
}
signOut() {
this.appState.accountMenu.setSigningOut(true);
}
showRegister() {
@@ -517,17 +512,21 @@ class AccountMenuCtrl extends PureViewCtrl<unknown, AccountMenuState> {
async submitPasscodeForm() {
const passcode = this.getState().formData.passcode!;
if (passcode !== this.getState().formData.confirmPasscode!) {
this.application!.alertService!.alert(STRING_NON_MATCHING_PASSCODES);
await alertDialog({
text: STRING_NON_MATCHING_PASSCODES,
});
this.passcodeInput[0].focus();
return;
}
await preventRefreshing(
STRING_CONFIRM_APP_QUIT_DURING_PASSCODE_CHANGE,
async () => {
if (this.application!.hasPasscode()) {
await this.application!.changePasscode(passcode);
} else {
await this.application!.addPasscode(passcode);
const successful = this.application.hasPasscode()
? await this.application.changePasscode(passcode)
: await this.application.addPasscode(passcode);
if (!successful) {
this.passcodeInput[0].focus();
}
}
);

6
app/assets/javascripts/directives/views/panelResizer.ts
View File

@@ -313,9 +313,7 @@ class PanelResizerCtrl implements PanelResizerScope {
}
if (Math.round(width + this.lastLeft) === Math.round(parentRect.width)) {
this.panel.style.width = `calc(100% - ${this.lastLeft}px)`;
this.panel.style.flexBasis = `calc(100% - ${this.lastLeft}px)`;
} else {
this.panel.style.flexBasis = width + 'px';
this.panel.style.width = width + 'px';
}
this.lastWidth = width;
@@ -344,8 +342,8 @@ class PanelResizerCtrl implements PanelResizerScope {
/**
* If an iframe is displayed adjacent to our panel, and the mouse exits over the iframe,
* document[onmouseup] is not triggered because the document is no longer the same over
* the iframe. We add an invisible overlay while resizing so that the mouse context
* document[onmouseup] is not triggered because the document is no longer the same over
* the iframe. We add an invisible overlay while resizing so that the mouse context
* remains in our main document.
*/
addInvisibleOverlay() {

6
app/assets/javascripts/services/bridge.ts
View File

@@ -10,9 +10,13 @@ export interface Bridge {
environment: Environment;
getKeychainValue(): Promise<unknown>;
setKeychainValue(value: any): Promise<void>;
setKeychainValue(value: unknown): Promise<void>;
clearKeychainValue(): Promise<void>;
localBackupsCount(): Promise<number>;
viewlocalBackups(): void;
deleteLocalBackups(): Promise<void>;
extensionsServerHost?: string;
syncComponents(payloads: unknown[]): void;
onMajorDataChange(): void;

11
app/assets/javascripts/services/browserBridge.ts
View File

@@ -1,4 +1,4 @@
import { Bridge } from "./bridge";
import { Bridge } from './bridge';
import { Environment } from '@standardnotes/snjs';
const KEYCHAIN_STORAGE_KEY = 'keychain';
@@ -14,7 +14,7 @@ export class BrowserBridge implements Bridge {
}
}
async setKeychainValue(value: any): Promise<void> {
async setKeychainValue(value: unknown): Promise<void> {
localStorage.setItem(KEYCHAIN_STORAGE_KEY, JSON.stringify(value));
}
@@ -22,9 +22,16 @@ export class BrowserBridge implements Bridge {
localStorage.removeItem(KEYCHAIN_STORAGE_KEY);
}
async localBackupsCount(): Promise<number> {
/** Browsers cannot save backups, only let you download one */
return 0;
}
/** No-ops */
/* eslint-disable @typescript-eslint/no-empty-function */
async deleteLocalBackups(): Promise<void> {}
viewlocalBackups(): void {}
syncComponents(): void {}
onMajorDataChange(): void {}
onInitialDataLoad(): void {}

5
app/assets/javascripts/strings.ts
View File

@@ -40,6 +40,8 @@ export const STRING_UNARCHIVE_LOCKED_ATTEMPT =
"This note is locked. If you'd like to archive it, unlock it, and try again.";
export const STRING_DELETE_LOCKED_ATTEMPT =
"This note is locked. If you'd like to delete it, unlock it, and try again.";
export const STRING_EDIT_LOCKED_ATTEMPT =
"This note is locked. If you'd like to edit its options, unlock it, and try again.";
export function StringDeleteNote(title: string, permanently: boolean) {
return permanently
? `Are you sure you want to permanently delete ${title}?`
@@ -52,8 +54,7 @@ export function StringEmptyTrash(count: number) {
/** @account */
export const STRING_ACCOUNT_MENU_UNCHECK_MERGE =
'Unchecking this option means any of the notes you have written while you were signed out will be deleted. Are you sure you want to discard these notes?';
export const STRING_SIGN_OUT_CONFIRMATION =
'Are you sure you want to end your session? This will delete all local items and extensions.';
export const STRING_SIGN_OUT_CONFIRMATION = 'This will delete all local items and extensions.';
export const STRING_ERROR_DECRYPTING_IMPORT =
'There was an error decrypting your items. Make sure the password you entered is correct and try again.';
export const STRING_E2E_ENABLED =

8
app/assets/javascripts/ui_models/app_state/account_menu_state.ts
View File

@@ -2,12 +2,16 @@ import { action, makeObservable, observable } from "mobx";
export class AccountMenuState {
show = false;
signingOut = false;
constructor() {
makeObservable(this, {
show: observable,
signingOut: observable,
setShow: action,
toggleShow: action,
setSigningOut: action,
});
}
@@ -15,6 +19,10 @@ export class AccountMenuState {
this.show = show;
}
setSigningOut = (signingOut: boolean): void => {
this.signingOut = signingOut;
}
toggleShow = (): void => {
this.show = !this.show;
}

2
app/assets/javascripts/ui_models/app_state/search_options_state.ts
View File

@@ -4,7 +4,7 @@ import { WebApplication } from "../application";
export class SearchOptionsState {
includeProtectedContents = false;
includeArchived = false;
includeArchived = true;
includeTrashed = false;
constructor(

7
app/assets/javascripts/ui_models/application.ts
View File

@@ -52,7 +52,7 @@ export class WebApplication extends SNApplication {
private $compile: angular.ICompileService,
scope: angular.IScope,
defaultSyncServerHost: string,
private bridge: Bridge,
public bridge: Bridge,
) {
super(
bridge.environment,
@@ -168,6 +168,11 @@ export class WebApplication extends SNApplication {
return angular.element(document.getElementById(this.identifier)!);
}
async signOutAndDeleteLocalBackups(): Promise<void> {
await this.bridge.deleteLocalBackups();
return this.signOut();
}
presentPasswordModal(callback: () => void) {
const scope = this.scope!.$new(true) as InputModalScope;
scope.type = "password";

140
app/assets/javascripts/views/editor/editor_view.ts
View File

@@ -34,6 +34,7 @@ import {
STRING_ELLIPSES,
STRING_DELETE_PLACEHOLDER_ATTEMPT,
STRING_DELETE_LOCKED_ATTEMPT,
STRING_EDIT_LOCKED_ATTEMPT,
StringDeleteNote,
StringEmptyTrash,
} from '@/strings';
@@ -88,11 +89,15 @@ type EditorState = {
};
type EditorValues = {
title?: string;
text?: string;
title: string;
text: string;
tagsInputValue?: string;
};
function copyEditorValues(values: EditorValues) {
return Object.assign({}, values);
}
function sortAlphabetically(array: SNComponent[]): SNComponent[] {
return array.sort((a, b) =>
a.name.toLowerCase() < b.name.toLowerCase() ? -1 : 1
@@ -110,7 +115,7 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
private saveTimeout?: ng.IPromise<void>;
private statusTimeout?: ng.IPromise<void>;
private lastEditorFocusEventSource?: EventSource;
public editorValues: EditorValues = {};
public editorValues: EditorValues = { title: '', text: '' };
onEditorLoad?: () => void;
private tags: SNTag[] = [];
@@ -198,9 +203,12 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
if (!this.editorValues.text) {
this.editorValues.text = note.text;
}
if (note.lastSyncBegan) {
if (note.lastSyncBegan || note.dirty) {
if (note.lastSyncEnd) {
if (note.lastSyncBegan!.getTime() > note.lastSyncEnd!.getTime()) {
if (
note.dirty ||
note.lastSyncBegan!.getTime() > note.lastSyncEnd!.getTime()
) {
this.showSavingStatus();
} else if (
note.lastSyncEnd!.getTime() > note.lastSyncBegan!.getTime()
@@ -301,6 +309,9 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
this.reloadPreferences();
this.reloadStackComponents();
this.reloadNoteTagsComponent();
if (note.dirty) {
this.showSavingStatus();
}
if (note.safeText().length === 0 && !showProtectedWarning) {
this.focusTitle();
}
@@ -408,6 +419,10 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
if (this.appState.getActiveEditor()?.isTemplateNote) {
await this.appState.getActiveEditor().insertTemplatedNote();
}
if (this.note.locked) {
this.application.alertService.alert(STRING_EDIT_LOCKED_ATTEMPT);
return;
}
if (!component) {
if (!this.note.prefersPlainEditor) {
await this.application.changeItem(this.note.uuid, (mutator) => {
@@ -464,26 +479,30 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
* close the editor (if we closed the editor before sync began, we'd get an exception,
* since the debouncer will be triggered on a non-existent editor)
*/
async saveNote(
async save(
note: SNNote,
editorValues: EditorValues,
bypassDebouncer = false,
isUserModified = false,
dontUpdatePreviews = false,
customMutate?: (mutator: NoteMutator) => void,
closeAfterSync = false
) {
const title = editorValues.title;
const text = editorValues.text;
const isTemplate = this.editor.isTemplateNote;
const selectedTag = this.appState.selectedTag;
if (document.hidden) {
this.application.alertService!.alert(STRING_SAVING_WHILE_DOCUMENT_HIDDEN);
this.application.alertService.alert(STRING_SAVING_WHILE_DOCUMENT_HIDDEN);
return;
}
const note = this.note;
if (note.deleted) {
this.application.alertService!.alert(STRING_DELETED_NOTE);
this.application.alertService.alert(STRING_DELETED_NOTE);
return;
}
if (this.editor.isTemplateNote) {
if (isTemplate) {
await this.editor.insertTemplatedNote();
}
const selectedTag = this.appState.selectedTag;
if (
!selectedTag?.isSmartTag &&
!selectedTag?.hasRelationshipWithItem(note)
@@ -493,7 +512,7 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
});
}
if (!this.application.findItem(note.uuid)) {
this.application.alertService!.alert(STRING_INVALID_NOTE);
this.application.alertService.alert(STRING_INVALID_NOTE);
return;
}
await this.application.changeItem(
@@ -503,12 +522,12 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
if (customMutate) {
customMutate(noteMutator);
}
noteMutator.title = this.editorValues.title!;
noteMutator.text = this.editorValues.text!;
noteMutator.title = title;
noteMutator.text = text;
if (!dontUpdatePreviews) {
const text = this.editorValues.text || '';
const truncate = text.length > NOTE_PREVIEW_CHAR_LIMIT;
const substring = text.substring(0, NOTE_PREVIEW_CHAR_LIMIT);
const noteText = text || '';
const truncate = noteText.length > NOTE_PREVIEW_CHAR_LIMIT;
const substring = noteText.substring(0, NOTE_PREVIEW_CHAR_LIMIT);
const previewPlain = substring + (truncate ? STRING_ELLIPSES : '');
noteMutator.preview_plain = previewPlain;
noteMutator.preview_html = undefined;
@@ -541,7 +560,8 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
syncTakingTooLong: false,
});
this.setStatus({
message: 'All changes saved' + (this.application.noAccount() ? ' offline' : ''),
message:
'All changes saved' + (this.application.noAccount() ? ' offline' : ''),
});
}
@@ -583,7 +603,7 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
}
contentChanged() {
this.saveNote(false, true);
this.save(this.note, copyEditorValues(this.editorValues), false, true);
}
onTitleEnter($event: Event) {
@@ -593,7 +613,13 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
}
onTitleChange() {
this.saveNote(false, true, true);
this.save(
this.note,
copyEditorValues(this.editorValues),
false,
true,
true
);
}
focusEditor() {
@@ -653,9 +679,16 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
if (permanently) {
this.performNoteDeletion(this.note);
} else {
this.saveNote(true, false, true, (mutator) => {
mutator.trashed = true;
});
this.save(
this.note,
copyEditorValues(this.editorValues),
true,
false,
true,
(mutator) => {
mutator.trashed = true;
}
);
}
}
}
@@ -665,7 +698,9 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
}
restoreTrashedNote() {
this.saveNote(
this.save(
this.note,
copyEditorValues(this.editorValues),
true,
false,
true,
@@ -698,15 +733,31 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
}
togglePin() {
this.saveNote(true, false, true, (mutator) => {
mutator.pinned = !this.note.pinned;
});
const note = this.note;
this.save(
note,
copyEditorValues(this.editorValues),
true,
false,
true,
(mutator) => {
mutator.pinned = !note.pinned;
}
);
}
toggleLockNote() {
this.saveNote(true, false, true, (mutator) => {
mutator.locked = !this.note.locked;
});
const note = this.note;
this.save(
note,
copyEditorValues(this.editorValues),
true,
false,
true,
(mutator) => {
mutator.locked = !note.locked;
}
);
}
async toggleProtectNote() {
@@ -723,29 +774,40 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
}
toggleNotePreview() {
this.saveNote(true, false, true, (mutator) => {
mutator.hidePreview = !this.note.hidePreview;
});
const note = this.note;
this.save(
note,
copyEditorValues(this.editorValues),
true,
false,
true,
(mutator) => {
mutator.hidePreview = !note.hidePreview;
}
);
}
toggleArchiveNote() {
if (this.note.locked) {
const note = this.note;
if (note.locked) {
alertDialog({
text: this.note.archived
text: note.archived
? STRING_UNARCHIVE_LOCKED_ATTEMPT
: STRING_ARCHIVE_LOCKED_ATTEMPT,
});
return;
}
this.saveNote(
this.save(
note,
copyEditorValues(this.editorValues),
true,
false,
true,
(mutator) => {
mutator.archived = !this.note.archived;
mutator.archived = !note.archived;
},
/** If we are unarchiving, and we are in the archived tag, close the editor */
this.note.archived && this.appState.selectedTag?.isArchiveTag
note.archived && this.appState.selectedTag?.isArchiveTag
);
}
@@ -1176,7 +1238,7 @@ class EditorViewCtrl extends PureViewCtrl<unknown, EditorState> {
editor.selectionStart = editor.selectionEnd = start + 4;
}
this.editorValues.text = editor.value;
this.saveNote(true);
this.save(this.note, copyEditorValues(this.editorValues), true);
},
});

3
app/assets/javascripts/views/notes/notes-view.pug
View File

@@ -7,7 +7,8 @@
.sk-button.contrast.wide(
ng-click='self.createNewNote()',
title='Create a new note in the selected tag'
)
aria-label="Create new note"
)
.sk-label
i.icon.ion-plus.add-button
.filter-section(role='search')