feat: save and get appearance from the settings

src/app/profile/core.nim

@@ -1,4 +1,5 @@
 import NimQml, json, eventemitter, strutils
+import json_serialization
 import ../../status/libstatus/mailservers as status_mailservers
 import ../../signals/types
 import ../../status/libstatus/types as status_types
@@ -8,6 +9,7 @@ import ../../status/[status, contacts]
 import ../../status/chat as status_chat
 import ../../status/chat/chat
 import view
+import chronicles
 
 type ProfileController* = ref object of SignalSubscriber
   view*: ProfileView
@@ -33,6 +35,8 @@ proc init*(self: ProfileController, account: Account) =
   let response = status_settings.getSettings()
   let pubKey = status_settings.getSetting[string]("public-key", "0x0")
   let mnemonic = status_settings.getSetting[string]("mnemonic", "")
+  let appearance = Json.decode($response["appearance"], int)
+  profile.appearance = appearance
   profile.id = pubKey
 
   self.view.setNewProfile(profile)

src/app/profile/view.nim

@@ -97,3 +97,7 @@ QtObject:
 
   proc qrCode*(self: ProfileView, text:string): string {.slot.} =
     result = "data:image/svg+xml;utf8," & generateQRCodeSVG(text, 2)
+
+  proc changeTheme*(self: ProfileView, theme: int) {.slot.} =
+    self.profile.setAppearance(theme)
+    self.status.saveSetting("appearance", $theme)

src/app/profile/views/profile_info.nim

@@ -6,6 +6,7 @@ QtObject:
     username*: string
     identicon*: string
     pubKey*: string
+    appearance*: int
 
   proc setup(self: ProfileInfoView) =
     self.QObject.setup
@@ -19,6 +20,7 @@ QtObject:
     result.pubKey = ""
     result.username = ""
     result.identicon = ""
+    result.appearance = 0
     result.setup
 
   proc profileChanged*(self: ProfileInfoView) {.signal.}
@@ -26,6 +28,7 @@ QtObject:
   proc setProfile*(self: ProfileInfoView, profile: Profile) =
     self.username = profile.username
     self.identicon = profile.identicon
+    self.appearance = profile.appearance
     self.pubKey = profile.id
     self.profileChanged()
 
@@ -34,6 +37,15 @@ QtObject:
     read = username
     notify = profileChanged
 
+  proc appearance*(self: ProfileInfoView): int {.slot.} = result = self.appearance
+  proc setAppearance*(self: ProfileInfoView, appearance: int) {.slot.} =
+    self.appearance = appearance
+    self.profileChanged()
+  QtProperty[int] appearance:
+    read = appearance
+    write = setAppearance
+    notify = profileChanged
+
   proc identicon*(self: ProfileInfoView): string {.slot.} = result = self.identicon
   QtProperty[string] identicon:
     read = identicon

src/status/profile/profile.nim

@@ -4,7 +4,7 @@ import ../libstatus/types
 type Profile* = ref object
   id*, alias*, username*, identicon*, address*, ensName*: string
   ensVerified*: bool
-  ensVerifiedAt*, ensVerificationRetries*: int
+  ensVerifiedAt*, ensVerificationRetries*, appearance*: int
   systemTags*: seq[string]
 
 proc isContact*(self: Profile): bool =
@@ -22,6 +22,7 @@ proc toProfileModel*(account: Account): Profile =
     ensName: "",
     ensVerified: false,
     ensVerifiedAt: 0,
+    appearance: 0,
     ensVerificationRetries: 0,
     systemTags: @[]
   )
@@ -39,6 +40,7 @@ proc toProfileModel*(profile: JsonNode): Profile =
     alias: profile["alias"].str,
     ensName: "",
     ensVerified: profile["ensVerified"].getBool,
+    appearance: 0,
     ensVerifiedAt: profile["ensVerifiedAt"].getInt,
     ensVerificationRetries: profile["ensVerificationRetries"].getInt,
     systemTags: systemTags

src/status/status.nim

@@ -57,3 +57,6 @@ proc reset*(self: Status) =
 
 proc getNodeVersion*(self: Status): string =
   libstatus_settings.getWeb3ClientVersion()
+
+proc saveSetting*(self: Status, setting: string, value: string) =
+  discard libstatus_settings.saveSettings(setting, value)

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

@@ -24,7 +24,15 @@ Item {
 
     RowLayout {
         // TODO move this to a new panel once we have the appearance panel
-        property bool isDarkTheme: false
+        property bool isDarkTheme: {
+            const isDarkTheme = profileModel.profile.appearance === 1
+            if (isDarkTheme) {
+                Style.changeTheme('dark')
+            } else {
+                Style.changeTheme('light')
+            }
+            return isDarkTheme
+        }
         id: themeSetting
         anchors.top: title.bottom
         anchors.topMargin: 20
@@ -36,12 +44,7 @@ Item {
         Switch {
             checked: themeSetting.isDarkTheme
             onCheckedChanged: function(value) {
-                themeSetting.isDarkTheme = !themeSetting.isDarkTheme
+                profileModel.changeTheme(themeSetting.isDarkTheme ? 0 : 1)
-                if (themeSetting.isDarkTheme) {
-                    Style.changeTheme('dark')
-                } else {
-                    Style.changeTheme('light')
-                }
             }
         }
     }