Adding filter banner component and filtering activated message

app/filtercontroller.cpp

@@ -867,4 +867,4 @@ QStringList FilterController::lookupValueRelationTexts( const QVariantMap &confi
   }
 
   return texts;
-}
+}

app/qml/CMakeLists.txt

@@ -62,6 +62,7 @@ set(MM_QML
     filters/MMFilterChip.qml
     filters/MMFilterLayerSection.qml
     filters/MMFiltersPanel.qml
+    filters/components/MMFilterBanner.qml
     dialogs/MMCloseAccountDialog.qml
     dialogs/MMDownloadProjectDialog.qml
     dialogs/MMMigrateToMerginDialog.qml

app/qml/components/MMButton.qml

@@ -15,7 +15,7 @@ Button {
   id: root
 
   enum Types { Primary, Secondary, Tertiary }
-  enum Sizes { Small, Regular }
+  enum Sizes { Small, Regular, ExtraSmall }
 
   property int type: MMButton.Types.Primary
   property int size: MMButton.Sizes.Regular
@@ -162,11 +162,20 @@ Button {
 
   state: "default"
 
-  implicitHeight: root.type === MMButton.Types.Tertiary ? buttonContent.height : buttonContent.height + topPadding + bottomPadding
-  implicitWidth: row.paintedChildrenWidth + 2 * ( root.size === MMButton.Sizes.Small ? __style.margin16 : __style.margin20 )
+  implicitHeight: buttonContent.height + topPadding + bottomPadding
+
+  implicitWidth: {
+    let margin = __style.margin20
+    if ( root.size === MMButton.Sizes.ExtraSmall ) margin = __style.margin8
+    else if ( root.size === MMButton.Sizes.Small ) margin = __style.margin16
+    return row.paintedChildrenWidth + 2 * margin
+  }
 
   topPadding: {
-    if ( root.type === MMButton.Types.Tertiary ) {
+    if ( root.size === MMButton.Sizes.ExtraSmall ) {
+      return __style.margin2;
+    }
+    else if ( root.type === MMButton.Types.Tertiary ) {
       return 0;
     }
     else if ( root.size === MMButton.Sizes.Small ) {
@@ -178,7 +187,10 @@ Button {
   }
 
   bottomPadding: {
-    if ( root.type === MMButton.Types.Tertiary ) {
+    if ( root.size === MMButton.Sizes.ExtraSmall ) {
+      return __style.margin2;
+    }
+    else if ( root.type === MMButton.Types.Tertiary ) {
       return 0;
     }
     else if ( root.size === MMButton.Sizes.Small ) {
@@ -200,7 +212,12 @@ Button {
       id: row
 
       property real paintedChildrenWidth: buttonIconLeft.paintedWidth + buttonContent.implicitWidth + buttonIconRight.paintedWidth + spacing
-      property real maxWidth: parent.width - 2 * ( root.size === MMButton.Sizes.Small ? __style.margin16 : __style.margin20 )
+      property real maxWidth: {
+        let margin = __style.margin20 
+        if ( root.size === MMButton.Sizes.ExtraSmall ) margin = __style.margin8
+        else if ( root.size === MMButton.Sizes.Small ) margin = __style.margin16
+        return parent.width - 2 * margin
+      }
 
       x: ( parent.width - width ) / 2
 
@@ -232,7 +249,7 @@ Button {
 
         width: parent.width - buttonIconLeft.paintedWidth - buttonIconRight.paintedWidth
 
-        font: __style.t3
+        font: root.size === MMButton.Sizes.ExtraSmall ? __style.t5 : __style.t3
         text: root.text
       }
 
@@ -266,7 +283,7 @@ Button {
   background: Rectangle {
     id: buttonBackground
 
-    radius: __style.radius30
+    radius: root.size === MMButton.Sizes.ExtraSmall ? __style.radius40 : __style.radius30
 
     border.width: 2 * __dp
   }

app/qml/components/private/MMBaseInput.qml

@@ -32,6 +32,7 @@ Item {
 
   property string errorMsg: ""
   property string warningMsg: ""
+  property string infoMsg: ""
 
   property alias inputContent: contentGroup.children
 
@@ -65,7 +66,7 @@ Item {
     states: [
       State {
         name: "valid"
-        when: !shouldShowValidation || ( !warningMsg && !errorMsg )
+        when: !shouldShowValidation || ( !warningMsg && !errorMsg && !infoMsg )
       },
       State {
         name: "error"
@@ -74,6 +75,10 @@ Item {
       State {
         name: "warning"
         when: warningMsg && !errorMsg
+      },
+      State {
+        name: "information"
+        when: infoMsg
       }
     ]
 
@@ -179,11 +184,15 @@ Item {
         width: parent.width
 
         MMComponents.MMIcon {
-          source: __style.errorCircleIcon
+          source: {
+            if ( root.validationState === "information" ) return __style.infoFilledIcon
+            return __style.errorCircleIcon
+          }
           size: __style.icon16
           color: {
             if ( root.validationState === "error" ) return __style.negativeColor
             if ( root.validationState === "warning" ) return __style.warningColor
+            if ( root.validationState === "information" ) return __style.informativeColor
             return __style.forestColor
           }
         }
@@ -194,11 +203,13 @@ Item {
           text: {
             if ( root.validationState === "error" ) return root.errorMsg
             if ( root.validationState === "warning" ) return root.warningMsg
+            if ( root.validationState === "information" ) return root.infoMsg
             return ""
           }
           color: {
             if ( root.validationState === "error" ) return __style.grapeColor
             if ( root.validationState === "warning" ) return __style.earthColor
+            if ( root.validationState === "information" ) return __style.deepOceanColor
             return __style.forestColor
           }
 

app/qml/filters/components/MMFilterBanner.qml

@@ -0,0 +1,66 @@
+/***************************************************************************
+ *                                                                         *
+ *   This program is free software; you can redistribute it and/or modify  *
+ *   it under the terms of the GNU General Public License as published by  *
+ *   the Free Software Foundation; either version 2 of the License, or     *
+ *   (at your option) any later version.                                   *
+ *                                                                         *
+ ***************************************************************************/
+
+import QtQuick
+import QtQuick.Layouts
+
+import "../../components" as MMComponents
+
+Rectangle {
+  id: root
+
+  property string text
+  property string actionText: ""
+
+  signal actionClicked()
+
+  color: __style.informativeColor
+  radius: __style.radius8
+  implicitHeight: row.implicitHeight + 2 * __style.margin8
+
+  RowLayout {
+    id: row
+
+    anchors {
+      left: parent.left
+      right: parent.right
+      leftMargin: __style.margin12
+      rightMargin: __style.margin8
+      verticalCenter: parent.verticalCenter
+    }
+
+    spacing: __style.spacing8
+
+    MMComponents.MMText {
+      Layout.fillWidth: true
+      Layout.alignment: Qt.AlignVCenter
+
+      text: root.text
+      font: __style.t4
+      color: __style.deepOceanColor
+      wrapMode: Text.Wrap
+      elide: Text.ElideNone
+    }
+
+    MMComponents.MMButton {
+      id: actionButton
+
+      visible: root.actionText !== ""
+      Layout.alignment: Qt.AlignVCenter
+
+      type: MMComponents.MMButton.Types.Tertiary
+      size: MMComponents.MMButton.Sizes.ExtraSmall
+      text: root.actionText
+      fontColor: __style.skyColor
+      bgndColor: __style.deepOceanColor
+
+      onClicked: root.actionClicked()
+    }
+  }
+}

app/qml/form/components/MMFeaturesListPageDrawer.qml

@@ -9,9 +9,11 @@
 
 import QtQuick
 import QtQuick.Controls
+import QtQuick.Layouts
 
 import "../../inputs" as MMInputs
 import "../../components" as MMComponents
+import "../../filters/components" as MMFilters
 
 //
 // Special type of drawer/page -> looks like page, but it is actually Drawer
@@ -51,35 +53,49 @@ Drawer {
       width: parent.width
       height: parent.height
 
-      Column {
+      ColumnLayout {
         id: contentColumn
 
         width: parent.width
         height: parent.height
 
         spacing: 0
 
-        MMComponents.MMListSpacer { height: __style.spacing20 }
+        MMComponents.MMListSpacer { Layout.preferredHeight: __style.spacing20 }
 
         MMInputs.MMSearchInput {
           id: searchBar
 
           delayedSearch: true
 
-          width: parent.width
+          Layout.fillWidth: true
 
           placeholderText: qsTr("Search for features...")
 
           onSearchTextChanged: root.searchTextChanged( searchBar.searchText )
         }
 
-        MMComponents.MMListSpacer { height: __style.spacing20 }
+        MMComponents.MMListSpacer { Layout.preferredHeight: __style.spacing20 }
+
+        MMFilters.MMFilterBanner {
+          id: filterBanner
+
+          visible: __activeProject.filterController.hasActiveFilters
+
+          Layout.fillWidth: true
+          text: qsTr( "Some features may be hidden by active filters" )
+        }
+
+        MMComponents.MMListSpacer {
+          visible: filterBanner.visible
+          Layout.preferredHeight: __style.spacing20
+        }
 
         MMComponents.MMListView {
           id: listView
 
-          width: parent.width
-          height: parent.height - 2 * __style.spacing20 - searchBar.height
+          Layout.fillWidth: true
+          Layout.fillHeight: true
 
           clip: true
 

app/qml/form/editors/MMFormGalleryEditor.qml

@@ -30,6 +30,10 @@ MMPrivateComponents.MMBaseInput {
 
   title: _fieldShouldShowTitle ? _fieldTitle : ""
 
+  infoMsg: root._fieldAssociatedRelation && __activeProject.filterController.hasActiveFilters
+           ? qsTr( "Some features may be hidden by active filters" )
+           : ""
+
   inputContent: MMComponents.MMListView {
     id: rowView
 

app/qml/form/editors/MMFormRelationEditor.qml

@@ -42,6 +42,10 @@ MMPrivateComponents.MMBaseInput {
 
   title: _fieldShouldShowTitle ? _fieldTitle : ""
 
+  infoMsg: root._fieldAssociatedRelation && __activeProject.filterController.hasActiveFilters
+           ? qsTr( "Some features may be hidden by active filters" )
+           : ""
+
   inputContent: Rectangle {
     width: parent.width
     height: privates.itemHeight * privates.rows + 2 * flow.spacing + 2 * __style.margin12