From 977a12c989895072e8ca1ceed812000c8c2d1962 Mon Sep 17 00:00:00 2001
From: Remco Burema <r.burema@ultimaker.com>
Date: Fri, 12 Nov 2021 09:52:24 +0100
Subject: [PATCH] Steal search-bar from DigitalFactory.

Make 'SearchBar' into a reusable component, so it can be used in the (new) Marketplace search. Also now at least the word 'Search' can be translated ;-)

part of CURA-8559
---
 .../resources/qml/SelectProjectPage.qml       | 26 ++------------
 resources/qml/SearchBar.qml                   | 36 +++++++++++++++++++
 2 files changed, 38 insertions(+), 24 deletions(-)
 create mode 100644 resources/qml/SearchBar.qml

diff --git a/plugins/DigitalLibrary/resources/qml/SelectProjectPage.qml b/plugins/DigitalLibrary/resources/qml/SelectProjectPage.qml
index 50d3cb61c5..1114900c04 100644
--- a/plugins/DigitalLibrary/resources/qml/SelectProjectPage.qml
+++ b/plugins/DigitalLibrary/resources/qml/SelectProjectPage.qml
@@ -9,7 +9,7 @@ import QtQuick.Controls.Styles 1.4
 import QtQuick.Layouts 1.1
 
 import UM 1.2 as UM
-import Cura 1.6 as Cura
+import Cura 1.7 as Cura
 
 import DigitalFactory 1.0 as DF
 
@@ -44,32 +44,10 @@ Item
         height: childrenRect.height
         spacing: UM.Theme.getSize("default_margin").width
 
-        Cura.TextField
+        Cura.SearchBar
         {
             id: searchBar
-            Layout.fillWidth: true
-            implicitHeight: createNewProjectButton.height
-            leftPadding: searchIcon.width + UM.Theme.getSize("default_margin").width * 2
-
             onTextEdited: manager.projectFilter = text //Update the search filter when editing this text field.
-
-            placeholderText: "Search"
-
-            UM.RecolorImage
-            {
-                id: searchIcon
-
-                anchors
-                {
-                    verticalCenter: parent.verticalCenter
-                    left: parent.left
-                    leftMargin: UM.Theme.getSize("default_margin").width
-                }
-                source: UM.Theme.getIcon("search")
-                height: UM.Theme.getSize("small_button_icon").height
-                width: height
-                color: UM.Theme.getColor("text")
-            }
         }
 
         Cura.SecondaryButton
diff --git a/resources/qml/SearchBar.qml b/resources/qml/SearchBar.qml
new file mode 100644
index 0000000000..de723d1c84
--- /dev/null
+++ b/resources/qml/SearchBar.qml
@@ -0,0 +1,36 @@
+// Copyright (C) 2021 Ultimaker B.V.
+// Cura is released under the terms of the LGPLv3 or higher.
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.1
+
+import UM 1.6 as UM
+import Cura 1.7 as Cura
+
+Cura.TextField
+{
+    UM.I18nCatalog { id: catalog; name: "cura" }
+
+    Layout.fillWidth: true
+    implicitHeight: createNewProjectButton.height
+    leftPadding: searchIcon.width + UM.Theme.getSize("default_margin").width * 2
+
+    placeholderText: catalog.i18nc("@placeholder", "Search")
+
+    UM.RecolorImage
+    {
+        id: searchIcon
+
+        anchors
+        {
+            verticalCenter: parent.verticalCenter
+            left: parent.left
+            leftMargin: UM.Theme.getSize("default_margin").width
+        }
+        source: UM.Theme.getIcon("search")
+        height: UM.Theme.getSize("small_button_icon").height
+        width: height
+        color: UM.Theme.getColor("text")
+    }
+}