upgraded Ember and Bootstrap, merged changes

gui/app/components/customize/auth-settings.js

@@ -27,16 +27,20 @@ export default Component.extend({
 	KeycloakPublicKeyError: empty('keycloakConfig.publicKey'),
 	KeycloakAdminUserError: empty('keycloakConfig.adminUser'),
 	KeycloakAdminPasswordError: empty('keycloakConfig.adminPassword'),
-	keycloakConfig: {
-		url: '',
-		realm: '',
-		clientId: '',
-		publicKey: '',
-		adminUser: '',
-		adminPassword: '',
-		group: '',
-		disableLogout: false,
-		defaultPermissionAddSpace: false
+
+	init() {
+		this._super(...arguments);
+		this.keycloakConfig = {
+			url: '',
+			realm: '',
+			clientId: '',
+			publicKey: '',
+			adminUser: '',
+			adminPassword: '',
+			group: '',
+			disableLogout: false,
+			defaultPermissionAddSpace: false
+		};
 	},
 
 	didReceiveAttrs() {

gui/app/components/customize/smtp-settings.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty } from '@ember/object/computed';
 import Component from '@ember/component';
 

gui/app/components/customize/user-admin.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import Component from '@ember/component';
 import { schedule, debounce } from '@ember/runloop';
 import AuthProvider from '../../mixins/auth';
@@ -17,13 +18,17 @@ import ModalMixin from '../../mixins/modal';
 export default Component.extend(AuthProvider, ModalMixin, {
 	editUser: null,
 	deleteUser: null,
-	password: {},
 	filter: '',
-	filteredUsers: [],
-	selectedUsers: [],
 	hasSelectedUsers: false,
 	showDeleteDialog: false,
 
+	init() {
+		this._super(...arguments);
+		this.password = {};
+		this.filteredUsers = [];
+		this.selectedUsers = [];	
+	},
+
 	didReceiveAttrs() {
 		this._super(...arguments);
 
@@ -74,25 +79,29 @@ export default Component.extend(AuthProvider, ModalMixin, {
 		toggleActive(id) {
 			let user = this.users.findBy("id", id);
 			user.set('active', !user.get('active'));
-			this.attrs.onSave(user);
+			let cb = this.get('onSave');
+			cb(user);
 		},
 
 		toggleEditor(id) {
 			let user = this.users.findBy("id", id);
 			user.set('editor', !user.get('editor'));
-			this.attrs.onSave(user);
+			let cb = this.get('onSave');
+			cb(user);
 		},
 
 		toggleAdmin(id) {
 			let user = this.users.findBy("id", id);
 			user.set('admin', !user.get('admin'));
-			this.attrs.onSave(user);
+			let cb = this.get('onSave');
+			cb(user);
 		},
 
 		toggleUsers(id) {
 			let user = this.users.findBy("id", id);
 			user.set('viewUsers', !user.get('viewUsers'));
-			this.attrs.onSave(user);
+			let cb = this.get('onSave');
+			cb(user);
 		},
 
 		onShowEdit(id) {
@@ -135,11 +144,14 @@ export default Component.extend(AuthProvider, ModalMixin, {
 			$('#edit-user-modal').modal('hide');
 			$('#edit-user-modal').modal('dispose');
 
-			this.attrs.onSave(user);
+			let cb = this.get('onSave');
+			cb(user);
 
 			if (is.not.empty(password.password) && is.not.empty(password.confirmation) &&
 				password.password === password.confirmation) {
-				this.attrs.onPassword(user, password.password);
+
+				let pw = this.get('onPassword');
+				pw(user, password.password);
 			}
 		},
 
@@ -153,7 +165,9 @@ export default Component.extend(AuthProvider, ModalMixin, {
 
 			this.set('selectedUsers', []);
 			this.set('hasSelectedUsers', false);
-			this.attrs.onDelete(this.get('deleteUser.id'));
+
+			let cb = this.get('onDelete');
+			cb(this.get('deleteUser.id'));
 
 			return true;
 		},
@@ -162,7 +176,8 @@ export default Component.extend(AuthProvider, ModalMixin, {
 			let su = this.get('selectedUsers');
 
 			su.forEach(userId => {
-				this.attrs.onDelete(userId);
+				let cb = this.get('onDelete');
+				cb(userId);
 			});
 
 			this.set('selectedUsers', []);

gui/app/components/customize/user-settings.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty, and } from '@ember/object/computed';
 import Component from '@ember/component';
 import { isEmpty } from '@ember/utils';
@@ -16,7 +17,6 @@ import { get, set } from '@ember/object';
 import AuthProvider from '../../mixins/auth';
 
 export default Component.extend(AuthProvider, {
-	newUser: { firstname: "", lastname: "", email: "", active: true },
 	firstnameEmpty: empty('newUser.firstname'),
 	lastnameEmpty: empty('newUser.lastname'),
 	emailEmpty: empty('newUser.email'),
@@ -24,6 +24,11 @@ export default Component.extend(AuthProvider, {
 	hasLastnameEmptyError: and('lastnameEmpty', 'lastnameError'),
 	hasEmailEmptyError: and('emailEmpty', 'emailError'),
 
+	init() {
+		this._super(...arguments);
+		this.newUser = { firstname: "", lastname: "", email: "", active: true };
+	},
+	
 	actions: {
 		add() {
 			if (isEmpty(this.get('newUser.firstname'))) {

gui/app/components/document/block-editor.js

@@ -44,11 +44,13 @@ export default Component.extend({
 
     actions: {
         onCancel() {
-            this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
         },
 
         onAction(page, meta) {
-            this.attrs.onAction(page, meta);
+			let cb = this.get('onAction');
+			cb(page, meta);
         }
     }
 });

gui/app/components/document/content-linker.js

@@ -20,25 +20,17 @@ export default Component.extend(ModalMixin, TooltipMixin, {
 	link: service(),
 	linkName: '',
 	selection: null,
-
 	tab1Selected: true,
 	tab2Selected: false,
 	tab3Selected: false,
 	showSections: computed('tab1Selected', function() { return this.get('tab1Selected'); }),
 	showAttachments: computed('tab2Selected', function() { return this.get('tab2Selected'); }),
 	showSearch: computed('tab3Selected', function() { return this.get('tab3Selected'); }),
-
 	keywords: '',
-	matches: {
-		documents: [],
-		pages: [],
-		attachments: []
-	},
 	hasMatches: computed('matches', function () {
 		let m = this.get('matches');
 		return m.documents.length || m.pages.length || m.attachments.length;
 	}),
-
 	modalId: computed('page', function() { return '#content-linker-modal-' + this.get('page.id'); }),
 	showModal: false,
 	onToggle: function() {
@@ -63,17 +55,23 @@ export default Component.extend(ModalMixin, TooltipMixin, {
 		this.modalOpen(modalId, {show: true});
 	}.observes('showModal'),
 
+	init() {
+		this._super(...arguments);
+		this.matches = {
+			documents: [],
+			pages: [],
+			attachments: []
+		};
+	},
+
 	didRender() {
 		this._super(...arguments);
-
 		this.renderTooltips();
 	},
 
 	willDestroyElement() {
 		this._super(...arguments);
-
 		this.removeTooltips();
-
 		this.modalClose(this.get('modalId'));
 	},
 

gui/app/components/document/document-editor.js

@@ -18,11 +18,13 @@ export default Component.extend({
 
     actions: {
         onCancel() {
-            this.attrs.onCancel();
+            let cb = this.get('onCancel');
+            cb();
         },
 
         onAction(page, meta) {
-            this.attrs.onAction(page, meta);
+            let cb = this.get('onAction');
+            cb(page, meta);
         }
     }
 });

gui/app/components/document/document-heading.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty } from '@ember/object/computed';
 import { computed } from '@ember/object';
 import { schedule } from '@ember/runloop';
@@ -62,7 +63,8 @@ export default Component.extend({
 			this.set('document.excerpt', this.get('docExcerpt'));
 			this.set('editMode', false);
 
-			this.attrs.onSaveDocument(this.get('document'));
+			let cb = this.get('onSaveDocument');
+			cb(this.get('document'));
 		},
 
 		onCancel() {

gui/app/components/document/document-meta.js

@@ -9,7 +9,9 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { computed } from '@ember/object';
+import { notEmpty } from '@ember/object/computed';
 import { inject as service } from '@ember/service';
 import Component from '@ember/component';
 import { A } from "@ember/array"
@@ -19,12 +21,9 @@ export default Component.extend({
     documentService: service('document'),
 	categoryService: service('category'),
 	sessionService: service('session'),
-	maxTags: 3,
+
 	categories: A([]),
 	newCategory: '',
-	tagz: A([]),
-	tagzModal: A([]),
-	newTag: '',
 	showCategoryModal: false,
 	hasCategories: computed('categories', function() {
 		return this.get('categories').length > 0;
@@ -36,9 +35,63 @@ export default Component.extend({
 		return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
 	}),
 
+	maxTags: 3,
+	tagz: A([]),
+	tagzModal: A([]),
+	newTag: '',
+
+	contributorMsg: '',
+	approverMsg: '',
+	userChanges: notEmpty('contributorMsg'),
+	isApprover: computed('permissions', function() {
+		return this.get('permissions.documentApprove');
+	}),
+	changeControlMsg: computed('document.protection', function() {
+		let p = this.get('document.protection');
+		let constants = this.get('constants');
+		let msg = '';
+		
+		switch (p) {
+			case constants.ProtectionType.None:
+				msg = constants.ProtectionType.NoneLabel;
+				break;
+			case constants.ProtectionType.Lock:
+				msg = constants.ProtectionType.LockLabel;
+				break;
+			case constants.ProtectionType.Review:
+				msg = constants.ProtectionType.ReviewLabel;
+				break;
+		}
+
+		return msg;
+	}),
+	approvalMsg: computed('document.{protection,approval}', function() {
+		let p = this.get('document.protection');
+		let a = this.get('document.approval');
+		let constants = this.get('constants');
+		let msg = '';
+
+		if (p === constants.ProtectionType.Review) {
+			switch (a) {
+				case constants.ApprovalType.Anybody:
+					msg = constants.ApprovalType.AnybodyLabel;
+					break;
+				case constants.ApprovalType.Majority:
+					msg = constants.ApprovalType.MajorityLabel;
+					break;
+				case constants.ApprovalType.Unanimous:
+					msg = constants.ApprovalType.UnanimousLabel;
+					break;
+			}
+		}
+
+		return msg;
+	}),	
+
 	didReceiveAttrs() {
 		this._super(...arguments);
 		this.load();
+		this.workflowStatus();
 	},
 
 	didInsertElement() {
@@ -100,6 +153,39 @@ export default Component.extend({
         this.set('tagz', A(tagz));
 	},
 
+	workflowStatus() {
+		let pages = this.get('pages');
+		let contributorMsg = '';
+		let userPendingCount = 0;
+		let userReviewCount = 0;
+		let userRejectedCount = 0;
+		let approverMsg = '';
+		let approverPendingCount = 0;
+		let approverReviewCount = 0;
+		let approverRejectedCount = 0;
+
+		pages.forEach((item) => {
+			if (item.get('userHasChangePending')) userPendingCount+=1;
+			if (item.get('userHasChangeAwaitingReview')) userReviewCount+=1;
+			if (item.get('userHasChangeRejected')) userRejectedCount+=1;
+			if (item.get('changePending')) approverPendingCount+=1;
+			if (item.get('changeAwaitingReview')) approverReviewCount+=1;
+			if (item.get('changeRejected')) approverRejectedCount+=1;
+		});
+
+		if (userPendingCount > 0 || userReviewCount > 0 || userRejectedCount > 0) {
+			let label = userPendingCount === 1 ? 'change' : 'changes';
+			contributorMsg = `${userPendingCount} ${label} progressing, ${userReviewCount} awaiting review, ${userRejectedCount} rejected`;
+		}
+		this.set('contributorMsg', contributorMsg);
+
+		if (approverPendingCount > 0 || approverReviewCount > 0 || approverRejectedCount > 0) {
+			let label = approverPendingCount === 1 ? 'change' : 'changes';
+			approverMsg = `${approverPendingCount} ${label} progressing, ${approverReviewCount} awaiting review, ${approverRejectedCount} rejected`;
+		}
+		this.set('approverMsg', approverMsg);
+	},
+
     actions: {
 		onShowCategoryModal() {
 			this.set('showCategoryModal', true);
@@ -179,13 +265,15 @@ export default Component.extend({
 
 			let doc = this.get('document');
 			doc.set('tags', save);
-			this.attrs.onSaveDocument(doc);
+
+			let cb = this.get('onSaveDocument');
+			cb(doc);
 
 			this.load();
 			this.set('newTag', '');
 
 			$('#document-tags-modal').modal('hide');
 			$('#document-tags-modal').modal('dispose');
-		},
+		}
 	}
 });

gui/app/components/document/document-page.js

@@ -17,46 +17,55 @@ export default Component.extend(TooltipMixin, {
 	documentService: service('document'),
 	sectionService: service('section'),
 	editMode: false,
+	editPage: null,
+	editMeta: null,
 
 	didReceiveAttrs() {
 		this._super(...arguments);
+		if (this.get('isDestroyed') || this.get('isDestroying')) return;
+		if (this.get('toEdit') === this.get('page.id') && this.get('permissions.documentEdit')) this.send('onEdit');
 
-		if (this.get('isDestroyed') || this.get('isDestroying')) {
-			return;
+		if (this.get('session.authenticated')) {
+			this.workflow();
 		}
+	},
 
-		let page = this.get('page');
-
-		this.get('documentService').getPageMeta(page.get('documentId'), page.get('id')).then((meta) => {
-			if (this.get('isDestroyed') || this.get('isDestroying')) {
-				return;
-			}
-
-			this.set('meta', meta);
-			if (this.get('toEdit') === this.get('page.id') && this.get('permissions.documentEdit')) {
-				this.send('onEdit');
-			}
-		});
+	workflow() {
+		this.set('editPage', this.get('page'));
+        this.set('editMeta', this.get('meta'));
 	},
 
 	actions: {
 		onSavePage(page, meta) {
-			this.set('page', page);
-			this.set('meta', meta);
+			let constants = this.get('constants');
+
+			if (this.get('document.protection') === constants.ProtectionType.Review) {			
+				if (this.get('page.status') === constants.ChangeState.Published) {
+					page.set('relativeId', this.get('page.id'));
+				}
+				if (this.get('page.status') === constants.ChangeState.PendingNew) {
+					page.set('relativeId', '');
+				}
+			}
+
 			this.set('editMode', false);
-			this.get('onSavePage')(page, meta);
+			let cb = this.get('onSavePage');
+			cb(page, meta);
 		},
 
 		onSavePageAsBlock(block) {
-			this.attrs.onSavePageAsBlock(block);
+			let cb = this.get('onSavePageAsBlock');
+			cb(block);
 		},
 
 		onCopyPage(documentId) {
-			this.attrs.onCopyPage(this.get('page.id'), documentId);
+			let cb = this.get('onCopyPage');
+			cb(this.get('page.id'), documentId);
 		},
 
 		onMovePage(documentId) {
-			this.attrs.onMovePage(this.get('page.id'), documentId);
+			let cb = this.get('onMovePage');
+			cb(this.get('page.id'), documentId);
 		},
 
 		onDeletePage(deleteChildren) {
@@ -72,16 +81,14 @@ export default Component.extend(TooltipMixin, {
 				children: deleteChildren
 			};
 
-			this.attrs.onDeletePage(params);
+			let cb = this.get('onDeletePage');
+			cb(params);
 		},
 
+		// Calculate if user is editing page or a pending change as per approval process
 		onEdit() {
-			if (this.get('editMode')) {
-				return;
-			}
-
+			if (this.get('editMode')) return;
 			this.get('toEdit', '');
-			// this.set('pageId', this.get('page.id'));
 			this.set('editMode', true);
 		},
 

gui/app/components/document/document-toc.js

@@ -9,101 +9,119 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { computed } from '@ember/object';
 import { schedule } from '@ember/runloop';
 import { inject as service } from '@ember/service';
 import Component from '@ember/component';
 import tocUtil from '../../utils/toc';
+import TooltipMixin from '../../mixins/tooltip';
 
-export default Component.extend({
+export default Component.extend(TooltipMixin, {
 	documentService: service('document'),
-	document: {},
-	folder: {},
-	pages: [],
-	currentPageId: '',
-	state: {
-		actionablePage: false,
-		upDisabled: true,
-		downDisabled: true,
-		indentDisabled: true,
-		outdentDisabled: true
-	},
+	isDesktop: false,
 	emptyState: computed('pages', function () {
 		return this.get('pages.length') === 0;
 	}),
-	isDesktop: false,
+	canEdit: computed('permssions', 'document', function() {
+		let constants = this.get('constants');
+		let permissions = this.get('permissions');
+		let authenticated = this.get('session.authenticated');
+		let notEmpty = this.get('pages.length') > 0;
+
+		if (notEmpty && authenticated && permissions.get('documentEdit') && this.get('document.protection') === constants.ProtectionType.None) return true;
+		if (notEmpty && authenticated && permissions.get('documentApprove') && this.get('document.protection') === constants.ProtectionType.Review) return true;
+
+		return false;
+	}),
+
+	init() {
+		this._super(...arguments);
+		this.state = {
+			actionablePage: false,
+			upDisabled: true,
+			downDisabled: true,
+			indentDisabled: true,
+			outdentDisabled: true,
+			pageId: ''
+		};		
+	},
 
 	didReceiveAttrs() {
 		this._super(...arguments);
-		this.setState(this.get('currentPageId'));
+		let cp = this.get('currentPageId');
+		this.setState(is.empty(cp) ? '' : cp);
 	},
 
 	didInsertElement() {
 		this._super(...arguments);
-
-		this.setSize();
 		this.eventBus.subscribe('documentPageAdded', this, 'onDocumentPageAdded');
-		this.eventBus.subscribe('resized', this, 'onResize');
-		this.attachResizer();
+		this.eventBus.subscribe('resized', this, 'setSize');
+	
+		this.setSize();
+		this.renderTooltips();
 	},
 
 	willDestroyElement() {
 		this._super(...arguments);
-
 		this.eventBus.unsubscribe('documentPageAdded');
 		this.eventBus.unsubscribe('resized');
 
 		let t = '#doc-toc';
-		if (interact.isSet(t)) {
-			interact(t).unset();
-		}
+		if (interact.isSet(t)) interact(t).unset();
+		this.removeTooltips();
 	},
 
 	onDocumentPageAdded(pageId) {
-		this.send('onEntryClick', pageId);
-		this.setSize();
-	},
-
-	onResize() {
 		this.setSize();
+		this.send('onGotoPage', pageId);
 	},
 
 	setSize() {
-		let isDesktop = $(window).width() >= 1800;
-		this.set('isDesktop', isDesktop);
+		schedule('afterRender', () => {
+			let isDesktop = $(window).width() >= 1800;
+			this.set('isDesktop', isDesktop);
 
-		if (isDesktop) {
-			let h = $(window).height() - $("#nav-bar").height() - 140;
-			$("#doc-toc").css('max-height', h);
-	
-			let i = $("#doc-view").offset();
-	
-			if (is.not.undefined(i)) {
-				let l = i.left - 100;
-				if (l > 350) l = 350;
-				$("#doc-toc").width(l);
+			if (isDesktop) {
+				let h = $(window).height() - $("#nav-bar").height() - 140;
+				$("#doc-toc").css('max-height', h);
+		
+				let i = $("#doc-view").offset();
+		
+				if (is.not.undefined(i)) {
+					let l = i.left - 100;
+					if (l > 350) l = 350;
+					$("#doc-toc").width(l);
 
+					$("#doc-toc").css({
+						'display': 'inline-block',
+						'position': 'fixed',
+						'width': l+'px',
+						'height': 'auto',
+						'transform': '',
+					});
+
+					this.attachResizer();
+				}
+			} else {
 				$("#doc-toc").css({
-					'display': 'inline-block',
-					'position': 'fixed',
-					'width': l+'px',
-					'height': 'auto',
-					'transform': '',
+					'display': 'block',
+					'position': 'relative',
+					'width': '100%',
+					'height': '500px',
+					'transform': 'none',
 				});
 			}
-		} else {
-			$("#doc-toc").css({
-				'display': 'block',
-				'position': 'relative',
-				'width': '100%',
-				'height': '500px',
-				'transform': 'none',
-			});
-		}
+		});
 	},
 
 	attachResizer() {
 		schedule('afterRender', () => {
+			let t = '#doc-toc';
+			if (interact.isSet(t)) {
+				interact(t).unset();
+			}
+
 			interact('#doc-toc')
 				.draggable({
 					autoScroll: true,
@@ -166,15 +184,12 @@ export default Component.extend({
 	},
 
 	// Controls what user can do with the toc (left sidebar)
-	// Identifies the target pages
 	setState(pageId) {
-		this.set('currentPageId', pageId);
-
 		let toc = this.get('pages');
-		let page = _.findWhere(toc, { id: pageId });
-		let state = tocUtil.getState(toc, page);
+		let page = _.find(toc, function(i) { return i.get('page.id') === pageId; });
+		let state = tocUtil.getState(toc, is.not.undefined(page) ? page.get('page') : page);
 
-		if (!this.get('permissions.documentEdit') || is.empty(pageId)) {
+		if (!this.get('canEdit')) {
 			state.actionablePage = false;
 			state.upDisabled = state.downDisabled = state.indentDisabled = state.outdentDisabled = true;
 		}
@@ -185,77 +200,77 @@ export default Component.extend({
 	actions: {
 		// Page up -- above pages shunt down
 		pageUp() {
-			if (this.get('state.upDisabled')) {
+			let state = this.get('state');
+
+			if (state.upDisabled || this.get('document.protection') !== this.get('constants').ProtectionType.None) {
 				return;
 			}
 
-			let state = this.get('state');
 			let pages = this.get('pages');
-			let page = _.findWhere(pages, { id: this.get('currentPageId') });
-			let pendingChanges = tocUtil.moveUp(state, pages, page);
+			let page = _.find(pages, function(i) { return i.get('page.id') === state.pageId; });
+			if (is.not.undefined(page)) page = page.get('page');
 
+			let pendingChanges = tocUtil.moveUp(state, pages, page);
 			if (pendingChanges.length > 0) {
-				this.attrs.onPageSequenceChange(pendingChanges);
+				let cb = this.get('onPageSequenceChange');
+				cb(state.pageId, pendingChanges);
 			}
 		},
 
 		// Move down -- pages below shift up
 		pageDown() {
-			if (this.get('state.downDisabled')) {
-				return;
-			}
+			if (!this.get('canEdit')) return;
 
 			let state = this.get('state');
-			var pages = this.get('pages');
-			var page = _.findWhere(pages, { id: this.get('currentPageId') });
-			let pendingChanges = tocUtil.moveDown(state, pages, page);
+			let pages = this.get('pages');
+			let page = _.find(pages, function(i) { return i.get('page.id') === state.pageId; });
+			if (is.not.undefined(page)) page = page.get('page');
 
+			let pendingChanges = tocUtil.moveDown(state, pages, page);
 			if (pendingChanges.length > 0) {
-				this.attrs.onPageSequenceChange(pendingChanges);
+				let cb = this.get('onPageSequenceChange');
+				cb(state.pageId, pendingChanges);
 			}
 		},
 
 		// Indent -- changes a page from H2 to H3, etc.
 		pageIndent() {
-			if (this.get('state.indentDisabled')) {
-				return;
-			}
+			if (!this.get('canEdit')) return;
 
 			let state = this.get('state');
-			var pages = this.get('pages');
-			var page = _.findWhere(pages, { id: this.get('currentPageId') });
-			let pendingChanges = tocUtil.indent(state, pages, page);
+			let pages = this.get('pages');
+			let page = _.find(pages, function(i) { return i.get('page.id') === state.pageId; });
+			if (is.not.undefined(page)) page = page.get('page');
 
+			let pendingChanges = tocUtil.indent(state, pages, page);
 			if (pendingChanges.length > 0) {
-				this.attrs.onPageLevelChange(pendingChanges);
+				let cb = this.get('onPageLevelChange');
+				cb(state.pageId, pendingChanges);
 			}
 		},
 
 		// Outdent -- changes a page from H3 to H2, etc.
 		pageOutdent() {
-			if (this.get('state.outdentDisabled')) {
-				return;
-			}
-
+			if (!this.get('canEdit')) return;
+			
 			let state = this.get('state');
-			var pages = this.get('pages');
-			var page = _.findWhere(pages, { id: this.get('currentPageId') });
-			let pendingChanges = tocUtil.outdent(state, pages, page);
+			let pages = this.get('pages');
+			let page = _.find(pages, function(i) { return i.get('page.id') === state.pageId; });
+			if (is.not.undefined(page)) page = page.get('page');
 
+			let pendingChanges = tocUtil.outdent(state, pages, page);
 			if (pendingChanges.length > 0) {
-				this.attrs.onPageLevelChange(pendingChanges);
+				let cb = this.get('onPageLevelChange');
+				cb(state.pageId, pendingChanges);
 			}
 		},
 
-		onEntryClick(id) {
-			if (id !== '') {
-				let jumpTo = "#page-" + id;
-				this.set('tab', 'content');
-				if (!$(jumpTo).inView()) {
-					$(jumpTo).velocity("scroll", { duration: 250, offset: -100 });
-				}
-				this.setState(id);
-			}
+		onGotoPage(id) {
+			if (id === '')  return;
+			this.setState(id);
+
+			let cb = this.get('onShowPage');
+			cb(id);
 		}
 	}
 });

gui/app/components/document/page-heading.js

@@ -9,66 +9,72 @@
 //
 // https://documize.com
 
-import Component from '@ember/component';
+import $ from 'jquery';
 import { computed } from '@ember/object';
+import { debounce } from '@ember/runloop';
 import { inject as service } from '@ember/service';
-import { A } from "@ember/array"
 import ModalMixin from '../../mixins/modal';
+import Component from '@ember/component';
 
 export default Component.extend(ModalMixin, {
 	documentService: service('document'),
+	searchService: service('search'),
+	router: service(),
 	deleteChildren: false,
 	blockTitle: "",
 	blockExcerpt: "",
-	documentList: A([]), 		//includes the current document
-	documentListOthers: A([]), 	//excludes the current document
-	hasMenuPermissions: computed('permissions', function() {
-		let permissions = this.get('permissions');
-		return permissions.get('documentDelete') || permissions.get('documentCopy') ||
-			permissions.get('documentMove') || permissions.get('documentTemplate');
+	canEdit: false,
+	canDelete: false,
+	canMove: false,
+	docSearchFilter: '',
+	onKeywordChange: function () {
+		debounce(this, this.searchDocs, 750);
+	}.observes('docSearchFilter'),
+	emptySearch: computed('docSearchResults', function() {
+		return this.get('docSearchResults.length') === 0;
 	}),
+	hasMenuPermissions: computed('permissions', 'userPendingItem', 'canEdit', 'canMove', 'canDelete', function() {
+		let permissions = this.get('permissions');
+
+		return permissions.get('documentCopy') || permissions.get('documentTemplate') ||
+			this.get('canEdit') || this.get('canMove') || this.get('canDelete');
+	}),
+
+	init() {
+		this._super(...arguments);
+		this.docSearchResults = [];
+	},
 
 	didReceiveAttrs() {
 		this._super(...arguments);
-
-		// Fetch document targets once
-		if (this.get('documentList').length > 0) {
-			return;
-		}
-
 		this.modalInputFocus('#publish-page-modal-' + this.get('page.id'), '#block-title-' + this.get('page.id'));
-		this.load();
-	},
 
-	load() {
-		let permissions = this.get('permissions');
-		if (permissions.get('documentMove') || permissions.get('documentCopy')) {
-			this.get('documentService').getPageMoveCopyTargets().then((d) => {
-				let me = this.get('document');
+	},
 	
-				d.forEach((i) => {
-					i.set('selected', false);
-				});
-	
-				if (this.get('isDestroyed') || this.get('isDestroying')) {
-					return;
-				}
-	
-				this.set('documentList', A(d));
-				this.set('documentListOthers', A(d.filter((item) => item.get('id') !== me.get('id'))));
-			});
-		}
+	searchDocs() {
+		let payload = { keywords: this.get('docSearchFilter').trim(), doc: true };
+		if (payload.keywords.length == 0) return;
+
+		this.get('searchService').find(payload).then((response)=> {
+			this.set('docSearchResults', response);
+		});
 	},
 
 	actions: {
 		onEdit() {
-			this.attrs.onEdit();
+			let page = this.get('page');
+
+			if (page.get('pageType') == this.get('constants').PageType.Tab) {
+				this.get('router').transitionTo('document.section', page.get('id'));
+			} else {
+				let cb = this.get('onEdit');
+				cb();
+			}
 		},
 
 		onDeletePage() {
-			this.attrs.onDeletePage(this.get('deleteChildren'));
-
-			this.load();
+			let cb = this.get('onDeletePage');
+			cb(this.get('deleteChildren'));
 
 			this.modalClose('#delete-page-modal-' + this.get('page.id'));
 		},
@@ -103,57 +109,60 @@ export default Component.extend(ModalMixin, {
 					externalSource: pm.get('externalSource')
 				};
 
-				this.attrs.onSavePageAsBlock(block);
+				let cb = this.get('onSavePageAsBlock');
+				cb(block);
 
 				this.set('blockTitle', '');
 				this.set('blockExcerpt', '');
 				$(titleElem).removeClass('is-invalid');
 				$(excerptElem).removeClass('is-invalid');
 
-				this.load();
-
 				this.modalClose('#publish-page-modal-' + this.get('page.id'));
+
+				let refresh = this.get('refresh');
+				refresh();
 			});
 		},
 
+		onSelectSearchResult(documentId) {
+			let results = this.get('docSearchResults');
+			results.forEach((d) => {
+				d.set('selected', d.get('documentId') === documentId);
+			});
+			this.set('docSearchResults', results);
+		},
+
 		onCopyPage() {
-			// can't proceed if no data
-			if (this.get('documentList.length') === 0) {
-				return;
-			}
+			let item = this.get('docSearchResults').findBy('selected', true);
+			let documentId = is.not.undefined(item) ? item.get('documentId') : '';
 
-			let targetDocumentId = this.get('documentList').findBy('selected', true).get('id');
-
-			// fall back to self
-			if (is.null(targetDocumentId)) {
-				targetDocumentId = this.get('document.id');
-			}
-
-			this.attrs.onCopyPage(targetDocumentId);
-
-			this.load();
+			if (is.empty(documentId)) return;
 
 			this.modalClose('#copy-page-modal-' + this.get('page.id'));
+
+			let cb = this.get('onCopyPage');
+			cb(documentId);
+
+			let refresh = this.get('refresh');
+			refresh();
 		},
 
 		onMovePage() {
-			// can't proceed if no data
-			if (this.get('documentListOthers.length') === 0) {
-				return;
-			}
+			let item = this.get('docSearchResults').findBy('selected', true);
+			let documentId = is.not.undefined(item) ? item.get('documentId') : '';
 
-			let targetDocumentId = this.get('documentListOthers').findBy('selected', true).get('id');
+			if (is.empty(documentId)) return;
 
-			// fall back to first document
-			if (is.null(targetDocumentId)) {
-				targetDocumentId = this.get('documentListOthers')[0].get('id');
-			}
-
-			this.attrs.onMovePage(targetDocumentId);
-
-			this.load();
+			// can't move into self
+			if (documentId === this.get('document.id')) return;
 
 			this.modalClose('#move-page-modal-' + this.get('page.id'));
-		}
+
+			let cb = this.get('onMovePage');
+			cb(documentId);
+
+			let refresh = this.get('refresh');
+			refresh();
+		},
 	}
 });

gui/app/components/document/view-activity.js

@@ -1,25 +0,0 @@
-// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
-//
-// This software (Documize Community Edition) is licensed under
-// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
-//
-// You can operate outside the AGPL restrictions by purchasing
-// Documize Enterprise Edition and obtaining a commercial license
-// by contacting <sales@documize.com>.
-//
-// https://documize.com
-
-import { inject as service } from '@ember/service';
-import Component from '@ember/component';
-
-export default Component.extend({
-	documentService: service('document'),
-
-	didReceiveAttrs() {
-		this._super(...arguments);
-
-		this.get('documentService').getActivity(this.get('document.id'), 7).then((activity) => {
-			this.set('activity', activity);
-		});	
-	}
-});

gui/app/components/document/view-attachment.js

@@ -18,24 +18,28 @@ export default Component.extend({
 	documentService: service('document'),
 	appMeta: service(),
 	hasAttachments: notEmpty('files'),
-	deleteAttachment: {
-		id: "",
-		name: "",
-	},
 	canShow: computed('permissions', 'files', function() {
 		return this.get('files.length') > 0 || this.get('permissions.documentEdit');
 	}),
+	canEdit: computed('permissions', 'document.protection', function() {
+		return this.get('document.protection') !== this.get('constants').ProtectionType.Lock && this.get('permissions.documentEdit');
+	}),
 	showDialog: false,
 	
 	init() {
 		this._super(...arguments);
 		this.getAttachments();
+
+		this.deleteAttachment = {
+			id: "",
+			name: "",
+		};
 	},
 
 	didInsertElement() {
 		this._super(...arguments);
 
-		if (!this.get('permissions.documentEdit')) {
+		if (!this.get('permissions.documentEdit') || this.get('document.protection') === this.get('constants').ProtectionType.Lock) {
 			return;
 		}
 
@@ -78,10 +82,6 @@ export default Component.extend({
 		this.set('drop', dzone);
 	},
 
-	willDestroyElement() {
-		this._super(...arguments);
-	},
-
 	getAttachments() {
 		this.get('documentService').getAttachments(this.get('document.id')).then((files) => {
 			this.set('files', files);

gui/app/components/document/view-content.js

@@ -9,11 +9,14 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { notEmpty, empty } from '@ember/object/computed';
 import { schedule } from '@ember/runloop';
 import { inject as service } from '@ember/service';
+import { computed } from '@ember/object';
 import Component from '@ember/component';
 import TooltipMixin from '../../mixins/tooltip';
+import models from '../../utils/model';
 
 export default Component.extend(TooltipMixin, {
 	documentService: service('document'),
@@ -28,11 +31,15 @@ export default Component.extend(TooltipMixin, {
 	toEdit: '',
 	showDeleteBlockDialog: false,
 	deleteBlockId: '',
+	canEdit: computed('permissions', 'document.protection', function() {
+		let canEdit = this.get('document.protection') !== this.get('constants').ProtectionType.Lock && this.get('permissions.documentEdit');
 
-	didReceiveAttrs() {
-		this._super(...arguments);
-		this.loadBlocks();
-	},
+		if (canEdit) this.setupAddWizard();
+		return canEdit;
+	}),
+	hasBlocks: computed('blocks', function() {
+		return this.get('blocks.length') > 0;
+	}),
 
 	didRender() {
 		this._super(...arguments);
@@ -41,20 +48,20 @@ export default Component.extend(TooltipMixin, {
 
 	didInsertElement() {
 		this._super(...arguments);
-		this.setupAddWizard();
 
-		if (this.attrs.onGotoPage !== null) {
-			this.attrs.onGotoPage(this.get('pageId'));
+		if (this.get('session.authenticated')) {
+			this.setupAddWizard();
+			this.renderTooltips();
 		}
-
-		this.renderTooltips();
 	},
 
 	willDestroyElement() {
 		this._super(...arguments);
-		$('.start-section:not(.start-section-empty-state)').off('.hoverIntent');
 
-		this.removeTooltips();
+		if (this.get('session.authenticated')) {
+			$('.start-section:not(.start-section-empty-state)').off('.hoverIntent');
+			this.removeTooltips();
+		}
 	},
 
 	contentLinkHandler() {
@@ -73,7 +80,7 @@ export default Component.extend(TooltipMixin, {
 					link.orphan = true;
 				} else {
 					if (link.linkType === "section") {
-						self.attrs.onGotoPage(link.targetId);
+						this.get('browser').scrollTo(`#page-${link.targetId}`);
 					}
 				}
 			}
@@ -105,80 +112,105 @@ export default Component.extend(TooltipMixin, {
 	},
 
 	addSection(model) {
-		// calculate sequence of page (position in document)
 		let sequence = 0;
 		let level = 1;
 		let beforePage = this.get('beforePage');
+		let constants = this.get('constants');
 
+		// calculate sequence of page (position in document)
 		if (is.not.null(beforePage)) {
 			level = beforePage.get('level');
 
 			// get any page before the beforePage so we can insert this new section between them
-			let index = _.findIndex(this.get('pages'), function(p) { return p.get('id') === beforePage.get('id'); });
+			let index = _.findIndex(this.get('pages'), function(item) { return item.get('page.id') === beforePage.get('id'); });
 
 			if (index !== -1) {
 				let beforeBeforePage = this.get('pages')[index-1];
 
 				if (is.not.undefined(beforeBeforePage)) {
-					sequence = (beforePage.get('sequence') + beforeBeforePage.get('sequence')) / 2;
+					sequence = (beforePage.get('sequence') + beforeBeforePage.get('page.sequence')) / 2;
 				} else {
 					sequence = beforePage.get('sequence') / 2;
 				}
+
+				model.page.set('sequence', sequence);
+				model.page.set('level', level);
 			}
 		}
 
-		model.page.sequence = sequence;
-		model.page.level = level;
+		if (this.get('document.protection') === constants.ProtectionType.Review) {
+			model.page.set('status', model.page.get('relativeId') === '' ? constants.ChangeState.PendingNew : constants.ChangeState.Pending);
+		}
 
 		this.send('onHideSectionWizard');
 
 		return this.get('onInsertSection')(model);
 	},
 
-	loadBlocks() {
-		if (is.not.undefined(this.get('folder'))) {
-			this.get('sectionService').getSpaceBlocks(this.get('folder.id')).then((blocks) => {
-				if (this.get('isDestroyed') || this.get('isDestroying')) {
-					return;
-				}
-	
-				this.set('blocks', blocks);
-				this.set('hasBlocks', blocks.get('length') > 0);
-			});
-		}
-	},
-
 	actions: {
 		onSavePageAsBlock(block) {
-			const promise = this.attrs.onSavePageAsBlock(block);
+			let cb = this.get('onSavePageAsBlock');
+			const promise = cb(block);
+
 			promise.then(() => {
-				this.loadBlocks();
+				let refresh = this.get('refresh');
+				refresh();
 			});
 		},
 
 		onCopyPage(pageId, documentId) {
-			this.attrs.onCopyPage(pageId, documentId);
+			let cb = this.get('onCopyPage');
+			cb(pageId, documentId);
 		},
 
 		onMovePage(pageId, documentId) {
-			this.attrs.onMovePage(pageId, documentId);
+			let cb = this.get('onMovePage');
+			cb(pageId, documentId);
 		},
 
 		onDeletePage(params) {
-			this.attrs.onDeletePage(params);
+			let cb = this.get('onDeletePage');
+			cb(params);
 		},
 
 		onSavePage(page, meta) {
-			this.set('toEdit', '');
-			this.attrs.onSavePage(page, meta);
+			let document = this.get('document');
+			let constants = this.get('constants');
+
+			switch (document.get('protection')) {
+				case constants.ProtectionType.Lock:
+					break;
+				case constants.ProtectionType.Review:
+					// detect edits to newly created pending page
+					if (page.get('relativeId') === '' && page.get('status') === constants.ChangeState.PendingNew) {
+						// new page, edits
+						this.set('toEdit', '');
+						let cb = this.get('onSavePage');
+						cb(page, meta);
+					} else if (page.get('relativeId') !== '' && page.get('status') === constants.ChangeState.Published) {
+						// existing page, first edit
+						const promise = this.addSection({ page: page, meta: meta });
+						promise.then((/*id*/) => { this.set('toEdit', ''); });
+					} else if (page.get('relativeId') !== '' && page.get('status') === constants.ChangeState.Pending) {
+						// existing page, subsequent edits
+						this.set('toEdit', '');
+						let cb = this.get('onSavePage');
+						cb(page, meta);
+					}
+					break;
+				case constants.ProtectionType.None:
+					// for un-protected documents, edits welcome!
+					this.set('toEdit', '');
+					// let cb2 = this.get('onSavePage');
+					// cb2(page, meta);
+					this.attrs.onSavePage(page, meta); // eslint-disable-line ember/no-attrs-in-components
+					
+					break;
+			}
 		},
 
 		onShowSectionWizard(page) {
-			if (is.undefined(page)) {
-				page = { id: '0' };
-			}
-
-			this.set('pageId', '');
+			if (is.undefined(page)) page = { id: '0' };
 
 			let beforePage = this.get('beforePage');
 			if (is.not.null(beforePage) && $("#new-section-wizard").is(':visible') && beforePage.get('id') === page.id) {
@@ -217,15 +249,11 @@ export default Component.extend(TooltipMixin, {
 				return;
 			}
 
-			let page = {
-				documentId: this.get('document.id'),
-				title: sectionName,
-				level: 1,
-				sequence: 0, // calculated elsewhere
-				body: "",
-				contentType: section.get('contentType'),
-				pageType: section.get('pageType')
-			};
+			let page = models.PageModel.create();
+			page.set('documentId', this.get('document.id'));
+			page.set('title', sectionName);
+			page.set('contentType', section.get('contentType'));
+			page.set('pageType', section.get('pageType'));
 
 			let meta = {
 				documentId: this.get('document.id'),
@@ -240,14 +268,7 @@ export default Component.extend(TooltipMixin, {
 
 			const promise = this.addSection(model);
 			promise.then((id) => {
-				this.set('pageId', id);
-
-				if (model.page.pageType === 'section') {
-					this.set('toEdit', id);
-				} else {
-					this.set('toEdit', '');
-				}
-
+				this.set('toEdit', model.page.pageType === 'section' ? id: '');
 				this.setupAddWizard();
 			});
 		},
@@ -263,7 +284,7 @@ export default Component.extend(TooltipMixin, {
 				documentId: this.get('document.id'),
 				title: `${block.get('title')}`,
 				level: 1,
-				sequence: 0, // calculated elsewhere
+				sequence: 1024,
 				body: block.get('body'),
 				contentType: block.get('contentType'),
 				pageType: block.get('pageType'),
@@ -283,9 +304,7 @@ export default Component.extend(TooltipMixin, {
 			};
 
 			const promise = this.addSection(model);
-			promise.then((id) => {
-				this.set('pageId', id);
-
+			promise.then((/*id*/) => {
 				this.setupAddWizard();
 			});
 		},
@@ -299,11 +318,14 @@ export default Component.extend(TooltipMixin, {
 			this.set('showDeleteBlockDialog', false);
 
 			let id = this.get('deleteBlockId');
-			const promise = this.attrs.onDeleteBlock(id);
+
+			let cb = this.get('onDeleteBlock');
+			let promise = cb(id);
 
 			promise.then(() => {
 				this.set('deleteBlockId', '');
-				this.loadBlocks();
+				let refresh = this.get('refresh');
+				refresh();
 			});
 
 			return true;

gui/app/components/document/view-revision.js

@@ -16,7 +16,6 @@ import ModalMixin from '../../mixins/modal';
 
 export default Component.extend(ModalMixin, {
 	documentService: service('document'),
-	revisions: [],
 	revision: null,
 	diff: '',
 	hasRevisions: computed('revisions', function() {
@@ -26,6 +25,11 @@ export default Component.extend(ModalMixin, {
 		return this.get('diff').length > 0;
 	}),
 
+	init() {
+		this._super(...arguments);
+		this.revisions = [];
+	},
+
 	didReceiveAttrs() {
 		this._super(...arguments);
 		this.fetchRevisions();
@@ -65,7 +69,8 @@ export default Component.extend(ModalMixin, {
 
 		onRollback() {
 			let revision = this.get('revision');
-			this.attrs.onRollback(revision.pageId, revision.id);
+			let cb = this.get('onRollback');
+			cb(revision.pageId, revision.id);
 
 			this.modalClose('#document-rollback-modal');
 		}

gui/app/components/focus-input.js

@@ -12,7 +12,8 @@
 import TextField from '@ember/component/text-field';
 
 export default TextField.extend({
-    becomeFocused: function() {
-        this.$().focus();
-    }.on('didInsertElement')
+    didInsertElement() {
+        this._super(...arguments);
+        this.$().focus();        
+    }
 });

gui/app/components/focus-textarea.js

@@ -12,7 +12,8 @@
 import TextArea from '@ember/component/text-area';
 
 export default TextArea.extend({
-    becomeFocused: function() {
+    didInsertElement() {
+        this._super(...arguments);
         this.$().focus();
-    }.on('didInsertElement')
+    }
 });

gui/app/components/folder/category-admin.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import Component from '@ember/component';
 import { inject as service } from '@ember/service';
 import TooltipMixin from '../../mixins/tooltip';
@@ -22,7 +23,11 @@ export default Component.extend(ModalMixin, TooltipMixin, {
 	newCategory: '',
 	deleteId: '',
 	dropdown: null,
-	users: [],
+
+	init() {
+		this._super(...arguments);
+		this.users = [];
+	},
 
 	didReceiveAttrs() {
 		this._super(...arguments);

gui/app/components/folder/document-tags.js

@@ -12,9 +12,6 @@
 import Component from '@ember/component';
 
 export default Component.extend({
-    documentTags: [],
-    tagz: [],
-
 	init() {
 		this._super(...arguments);
         let tagz = [];

gui/app/components/folder/documents-list.js

@@ -48,7 +48,8 @@ export default Component.extend({
 			this.set('selectedDocuments', A([]));
 			this.set('showDeleteDialog', false);
 
-			this.attrs.onDeleteDocument(list);
+			let cb = this.get('onDeleteDocument');
+			cb(list);
 
 			return true;
 		},
@@ -72,7 +73,9 @@ export default Component.extend({
 
 			this.set('showMoveDialog', false);
 			this.set('selectedDocuments', A([]));
-			this.attrs.onMoveDocument(list, moveSpaceId);
+
+			let cb = this.get('onMoveDocument');
+			cb(list, moveSpaceId);
 
 			return true;
 		},

gui/app/components/folder/space-heading.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty } from '@ember/object/computed';
 import { schedule } from '@ember/runloop';
 import { inject as service } from '@ember/service';

gui/app/components/folder/space-view.js

@@ -23,12 +23,16 @@ export default Component.extend(AuthMixin, {
 	folderService: service('folder'),
 	localStorage: service('localStorage'),
 	hasCategories: gt('categories.length', 0),
-	filteredDocs: [],
 	categoryLinkName: 'Manage',
 	spaceSettings: computed('permissions', function() {
 		return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
 	}),
 
+	init() {
+		this._super(...arguments);
+		this.filteredDocs = [];	
+	},
+
 	didReceiveAttrs() {
 		this._super(...arguments);
 		this.setup();
@@ -108,7 +112,8 @@ export default Component.extend(AuthMixin, {
 				});
 
 				this.set('documents', documents);
-				this.attrs.onRefresh();
+				let cb = this.get('onRefresh');
+				cb.onRefresh();
 			});
 		},
 

gui/app/components/forgot-password.js

@@ -9,8 +9,8 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty, and } from '@ember/object/computed';
-
 import { set } from '@ember/object';
 import Component from '@ember/component';
 import { isEmpty } from '@ember/utils';

gui/app/components/onboard/share-folder.js

@@ -9,8 +9,8 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { inject as service } from '@ember/service';
-
 import Component from '@ember/component';
 
 export default Component.extend({

gui/app/components/password-reset.js

@@ -9,8 +9,8 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty, and } from '@ember/object/computed';
-
 import Component from '@ember/component';
 import { isEqual, isEmpty } from '@ember/utils';
 import { set } from '@ember/object';

gui/app/components/search/search-results.js

@@ -12,9 +12,13 @@
 import Component from '@ember/component';
 
 export default Component.extend({
-	results: [],
 	resultPhrase: "",
 
+	init() {
+		this._super(...arguments);
+		this.results = [];
+	},
+
 	didReceiveAttrs() {
 		let docs = this.get('results');
 		let duped = [];

gui/app/components/section/airtable/type-editor.js

@@ -24,7 +24,8 @@ export default Component.extend({
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {
@@ -33,7 +34,8 @@ export default Component.extend({
 			page.set('title', title);
 			meta.set('rawBody', this.get("data"));
 
-			this.attrs.onAction(page, meta);
+			let cb = this.get('onAction');
+			cb(page, meta);
 		}
 	}
 });

gui/app/components/section/base-editor-inline.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty } from '@ember/object/computed';
 import { computed } from '@ember/object';
 import TooltipMixin from '../../mixins/tooltip';
@@ -75,21 +76,25 @@ export default Component.extend(TooltipMixin, ModalMixin, {
 				return;
 			}
 
-			this.attrs.onAction(this.get('page.title'));
+			let cb = this.get('onAction');
+			cb(this.get('page.title'));
 		},
 
 		onCancel() {
-			if (this.attrs.isDirty() !== null && this.attrs.isDirty()) {
+			let isDirty = this.get('isDirty');
+			if (isDirty() !== null && isDirty()) {
 				this.modalOpen('#discard-modal-' + this.get('page.id'), {show: true});
 				return;
 			}
 
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onDiscard() {
 			this.modalClose('#discard-modal-' + this.get('page.id'));
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onPreview() {

gui/app/components/section/base-editor.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty } from '@ember/object/computed';
 import Component from '@ember/component';
 import ModalMixin from '../../mixins/modal';
@@ -44,17 +45,21 @@ export default Component.extend(ModalMixin, {
 
 	actions: {
 		onCancel() {
-			if (this.attrs.isDirty() !== null && this.attrs.isDirty()) {
+			let isDirty = this.get('isDirty');
+			if (isDirty() !== null && isDirty()) {
 				this.modalOpen('#discard-modal', {show: true});
 				return;
 			}
 
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onDiscard() {
 			this.modalClose('#discard-modal');
-			this.attrs.onCancel();
+
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction() {
@@ -72,7 +77,8 @@ export default Component.extend(ModalMixin, {
 				return;
 			}
 
-			this.attrs.onAction(this.get('page.title'));
+			let cb = this.get('onAction');
+			cb(this.get('page.title'));
 		}
 	}
 });

gui/app/components/section/code/type-editor.js

@@ -16,7 +16,7 @@ import TooltipMixin from '../../../mixins/tooltip';
 export default Component.extend(TooltipMixin, {
     isDirty: false,
     pageBody: "",
-    syntaxOptions: [],
+
     codeSyntax: null,
 	codeEditor: null,
 	editorId: computed('page', function () {
@@ -29,7 +29,8 @@ export default Component.extend(TooltipMixin, {
 	}),
 
 	init() {
-		this._super(...arguments);
+        this._super(...arguments);
+        this.syntaxOptions = [];
 
         let self = this;
         let rawBody = this.get('meta.rawBody');
@@ -128,7 +129,8 @@ export default Component.extend(TooltipMixin, {
         },
 
         onCancel() {
-            this.attrs.onCancel();
+            let cb = this.get('onCancel');
+            cb();
         },
 
         onAction(title) {
@@ -138,7 +140,8 @@ export default Component.extend(TooltipMixin, {
             page.set('title', title);
             page.set('body', meta.get('rawBody'));
 
-            this.attrs.onAction(page, meta);
+            let cb = this.get('onAction');
+            cb(page, meta);
         }
     }
 });

gui/app/components/section/gemini/type-editor.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { set } from '@ember/object';
 import { schedule } from '@ember/runloop';
 import { inject as service } from '@ember/service';
@@ -21,9 +22,13 @@ export default Component.extend(SectionMixin, TooltipMixin, {
 	isDirty: false,
 	waiting: false,
 	authenticated: false,
-	user: {},
-	workspaces: [],
-	config: {},
+
+	init() {
+		this._super(...arguments);
+		this.user = {};
+		this.workspaces = [];
+		this.config = {};			
+	},
 
 	didReceiveAttrs() {
 		let config = {};
@@ -195,7 +200,8 @@ export default Component.extend(SectionMixin, TooltipMixin, {
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {
@@ -206,7 +212,8 @@ export default Component.extend(SectionMixin, TooltipMixin, {
 			meta.set('config', JSON.stringify(this.get('config')));
 			meta.set('externalSource', true);
 
-			this.attrs.onAction(page, meta);
+			let cb = this.get('onAction');
+			cb(page, meta);
 		}
 	}
 });

gui/app/components/section/github/type-editor.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import EmberObject from '@ember/object';
 import { A } from '@ember/array';
 import { inject as service } from '@ember/service';
@@ -21,9 +22,13 @@ export default Component.extend(SectionMixin, NotifierMixin, {
 	isDirty: false,
 	busy: false,
 	authenticated: false,
-	config: {},
 	owners: null,
 
+	init() {
+		this._super(...arguments);
+		this.config = {};
+	},
+
 	didReceiveAttrs() {
 		let self = this;
 		let page = this.get('page');
@@ -227,7 +232,8 @@ export default Component.extend(SectionMixin, NotifierMixin, {
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {

gui/app/components/section/markdown/type-editor.js

@@ -111,7 +111,8 @@ export default Component.extend({
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {
@@ -120,7 +121,8 @@ export default Component.extend({
 			page.set('title', title);
 			meta.set('rawBody', this.getBody());
 
-			this.attrs.onAction(page, meta);
+			let cb = this.get('onCancel');
+			cb(page, meta);
 		}
 	}
 });

gui/app/components/section/papertrail/type-editor.js

@@ -21,8 +21,12 @@ export default Component.extend(SectionMixin, NotifierMixin, {
 	isDirty: false,
 	waiting: false,
 	authenticated: false,
-	config: {},
-	items: {},
+
+	init() {
+		this._super(...arguments);
+		this.config = {};
+		this.items = {};
+	},
 
 	didReceiveAttrs() {
 		let config = {};
@@ -140,7 +144,8 @@ export default Component.extend(SectionMixin, NotifierMixin, {
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {

gui/app/components/section/table/type-editor.js

@@ -9,8 +9,9 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
+import { schedule } from 'ember/runloop';
 import { computed } from '@ember/object';
-
 import Component from '@ember/component';
 
 export default Component.extend({
@@ -38,8 +39,10 @@ export default Component.extend({
 			tableResizerOffset: 10
 		});
 
-		$(id).on('froalaEditor.contentChanged', () => {
-			this.set('isDirty', true);
+		schedule('afterRender', function() {
+			$(id).on('froalaEditor.contentChanged', () => {
+				this.set('isDirty', true);  // eslint-disable-line ember/jquery-ember-run
+			});
 		});
 	},
 
@@ -53,7 +56,8 @@ export default Component.extend({
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {
@@ -69,7 +73,8 @@ export default Component.extend({
 
 			meta.set('rawBody', body);
 
-			this.attrs.onAction(page, meta);
+			let cb = this.get('onAction');
+			cb(page, meta);
 		}
 	}
 });

gui/app/components/section/trello/type-editor.js

@@ -11,7 +11,6 @@
 
 /*global Trello*/
 import $ from 'jquery';
-
 import { htmlSafe } from '@ember/string';
 import { computed, set } from '@ember/object';
 import { inject as service } from '@ember/service';
@@ -25,11 +24,9 @@ export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
 	isDirty: false,
 	busy: false,
 	authenticated: false,
-	config: {},
 	boards: null,
 	noBoards: false,
 	appKey: "",
-
 	boardStyle: computed('config.board', function () {
 		let board = this.get('config.board');
 
@@ -41,6 +38,11 @@ export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
 		return htmlSafe("background-color: " + color);
 	}),
 
+	init() {
+		this._super(...arguments);
+		this.config = {};
+	},
+
 	didReceiveAttrs() {
 		let page = this.get('page');
 		let config = {};
@@ -219,7 +221,8 @@ export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {

gui/app/components/section/wysiwyg/type-editor.js

@@ -9,8 +9,8 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { computed, set } from '@ember/object';
-
 import Component from '@ember/component';
 import { inject as service } from '@ember/service';
 
@@ -116,7 +116,8 @@ export default Component.extend({
 		},
 
 		onCancel() {
-			this.attrs.onCancel();
+			let cb = this.get('onCancel');
+			cb();
 		},
 
 		onAction(title) {
@@ -127,7 +128,8 @@ export default Component.extend({
 			page.set('title', title);
 			meta.set('rawBody', editor.getContent());
 
-			this.attrs.onAction(page, meta);
+			let cb = this.get('onAction');
+			cb(page, meta);
 		}
 	}
 });

gui/app/components/spaces/space-list.js

@@ -16,13 +16,17 @@ import NotifierMixin from '../../mixins/notifier';
 import AuthMixin from '../../mixins/auth';
 
 export default Component.extend(TooltipMixin, NotifierMixin, AuthMixin, {
-	publicFolders: [],
-	protectedFolders: [],
-	privateFolders: [],
 	hasPublicFolders: false,
 	hasProtectedFolders: false,
 	hasPrivateFolders: false,
 
+	init() {
+		this._super(...arguments);
+		this.publicFolders = [];
+		this.protectedFolders = [];
+		this.privateFolders = [];			
+	},
+
 	didReceiveAttrs() {
 		let folders = this.get('spaces');
 		let publicFolders = [];

gui/app/components/toolbar/for-document.js

@@ -9,29 +9,36 @@
 //
 // https://documize.com
 
-import Component from '@ember/component';
+import $ from 'jquery';
 import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import AuthMixin from '../../mixins/auth';
 import TooltipMixin from '../../mixins/tooltip';
 import ModalMixin from '../../mixins/modal';
 
 export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
-	spaceService: service('folder'),
+	userSvc: service('user'),
+	store: service(),
+	spaceSvc: service('folder'),
 	session: service(),
 	appMeta: service(),
 	pinned: service(),
-	pinState : {
-		isPinned: false,
-		pinId: '',
-		newName: ''
-	},
-	saveTemplate: {
-		name: '',
-		description: ''
-	},
 	showTools: true, 			// show document related tools? favourite, delete, make template...
 	showDocumentLink: false, 	// show link to document in breadcrumbs
 
+init() {
+		this._super(...arguments);
+		this.pinState = {
+			isPinned: false,
+			pinId: '',
+			newName: ''
+		};
+		this.saveTemplate = {
+			name: '',
+			description: ''
+		};
+	},
+	
 	didReceiveAttrs() {
 		this._super(...arguments);
 
@@ -62,8 +69,9 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 	actions: {
 		onDocumentDelete() {
 			this.modalClose('#document-delete-modal');
-			
-			this.attrs.onDocumentDelete();
+
+			let cb = this.get('onDocumentDelete');
+			cb();
 		},
 
 		onPrintDocument() {
@@ -118,7 +126,8 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 			this.set('saveTemplate.name', '');
 			this.set('saveTemplate.description', '');
 
-			this.attrs.onSaveTemplate(name, excerpt);
+			let cb = this.get('onSaveTemplate');
+			cb(name, excerpt);
 
 			this.modalClose('#document-template-modal');
 

gui/app/components/toolbar/for-space.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import Component from '@ember/component';
 import { computed } from '@ember/object';
 import { schedule } from '@ember/runloop';
@@ -29,12 +30,7 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 	copyTemplate: true,
 	copyPermission: true,
 	copyDocument: false,
-	clonedSpace: { id: '' },
-	pinState : {
-		isPinned: false,
-		pinId: '',
-		newName: ''
-	},
+
 	spaceSettings: computed('permissions', function() {
 		return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
 	}),
@@ -49,10 +45,21 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 	templateDocName: '',
 	templateDocNameError: false,
 	selectedTemplate: '',
-	importedDocuments: [],
-	importStatus: [],
+
 	dropzone: null,
 
+	init() {
+		this._super(...arguments);
+		this.importedDocuments = [];
+		this.importStatus = [];
+		this.clonedSpace = { id: '' };
+		this.pinState = {
+			isPinned: false,
+			pinId: '',
+			newName: ''
+		};
+	},
+
 	didReceiveAttrs() {
 		this._super(...arguments);
 
@@ -226,8 +233,8 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 			this.set('deleteSpaceName', '');
 			$("#delete-space-name").removeClass("is-invalid");
 
-			this.attrs.onDeleteSpace(this.get('space.id'));
-
+			let cb = this.get('onDeleteSpace');
+			cb(this.get('space.id'));
 
 			this.modalClose('#space-delete-modal');
 		},
@@ -330,8 +337,9 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 			this.set('importedDocuments', documents);
 
 			if (documents.length === 0) {
-				this.modalClose("#import-doc-modal");				
-				this.attrs.onRefresh();
+				this.modalClose("#import-doc-modal");
+				let cb = this.get('onRefresh');
+				cb();
 			}
 		},
 

gui/app/components/toolbar/for-spaces.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import Component from '@ember/component';
 import { schedule } from '@ember/runloop';
 import { notEmpty } from '@ember/object/computed';
@@ -20,9 +21,13 @@ export default Component.extend(NotifierMixin, AuthMixin, {
 	copyTemplate: true,
 	copyPermission: true,
 	copyDocument: false,
-	clonedSpace: { id: '' },
 	hasClone: notEmpty('clonedSpace.id'),
 
+	init() {
+		this._super(...arguments);
+		this.clonedSpace = { id: '' };
+	},
+
 	didInsertElement() {
 		this._super(...arguments);
 
@@ -64,7 +69,8 @@ export default Component.extend(NotifierMixin, AuthMixin, {
 			$('#add-space-modal').modal('hide');
 			$('#add-space-modal').modal('dispose');
 
-			this.attrs.onAddSpace(payload);
+			let cb = this.get('onAddSpace');
+			cb(payload);
 		}
 	}
 });

gui/app/components/toolbar/nav-bar.js

@@ -21,13 +21,13 @@ export default Component.extend({
 	store: service(),
 	pinned: service(),
 	enableLogout: true,
-	pins: [],
 	hasPins: notEmpty('pins'),
 	hasSpacePins: notEmpty('spacePins'),
 	hasDocumentPins: notEmpty('documentPins'),
 
 	init() {
 		this._super(...arguments);
+		this.pins = [];
 
 		if (this.get('appMeta.authProvider') === constants.AuthProvider.Keycloak) {
 			let config = this.get('appMeta.authConfig');

gui/app/components/ui-select.js

@@ -15,7 +15,6 @@ import Component from '@ember/component';
 
 export default Component.extend({
     cssClass: "",
-    content: [],
     prompt: null,
     optionValuePath: 'id',
     optionLabelPath: 'name',
@@ -26,6 +25,11 @@ export default Component.extend({
     // leaking changes to it via a 2-way binding
     _selection: reads('selection'),
 
+    init() {
+        this._super(...arguments);
+        this.content = [];
+    },
+
     actions: {
         change() {
             const selectEl = this.$('select')[0];

gui/app/components/ui/ui-dialog.js

@@ -9,6 +9,7 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import Component from '@ember/component';
 import stringUtil from '../../utils/string';
 
@@ -56,7 +57,8 @@ export default Component.extend({
 				return;
 			}
 
-			let result = this.attrs.onAction();
+			let cb = this.get('onAction');
+			let result = cb();
 			if (result) {
 				this.set('show', false);
 			}

gui/app/components/ui/ui-list-picker.js

@@ -16,7 +16,6 @@ import { computed } from '@ember/object';
 export default Component.extend({
 	nameField: 'category',
 	singleSelect: false,
-	items: [],
 	maxHeight: 0,
 	onSelect: null,
 	styleCss: computed('maxHeight', function () {
@@ -29,13 +28,19 @@ export default Component.extend({
 		}
 	}),
 
+	init() {
+		this._super(...arguments);
+		this.items = [];	
+	},
+
 	actions: {
 		onToggle(item) {
 			// callback takes precedence
 			// caller sets item to 'selected'
 			let cb = this.get('onSelect');
 			if (cb !== null) {
-				this.attrs.onSelect(item);
+				let cb = this.get('onSelect');
+				cb(item);
 				return;
 			}
 

gui/app/components/ui/ui-radio.js

@@ -19,7 +19,8 @@ export default Component.extend({
 	actions: {
 		onCheck() {
 			if (this.get('onClick') !== null) {
-				this.attrs.onClick(this.get('value'));
+				let cb = this.get('onClick');
+				cb(this.get('value'));
 			} else {
 				this.set('selected', !this.get('selected'));
 			}

gui/app/components/user-notification.js

@@ -14,7 +14,10 @@ import Component from '@ember/component';
 import miscUtil from '../utils/misc';
 
 export default Component.extend({
-    notifications: [],
+    init() {
+        this._super(...arguments);
+        this.notifications = [];
+    },
 
     didInsertElement() {
         this.eventBus.subscribe('notifyUser', this, 'showNotification');

gui/app/components/user-profile.js

@@ -9,15 +9,14 @@
 //
 // https://documize.com
 
+import $ from 'jquery';
 import { empty } from '@ember/object/computed';
-
 import Component from '@ember/component';
 import { computed, set } from '@ember/object';
 import { isPresent, isEqual, isEmpty } from '@ember/utils';
 import AuthProvider from '../mixins/auth';
 
 export default Component.extend(AuthProvider, {
-	password: { password: "", confirmation: "" },
 	hasFirstnameError: empty('model.firstname'),
 	hasLastnameError: empty('model.lastname'),
 	hasEmailError: computed('model.email', function() {
@@ -45,6 +44,11 @@ export default Component.extend(AuthProvider, {
 		}
 	}),
 
+	init() {
+		this._super(...arguments);
+		this.password = { password: "", confirmation: "" };
+	},
+
 	actions: {
 		save() {
 			let password = this.get('password.password');