sort-order icon

Author: saintmatthieu

src/appshell/qml/MuseScore/AppShell/DevTools/Gallery/GeneralComponentsGallery.qml

@@ -1108,31 +1108,31 @@ Rectangle {
             valueTitle: "Age"
 
             model: ListModel {
-                ListElement {
+                 ListElement {
                     name: "Alex"
                     age: 12
                     valueType: "Int"
                     min: 1
                     max: 15
                 }
                 ListElement {
-                    name: "Tony"
-                    age: 15
+                    name: "Anna"
+                    age: 11
                     valueType: "Int"
                 }
                 ListElement {
-                    name: "Fred"
-                    age: 10
+                    name: "Emma"
+                    age: 5
                     valueType: "Int"
                 }
                 ListElement {
-                    name: "Emma"
-                    age: 5
+                    name: "Fred"
+                    age: 10
                     valueType: "Int"
                 }
                 ListElement {
-                    name: "Anna"
-                    age: 11
+                    name: "Tony"
+                    age: 15
                     valueType: "Int"
                 }
             }
@@ -1170,6 +1170,10 @@ Rectangle {
                 return null
             }
 
+            sortOrderProvider: function(column) {
+                return tableProxy.columnSortOrder(column)
+            }
+
             onHorizontalHeaderClicked: function (column) {
                 tableProxy.toggleColumnSort(column)
             }

src/framework/uicomponents/qml/Muse/UiComponents/StyledTableView.qml

@@ -34,6 +34,8 @@ Item {
     property alias model: tableView.model
     property var sourceComponentCallback
 
+    property var sortOrderProvider: null
+
     property bool showVerticalHeader: false
     property bool horizontalHeaderNavigationEnabled: true
     property bool displayTruncatedTextOnHover: false
@@ -83,11 +85,18 @@ Item {
     QtObject {
         id: prv
 
+        property int sortRevision: 0
         property real valueItemWidth: 126
         property real spacing: 4
         property real sideMargin: 30
     }
 
+    Connections {
+        target: root.model
+        ignoreUnknownSignals: true
+        function onSortChanged() { prv.sortRevision++ }
+    }
+
     Rectangle {
         id: background
         anchors.fill: parent
@@ -120,6 +129,8 @@ Item {
 
             headerCapitalization: root.headerCapitalization
 
+            sortOrder: root.sortOrderProvider ? (prv.sortRevision, root.sortOrderProvider(index)) : ColumnSortOrder.Unsorted
+
             navigation.panel: root.navigationPanel
             navigation.row: 0
             navigation.column: index * 100 // * 100 - some extra space for cell controls

src/framework/uicomponents/qml/Muse/UiComponents/internal/StyledTableViewColumn.qml

@@ -38,6 +38,8 @@ Item {
 
     property int headerCapitalization: Font.AllUppercase
 
+    property int sortOrder: ColumnSortOrder.Unsorted
+
     property NavigationControl navigation: NavigationControl {
         name: root.objectName !== "" ? root.objectName : "TableViewColumn"
         enabled: root.enabled && root.visible
@@ -96,6 +98,16 @@ Item {
             opacity: ui.theme.buttonOpacityNormal
         }
 
+        StyledIconLabel {
+            id: sorterIcon
+            Layout.alignment: Qt.AlignVCenter
+
+            visible: root.sortOrder !== ColumnSortOrder.Unsorted
+            iconCode: root.sortOrder === ColumnSortOrder.Ascending ? IconCode.SMALL_ARROW_DOWN : IconCode.SMALL_ARROW_UP
+
+            opacity: ui.theme.buttonOpacityNormal
+        }
+
         MenuButton {
             Layout.alignment: Qt.AlignVCenter
             Layout.preferredWidth: 16
@@ -141,6 +153,11 @@ Item {
                 target: titleLabel
                 opacity: ui.theme.buttonOpacityHover
             }
+
+            PropertyChanges {
+                target: sorterIcon
+                opacity: ui.theme.buttonOpacityHover
+            }
         }
     ]
 }

src/framework/uicomponents/qml/Muse/UiComponents/tablesortfilterproxymodel.cpp

@@ -118,18 +118,29 @@ int TableSortFilterProxyModel::mapRowToSource(int proxyRow) const
     return idx.isValid() ? idx.row() : -1;
 }
 
+ColumnSortOrder::Type TableSortFilterProxyModel::columnSortOrder(int column) const
+{
+    const auto it = std::find_if(m_sortPipeline.begin(), m_sortPipeline.end(),
+                                 [column](const SortKey& k) { return k.column == column; });
+    if (it != m_sortPipeline.end() - 1) {
+        return ColumnSortOrder::Type::Unsorted;
+    }
+    return it->ascending ? ColumnSortOrder::Type::Ascending : ColumnSortOrder::Type::Descending;
+}
+
 void TableSortFilterProxyModel::reapplySort()
 {
     if (!sourceModel()) {
         return;
     }
     if (m_sortPipeline.empty()) {
         sort(-1);
-        return;
+    } else {
+        invalidate();
+        //! Note: trigger a sort - what column and order we specify doesn't matter. The ordering is determined by the sort pipeline in `lessThan()`
+        sort(0, Qt::AscendingOrder);
     }
-    invalidate();
-    //! Note: trigger a sort - what column and order we specify doesn't matter. The ordering is determined by the sort pipeline in `lessThan()`
-    sort(0, Qt::AscendingOrder);
+    emit sortChanged();
 }
 
 bool TableSortFilterProxyModel::filterAcceptsRow(int sourceRow, const QModelIndex& sourceParent) const

src/framework/uicomponents/qml/Muse/UiComponents/tablesortfilterproxymodel.h

@@ -29,6 +29,19 @@
 #include <vector>
 
 namespace muse::uicomponents {
+namespace ColumnSortOrder {
+Q_NAMESPACE;
+QML_ELEMENT;
+
+enum class Type {
+    Unsorted = -1,
+    Ascending = 0,
+    Descending = 1
+};
+
+Q_ENUM_NS(Type)
+}
+
 /**
  * @brief Table-aware sort/filter proxy.
  *
@@ -56,9 +69,11 @@ class TableSortFilterProxyModel : public QSortFilterProxyModel
     Q_INVOKABLE void clearSort();
     Q_INVOKABLE void invalidateFilters();
     Q_INVOKABLE int mapRowToSource(int proxyRow) const;
+    Q_INVOKABLE ColumnSortOrder::Type columnSortOrder(int column) const;
 
 signals:
     void rowCountChanged();
+    void sortChanged();
 
 protected:
     bool filterAcceptsRow(int sourceRow, const QModelIndex& sourceParent) const override;