QmlDesigner: Add "Unsaved Changes" indicator to Save button

Task-number: QDS-12237
Change-Id: Ib210ca06e061e82824ff4398604a569af44c2f6d
Reviewed-by: Ali Kianian <ali.kianian@qt.io>
Reviewed-by: Mahmoud Badri <mahmoud.badri@qt.io>
Reviewed-by: Qt CI Patch Build Bot <ci_patchbuild_bot@qt.io>

share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionDetailsToolbar.qml

@@ -17,6 +17,7 @@ Rectangle {
     required property var model
     required property var backend
     property int selectedRow: -1
+    property bool hasUnsavedChanges: false
 
     implicitHeight: StudioTheme.Values.toolbarHeight
     color: StudioTheme.Values.themeToolbarBackground
@@ -34,6 +35,14 @@ Rectangle {
         fileDialog.reject()
     }
 
+    Connections {
+        target: root.model
+
+        function onDataChanged() {
+            hasUnsavedChanges = true
+        }
+    }
+
     RowLayout {
         id: container
 
@@ -122,8 +131,18 @@ Rectangle {
 
                 buttonIcon: StudioTheme.Constants.save_medium
                 tooltip: qsTr("Save changes")
-                enabled: root.model.collectionName !== ""
-                onClicked: root.model.saveDataStoreCollections()
+                enabled: root.model.collectionName !== "" && root.hasUnsavedChanges
+                onClicked: hasUnsavedChanges = !root.model.saveDataStoreCollections()
+
+                Rectangle {
+                    width: StudioTheme.Values.smallStatusIndicatorDiameter
+                    height: StudioTheme.Values.smallStatusIndicatorDiameter
+                    radius: StudioTheme.Values.smallStatusIndicatorDiameter / 2
+                    anchors.right: parent.right
+                    anchors.top: parent.top
+                    visible: hasUnsavedChanges
+                    color: StudioTheme.Values.themeIconColorSelected
+                 }
             }
 
             IconButton {

share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml

@@ -251,6 +251,7 @@ QtObject {
     property real collectionTableVerticalMargin: 10
     property real collectionCellMinimumWidth: 60
     property real collectionCellMinimumHeight: 20
+    property real smallStatusIndicatorDiameter: 6
 
     // NEW NEW NEW
     readonly property int flowMargin: 7