qml: introduce NetworkIndicator component

Signals to the user what network they are running under when not on the
main network.

Author: jarolrod

src/Makefile.qt.include

@@ -335,6 +335,7 @@ QML_RES_QML = \
   qml/components/ConnectionSettings.qml \
   qml/components/DeveloperOptions.qml \
   qml/components/PeersIndicator.qml \
+  qml/components/NetworkIndicator.qml \
   qml/components/StorageLocations.qml \
   qml/components/StorageOptions.qml \
   qml/components/StorageSettings.qml \

src/qml/bitcoin_qml.qrc

@@ -8,6 +8,7 @@
         <file>components/ConnectionSettings.qml</file>
         <file>components/PeersIndicator.qml</file>
         <file>components/DeveloperOptions.qml</file>
+        <file>components/NetworkIndicator.qml</file>
         <file>components/StorageLocations.qml</file>
         <file>components/StorageOptions.qml</file>
         <file>components/StorageSettings.qml</file>

src/qml/components/NetworkIndicator.qml

@@ -0,0 +1,69 @@
+// Copyright (c) 2023 The Bitcoin Core developers
+// Distributed under the MIT software license, see the accompanying
+// file COPYING or http://www.opensource.org/licenses/mit-license.php.
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import "../controls"
+import "../components"
+
+import org.bitcoincore.qt 1.0
+
+Button {
+    id: root
+    property color bgColor
+    property int textSize: 18
+    font.family: "Inter"
+    font.styleName: "Regular"
+    font.pixelSize: root.textSize
+    padding: 7
+    state: chainModel.currentNetworkName
+    contentItem: Text {
+        text: root.text
+        font: root.font
+        color: Theme.color.white
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+    }
+    background: Rectangle {
+        id: bg
+        color: root.bgColor
+        radius: 2
+    }
+    states: [
+        State {
+            name: "MAIN"
+            PropertyChanges {
+                target: root
+                visible: false
+            }
+        },
+        State {
+            name: "TEST"
+            PropertyChanges {
+                target: root
+                visible: true
+                text: qsTr("Test Network")
+                bgColor: Theme.color.green
+            }
+        },
+        State {
+            name: "SIGNET"
+            PropertyChanges {
+                target: root
+                visible: true
+                text: qsTr("Signet Network")
+                bgColor: Theme.color.amber
+            }
+        },
+        State {
+            name: "REGTEST"
+            PropertyChanges {
+                target: root
+                visible: true
+                text: qsTr("Regtest Mode")
+                bgColor: Theme.color.blue
+            }
+        }
+    ]
+}