Refactor and remove some (hopefully) redundant code from PaletteTree.qml

Author: mathesoncalum

src/palette/qml/MuseScore/Palette/internal/PaletteTree.qml

@@ -79,7 +79,6 @@ StyledListView {
     onFilterChanged: {
         if (Boolean(filter)) {
             paletteSelectionModel.clear()
-            expandedPopupIndex = null
         }
 
         if (paletteProvider) {
@@ -123,25 +122,13 @@ StyledListView {
         paletteController.applyPaletteElement(index, Qt.NoModifier);
     }
 
-    property var expandedPopupIndex: null // TODO: or use selection model? That would allow to preserve popups on removing palettes
-
-    onExpandedPopupIndexChanged: {
-        if (footerItem) {
-            footerItem.height = 0
-        }
-    }
-
     onCurrentIndexChanged: {
         if (paletteSelectionModel.hasSelection && paletteSelectionModel.currentIndex.row !== currentIndex) {
             paletteSelectionModel.clearSelection();
         }
     }
 
     function ensureYVisible(y) {
-        if (y > footerItem.y) {
-            footerItem.height = y - footerItem.y
-        }
-
         if (y > contentY + height) {
             contentY = y - height;
         } else if (y < contentY) {
@@ -271,43 +258,34 @@ StyledListView {
     }
 
     Loader {
-        id: palettePopup
+        id: morePopup
         active: false
 
         property var control: null
-        property var model: null
-        property alias isOpened: palettePopup.active
+        property var popupModel: null
 
         sourceComponent: MoreElementsPopup {
-            id: moreElementsPopup
-
-            property var control: palettePopup.control
-            property var model: palettePopup.model
-
             maxHeight: Math.min(0.75 * paletteTree.height, 500)
 
             // TODO: change settings to "hidden" model?
-            cellSize: control.cellSize
-            drawGrid: control.drawGrid
+            cellSize: morePopup.control.cellSize ?? 0
+            drawGrid: morePopup.control.drawGrid ?? false
 
-            paletteName: model.display
-            paletteIsCustom: model.custom
-            paletteEditingEnabled: model.editable
+            paletteName: morePopup.popupModel.display ?? ""
+            paletteIsCustom: morePopup.popupModel.custom ?? false
+            paletteEditingEnabled: morePopup.popupModel.editable ?? true
 
             onIsOpenedChanged: {
                 // build pool model on first popup appearance
                 if (visible && !poolPalette) {
-                    poolPalette = paletteTree.paletteProvider.poolPaletteModel(control.modelIndex);
-                    poolPaletteRootIndex = paletteTree.paletteProvider.poolPaletteIndex(control.modelIndex, poolPalette);
-                    poolPaletteController = paletteTree.paletteProvider.poolPaletteController(poolPalette, control.modelIndex);
+                    poolPalette = paletteTree.paletteProvider.poolPaletteModel(morePopup.control.modelIndex);
+                    poolPaletteRootIndex = paletteTree.paletteProvider.poolPaletteIndex(morePopup.control.modelIndex, poolPalette);
+                    poolPaletteController = paletteTree.paletteProvider.poolPaletteController(poolPalette, morePopup.control.modelIndex);
 
                     customPalette = paletteTree.paletteProvider.customElementsPaletteModel
-                    customPaletteRootIndex = paletteTree.paletteProvider.customElementsPaletteIndex(control.modelIndex) // TODO: make a property binding? (but that works incorrectly)
+                    customPaletteRootIndex = paletteTree.paletteProvider.customElementsPaletteIndex(morePopup.control.modelIndex) // TODO: make a property binding? (but that works incorrectly)
                     customPaletteController = paletteTree.paletteProvider.customElementsPaletteController
                 }
-                if (!isOpened) {
-                    paletteTree.expandedPopupIndex = null
-                }
             }
 
             property bool needScrollToBottom: false
@@ -320,7 +298,7 @@ StyledListView {
 
             onClosed: {
                 enablePaletteAnimations = false;
-                palettePopup.active = false;
+                morePopup.active = false;
             }
 
             function scrollToPopupBottom() {
@@ -349,25 +327,25 @@ StyledListView {
         }
 
         function close() {
-            if (palettePopup.active) {
-                palettePopup.item.close();
+            if (morePopup.active) {
+                morePopup.item.close()
             }
         }
 
         function toggleOpened(model, control, parent) {
-            if (palettePopup.active) {
-                palettePopup.close();
-                return;
+            if (morePopup.active) {
+                morePopup.close()
+                return
             }
 
-            palettePopup.parent = parent;
-            palettePopup.model = model;
-            palettePopup.control = control;
+            morePopup.parent = parent
+            morePopup.popupModel = model
+            morePopup.control = control
 
-            palettePopup.active = true;
-            palettePopup.item.setParentItem(parent);
+            morePopup.active = true
+            morePopup.item.setParentItem(parent)
 
-            palettePopup.item.toggleOpened();
+            morePopup.item.toggleOpened()
         }
     }
 
@@ -407,8 +385,8 @@ StyledListView {
             }
 
             Component.onDestruction: {
-                if (palettePopup.active && palettePopup.model === model) {
-                    palettePopup.close()
+                if (morePopup.active && morePopup.popupModel === model) {
+                    morePopup.close()
                 }
             }
 
@@ -494,22 +472,15 @@ StyledListView {
 
             highlighted: (activeFocus && !selected) || DelegateModel.isUnresolved
 
-            property bool popupExpanded: palettePopup.isOpened
+            property bool popupExpanded: morePopup.active
             onPopupExpandedChanged: {
                 paletteTree.interactive = !popupExpanded
             }
 
-            function togglePopup(btn) {
-                const expand = !popupExpanded;
-                paletteTree.expandedPopupIndex = expand ? modelIndex : null;
-                palettePopup.toggleOpened(model, control, btn)
-            }
-
             property size cellSize: model.gridSize
             property bool drawGrid: model.drawGrid
 
             function hidePalette() {
-                paletteTree.expandedPopupIndex = null;
                 paletteTree.paletteController.remove(modelIndex);
             }
 
@@ -527,7 +498,8 @@ StyledListView {
 
             Drag.onDragStarted: {
                 if (popupExpanded) {
-                    togglePopup();
+                    // Close the popup
+                    morePopup.toggleOpened(null, null, null)
                 }
 
                 paletteHeader.closeContextMenu()
@@ -712,22 +684,21 @@ StyledListView {
                         }
 
                         showMoreButton: !paletteTree.searchOpened
-                        onMoreButtonClicked: function(btn) { control.togglePopup(btn) }
+                        onMoreButtonClicked: function(btn) {
+                            morePopup.toggleOpened(model, control, btn)
+                        }
 
                         onVisibleChanged: {
                             if (!visible && control.popupExpanded) {
-                                control.togglePopup();
+                                // Close the popup
+                                morePopup.toggleOpened(null, null, null)
                             }
                         }
 
                         enableAnimations: paletteTree.enableAnimations
-                        externalDropBlocked: paletteTree.expandedPopupIndex && !control.popupExpanded // FIXME: find another way to prevent drops go under a popup
                     }
                 }
             }
         }
     }
-
-    // placeholder footer item to reserve a space for "More" popup to expand
-    footer: Item { height: 0 }
 }