Reuse password form for password confirmation

4 files changed, 13 insertions, 130 deletions

diff --git a/pages/ConfirmPassword.qml b/pages/ConfirmPassword.qml
index 78e57f1..4b6d587 100644
--- a/pages/ConfirmPassword.qml
+++ b/pages/ConfirmPassword.qml
@@ -2,7 +2,7 @@ import QtQuick 2.12
 import id.co.darapsa.kelakon.user 0.1
 import id.co.darapsa.kelakon.rtclient 0.1
 
-ConfirmPasswordForm {
+PasswordForm {
 	width: stackView.width
 	height: stackView.height
 
@@ -12,9 +12,13 @@ ConfirmPasswordForm {
 		}
 	}
 
+	userEmail.y: 292
+	instructionLabel.text: qsTr("Re-Enter password")
 	emailAddressLabel.text: User.emailAddress
+	passTextField.placeholderText: qsTr("Re-enter Password")
 
-	confirmPassButton {
+	createPassButton {
+		text: qsTr("Confirm password")
 		onClicked: {
 			RTClient.logIn(User.emailAddress, User.password)
 			stackView.push("qrc:/pages/CreateProfile.qml")
diff --git a/pages/ConfirmPasswordForm.ui.qml b/pages/ConfirmPasswordForm.ui.qml
deleted file mode 100644
index d867587..0000000
--- a/pages/ConfirmPasswordForm.ui.qml
+++ /dev/null
@@ -1,127 +0,0 @@
-import QtQuick 2.12
-import QtQuick.Layouts 1.12
-import QtQuick.Controls 2.12
-import QtQuick.Controls.Material 2.12
-
-Rectangle {
-    id: rectangle
-    color: "#fff"
-    border.width: 0
-
-    property alias backButton: backButton
-    property alias confirmPassTextField: confirmPassTextField
-    property alias confirmPassButton: confirmPassButton
-    property alias emailAddressLabel: emailAddressLabel
-
-    ToolBar {
-        id: toolbar
-        height: 56
-        font.family: "Google Sans"
-        anchors.top: parent.top
-        anchors.topMargin: 0
-        anchors.right: parent.right
-        anchors.rightMargin: 0
-        anchors.left: parent.left
-        anchors.leftMargin: 0
-        background: Rectangle {
-            color: "#FFF"
-        }
-
-        RowLayout {
-            anchors.fill: parent
-            spacing: 8
-
-            ToolButton {
-                id: backButton
-                icon.name: "back-icon"
-                icon.source: "/assets/arrow-back-24px.svg"
-                highlighted: true
-            }
-        }
-    }
-
-    Label {
-        x: 16
-        y: 232
-        color: "#2b2626"
-        text: qsTr("Re-Enter password")
-        anchors.bottom: userEmail.top
-        anchors.bottomMargin: 16
-        font.letterSpacing: 0.25
-        lineHeight: 1
-        font.weight: Font.Bold
-        wrapMode: Text.WordWrap
-        anchors.left: parent.left
-        anchors.leftMargin: 16
-        anchors.right: parent.right
-        anchors.rightMargin: 88
-
-        font.family: "Google Sans"
-        font.pointSize: 34
-    }
-
-    Rectangle {
-        id: userEmail
-        y: 292
-        height: 48
-        anchors.right: parent.right
-        anchors.rightMargin: 16
-        anchors.left: parent.left
-        anchors.leftMargin: 16
-        anchors.bottom: confirmPassTextField.top
-        anchors.bottomMargin: 16
-
-        Label {
-            id: emailAddressLabel
-            anchors.right: parent.right
-            anchors.rightMargin: 16
-            anchors.left: parent.left
-            anchors.leftMargin: 16
-            anchors.verticalCenter: parent.verticalCenter
-
-            text: qsTr("your@email.com")
-            font.family: "Google Sans"
-            font.pointSize: 16
-            color: "#99000000"
-        }
-    }
-
-    TextField {
-        id: confirmPassTextField
-        y: 501
-        font.pointSize: 16
-        anchors.bottom: confirmPassButton.top
-        anchors.bottomMargin: 16
-        font.family: "Google Sans"
-        Layout.fillWidth: true
-        placeholderText: qsTr("Re-enter Password")
-        anchors.right: parent.right
-        anchors.rightMargin: 16
-        anchors.left: parent.left
-        anchors.leftMargin: 16
-        Layout.maximumHeight: 56
-        echoMode: TextInput.Password
-    }
-
-    RoundButton {
-        id: confirmPassButton
-        x: 34
-        y: 278
-        text: qsTr("Confirm password")
-        font.family: "Google Sans"
-        font.capitalization: Font.MixedCase
-        anchors.right: parent.right
-        anchors.rightMargin: 8
-        anchors.bottom: parent.bottom
-        anchors.bottomMargin: 8
-        anchors.left: parent.left
-        anchors.leftMargin: 8
-        highlighted: true
-        Material.background: Material.primary
-    }
-}
-
-/*##^## Designer {
-    D{i:0;autoSize:true;height:480;width:640}
-}
- ##^##*/
diff --git a/pages/Password.qml b/pages/Password.qml
index 4a1ae59..fc45a5a 100644
--- a/pages/Password.qml
+++ b/pages/Password.qml
@@ -10,9 +10,12 @@ PasswordForm {
 		}
 	}
 
+	instructionLabel.text: qsTr("Create password")
 	emailAddressLabel.text: User.emailAddress
+	passTextField.placeholderText: qsTr("Password")
 
 	createPassButton {
+		text: qsTr("Next")
 		onClicked: {
 			User.password = passTextField.text
 			stackView.push("qrc:/pages/ConfirmPassword.qml")
diff --git a/pages/PasswordForm.ui.qml b/pages/PasswordForm.ui.qml
index 7b9ee46..95b88b3 100644
--- a/pages/PasswordForm.ui.qml
+++ b/pages/PasswordForm.ui.qml
@@ -1,5 +1,5 @@
 import QtQuick 2.12
-import QtQuick.Layouts 1.3
+import QtQuick.Layouts 1.12
 import QtQuick.Controls 2.12
 import QtQuick.Controls.Material 2.12
 
@@ -9,6 +9,8 @@ Rectangle {
     border.width: 0
 
     property alias backButton: backButton
+    property alias instructionLabel: instructionLabel
+    property alias userEmail: userEmail
     property alias passTextField: passTextField
     property alias createPassButton: createPassButton
     property alias emailAddressLabel: emailAddressLabel
@@ -41,6 +43,7 @@ Rectangle {
     }
 
     Label {
+        id: instructionLabel
         x: 16
         y: 232
         color: "#2b2626"