mirror of
https://github.com/documize/community.git
synced 2025-07-19 05:09:42 +02:00
Refactor content linking code flow
Fixed EmberJS deprecation warnings by removing usage of observers. Fixed edge case bug for repeated content link insertion modal clicks.
This commit is contained in:
parent
3fd1d793a3
commit
9b06ddecb5
4 changed files with 36 additions and 15 deletions
|
@ -10,7 +10,7 @@
|
||||||
// https://documize.com
|
// https://documize.com
|
||||||
|
|
||||||
import { debounce } from '@ember/runloop';
|
import { debounce } from '@ember/runloop';
|
||||||
import { computed, set, observer } from '@ember/object';
|
import { computed, set } from '@ember/object';
|
||||||
import { inject as service } from '@ember/service';
|
import { inject as service } from '@ember/service';
|
||||||
import stringUtil from '../../utils/string';
|
import stringUtil from '../../utils/string';
|
||||||
import ModalMixin from '../../mixins/modal';
|
import ModalMixin from '../../mixins/modal';
|
||||||
|
@ -35,7 +35,19 @@ export default Component.extend(ModalMixin, {
|
||||||
}),
|
}),
|
||||||
modalId: computed('page', function() { return '#content-linker-modal-' + this.get('page.id'); }),
|
modalId: computed('page', function() { return '#content-linker-modal-' + this.get('page.id'); }),
|
||||||
showModal: false,
|
showModal: false,
|
||||||
onToggle: observer('showModal', function() {
|
|
||||||
|
init() {
|
||||||
|
this._super(...arguments);
|
||||||
|
this.matches = {
|
||||||
|
documents: [],
|
||||||
|
pages: [],
|
||||||
|
attachments: []
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
didReceiveAttrs() {
|
||||||
|
this._super(...arguments);
|
||||||
|
|
||||||
let modalId = this.get('modalId');
|
let modalId = this.get('modalId');
|
||||||
|
|
||||||
if (!this.get('showModal')) {
|
if (!this.get('showModal')) {
|
||||||
|
@ -52,18 +64,20 @@ export default Component.extend(ModalMixin, {
|
||||||
self.set('candidates', candidates);
|
self.set('candidates', candidates);
|
||||||
self.set('hasSections', is.not.null(candidates.pages) && candidates.pages.length);
|
self.set('hasSections', is.not.null(candidates.pages) && candidates.pages.length);
|
||||||
self.set('hasAttachments', is.not.null(candidates.attachments) && candidates.attachments.length);
|
self.set('hasAttachments', is.not.null(candidates.attachments) && candidates.attachments.length);
|
||||||
|
|
||||||
|
if (!self.get('hasSections') && !self.get('hasAttachments')) {
|
||||||
|
self.set('tab1Selected', false);
|
||||||
|
self.set('tab2Selected', false);
|
||||||
|
self.set('tab3Selected', true);
|
||||||
|
self.set('tab4Selected', false);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
this.modalOpen(modalId, {show: true});
|
this.modalOpen(modalId, {show: true});
|
||||||
}),
|
|
||||||
|
|
||||||
init() {
|
this.modalOnHide(modalId, () => {
|
||||||
this._super(...arguments);
|
this.set('showModal', false);
|
||||||
this.matches = {
|
});
|
||||||
documents: [],
|
|
||||||
pages: [],
|
|
||||||
attachments: []
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
|
|
||||||
didRender() {
|
didRender() {
|
||||||
|
@ -74,13 +88,10 @@ export default Component.extend(ModalMixin, {
|
||||||
|
|
||||||
willDestroyElement() {
|
willDestroyElement() {
|
||||||
this._super(...arguments);
|
this._super(...arguments);
|
||||||
|
this.set('showModal', false);
|
||||||
this.modalClose(this.get('modalId'));
|
this.modalClose(this.get('modalId'));
|
||||||
},
|
},
|
||||||
|
|
||||||
onKeywordChange: observer('keywords', function() {
|
|
||||||
debounce(this, this.fetch, 750);
|
|
||||||
}),
|
|
||||||
|
|
||||||
fetch() {
|
fetch() {
|
||||||
let keywords = this.get('keywords');
|
let keywords = this.get('keywords');
|
||||||
let self = this;
|
let self = this;
|
||||||
|
@ -96,6 +107,10 @@ export default Component.extend(ModalMixin, {
|
||||||
},
|
},
|
||||||
|
|
||||||
actions: {
|
actions: {
|
||||||
|
onSearch() {
|
||||||
|
debounce(this, this.fetch, 750);
|
||||||
|
},
|
||||||
|
|
||||||
setSelection(i) {
|
setSelection(i) {
|
||||||
let candidates = this.get('candidates');
|
let candidates = this.get('candidates');
|
||||||
let matches = this.get('matches');
|
let matches = this.get('matches');
|
||||||
|
|
|
@ -37,6 +37,7 @@ export default Component.extend(Notifier, {
|
||||||
|
|
||||||
didReceiveAttrs() {
|
didReceiveAttrs() {
|
||||||
this._super(...arguments);
|
this._super(...arguments);
|
||||||
|
|
||||||
this.set('showLikes', this.get('folder.allowLikes') && this.get('document.isLive'));
|
this.set('showLikes', this.get('folder.allowLikes') && this.get('document.isLive'));
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -44,6 +45,10 @@ export default Component.extend(Notifier, {
|
||||||
this._super(...arguments);
|
this._super(...arguments);
|
||||||
|
|
||||||
this.jumpToSection(this.get('currentPageId'));
|
this.jumpToSection(this.get('currentPageId'));
|
||||||
|
},
|
||||||
|
|
||||||
|
didRender() {
|
||||||
|
this._super(...arguments);
|
||||||
|
|
||||||
this.contentLinkHandler();
|
this.contentLinkHandler();
|
||||||
},
|
},
|
||||||
|
|
|
@ -60,6 +60,7 @@ export default Component.extend(ModalMixin, {
|
||||||
|
|
||||||
willDestroyElement() {
|
willDestroyElement() {
|
||||||
this._super(...arguments);
|
this._super(...arguments);
|
||||||
|
this.set('showLinkModal', false);
|
||||||
|
|
||||||
let mousetrap = this.get('mousetrap');
|
let mousetrap = this.get('mousetrap');
|
||||||
if (is.not.null(mousetrap)) {
|
if (is.not.null(mousetrap)) {
|
||||||
|
|
|
@ -46,7 +46,7 @@
|
||||||
<div class="content-linker-modal-container">
|
<div class="content-linker-modal-container">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label>Search</label>
|
<label>Search</label>
|
||||||
{{focus-input id="content-linker-search" type="input" class="form-control" value=keywords placeholder="keyword search" autocomplete="off"}}
|
{{focus-input id="content-linker-search" type="input" class="form-control" value=keywords placeholder="keyword search" autocomplete="off" key-up=(action "onSearch")}}
|
||||||
<small class="form-text text-muted">Document name, content, attachment name</small>
|
<small class="form-text text-muted">Document name, content, attachment name</small>
|
||||||
</div>
|
</div>
|
||||||
{{#unless hasMatches}}
|
{{#unless hasMatches}}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue