Fix issue where a new row would not appear last after deleting multiple rows from the raw tag editor (close #7087)

This commit is contained in:
Quincy Morgan
2019-12-05 13:22:43 -05:00
parent db300d1071
commit 88ff303a49
+26 -18
View File
@@ -20,7 +20,8 @@ export function uiRawTagEditor(context) {
var _tagView = (context.storage('raw-tag-editor-view') || 'list'); // 'list, 'text'
var _readOnlyTags = [];
var _indexedKeys = [];
// the keys in the order we want them to display
var _orderedKeys = [];
var _showBlank = false;
var _updatePreference = true;
var _expanded = false;
@@ -58,27 +59,31 @@ export function uiRawTagEditor(context) {
function content(wrap) {
// remove deleted keys
_orderedKeys = _orderedKeys.filter(function(key) {
return _tags[key] !== undefined;
});
// When switching to a different entity or changing the state (hover/select)
// reorder the keys alphabetically.
// We trigger this by emptying the `_indexedKeys` array, then it will be rebuilt here.
// We trigger this by emptying the `_orderedKeys` array, then it will be rebuilt here.
// Otherwise leave their order alone - #5857, #5927
var all = Object.keys(_tags).sort();
var known = _indexedKeys.map(function(t) { return t.key; });
var missing = utilArrayDifference(all, known);
for (var i = 0; i < missing.length; i++) {
_indexedKeys.push({ index: _indexedKeys.length, key: missing[i] });
var missingKeys = utilArrayDifference(all, _orderedKeys);
for (var i in missingKeys) {
_orderedKeys.push(missingKeys[i]);
}
// assemble row data, excluding any deleted tags
var rowData = _indexedKeys.map(function(row) {
var v = _tags[row.key];
return (v === undefined) ? null : Object.assign(row, { value: v });
}).filter(Boolean);
// assemble row data
var rowData = _orderedKeys.map(function(key, i) {
return { index: i, key: key, value: _tags[key] };
});
// append blank row last, if necessary
if (!_indexedKeys.length || _showBlank) {
if (!rowData.length || _showBlank) {
_showBlank = false;
rowData.push({ index: _indexedKeys.length, key: '', value: '' });
rowData.push({ index: rowData.length, key: '', value: '' });
}
@@ -471,6 +476,10 @@ export function uiRawTagEditor(context) {
_pendingChange[kNew] = vNew;
// update the ordered key index so this row doesn't change position
var existingKeyIndex = _orderedKeys.indexOf(kOld);
if (existingKeyIndex !== -1) _orderedKeys[existingKeyIndex] = kNew;
d.key = kNew; // update datum to avoid exit/enter on tag update
d.value = vNew;
@@ -501,9 +510,8 @@ export function uiRawTagEditor(context) {
content(wrap);
} else {
// remove from indexedKeys too, so that if the user puts it back,
// it will be sorted to the end and not back to its original position
_indexedKeys = _indexedKeys.filter(function(row) { return row.key !== d.key; });
// remove the key from the ordered key index
_orderedKeys = _orderedKeys.filter(function(key) { return key !== d.key; });
_pendingChange = _pendingChange || {};
_pendingChange[d.key] = undefined;
@@ -537,7 +545,7 @@ export function uiRawTagEditor(context) {
rawTagEditor.state = function(val) {
if (!arguments.length) return _state;
if (_state !== val) {
_indexedKeys = [];
_orderedKeys = [];
_state = val;
}
return rawTagEditor;
@@ -568,7 +576,7 @@ export function uiRawTagEditor(context) {
rawTagEditor.entityID = function(val) {
if (!arguments.length) return _entityID;
if (_entityID !== val) {
_indexedKeys = [];
_orderedKeys = [];
_entityID = val;
}
return rawTagEditor;