feat(settings): introduce moodal to back up seed phrase

Closes #345

src/app/profile/core.nim

@@ -1,5 +1,6 @@
 import NimQml
 import json, eventemitter
+import strutils
 import ../../status/libstatus/mailservers as status_mailservers
 import ../../signals/types
 import "../../status/libstatus/types" as status_types
@@ -32,10 +33,13 @@ proc init*(self: ProfileController, account: Account) =
   # (rramos) TODO: I added this because I needed the public key
   # Ideally, this module should call getSettings once, and fill the 
   # profile with all the information comming from the settings.
-  let pubKey = status_settings.getSettings().parseJSON()["result"]["public-key"].getStr
+  let response = status_settings.getSettings()
+  let pubKey = parseJSON($response)["result"]["public-key"].getStr
+  let mnemonic = parseJSON($response)["result"]["mnemonic"].getStr
   profile.id = pubKey
 
   self.view.setNewProfile(profile)
+  self.view.setMnemonic(mnemonic)
 
   var mailservers = status_mailservers.getMailservers()
   for mailserver_config in mailservers:

src/app/profile/view.nim

@@ -1,4 +1,5 @@
 import NimQml
+import sequtils
 import views/mailservers_list
 import views/contact_list
 import views/profile_info
@@ -14,6 +15,7 @@ QtObject:
     profile*: ProfileInfoView
     mailserversList*: MailServersList
     contactList*: ContactList
+    mnemonic: string
     status*: Status
 
   proc setup(self: ProfileView) =
@@ -31,6 +33,7 @@ QtObject:
     result.profile = newProfileInfoView()
     result.mailserversList = newMailServersList()
     result.contactList = newContactList()
+    result.mnemonic = ""
     result.status = status
     result.setup
 
@@ -61,6 +64,20 @@ QtObject:
     write = setContactList
     notify = contactListChanged
 
+  proc mnemonicChanged*(self: ProfileView) {.signal.}
+
+  proc getMnemonic*(self: ProfileView): QVariant {.slot.} =
+    return newQVariant(self.mnemonic)
+
+  proc setMnemonic*(self: ProfileView, mnemonic: string) =
+    self.mnemonic = mnemonic
+    self.mnemonicChanged()
+
+  QtProperty[QVariant] mnemonic:
+    read = getMnemonic
+    write = setMnemonic
+    notify = mnemonicChanged
+
   proc getProfile(self: ProfileView): QVariant {.slot.} =
     return newQVariant(self.profile)
 

ui/app/AppLayouts/Profile/LeftTab/Menu.qml

@@ -78,8 +78,7 @@ Rectangle {
         TabButton {
             id: privacyTabButton
             width: profileInfoContainer.w
-            height: 0 //profileTabBar.btnheight
-            visible: false
+            height: profileTabBar.btnheight
             text: ""
             anchors.left: parent.left
             anchors.leftMargin: 0

ui/app/AppLayouts/Profile/Sections/BackupSeedModal.qml

@@ -0,0 +1,105 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
+import "../../../../imports"
+import "../../../../shared"
+
+ModalPopup {
+    id: popup
+
+    title: qsTr("Write down your seed phrase")
+
+    Item {
+
+      id: seed
+      anchors.left: parent.left
+      anchors.right: parent.right
+      width: parent.width
+      height: children[0].height
+
+      Rectangle {
+        id: wrapper
+        property int len: profileModel.mnemonic.split(" ").length
+        anchors.top: parent.top
+        anchors.topMargin: Theme.padding
+        height: 40*(len/2)
+        width: 350
+        border.width: 1
+        border.color: Theme.grey
+        radius: Theme.radius
+        anchors.horizontalCenter: parent.horizontalCenter
+
+        Repeater {
+          model: profileModel.mnemonic.split(" ")
+          Rectangle {
+            id: word
+            height: 40
+            width: 175
+            color: "transparent"
+            anchors.top: (index == 0 || index == (wrapper.len/2)) ? parent.top : parent.children[index-1].bottom
+            anchors.left: (index < (wrapper.len/2)) ? parent.left : undefined
+            anchors.right: (index >= wrapper.len/2) ? parent.right : undefined
+
+            Rectangle {
+              width: 1
+              height: parent.height
+              anchors.top: parent.top
+              anchors.bottom: parent.bottom
+              anchors.right: parent.right
+              anchors.rightMargin: 175
+              color: Theme.grey
+              visible: index >= wrapper.len/2
+            }
+
+            Text {
+              id: count
+              text: index+1
+              color: Theme.darkGrey
+              anchors.bottom: parent.bottom
+              anchors.bottomMargin: Theme.smallPadding
+              anchors.left: parent.left
+              anchors.leftMargin: Theme.bigPadding
+              font.pixelSize: 15
+            }
+
+            TextEdit {
+              text: modelData
+              font.pixelSize: 15
+              anchors.bottom: parent.bottom
+              anchors.bottomMargin: Theme.smallPadding
+              anchors.left: count.right
+              anchors.leftMargin: Theme.padding
+              selectByMouse: true
+              readOnly: true
+            }
+
+          }
+        }
+      }
+    }
+
+    Text {
+      id: confirmationsInfo
+      text: qsTr("With this 12 words you can always get your key back. Write it down. Keep it safe, offline, and separate from this device.")
+      font.pixelSize: 14
+      font.weight: Font.Medium
+      color: Theme.darkGrey
+      anchors.bottom: parent.bottom
+      anchors.bottomMargin: Theme.padding
+      anchors.left: parent.left
+      anchors.leftMargin: Theme.smallPadding
+      anchors.right: parent.right
+      anchors.rightMargin: Theme.smallPadding
+      wrapMode: Text.WordWrap
+    }
+
+    footer: StyledButton {
+      label: qsTr("Done")
+      anchors.right: parent.right
+      anchors.rightMargin: Theme.smallPadding
+      anchors.bottom: parent.bottom
+      onClicked: {
+        backupSeedModal.close()
+      }
+    }
+}

ui/app/AppLayouts/Profile/Sections/PrivacyContainer.qml

@@ -21,4 +21,38 @@ Item {
         font.weight: Font.Bold
         font.pixelSize: 20
     }
+
+    Text {
+      id: labelSecurity
+      text: qsTr("Security")
+      font.pixelSize: 13
+      font.weight: Font.Medium
+      color: Theme.darkGrey
+      anchors.left: parent.left
+      anchors.leftMargin: Theme.bigPadding
+      anchors.top: element3.bottom
+      anchors.topMargin: Theme.smallPadding
+    }
+
+    Item {
+      anchors.top: labelSecurity.bottom
+      anchors.topMargin: Theme.padding
+      anchors.left: parent.left
+      anchors.leftMargin: Theme.bigPadding
+      height: children[0].height
+      width: children[0].width
+      Text {
+          text: qsTr("Backup Seed Phrase")
+          font.pixelSize: 14
+      }
+      MouseArea {
+          anchors.fill: parent
+          onClicked: backupSeedModal.open()
+          cursorShape: Qt.PointingHandCursor
+      }
+    }
+
+    BackupSeedModal{
+        id: backupSeedModal
+    }
 }

ui/app/AppLayouts/Profile/Sections/qmldir

@@ -7,4 +7,5 @@ NotificationsContainer 1.0 NotificationsContainer.qml
 AdvancedContainer 1.0 AdvancedContainer.qml
 HelpContainer 1.0 HelpContainer.qml
 AboutContainer 1.0 AboutContainer.qml
-SignoutContainer 1.0 SignoutContainer.qml
+SignoutContainer 1.0 SignoutContainer.qml
+BackupSeedModal 1.0 BackupSeedModal.qml