upgraded Ember and integrated Bootstrap 4

Upgraded to Ember JS 2.16.x release. This upgrade uses the new JavaScript modules API syntax.

Integrated Bootstrap 4 Beta 2 via package.json and associated popper.js library. Overridden Bootstrap styles using bootstrap.scss -- this file selectively imports the modules we need.

gui/MODULE_REPORT.md

@@ -0,0 +1,42 @@
+## Module Report
+### Unknown Global
+
+**Global**: `Ember.testing`
+
+**Location**: `app/services/tether.js` at line 20
+
+```js
+export default Ember.Service.extend({
+	createDrop() {
+		if (Ember.testing) {
+			return;
+		}
+```
+
+### Unknown Global
+
+**Global**: `Ember.testing`
+
+**Location**: `app/services/tether.js` at line 27
+
+```js
+	},
+	createTooltip() {
+		if (Ember.testing) {
+			return;
+		}
+```
+
+### Unknown Global
+
+**Global**: `Ember.Handlebars`
+
+**Location**: `app/utils/model.js` at line 22
+
+```js
+
+	setSafe(attr, value) {
+		this.set(attr, Ember.String.htmlSafe(Ember.Handlebars.Utils.escapeExpression(value)));
+	}
+});
+```

gui/app/app.js

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Application from '@ember/application';
 import Resolver from './resolver';
 import loadInitializers from 'ember-load-initializers';
 import config from './config/environment';
@@ -23,7 +23,7 @@ let App;
 //     console.log(error);
 // });
 
-App = Ember.Application.extend({
+App = Application.extend({
     modulePrefix: config.modulePrefix,
     podModulePrefix: config.podModulePrefix,
     Resolver

gui/app/authenticators/anonymous.js

@@ -9,12 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
-import Base from 'ember-simple-auth/authenticators/base';
+import { resolve } from 'rsvp';
 
-const {
-	RSVP: { resolve }
-} = Ember;
+import Base from 'ember-simple-auth/authenticators/base';
 
 export default Base.extend({
 	restore(data) {

gui/app/authenticators/documize.js

@@ -9,17 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { isPresent } from '@ember/utils';
+
+import { reject, resolve } from 'rsvp';
+import { inject as service } from '@ember/service';
 import Base from 'ember-simple-auth/authenticators/base';
 import encodingUtil from '../utils/encoding';
 import netUtil from '../utils/net';
 
-const {
-	isPresent,
-	RSVP: { resolve, reject },
-	inject: { service }
-} = Ember;
-
 export default Base.extend({
 	ajax: service(),
 	appMeta: service(),
@@ -42,14 +39,14 @@ export default Base.extend({
 			let { password, email } = credentials;
 
 			if (!isPresent(password) || !isPresent(email)) {
-				return Ember.RSVP.reject("invalid");
+				return reject("invalid");
 			}
 
 			encoded = encodingUtil.Base64.encode(`${domain}:${email}:${password}`);
 		} else if (typeof credentials === 'string') {
 			encoded = credentials;
 		} else {
-			return Ember.RSVP.reject("invalid");
+			return reject("invalid");
 		}
 
 		let headers = { 'Authorization': 'Basic ' + encoded };

gui/app/authenticators/keycloak.js

@@ -9,16 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { isPresent } from '@ember/utils';
+
+import { reject, resolve } from 'rsvp';
+import { inject as service } from '@ember/service';
 import Base from 'ember-simple-auth/authenticators/base';
 import netUtil from '../utils/net';
 
-const {
-	isPresent,
-	RSVP: { resolve, reject },
-	inject: { service }
-} = Ember;
-
 export default Base.extend({
 	ajax: service(),
 	appMeta: service(),
@@ -38,7 +35,7 @@ export default Base.extend({
 		data.domain = netUtil.getSubdomain();
 
 		if (!isPresent(data.token) || !isPresent(data.email)) {
-			return Ember.RSVP.reject("invalid");
+			return reject("invalid");
 		}
 
 		return this.get('ajax').post('public/authenticate/keycloak', {

gui/app/components/back-to-space.js

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 });

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

@@ -9,25 +9,26 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { equal, empty } from '@ember/object/computed';
+
+import { set } from '@ember/object';
+import { copy } from '@ember/object/internals';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import constants from '../../utils/constants';
 import encoding from '../../utils/encoding';
 import NotifierMixin from "../../mixins/notifier";
 
-const {
-	computed
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, {
-	appMeta: Ember.inject.service(),
-	isDocumizeProvider: computed.equal('authProvider', constants.AuthProvider.Documize),
-	isKeycloakProvider: computed.equal('authProvider', constants.AuthProvider.Keycloak),
-	KeycloakUrlError: computed.empty('keycloakConfig.url'),
-	KeycloakRealmError: computed.empty('keycloakConfig.realm'),
-	KeycloakClientIdError: computed.empty('keycloakConfig.clientId'),
-	KeycloakPublicKeyError: computed.empty('keycloakConfig.publicKey'),
-	KeycloakAdminUserError: computed.empty('keycloakConfig.adminUser'),
-	KeycloakAdminPasswordError: computed.empty('keycloakConfig.adminPassword'),
+export default Component.extend(NotifierMixin, {
+	appMeta: service(),
+	isDocumizeProvider: equal('authProvider', constants.AuthProvider.Documize),
+	isKeycloakProvider: equal('authProvider', constants.AuthProvider.Keycloak),
+	KeycloakUrlError: empty('keycloakConfig.url'),
+	KeycloakRealmError: empty('keycloakConfig.realm'),
+	KeycloakClientIdError: empty('keycloakConfig.clientId'),
+	KeycloakPublicKeyError: empty('keycloakConfig.publicKey'),
+	KeycloakAdminUserError: empty('keycloakConfig.adminUser'),
+	KeycloakAdminPasswordError: empty('keycloakConfig.adminPassword'),
 	keycloakConfig: { 
 		url: '',
 		realm: '',
@@ -109,7 +110,7 @@ export default Ember.Component.extend(NotifierMixin, {
 						return;
 					}
 
-					config = Ember.copy(this.get('keycloakConfig'));
+					config = copy(this.get('keycloakConfig'));
 					config.url = config.url.trim();
 					config.realm = config.realm.trim();
 					config.clientId = config.clientId.trim();
@@ -124,7 +125,7 @@ export default Ember.Component.extend(NotifierMixin, {
 						config.url = config.url.substring(0, config.url.length-1);
 					}
 
-					Ember.set(config, 'publicKey', encoding.Base64.encode(this.get('keycloakConfig.publicKey')));
+					set(config, 'publicKey', encoding.Base64.encode(this.get('keycloakConfig.publicKey')));
 					break;
 			}
 			

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

@@ -9,21 +9,20 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty, and } from '@ember/object/computed';
 
-const {
-	isEmpty,
-	computed,
-	set
-} = Ember;
+import $ from 'jquery';
+import Component from '@ember/component';
+import { isEmpty } from '@ember/utils';
+import { set } from '@ember/object';
 
-export default Ember.Component.extend({
-	titleEmpty: computed.empty('model.general.title'),
-	messageEmpty: computed.empty('model.general.message'),
-	conversionEndpointEmpty: computed.empty('model.general.conversionEndpoint'),
-	hasTitleInputError: computed.and('titleEmpty', 'titleError'),
-	hasMessageInputError: computed.and('messageEmpty', 'messageError'),
-	hasConversionEndpointInputError: computed.and('conversionEndpointEmpty', 'conversionEndpointError'),
+export default Component.extend({
+	titleEmpty: empty('model.general.title'),
+	messageEmpty: empty('model.general.message'),
+	conversionEndpointEmpty: empty('model.general.conversionEndpoint'),
+	hasTitleInputError: and('titleEmpty', 'titleError'),
+	hasMessageInputError: and('messageEmpty', 'messageError'),
+	hasConversionEndpointInputError: and('conversionEndpointEmpty', 'conversionEndpointError'),
 
 	actions: {
 		save() {
@@ -47,7 +46,7 @@ export default Ember.Component.extend({
 				this.set('model.general.conversionEndpoint', e.substring(0, e.length-1));
 			}
 
-			this.model.general.set('allowAnonymousAccess', Ember.$("#allowAnonymousAccess").prop('checked'));
+			this.model.general.set('allowAnonymousAccess', $("#allowAnonymousAccess").prop('checked'));
 
 			this.get('save')().then(() => {
 				set(this, 'titleError', false);

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

@@ -9,18 +9,16 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty } from '@ember/object/computed';
 
-const {
-	computed
-} = Ember;
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
-	SMTPHostEmptyError: computed.empty('model.smtp.host'),
-	SMTPPortEmptyError: computed.empty('model.smtp.port'),
-	SMTPSenderEmptyError: computed.empty('model.smtp.sender'),
-	SMTPUserIdEmptyError: computed.empty('model.smtp.userid'),
-	SMTPPasswordEmptyError: computed.empty('model.smtp.password'),
+export default Component.extend({
+	SMTPHostEmptyError: empty('model.smtp.host'),
+	SMTPPortEmptyError: empty('model.smtp.port'),
+	SMTPSenderEmptyError: empty('model.smtp.sender'),
+	SMTPUserIdEmptyError: empty('model.smtp.userid'),
+	SMTPPasswordEmptyError: empty('model.smtp.password'),
 
 	actions: {
 		saveSMTP() {

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

@@ -9,11 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { debounce } from '@ember/runloop';
+
+import Component from '@ember/component';
 import AuthProvider from '../../mixins/auth';
 import DropdownMixin from '../../mixins/dropdown';
 
-export default Ember.Component.extend(AuthProvider, DropdownMixin, {
+export default Component.extend(AuthProvider, DropdownMixin, {
 	editUser: null,
 	deleteUser: null,
 	dropdown: null,
@@ -43,7 +45,7 @@ export default Ember.Component.extend(AuthProvider, DropdownMixin, {
 	},
 
 	onKeywordChange: function () {
-		Ember.run.debounce(this, this.filterUsers, 350);
+		debounce(this, this.filterUsers, 350);
 	}.observes('filter'),
 
 	filterUsers() {

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

@@ -9,24 +9,21 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty, and } from '@ember/object/computed';
+
+import Component from '@ember/component';
+import { isEmpty } from '@ember/utils';
+import { get, set } from '@ember/object';
 import AuthProvider from '../../mixins/auth';
 
-const {
-	isEmpty,
-	computed,
-	set,
-	get
-} = Ember;
-
-export default Ember.Component.extend(AuthProvider, {
+export default Component.extend(AuthProvider, {
 	newUser: { firstname: "", lastname: "", email: "", active: true },
-	firstnameEmpty: computed.empty('newUser.firstname'),
-	lastnameEmpty: computed.empty('newUser.lastname'),
-	emailEmpty: computed.empty('newUser.email'),
-	hasFirstnameEmptyError: computed.and('firstnameEmpty', 'firstnameError'),
-	hasLastnameEmptyError: computed.and('lastnameEmpty', 'lastnameError'),
-	hasEmailEmptyError: computed.and('emailEmpty', 'emailError'),
+	firstnameEmpty: empty('newUser.firstname'),
+	lastnameEmpty: empty('newUser.lastname'),
+	emailEmpty: empty('newUser.email'),
+	hasFirstnameEmptyError: and('firstnameEmpty', 'firstnameError'),
+	hasLastnameEmptyError: and('lastnameEmpty', 'lastnameError'),
+	hasEmailEmptyError: and('emailEmpty', 'emailError'),
 
 	actions: {
 		add() {

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

@@ -9,10 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
 
-export default Ember.Component.extend({
-	store: Ember.inject.service(),
+import Component from '@ember/component';
+
+export default Component.extend({
+	store: service(),
 
     didReceiveAttrs() {
 		let p = this.get('store').createRecord('page');

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

@@ -9,14 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { debounce } from '@ember/runloop';
+
+import { computed, set } from '@ember/object';
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import TooltipMixin from '../../mixins/tooltip';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(TooltipMixin, {
+export default Component.extend(TooltipMixin, {
 	link: service(),
 	linkName: '',
 	keywords: '',
@@ -31,21 +31,21 @@ export default Ember.Component.extend(TooltipMixin, {
 		{ label: 'Attachment', selected: false },
 		{ label: 'Search', selected: false }
 	],
-	contentLinkerButtonId: Ember.computed('page', function () {
+	contentLinkerButtonId: computed('page', function () {
 		let page = this.get('page');
 		return `content-linker-button-${page.id}`;
 	}),
 
-	showSections: Ember.computed('tabs.@each.selected', function () {
+	showSections: computed('tabs.@each.selected', function () {
 		return this.get('tabs').findBy('label', 'Section').selected;
 	}),
-	showAttachments: Ember.computed('tabs.@each.selected', function () {
+	showAttachments: computed('tabs.@each.selected', function () {
 		return this.get('tabs').findBy('label', 'Attachment').selected;
 	}),
-	showSearch: Ember.computed('tabs.@each.selected', function () {
+	showSearch: computed('tabs.@each.selected', function () {
 		return this.get('tabs').findBy('label', 'Search').selected;
 	}),
-	hasMatches: Ember.computed('matches', function () {
+	hasMatches: computed('matches', function () {
 		let m = this.get('matches');
 		return m.documents.length || m.pages.length || m.attachments.length;
 	}),
@@ -75,7 +75,7 @@ export default Ember.Component.extend(TooltipMixin, {
 	},
 
 	onKeywordChange: function () {
-		Ember.run.debounce(this, this.fetch, 750);
+		debounce(this, this.fetch, 750);
 	}.observes('keywords'),
 
 	fetch() {
@@ -100,23 +100,23 @@ export default Ember.Component.extend(TooltipMixin, {
 			this.set('selection', i);
 
 			candidates.pages.forEach(c => {
-				Ember.set(c, 'selected', c.id === i.id);
+				set(c, 'selected', c.id === i.id);
 			});
 
 			candidates.attachments.forEach(c => {
-				Ember.set(c, 'selected', c.id === i.id);
+				set(c, 'selected', c.id === i.id);
 			});
 
 			matches.documents.forEach(c => {
-				Ember.set(c, 'selected', c.id === i.id);
+				set(c, 'selected', c.id === i.id);
 			});
 
 			matches.pages.forEach(c => {
-				Ember.set(c, 'selected', c.id === i.id);
+				set(c, 'selected', c.id === i.id);
 			});
 
 			matches.attachments.forEach(c => {
-				Ember.set(c, 'selected', c.id === i.id);
+				set(c, 'selected', c.id === i.id);
 			});
 		},
 

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

@@ -9,10 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
 
-export default Ember.Component.extend({
-	documentService: Ember.inject.service('document'),
+import Component from '@ember/component';
+
+export default Component.extend({
+	documentService: service('document'),
 
 	didReceiveAttrs() {
 		this._super(...arguments);

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

@@ -9,21 +9,25 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
+
+import { notEmpty } from '@ember/object/computed';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 import DropdownMixin from '../../mixins/dropdown';
 
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, DropdownMixin, {
-	documentService: Ember.inject.service('document'),
-	appMeta: Ember.inject.service(),
+export default Component.extend(NotifierMixin, TooltipMixin, DropdownMixin, {
+	documentService: service('document'),
+	appMeta: service(),
 	dropdown: null,
-	hasAttachments: Ember.computed.notEmpty('files'),
+	hasAttachments: notEmpty('files'),
 	deleteAttachment: {
 		id: "",
 		name: "",
 	},
-	canShow: Ember.computed('permissions', 'files', function() {
+	canShow: computed('permissions', 'files', function() {
 		return this.get('files.length') > 0 || this.get('permissions.documentEdit');
 	}),
 

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
     didReceiveAttrs() {
         this.set('editorType', 'section/' + this.get('page.contentType') + '/type-editor');
     },

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

@@ -9,21 +9,21 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty } from '@ember/object/computed';
+
+import { schedule } from '@ember/runloop';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-const {
-	computed,
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
-	documentService: Ember.inject.service('document'),
+export default Component.extend(NotifierMixin, TooltipMixin, {
+	documentService: service('document'),
 	editMode: false,
 	docName: '',
 	docExcerpt: '',
-	hasNameError: computed.empty('docName'),
-	hasExcerptError: computed.empty('docExcerpt'),
+	hasNameError: empty('docName'),
+	hasExcerptError: empty('docExcerpt'),
 
 	keyUp(e) {
 		if (e.keyCode === 27) { // escape key
@@ -37,7 +37,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
 			this.set('docExcerpt', this.get('document.excerpt'));
 			this.set('editMode', true);
 
-			Ember.run.schedule('afterRender', () => {
+			schedule('afterRender', () => {
 				$('#document-name').select();
 			});
 		},

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

@@ -9,11 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed, set } from '@ember/object';
 
-export default Ember.Component.extend({
+import Component from '@ember/component';
+
+export default Component.extend({
 	revision: null,
-	hasDiff: Ember.computed('diff', function () {
+	hasDiff: computed('diff', function () {
 		return this.get('diff').length > 0;
 	}),
 
@@ -21,8 +23,8 @@ export default Ember.Component.extend({
 		let revisions = this.get('revisions');
 
 		revisions.forEach((r) => {
-			Ember.set(r, 'deleted', r.revisions === 0);
-			Ember.set(r, 'label', `${r.created} - ${r.firstname} ${r.lastname} - ${r.title}`);
+			set(r, 'deleted', r.revisions === 0);
+			set(r, 'label', `${r.created} - ${r.firstname} ${r.lastname} - ${r.title}`);
 		});
 
 		if (revisions.length > 0 && is.null(this.get('revision'))) {

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

@@ -9,12 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
+
+import Component from '@ember/component';
 import tocUtil from '../../utils/toc';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
+export default Component.extend(NotifierMixin, TooltipMixin, {
 	document: {},
 	folder: {},
 	pages: [],
@@ -26,7 +28,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
 		indentDisabled: true,
 		outdentDisabled: true
 	},
-	emptyState: Ember.computed('pages', function () {
+	emptyState: computed('pages', function () {
 		return this.get('pages.length') === 0;
 	}),
 

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

@@ -9,13 +9,15 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
+
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
-	documentService: Ember.inject.service('document'),
-	sectionService: Ember.inject.service('section'),
+export default Component.extend(NotifierMixin, TooltipMixin, {
+	documentService: service('document'),
+	sectionService: service('section'),
 	editMode: false,
 
 	didReceiveAttrs() {

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

@@ -9,11 +9,11 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
+export default Component.extend(NotifierMixin, TooltipMixin, {
 	tab: 'index',
 
 	didRender() {

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

@@ -9,12 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
+
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
-	sectionService: Ember.inject.service('section'),
+export default Component.extend(NotifierMixin, TooltipMixin, {
+	sectionService: service('section'),
 	viewMode: true,
 	editMode: false,
 

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

@@ -9,18 +9,20 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
+
+import Component from '@ember/component';
 import TooltipMixin from '../../mixins/tooltip';
 import NotifierMixin from '../../mixins/notifier';
 
-export default Ember.Component.extend(TooltipMixin, NotifierMixin, {
-    documentService: Ember.inject.service('document'),
-	sectionService: Ember.inject.service('section'),
-	sessionService: Ember.inject.service('session'),
-	appMeta: Ember.inject.service(),
-	userService: Ember.inject.service('user'),
-	localStorage: Ember.inject.service(),
-	pinned: Ember.inject.service(),
+export default Component.extend(TooltipMixin, NotifierMixin, {
+    documentService: service('document'),
+	sectionService: service('section'),
+	sessionService: service('session'),
+	appMeta: service(),
+	userService: service('user'),
+	localStorage: service(),
+	pinned: service(),
 	menuOpen: false,
 	pinState : {
 		isPinned: false,

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

@@ -9,22 +9,22 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { notEmpty, empty } from '@ember/object/computed';
+
+import { schedule } from '@ember/runloop';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-const {
-	computed,
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
-	documentService: Ember.inject.service('document'),
-	sectionService: Ember.inject.service('section'),
-	appMeta: Ember.inject.service(),
-	link: Ember.inject.service(),
-	hasPages: computed.notEmpty('pages'),
+export default Component.extend(NotifierMixin, TooltipMixin, {
+	documentService: service('document'),
+	sectionService: service('section'),
+	appMeta: service(),
+	link: service(),
+	hasPages: notEmpty('pages'),
 	newSectionName: 'Section',
-	newSectionNameMissing: computed.empty('newSectionName'),
+	newSectionNameMissing: empty('newSectionName'),
 	newSectionLocation: '',
 	beforePage: '',
 	toEdit: '',
@@ -33,7 +33,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
 		this._super(...arguments);
 		this.loadBlocks();
 
-		Ember.run.schedule('afterRender', () => {
+		schedule('afterRender', () => {
 			let jumpTo = "#page-" + this.get('pageId');
 			if (!$(jumpTo).inView()) {
 				$(jumpTo).velocity("scroll", { duration: 250, offset: -100 });
@@ -98,7 +98,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
 	},
 
 	setupAddWizard() {
-		Ember.run.schedule('afterRender', () => {
+		schedule('afterRender', () => {
 			$('.start-section:not(.start-section-empty-state)').off('.hoverIntent');
 
 			$('.start-section:not(.start-section-empty-state)').hoverIntent({interval: 100, over: function() {

gui/app/components/document/index-entry.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
     page: {},
     tagName: "li",
     classNames: ["item"],

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

@@ -9,15 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
+
+import { computed } from '@ember/object';
+import { inject as service } from '@ember/service';
 import TooltipMixin from '../../mixins/tooltip';
 
-const {
-	computed,
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(TooltipMixin, {
+export default Component.extend(TooltipMixin, {
 	documentService: service('document'),
 	deleteChildren: false,
 	menuOpen: false,

gui/app/components/document/space-category.js

@@ -9,23 +9,26 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
+
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import TooltipMixin from '../../mixins/tooltip';
 import NotifierMixin from '../../mixins/notifier';
 
-export default Ember.Component.extend(TooltipMixin, NotifierMixin, {
-    documentService: Ember.inject.service('document'),
-	categoryService: Ember.inject.service('category'),
-	sessionService: Ember.inject.service('session'),
+export default Component.extend(TooltipMixin, NotifierMixin, {
+    documentService: service('document'),
+	categoryService: service('category'),
+	sessionService: service('session'),
 	newCategory: '',
 	categories: [],
-	hasCategories: Ember.computed('categories', function() {
+	hasCategories: computed('categories', function() {
 		return this.get('categories').length > 0;
 	}),
-	canSelectCategory: Ember.computed('categories', function() {
+	canSelectCategory: computed('categories', function() {
 		return (this.get('categories').length > 0 && this.get('permissions.documentEdit'));
 	}),
-	canAddCategory: Ember.computed('categories', function() {
+	canAddCategory: computed('categories', function() {
 		return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
 	}),
 

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

@@ -9,15 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
+
+import { computed } from '@ember/object';
+import { inject as service } from '@ember/service';
 import TooltipMixin from '../../mixins/tooltip';
 
-const {
-	computed,
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(TooltipMixin, {
+export default Component.extend(TooltipMixin, {
 	documentService: service('document'),
 	expanded: false,
 	deleteChildren: false,

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

@@ -9,15 +9,17 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
 
-export default Ember.Component.extend({
+import Component from '@ember/component';
+
+export default Component.extend({
     documentTags: [],
     tagz: [],
     newTag: "",
     maxTags: 3,
 	canAdd: false,
-	emptyState: Ember.computed('tagz', function() {
+	emptyState: computed('tagz', function() {
 		return (this.get('tagz').length === 0 && !this.get('permissions.documentEdit'));
 	}),
 

gui/app/components/documize-setup.js

@@ -9,26 +9,24 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty, and } from '@ember/object/computed';
 
-const {
-	isEmpty,
-	computed,
-	set
+import $ from 'jquery';
+import Component from '@ember/component';
+import { isEmpty } from '@ember/utils';
+import { set } from '@ember/object';
 
-} = Ember;
-
-export default Ember.Component.extend({
-	titleEmpty: computed.empty('model.title'),
-	firstnameEmpty: computed.empty('model.firstname'),
-	lastnameEmpty: computed.empty('model.lastname'),
-	emailEmpty: computed.empty('model.email'),
-	passwordEmpty: computed.empty('model.password'),
-	hasEmptyTitleError: computed.and('titleEmpty', 'titleError'),
-	hasEmptyFirstnameError: computed.and('firstnameEmpty', 'adminFirstnameError'),
-	hasEmptyLastnameError: computed.and('lastnameEmpty', 'adminLastnameError'),
-	hasEmptyEmailError: computed.and('emailEmpty', 'adminEmailError'),
-	hasEmptyPasswordError: computed.and('passwordEmpty', 'adminPasswordError'),
+export default Component.extend({
+	titleEmpty: empty('model.title'),
+	firstnameEmpty: empty('model.firstname'),
+	lastnameEmpty: empty('model.lastname'),
+	emailEmpty: empty('model.email'),
+	passwordEmpty: empty('model.password'),
+	hasEmptyTitleError: and('titleEmpty', 'titleError'),
+	hasEmptyFirstnameError: and('firstnameEmpty', 'adminFirstnameError'),
+	hasEmptyLastnameError: and('lastnameEmpty', 'adminLastnameError'),
+	hasEmptyEmailError: and('emailEmpty', 'adminEmailError'),
+	hasEmptyPasswordError: and('passwordEmpty', 'adminPasswordError'),
 
 	actions: {
 		save() {
@@ -57,7 +55,7 @@ export default Ember.Component.extend({
 				return $("#adminPassword").focus();
 			}
 
-			this.model.allowAnonymousAccess = Ember.$("#allowAnonymousAccess").prop('checked');
+			this.model.allowAnonymousAccess = $("#allowAnonymousAccess").prop('checked');
 
 			this.get('save')().then(() => {
 				set(this, 'titleError', false);

gui/app/components/dropdown-dialog.js

@@ -9,10 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
+
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import stringUtil from '../utils/string';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	drop: null,
 	target: null,
 	button: "Delete",
@@ -33,9 +36,9 @@ export default Ember.Component.extend({
 	constrainToWindow: true,
 	constrainToScrollParent: true,
 	cssClass: '',
-	tether: Ember.inject.service(),
+	tether: service(),
 
-	hasSecondButton: Ember.computed('button2', 'color2', function () {
+	hasSecondButton: computed('button2', 'color2', function () {
 		return is.not.empty(this.get('button2')) && is.not.empty(this.get('color2'));
 	}),
 

gui/app/components/dropdown-menu.js

@@ -9,10 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
+
+import Component from '@ember/component';
 import stringUtil from '../utils/string';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	target: null,
 	open: "click",
 	position: 'bottom right',
@@ -20,7 +22,7 @@ export default Ember.Component.extend({
 	drop: null,
 	onOpenCallback: null, // callback when opened
 	onCloseCallback: null, // callback when closed
-	tether: Ember.inject.service(),
+	tether: service(),
 
 	didReceiveAttrs() {
 		this.set("contentId", 'dropdown-menu-' + stringUtil.makeId(10));

gui/app/components/empty-state.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	icon: 'visibility',
 	glypth: '',
 

gui/app/components/focus-input.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import TextField from '@ember/component/text-field';
 
-export default Ember.TextField.extend({
+export default TextField.extend({
     becomeFocused: function() {
         this.$().focus();
     }.on('didInsertElement')

gui/app/components/focus-textarea.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import TextArea from '@ember/component/text-area';
 
-export default Ember.TextArea.extend({
+export default TextArea.extend({
     becomeFocused: function() {
         this.$().focus();
     }.on('didInsertElement')

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

@@ -9,16 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
+
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 import DropdownMixin from '../../mixins/dropdown';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, DropdownMixin, {
+export default Component.extend(NotifierMixin, TooltipMixin, DropdownMixin, {
 	userService: service('user'),
 	categoryService: service('category'),
 	appMeta: service(),

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
     documentTags: [],
     tagz: [],
 

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

@@ -9,13 +9,15 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
 
-export default Ember.Component.extend({
-	showAdd: Ember.computed('permissions', 'documents', function() {
+import Component from '@ember/component';
+
+export default Component.extend({
+	showAdd: computed('permissions', 'documents', function() {
 		return this.get('documents.length') === 0 && this.get('permissions.documentAdd');
 	}),
-	showLockout: Ember.computed('permissions', 'documents', function() {
+	showLockout: computed('permissions', 'documents', function() {
 		return this.get('documents.length') === 0 && !this.get('permissions.documentAdd');
 	}),
 

gui/app/components/folder/invite-user.js

@@ -9,14 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
+
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, {
+export default Component.extend(NotifierMixin, {
 	folderService: service('folder'),
 	appMeta: service(),
 	inviteEmail: '',

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

@@ -9,14 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { setProperties } from '@ember/object';
+
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, {
+export default Component.extend(NotifierMixin, {
 	folderService: service('folder'),
 	userService: service('user'),
 	appMeta: service(),
@@ -74,7 +73,7 @@ export default Ember.Component.extend(NotifierMixin, {
 				permissions.forEach((permission, index) => { // eslint-disable-line no-unused-vars
 					let record = folderPermissions.findBy('userId', permission.get('userId'));
 					if (is.not.undefined(record)) {
-						record = Ember.setProperties(record, permission);
+						record = setProperties(record, permission);
 					}
 				});
 

gui/app/components/folder/sidebar-folders-list.js

@@ -9,13 +9,15 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { schedule } from '@ember/runloop';
+
+import Component from '@ember/component';
 import constants from '../../utils/constants';
 import TooltipMixin from '../../mixins/tooltip';
 import NotifierMixin from '../../mixins/notifier';
 import AuthMixin from '../../mixins/auth';
 
-export default Ember.Component.extend(TooltipMixin, NotifierMixin, AuthMixin, {
+export default Component.extend(TooltipMixin, NotifierMixin, AuthMixin, {
 	publicFolders: [],
 	protectedFolders: [],
 	privateFolders: [],
@@ -66,7 +68,7 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, AuthMixin, {
 			this.set('showSpace', val);
 
 			if (val) {
-				Ember.run.schedule('afterRender', () => {
+				schedule('afterRender', () => {
 					$("#new-folder-name").focus();
 				});
 			}

gui/app/components/folder/sidebar-zone.js

@@ -9,12 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 import TooltipMixin from '../../mixins/tooltip';
 import NotifierMixin from '../../mixins/notifier';
 import AuthMixin from '../../mixins/auth';
 
-export default Ember.Component.extend(TooltipMixin, NotifierMixin, AuthMixin, {
+export default Component.extend(TooltipMixin, NotifierMixin, AuthMixin, {
 	tab: '',
 
 	init() {

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

@@ -9,18 +9,18 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty } from '@ember/object/computed';
+
+import { schedule } from '@ember/runloop';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 
-const {
-	computed,
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
-	folderService: Ember.inject.service('folder'),
+export default Component.extend(NotifierMixin, TooltipMixin, {
+	folderService: service('folder'),
 	folderName: '',
-	hasNameError: computed.empty('folderName'),
+	hasNameError: empty('folderName'),
 	editMode: false,
 
 	keyUp(e) {
@@ -34,7 +34,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
 			this.set('folderName', this.get('folder.name'));
 			this.set('editMode', true);
 
-			Ember.run.schedule('afterRender', () => {
+			schedule('afterRender', () => {
 				$('#folder-name').select();
 			});
 		},

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

@@ -9,16 +9,15 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
+
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 import AuthMixin from '../../mixins/auth';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
+export default Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
 	folderService: service('folder'),
 	session: service(),
 	appMeta: service(),
@@ -34,7 +33,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
 		newName: ''
 	},
 	deleteSpaceName: '',
-	spaceSettings: Ember.computed('permissions', function() {
+	spaceSettings: computed('permissions', function() {
 		return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
 	}),
 

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

@@ -9,23 +9,24 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { all } from 'rsvp';
+
+import { schedule } from '@ember/runloop';
+import { gt } from '@ember/object/computed';
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 import TooltipMixin from '../../mixins/tooltip';
 import AuthMixin from '../../mixins/auth';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
+export default Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
 	router: service(),
 	documentService: service('document'),
 	folderService: service('folder'),
 	localStorage: service('localStorage'),
 	selectedDocuments: [],
-	hasSelectedDocuments: Ember.computed.gt('selectedDocuments.length', 0),
-	hasCategories: Ember.computed.gt('categories.length', 0),
+	hasSelectedDocuments: gt('selectedDocuments.length', 0),
+	hasCategories: gt('categories.length', 0),
 	showStartDocument: false,
 	filteredDocs: [],
 
@@ -70,7 +71,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
 
 		this.set('categories', categories);
 
-		Ember.run.schedule('afterRender', () => {
+		schedule('afterRender', () => {
 			if (this.get('rootDocCount') > 0) {
 				this.send('onDocumentFilter', 'space', this.get('folder.id'));
 			} else if (selectedCategory !== '') {
@@ -107,7 +108,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, AuthMixin, {
 				promises[index] = self.get('documentService').deleteDocument(document);
 			});
 
-			Ember.RSVP.all(promises).then(() => {
+			all(promises).then(() => {
 				let documents = this.get('documents');
 				documents.forEach(function (document) {
 					document.set('selected', false);

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

@@ -9,15 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty } from '@ember/object/computed';
+
+import { schedule } from '@ember/runloop';
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 
-const {
-	computed,
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, {
+export default Component.extend(NotifierMixin, {
 	localStorage: service(),
 	appMeta: service(),
 	templateService: service('template'),
@@ -26,14 +25,14 @@ export default Ember.Component.extend(NotifierMixin, {
 	importStatus: [],
 	dropzone: null,
 	newDocumentName: '',
-	newDocumentNameMissing: computed.empty('newDocumentName'),
+	newDocumentNameMissing: empty('newDocumentName'),
 
 	didReceiveAttrs() {
 		this._super(...arguments);
 
 		this.setupTemplates();
 
-		Ember.run.schedule('afterRender', ()=> {
+		schedule('afterRender', ()=> {
 			this.setupImport();
 		});
 	},
@@ -64,7 +63,7 @@ export default Ember.Component.extend(NotifierMixin, {
 
 		this.set('savedTemplates', templates);
 
-		Ember.run.schedule('afterRender', () => {
+		schedule('afterRender', () => {
 			$('#new-document-name').select();
 		});
 	},

gui/app/components/forgot-password.js

@@ -9,32 +9,31 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty, and } from '@ember/object/computed';
 
-const {
-	computed,
-	isEmpty
-} = Ember;
+import { set } from '@ember/object';
+import Component from '@ember/component';
+import { isEmpty } from '@ember/utils';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	email: "",
 	sayThanks: false,
-	emailEmpty: computed.empty('email'),
-	hasEmptyEmailError: computed.and('emailEmpty', 'emailIsEmpty'),
+	emailEmpty: empty('email'),
+	hasEmptyEmailError: and('emailEmpty', 'emailIsEmpty'),
 
 	actions: {
 		forgot() {
 			let email = this.get('email');
 
 			if (isEmpty(email)) {
-				Ember.set(this, 'emailIsEmpty', true);
+				set(this, 'emailIsEmpty', true);
 				return $("#email").focus();
 			}
 
 			this.get('forgot')(email).then(() => {
-				Ember.set(this, 'sayThanks', true);
-				Ember.set(this, 'email', '');
-				Ember.set(this, 'emailIsEmpty', false);
+				set(this, 'sayThanks', true);
+				set(this, 'email', '');
+				set(this, 'emailIsEmpty', false);
 			});
 		}
 	}

gui/app/components/layout/sidebar-intro.js

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 });

gui/app/components/layout/zone-content.js

@@ -9,14 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
+
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, {
+export default Component.extend(NotifierMixin, {
     appMeta :service(),
 
     didRender() {

gui/app/components/layout/zone-document.js

@@ -9,14 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
+
+import { inject as service } from '@ember/service';
 import NotifierMixin from '../../mixins/notifier';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(NotifierMixin, {
+export default Component.extend(NotifierMixin, {
     appMeta :service(),
 
     didRender() {

gui/app/components/layout/zone-sidebar.js

@@ -9,15 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { notEmpty } from '@ember/object/computed';
+
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import constants from '../../utils/constants';
 
-const {
-	computed,
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend({
+export default Component.extend({
 	folderService: service('folder'),
 	appMeta: service(),
 	session: service(),
@@ -25,7 +23,7 @@ export default Ember.Component.extend({
 	pinned: service(),
 	enableLogout: true,
 	pins: [],
-	hasPins: computed.notEmpty('pins'),
+	hasPins: notEmpty('pins'),
 
 	init() {
 		this._super(...arguments);

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

@@ -9,10 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
 
-export default Ember.Component.extend({
-    folderService: Ember.inject.service('folder'),
+import Component from '@ember/component';
+
+export default Component.extend({
+    folderService: service('folder'),
     serial: "",
     folderId: "",
     slug: "",

gui/app/components/password-reset.js

@@ -9,24 +9,20 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty, and } from '@ember/object/computed';
 
-const {
-	isEmpty,
-	isEqual,
-	computed,
-	set
+import Component from '@ember/component';
+import { isEqual, isEmpty } from '@ember/utils';
+import { set } from '@ember/object';
 
-} = Ember;
-
-export default Ember.Component.extend({
+export default Component.extend({
 	password: "",
 	passwordConfirm: "",
 	mustMatch: false,
-	passwordEmpty: computed.empty('password'),
-	confirmEmpty: computed.empty('passwordConfirm'),
-	hasPasswordError: computed.and('passwordEmpty', 'passwordIsEmpty'),
-	hasConfirmError: computed.and('confirmEmpty', 'passwordConfirmIsEmpty'),
+	passwordEmpty: empty('password'),
+	confirmEmpty: empty('passwordConfirm'),
+	hasPasswordError: and('passwordEmpty', 'passwordIsEmpty'),
+	hasConfirmError: and('confirmEmpty', 'passwordConfirmIsEmpty'),
 
 	actions: {
 		reset() {

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	results: [],
 	resultPhrase: "",
 

gui/app/components/search/tag-list.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
     documentTags: [],
     tagz: [],
 

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	data: "",
 
 	didReceiveAttrs() {

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -9,39 +9,38 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { empty } from '@ember/object/computed';
 
-const {
-	computed,
-} = Ember;
+import { computed } from '@ember/object';
+import Component from '@ember/component';
 
 
-export default Ember.Component.extend({
+export default Component.extend({
 	drop: null,
 	busy: false,
 	mousetrap: null,
-	hasNameError: computed.empty('page.title'),
-	containerId: Ember.computed('page', function () {
+	hasNameError: empty('page.title'),
+	containerId: computed('page', function () {
 		let page = this.get('page');
 		return `base-editor-inline-container-${page.id}`;
 	}),
-	pageId: Ember.computed('page', function () {
+	pageId: computed('page', function () {
 		let page = this.get('page');
 		return `page-editor-${page.id}`;
 	}),
-	cancelId: Ember.computed('page', function () {
+	cancelId: computed('page', function () {
 		let page = this.get('page');
 		return `cancel-edits-button-${page.id}`;
 	}),
-	dialogId: Ember.computed('page', function () {
+	dialogId: computed('page', function () {
 		let page = this.get('page');
 		return `discard-edits-dialog-${page.id}`;
 	}),
-	contentLinkerButtonId: Ember.computed('page', function () {
+	contentLinkerButtonId: computed('page', function () {
 		let page = this.get('page');
 		return `content-linker-button-${page.id}`;
 	}),
-	previewButtonId: Ember.computed('page', function () {
+	previewButtonId: computed('page', function () {
 		let page = this.get('page');
 		return `content-preview-button-${page.id}`;
 	}),

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

@@ -9,15 +9,17 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
 
-export default Ember.Component.extend({
+import Component from '@ember/component';
+
+export default Component.extend({
 	drop: null,
 	cancelLabel: "Close",
 	actionLabel: "Save",
 	tip: "Short and concise title",
 	busy: false,
-	hasExcerpt: Ember.computed('page', function () {
+	hasExcerpt: computed('page', function () {
 		return is.not.undefined(this.get('page.excerpt'));
 	}),
 

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

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 });

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

@@ -9,20 +9,22 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
+
+import Component from '@ember/component';
 import TooltipMixin from '../../../mixins/tooltip';
 
-export default Ember.Component.extend(TooltipMixin, {
+export default Component.extend(TooltipMixin, {
     isDirty: false,
     pageBody: "",
     syntaxOptions: [],
     codeSyntax: null,
 	codeEditor: null,
-	editorId: Ember.computed('page', function () {
+	editorId: computed('page', function () {
 		let page = this.get('page');
 		return `code-editor-${page.id}`;
 	}),
-	syntaxId: Ember.computed('page', function () {
+	syntaxId: computed('page', function () {
 		let page = this.get('page');
 		return `code-editor-syntax-${page.id}`;
 	}),

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
     codeBody: "",
     codeSyntax: "htmlmixed",
 

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

@@ -9,13 +9,17 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { set } from '@ember/object';
+
+import { schedule } from '@ember/runloop';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../../mixins/notifier';
 import TooltipMixin from '../../../mixins/tooltip';
 import SectionMixin from '../../../mixins/section';
 
-export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
-	sectionService: Ember.inject.service('section'),
+export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
+	sectionService: service('section'),
 	isDirty: false,
 	waiting: false,
 	authenticated: false,
@@ -87,7 +91,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 				self.set('workspaces', response);
 				self.selectWorkspace(workspaceId);
 
-				Ember.run.schedule('afterRender', function () {
+				schedule('afterRender', function () {
 					window.scrollTo(0, document.body.scrollHeight);
 
 					response.forEach(function (workspace) {
@@ -129,7 +133,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 		let w = this.get('workspaces');
 
 		w.forEach(function (w) {
-			Ember.set(w, 'selected', w.Id === id);
+			set(w, 'selected', w.Id === id);
 
 			if (w.Id === id) {
 				self.set("config.filter", w.Filter);

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -9,13 +9,16 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { set } from '@ember/object';
+
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../../mixins/notifier';
 import TooltipMixin from '../../../mixins/tooltip';
 import SectionMixin from '../../../mixins/section';
 
-export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
-	sectionService: Ember.inject.service('section'),
+export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
+	sectionService: service('section'),
 	isDirty: false,
 	busy: false,
 	authenticated: false,
@@ -182,11 +185,11 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 			let list = lists.findBy('id', id);
 
 			lists.forEach(function (entry) {
-				Ember.set(entry, 'included', false);
+				set(entry, 'included', false);
 			});
 
 			if (list !== null) {
-				Ember.set(list, 'included', true);
+				set(list, 'included', true);
 			}
 		},
 

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -9,25 +9,25 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { schedule } from '@ember/runloop';
+
+import { computed } from '@ember/object';
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 import TooltipMixin from '../../../mixins/tooltip';
 
-const {
-	inject: { service }
-} = Ember;
-
-export default Ember.Component.extend(TooltipMixin, {
+export default Component.extend(TooltipMixin, {
 	link: service(),
 	pageBody: "",
 	pagePreview: "",
 	editMode: true,
 	codeSyntax: null,
 	codeEditor: null,
-	editorId: Ember.computed('page', function () {
+	editorId: computed('page', function () {
 		let page = this.get('page');
 		return `markdown-editor-${page.id}`;
 	}),
-	previewId: Ember.computed('page', function () {
+	previewId: computed('page', function () {
 		let page = this.get('page');
 		return `markdown-preview-${page.id}`;
 	}),
@@ -89,7 +89,7 @@ export default Ember.Component.extend(TooltipMixin, {
 		onPreview() {
 			this.set('editMode', !this.get('editMode'));
 
-			Ember.run.schedule('afterRender', () => {
+			schedule('afterRender', () => {
 				if (this.get('editMode')) {
 					this.attachEditor();
 				} else {

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -9,14 +9,17 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { set } from '@ember/object';
+
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../../mixins/notifier';
 import TooltipMixin from '../../../mixins/tooltip';
 import SectionMixin from '../../../mixins/section';
 import netUtil from '../../../utils/net';
 
-export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
-	sectionService: Ember.inject.service('section'),
+export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
+	sectionService: service('section'),
 	isDirty: false,
 	waiting: false,
 	authenticated: false,
@@ -88,7 +91,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 								group = options.groups[0];
 							}
 							if (is.not.undefined(group)) {
-								Ember.set(config, 'group', group);
+								set(config, 'group', group);
 							}
 						}, function (reason) { 
 							self.set('authenticated', false);
@@ -159,7 +162,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 				max = parseInt(config.max);
 			}
 
-			Ember.set(config, 'max', max);
+			set(config, 'max', max);
 			this.set('waiting', true);
 
 			this.get('sectionService').fetch(page, "auth", this.get('config'))

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -9,12 +9,14 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed } from '@ember/object';
 
-export default Ember.Component.extend({
+import Component from '@ember/component';
+
+export default Component.extend({
 	isDirty: false,
 	pageBody: "",
-	editorId: Ember.computed('page', function () {
+	editorId: computed('page', function () {
 		let page = this.get('page');
 		return `table-editor-${page.id}`;
 	}),

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -10,13 +10,18 @@
 // https://documize.com
 
 /*global Trello*/
-import Ember from 'ember';
+import $ from 'jquery';
+
+import { htmlSafe } from '@ember/string';
+import { computed, set } from '@ember/object';
+import { inject as service } from '@ember/service';
+import Component from '@ember/component';
 import NotifierMixin from '../../../mixins/notifier';
 import TooltipMixin from '../../../mixins/tooltip';
 import SectionMixin from '../../../mixins/section';
 
-export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
-	sectionService: Ember.inject.service('section'),
+export default Component.extend(SectionMixin, NotifierMixin, TooltipMixin, {
+	sectionService: service('section'),
 	isDirty: false,
 	busy: false,
 	authenticated: false,
@@ -25,7 +30,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 	noBoards: false,
 	appKey: "",
 
-	boardStyle: Ember.computed('config.board', function () {
+	boardStyle: computed('config.board', function () {
 		let board = this.get('config.board');
 
 		if (is.null(board) || is.undefined(board)) {
@@ -33,7 +38,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 		}
 
 		let color = board.prefs.backgroundColor;
-		return Ember.String.htmlSafe("background-color: " + color);
+		return htmlSafe("background-color: " + color);
 	}),
 
 	didReceiveAttrs() {
@@ -73,7 +78,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 				if (self.get('appKey') !== "" && self.get('config.token') !== "") {
 					self.send('auth');
 				} else {
-					Ember.$.getScript("https://api.trello.com/1/client.js?key=" + self.get('appKey'), function () {
+					$.getScript("https://api.trello.com/1/client.js?key=" + self.get('appKey'), function () {
 						Trello.deauthorize();
 					});
 				}
@@ -146,7 +151,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 			let list = lists.findBy('id', id);
 
 			if (list !== null) {
-				Ember.set(list, 'included', !list.included);
+				set(list, 'included', !list.included);
 			}
 		},
 
@@ -162,7 +167,7 @@ export default Ember.Component.extend(SectionMixin, NotifierMixin, TooltipMixin,
 
 			self.set('busy', true);
 
-			Ember.$.getScript("https://api.trello.com/1/client.js?key=" + this.get('appKey'), function () {
+			$.getScript("https://api.trello.com/1/client.js?key=" + this.get('appKey'), function () {
 				Trello.authorize({
 					type: "redirect",
 					interactive: true,

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

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

@@ -9,17 +9,16 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { computed, set } from '@ember/object';
 
-const {
-	inject: { service }
-} = Ember;
+import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	appMeta: service(),
 	link: service(),
 	pageBody: "",
-	editorId: Ember.computed('page', function () {
+	editorId: computed('page', function () {
 		let page = this.get('page');
 		return `wysiwyg-editor-${page.id}`;
 	}),
@@ -102,7 +101,7 @@ export default Ember.Component.extend({
 			let userSelection = editor.selection.getContent();
 
 			if (is.not.empty(userSelection)) {
-				Ember.set(link, 'title', userSelection);
+				set(link, 'title', userSelection);
 			}
 
 			let linkHTML = this.get('link').buildLink(link);

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

@@ -9,6 +9,6 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({});
+export default Component.extend({});

gui/app/components/ui-select.js

@@ -9,9 +9,11 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { reads } from '@ember/object/computed';
 
-export default Ember.Component.extend({
+import Component from '@ember/component';
+
+export default Component.extend({
     cssClass: "",
     content: [],
     prompt: null,
@@ -22,7 +24,7 @@ export default Ember.Component.extend({
 
     // shadow the passed-in `selection` to avoid
     // leaking changes to it via a 2-way binding
-    _selection: Ember.computed.reads('selection'),
+    _selection: reads('selection'),
 
     actions: {
         change() {

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

@@ -9,10 +9,10 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 import TooltipMixin from '../../mixins/tooltip';
 
-export default Ember.Component.extend(TooltipMixin, {
+export default Component.extend(TooltipMixin, {
 	didRender() {
 		let refId = this.get('refId');
 		this.addTooltip(document.getElementById(`avatar-${refId}`));

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	tagName: 'span',
 
 	actions: {

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

@@ -9,15 +9,17 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { set } from '@ember/object';
 
-export default Ember.Component.extend({
+import Component from '@ember/component';
+
+export default Component.extend({
 	nameField: 'category',
 	items: [],
 
 	actions: {
 		onToggle(item) {
-			Ember.set(item, 'selected', !item.get('selected'));
+			set(item, 'selected', !item.get('selected'));
 		}
 	}
 });

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

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 	tagName: 'span',
 	value: '',
 	onClick: null,

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

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Component from '@ember/component';
 
-export default Ember.Component.extend({
+export default Component.extend({
 });

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

@@ -9,22 +9,25 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { htmlSafe } from '@ember/string';
 
-export default Ember.Component.extend({
-	myWidth: Ember.computed('tabs', function() {
+import { computed, set } from '@ember/object';
+import Component from '@ember/component';
+
+export default Component.extend({
+	myWidth: computed('tabs', function() {
 		let count = this.get('tabs.length');
 		let width = 95 / count;
-		return Ember.String.htmlSafe("width: " + `${width}%;`);
+		return htmlSafe("width: " + `${width}%;`);
 	}),
 
 	actions: {
 		onTabSelect(tab) {
 			this.get('tabs').forEach(t => {
-				Ember.set(t, 'selected', false);
+				set(t, 'selected', false);
 			});
 
-			Ember.set(tab, 'selected', true);
+			set(tab, 'selected', true);
 
 			this.attrs.onTabSelect(this.get('tabs'));
 		}

gui/app/components/user-notification.js

@@ -9,10 +9,12 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { run } from '@ember/runloop';
+
+import Component from '@ember/component';
 import miscUtil from '../utils/misc';
 
-export default Ember.Component.extend({
+export default Component.extend({
     notifications: [],
 
     didInsertElement() {
@@ -31,7 +33,7 @@ export default Ember.Component.extend({
 
         let elem = this.$(".user-notification")[0];
 
-        Ember.run(() => {
+        run(() => {
             self.$(elem).show();
 
             // FIXME: need a more robust solution

gui/app/components/user-profile.js

@@ -9,21 +9,18 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+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';
 
-const {
-	computed,
-	isEmpty,
-	isEqual,
-	isPresent
-} = Ember;
-
-export default Ember.Component.extend(AuthProvider, {
+export default Component.extend(AuthProvider, {
 	password: { password: "", confirmation: "" },
-	hasFirstnameError: computed.empty('model.firstname'),
-	hasLastnameError: computed.empty('model.lastname'),
-	hasEmailError: computed.empty('model.email'),
+	hasFirstnameError: empty('model.firstname'),
+	hasLastnameError: empty('model.lastname'),
+	hasEmailError: empty('model.email'),
 	hasPasswordError: computed('passwordError', 'password.password', {
 		get() {
 			if (isPresent(this.get('passwordError'))) {
@@ -61,23 +58,23 @@ export default Ember.Component.extend(AuthProvider, {
 			}
 
 			if (isPresent(password) && isEmpty(confirmation)) {
-				Ember.set(this, 'confirmPasswordError', 'error');
+				set(this, 'confirmPasswordError', 'error');
 				return $("#confirmPassword").focus();
 			}
 			if (isEmpty(password) && isPresent(confirmation)) {
-				Ember.set(this, 'passwordError', 'error');
+				set(this, 'passwordError', 'error');
 				return $("#password").focus();
 			}
 			if (!isEqual(password, confirmation)) {
-				Ember.set(this, 'passwordError', 'error');
+				set(this, 'passwordError', 'error');
 				return $("#password").focus();
 			}
 
 			let passwords = this.get('password');
 
 			this.get('save')(passwords).finally(() => {
-				Ember.set(this, 'password.password', '');
-				Ember.set(this, 'password.confirmation', '');
+				set(this, 'password.password', '');
+				set(this, 'password.confirmation', '');
 			});
 		}
 	}

gui/app/components/widget-sample.js

@@ -10,10 +10,10 @@
 // https://documize.com
 
 // Copyright (c) 2015 Documize Inc.
-import Ember from 'ember';
+import Component from '@ember/component';
 import NotifierMixin from '../mixins/notifier';
 
-export default Ember.Component.extend(NotifierMixin, {
+export default Component.extend(NotifierMixin, {
     drop1: null,
 
     didInsertElement() {
@@ -31,15 +31,25 @@ export default Ember.Component.extend(NotifierMixin, {
             target: document.getElementById("sample-4")
         });
 
-        let drop1 = new Drop({
-            target: document.getElementById('sample-dropdown-1'),
-            content: document.getElementById('sample-dropdown-content-1'),
-            classes: 'drop-theme-basic',
-            position: 'bottom middle',
-            openOn: 'click'
-        });
+        // let drop1 = new Drop({
+        //     target: document.getElementById('sample-dropdown-1'),
+        //     content: document.getElementById('sample-dropdown-content-1'),
+        //     classes: 'drop-theme-basic',
+        //     position: 'bottom middle',
+        //     openOn: 'click'
+        // });
 
-        this.set('drop1', drop1);
+		// this.set('drop1', drop1);
+
+		$('#test-button').popover({
+			placement: 'top',
+			trigger: 'focus',
+			title: "How to Test",
+			content: "This is a demo that tests the suitability of Bootstrap 4 inside Documize"
+		});
+
+		$('#test-button2').tooltip({});
+		$('#test-button3').tooltip({});
     },
 
     actions: {

gui/app/helpers/document/file-icon.js

@@ -9,7 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
+
+import { htmlSafe } from '@ember/string';
 
 export function documentFileIcon(params) {
     let fileExtension = params[0].toLowerCase();
@@ -106,7 +108,7 @@ export function documentFileIcon(params) {
         case "xslt":
     }
 
-    return new Ember.String.htmlSafe(html);
+    return new htmlSafe(html);
 }
 
-export default Ember.Helper.helper(documentFileIcon);
+export default helper(documentFileIcon);

gui/app/helpers/formatted-date.js

@@ -9,11 +9,11 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
 import dateUtil from '../utils/date';
 
 export function formattedDate(params) {
     return dateUtil.toIsoDate(params[0], params[1]);
 }
 
-export default Ember.Helper.helper(formattedDate);
+export default helper(formattedDate);

gui/app/helpers/generate-id.js

@@ -9,10 +9,10 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
 
 // Usage: {{generate-id 'admin-' 123}}
-export default Ember.Helper.helper(function(params) {
+export default helper(function(params) {
     let prefix = params[0];
     let id = params[1];
     return prefix + "-" + id;

gui/app/helpers/is-equal.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
 
 // Usage: {{is-equal item selection}}
-export default Ember.Helper.helper(function([leftSide, rightSide]) {
+export default helper(function([leftSide, rightSide]) {
     return leftSide === rightSide;
 });

gui/app/helpers/is-not.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
 
 // Usage: {{is-not selection}}
-export default Ember.Helper.helper(function([value]) {
+export default helper(function([value]) {
     return !value;
 });

gui/app/helpers/read-path.js

@@ -9,8 +9,10 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { get } from '@ember/object';
 
-export default Ember.Helper.helper(function([object, path]) {
-    return Ember.get(object, path);
+import { helper } from '@ember/component/helper';
+
+export default helper(function([object, path]) {
+    return get(object, path);
 });

gui/app/helpers/time-ago.js

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
 import dateUtil from '../utils/date';
 
 // {{time-ago createdAt}}
@@ -23,4 +23,4 @@ export function timeAgo(params) {
 	return d;
 }
 
-export default Ember.Helper.helper(timeAgo);
+export default helper(timeAgo);

gui/app/helpers/user-initials.js

@@ -9,7 +9,7 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { helper } from '@ember/component/helper';
 
 // {{user-initials firstname lastname}}
 export function userInitials(params) {
@@ -26,4 +26,4 @@ export function userInitials(params) {
     return (firstname.substring(0, 1) + lastname.substring(0, 1)).toUpperCase();
 }
 
-export default Ember.Helper.helper(userInitials);
+export default helper(userInitials);

gui/app/mixins/auth.js

@@ -9,11 +9,13 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import { inject as service } from '@ember/service';
+
+import Mixin from '@ember/object/mixin';
 import constants from '../utils/constants';
 
-export default Ember.Mixin.create({
-	appMeta: Ember.inject.service(),
+export default Mixin.create({
+	appMeta: service(),
 	isAuthProviderDocumize: true,
 	IsAuthProviderKeycloak: false,
 

gui/app/mixins/dropdown.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Mixin from '@ember/object/mixin';
 
-export default Ember.Mixin.create({
+export default Mixin.create({
 	closeDropdown() {
 		let drop = this.get('dropdown');
 

gui/app/mixins/notifier.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Mixin from '@ember/object/mixin';
 
-export default Ember.Mixin.create({
+export default Mixin.create({
     showNotification(msg) {
         this.eventBus.publish('notifyUser', msg);
     },

gui/app/mixins/section.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Mixin from '@ember/object/mixin';
 
-export default Ember.Mixin.create({
+export default Mixin.create({
 	isReadonly: function () {
 		if (this.get('page.userId') === this.get('session.session.authenticated.user.id')) {
 			return undefined;

gui/app/mixins/tooltip.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
-import Ember from 'ember';
+import Mixin from '@ember/object/mixin';
 
-export default Ember.Mixin.create({
+export default Mixin.create({
     tooltips: [],
 
     addTooltip(elem) {

gui/app/models/document-activity.js

@@ -9,9 +9,9 @@
 //
 // https://documize.com
 
+import { computed } from '@ember/object';
 import Model from 'ember-data/model';
 import attr from 'ember-data/attr';
-import Ember from 'ember';
 import constants from '../utils/constants'; 
 
 export default Model.extend({
@@ -24,7 +24,7 @@ export default Model.extend({
 	activityType: attr('number'),
 	created: attr(),
 
-	activityLabel: Ember.computed('activityType', function() {
+	activityLabel: computed('activityType', function() {
 		let label = '';
 
 		switch (this.get('activityType')) {
@@ -62,7 +62,7 @@ export default Model.extend({
 		return label;
 	}),
 
-	activityColor: Ember.computed('activityType', function() {
+	activityColor: computed('activityType', function() {
 		let color = '';
 
 		switch (this.get('activityType')) {