update settings UI

Gitlab: #294

Change-Id: Ia2ab6a35e0f9b630ab4820949dc4cc6401254bcf

Ring/Ring/Constants/Generated/Strings.swift

@@ -99,6 +99,8 @@ internal enum L10n {
     internal static let enableBoothMode = L10n.tr("Localizable", "accountPage.enableBoothMode", fallback: "Enable Booth Mode")
     /// Enable Notifications
     internal static let enableNotifications = L10n.tr("Localizable", "accountPage.enableNotifications", fallback: "Enable Notifications")
+    /// Invite friends
+    internal static let inviteFriends = L10n.tr("Localizable", "accountPage.inviteFriends", fallback: "Invite friends")
     /// Link another device
     internal static let linkDeviceTitle = L10n.tr("Localizable", "accountPage.linkDeviceTitle", fallback: "Link another device")
     /// Confirm new password
@@ -109,6 +111,8 @@ internal enum L10n {
     internal static let noBoothMode = L10n.tr("Localizable", "accountPage.noBoothMode", fallback: "To enable Booth mode you need to create account password first.")
     /// Your device won't receive notifications when proxy is disabled
     internal static let noProxyExplanationLabel = L10n.tr("Localizable", "accountPage.noProxyExplanationLabel", fallback: "Your device won't receive notifications when proxy is disabled")
+    /// Notifications
+    internal static let notificationsHeader = L10n.tr("Localizable", "accountPage.notificationsHeader", fallback: "Notifications")
     /// Enter old password
     internal static let oldPasswordPlaceholder = L10n.tr("Localizable", "accountPage.oldPasswordPlaceholder", fallback: "Enter old password")
     /// Other
@@ -141,8 +145,6 @@ internal enum L10n {
     internal static let revokeDeviceTitle = L10n.tr("Localizable", "accountPage.revokeDeviceTitle", fallback: "Revoke device")
     /// Settings
     internal static let settingsHeader = L10n.tr("Localizable", "accountPage.settingsHeader", fallback: "Settings")
-    /// Share Account Details
-    internal static let shareAccountDetails = L10n.tr("Localizable", "accountPage.shareAccountDetails", fallback: "Share Account Details")
     /// Enable TURN
     internal static let turnEnabled = L10n.tr("Localizable", "accountPage.turnEnabled", fallback: "Enable TURN")
     /// TURN password

Ring/Ring/EditProfileViewController.swift

@@ -3,6 +3,7 @@
  *
  *  Author: Kateryna Kostiuk <kateryna.kostiuk@savoirfairelinux.com>
  *  Author: Quentin Muret <quentin.muret@savoirfairelinux.com>
+ *  Author: Alireza Toghiani Khorasgani <alireza.toghiani@savoirfairelinux.com>
  *
  *  This program is free software; you can redistribute it and/or modify
  *  it under the terms of the GNU General Public License as published by

Ring/Ring/EditProfileViewModel.swift

@@ -2,6 +2,7 @@
  *  Copyright (C) 2017-2019 Savoir-faire Linux Inc.
  *
  *  Author: Kateryna Kostiuk <kateryna.kostiuk@savoirfairelinux.com>
+ *  Author: Alireza Toghiani Khorasgani <alireza.toghiani@savoirfairelinux.com>
  *
  *  This program is free software; you can redistribute it and/or modify
  *  it under the terms of the GNU General Public License as published by

Ring/Ring/Extensions/UIView+Ring.swift

@@ -174,13 +174,19 @@ extension UIView {
     }
 
     func roundTopCorners(radius: CGFloat) {
-        //        DispatchQueue.main.async { [weak self] in
         let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: [.topLeft, .topRight], cornerRadii: CGSize(width: radius, height: radius))
         let mask = CAShapeLayer()
         mask.path = path.cgPath
-        mask.frame = bounds
+        mask.frame = self.bounds
+        layer.mask = mask
+    }
+
+    func roundAllCorners(radius: CGFloat) {
+        let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: [.bottomLeft, .bottomRight, .topRight, .topLeft], cornerRadii: CGSize(width: radius, height: radius))
+        let mask = CAShapeLayer()
+        mask.path = path.cgPath
+        mask.frame = self.bounds
         layer.mask = mask
-        //        }
     }
 
     func removeCorners() {

Ring/Ring/Extensions/UIViewController+Ring.swift

@@ -156,13 +156,13 @@ extension UIViewController {
             .disposed(by: disposeBag)
     }
 
-    func configureNavigationBar(isTransparent: Bool = false) {
+    func configureNavigationBar(isTransparent: Bool = false, backgroundColor: UIColor = .systemBackground) {
         let appearance = UINavigationBarAppearance()
         if isTransparent {
             appearance.configureWithTransparentBackground()
         } else {
             appearance.configureWithOpaqueBackground()
-            appearance.backgroundColor = UIColor.systemBackground
+            appearance.backgroundColor = backgroundColor
         }
 
         // Explicitly set shadow properties to none

Ring/Ring/Features/Me/Me/AccountHeader.swift

@@ -28,7 +28,7 @@ class AccountHeader: GSKStretchyHeaderView {
 
     override func willMove(toWindow newWindow: UIWindow?) {
         super.willMove(toWindow: newWindow)
-        background.backgroundColor = UIColor.jamiBackgroundColor
+        background.backgroundColor = UIColor.clear
     }
 
     override func didChangeStretchFactor(_ stretchFactor: CGFloat) {

Ring/Ring/Features/Me/Me/DeviceCell.xib

 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="15505" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="21701" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
     <device id="retina4_7" orientation="portrait" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15510"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="21678"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <objects>
@@ -17,19 +17,19 @@
                 <autoresizingMask key="autoresizingMask"/>
                 <subviews>
                     <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Device ID" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="OQs-TS-z4j">
-                        <rect key="frame" x="15" y="45.5" width="54" height="14.5"/>
+                        <rect key="frame" x="16" y="45.5" width="54" height="14.5"/>
                         <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
                         <color key="textColor" white="0.33333333333333331" alpha="1" colorSpace="calibratedWhite"/>
                         <nil key="highlightedColor"/>
                     </label>
                     <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="252" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Emx-P1-xQc">
-                        <rect key="frame" x="15" y="10" width="42" height="20.5"/>
+                        <rect key="frame" x="16" y="10" width="41.5" height="20.5"/>
                         <fontDescription key="fontDescription" style="UICTFontTextStyleBody"/>
                         <nil key="textColor"/>
                         <nil key="highlightedColor"/>
                     </label>
                     <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="xNp-cR-95I">
-                        <rect key="frame" x="330" y="25" width="30" height="30"/>
+                        <rect key="frame" x="329" y="25" width="30" height="30"/>
                         <constraints>
                             <constraint firstAttribute="height" constant="30" id="PBa-iQ-J9e"/>
                             <constraint firstAttribute="width" constant="30" id="tgl-mD-JbM"/>

Ring/Ring/Features/Me/Me/DisposableCell.swift

@@ -26,6 +26,7 @@ class DisposableCell: UITableViewCell {
 
     override func prepareForReuse() {
         super.prepareForReuse()
+        self.backgroundColor = .systemBackground
         self.disposeBag = DisposeBag()
     }
 }

Ring/Ring/Features/Me/Me/MeViewController.storyboard

 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="15505" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES" initialViewController="RuW-kz-iBP">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="21701" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES" initialViewController="RuW-kz-iBP">
     <device id="retina4_7" orientation="portrait" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15510"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="21678"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <scenes>
@@ -19,9 +19,8 @@
                         <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <subviews>
-                            <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" showsHorizontalScrollIndicator="NO" showsVerticalScrollIndicator="NO" contentInsetAdjustmentBehavior="never" dataMode="prototypes" style="plain" separatorStyle="default" rowHeight="44" sectionHeaderHeight="28" estimatedSectionHeaderHeight="40" sectionFooterHeight="28" translatesAutoresizingMaskIntoConstraints="NO" id="eg8-N7-lDA" customClass="SettingsTableView" customModule="Ring" customModuleProvider="target">
+                            <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" showsHorizontalScrollIndicator="NO" showsVerticalScrollIndicator="NO" contentInsetAdjustmentBehavior="never" dataMode="prototypes" style="insetGrouped" rowHeight="44" sectionHeaderHeight="18" estimatedSectionHeaderHeight="40" sectionFooterHeight="18" translatesAutoresizingMaskIntoConstraints="NO" id="eg8-N7-lDA" customClass="SettingsTableView" customModule="Ring" customModuleProvider="target">
                                 <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
-                                <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                             </tableView>
                         </subviews>
                         <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>

Ring/Ring/Features/Me/Me/MeViewController.swift

@@ -4,6 +4,7 @@
  *  Author: Edric Ladent-Milaret <edric.ladent-milaret@savoirfairelinux.com>
  *  Author: Kateryna Kostiuk <kateryna.kostiuk@savoirfairelinux.com>
  *  Author: Quentin Muret <quentin.muret@savoirfairelinux.com>
+ *  Author: Alireza Toghiani Khorasgani <alireza.toghiani@savoirfairelinux.com>
  *
  *  This program is free software; you can redistribute it and/or modify
  *  it under the terms of the GNU General Public License as published by
@@ -47,15 +48,14 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
     private let accountStateCell = "accountStateCell"
     var loadingViewPresenter = LoadingViewPresenter()
 
-    // MARK: - functions
+    // MARK: - functio
     override func viewDidLoad() {
-        self.view.backgroundColor = UIColor.jamiBackgroundColor
-        self.settingsTable.backgroundColor = UIColor.jamiBackgroundColor
+        self.view.backgroundColor = .secondarySystemBackground
+        setupTableView()
         self.addHeaderView()
         super.viewDidLoad()
         self.applyL10n()
         self.configureBindings()
-        self.configureNavigationBar()
         self.calculateSipCredentialsMargin()
         self.calculateConnectivityMargin()
         self.adaptTableToKeyboardState(for: self.settingsTable,
@@ -79,8 +79,22 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
         super.viewWillAppear(animated)
         self.navigationController?.navigationBar.layer.shadowColor = UIColor.clear.cgColor
         self.navigationController?.navigationBar
-            .titleTextAttributes = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 18, weight: .medium),
-                                    NSAttributedString.Key.foregroundColor: UIColor.jamiLabelColor]
+            .titleTextAttributes = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 18, weight: .medium)]
+        self.configureNavigationBar(backgroundColor: .secondarySystemBackground)
+    }
+
+    override func viewWillDisappear(_ animated: Bool) {
+        super.viewWillDisappear(animated)
+        self.configureNavigationBar()
+    }
+
+    func setupTableView() {
+        self.settingsTable.backgroundColor = .secondarySystemBackground
+        self.settingsTable.separatorInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
+        self.settingsTable.alwaysBounceHorizontal = false
+        if #available(iOS 15.0, *) {
+            self.settingsTable.sectionHeaderTopPadding = 0
+        }
     }
 
     func applyL10n() {
@@ -98,7 +112,7 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
             supportEditProfile()
             return
         }
-        headerView.backgroundColor = UIColor.jamiBackgroundColor
+        headerView.backgroundColor = .secondarySystemBackground
         self.stretchyHeader = headerView
         let point = CGPoint(x: 0, y: 120)
         self.stretchyHeader.frame.origin = point
@@ -274,9 +288,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                 switch dataSource[indexPath] {
                 case .autoRegistration:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.autoRegistration
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -296,10 +310,8 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                         })
                         .disposed(by: cell.disposeBag)
                     return cell
-
                 case .device(let device):
                     let cell = tableView.dequeueReusableCell(for: indexPath, cellType: DeviceCell.self)
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.deviceIdLabel.text = device.deviceId
                     cell.deviceIdLabel.font = UIFont.preferredFont(forTextStyle: .caption1)
                     cell.deviceIdLabel.sizeToFit()
@@ -317,17 +329,15 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                         .disposed(by: cell.disposeBag)
                     cell.sizeToFit()
                     return cell
-
                 case .linkNew:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.linkDeviceTitle
-                    cell.textLabel?.textColor = UIColor.jamiMain
+                    cell.textLabel?.textColor = UIColor.jamiButtonDark
                     cell.textLabel?.textAlignment = .center
                     cell.selectionStyle = .none
                     cell.sizeToFit()
                     let button = UIButton.init(frame: cell.frame)
-                    let size = CGSize(width: self.view.frame.width, height: button.frame.height)
+                    let size = CGSize(width: self.settingsTable.frame.width, height: button.frame.height)
                     button.frame.size = size
                     cell.addSubview(button)
                     button.rx.tap
@@ -335,8 +345,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                             self?.viewModel.linkDevice()
                         })
                         .disposed(by: cell.disposeBag)
+                    cell.backgroundColor = .clear
+                    cell.contentView.backgroundColor = .systemBackground
                     return cell
-
                 case .blockedList:
                     let cell = DisposableCell()
                     cell.textLabel?.text = L10n.AccountPage.blockedContacts
@@ -345,8 +356,7 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     cell.selectionStyle = .none
                     cell.sizeToFit()
                     let button = UIButton.init(frame: cell.frame)
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
-                    let size = CGSize(width: self.view.frame.width, height: button.frame.height)
+                    let size = CGSize(width: self.settingsTable.frame.width, height: button.frame.height)
                     button.frame.size = size
                     cell.addSubview(button)
                     button.rx.tap
@@ -355,23 +365,15 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                         })
                         .disposed(by: cell.disposeBag)
                     return cell
-                case .sectionHeader(let title):
-                    let cell = UITableViewCell()
-                    cell.textLabel?.text = title
-                    cell.backgroundColor = UIColor.jamiBackgroundSecondaryColor
-                    cell.selectionStyle = .none
-                    return cell
-
                 case .removeAccount:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.Global.removeAccount
-                    cell.textLabel?.textColor = UIColor.jamiMain
+                    cell.textLabel?.textColor = UIColor.systemRed
                     cell.textLabel?.textAlignment = .center
                     cell.selectionStyle = .none
                     cell.sizeToFit()
                     let button = UIButton.init(frame: cell.frame)
-                    let size = CGSize(width: self.view.frame.width, height: button.frame.height)
+                    let size = CGSize(width: self.settingsTable.frame.width, height: 25)
                     button.frame.size = size
                     cell.addSubview(button)
                     button.rx.tap
@@ -379,6 +381,8 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                             self?.confirmRemoveAccountAlert()
                         })
                         .disposed(by: cell.disposeBag)
+                    cell.backgroundColor = .clear
+                    cell.contentView.backgroundColor = .clear
                     return cell
                 case .jamiUserName(let label):
                     if !label.isEmpty {
@@ -388,12 +392,12 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     }
                     let cell = DisposableCell()
                     cell.textLabel?.text = L10n.Global.registerAUsername
-                    cell.textLabel?.textColor = UIColor.jamiMain
+                    cell.textLabel?.textColor = UIColor.jamiButtonDark
                     cell.textLabel?.textAlignment = .center
                     cell.sizeToFit()
                     cell.selectionStyle = .none
                     let button = UIButton.init(frame: cell.frame)
-                    let size = CGSize(width: self.view.frame.width, height: button.frame.height)
+                    let size = CGSize(width: self.settingsTable.frame.width, height: button.frame.height)
                     button.frame.size = size
                     cell.addSubview(button)
                     button.rx.tap
@@ -408,22 +412,20 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                                                                 style: .footnote)
                 case .ordinary(let label):
                     let cell = UITableViewCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = label
                     cell.selectionStyle = .none
                     return cell
                 case .shareAccountDetails:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
-                    cell.textLabel?.text = L10n.AccountPage.shareAccountDetails
-                    cell.textLabel?.textColor = UIColor.jamiMain
+                    cell.textLabel?.text = L10n.AccountPage.inviteFriends
+                    cell.textLabel?.textColor = UIColor.jamiButtonDark
                     cell.textLabel?.textAlignment = .center
                     cell.sizeToFit()
                     cell.selectionStyle = .none
                     let button = UIButton.init(frame: cell.frame)
-                    let size = CGSize(width: self.view.frame.width, height: button.frame.height)
+                    let size = CGSize(width: cell.contentView.bounds.width, height: button.frame.height)
                     button.frame.size = size
-                    cell.addSubview(button)
+                    cell.contentView.addSubview(button)
                     button.rx.tap
                         .subscribe(onNext: { [weak self] in
                             self?.shareAccountInfo()
@@ -432,16 +434,15 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .changePassword:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     let title = self.viewModel.hasPassword() ?
                         L10n.AccountPage.changePassword : L10n.AccountPage.createPassword
                     cell.textLabel?.text = title
-                    cell.textLabel?.textColor = UIColor.jamiMain
+                    cell.textLabel?.textColor = UIColor.jamiButtonDark
                     cell.textLabel?.textAlignment = .center
                     cell.sizeToFit()
                     cell.selectionStyle = .none
                     let button = UIButton.init(frame: cell.frame)
-                    let size = CGSize(width: self.view.frame.width, height: button.frame.height)
+                    let size = CGSize(width: self.settingsTable.frame.width, height: button.frame.height)
                     button.frame.size = size
                     cell.addSubview(button)
                     button.rx.tap
@@ -452,9 +453,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .notifications:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.enableNotifications
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -475,9 +476,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .peerDiscovery:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.peerDiscovery
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -540,10 +541,10 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .boothMode:
                     let cell = DisposableCell(style: .subtitle, reuseIdentifier: self.jamiIDCell)
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.enableBoothMode
                     cell.textLabel?.sizeToFit()
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -575,9 +576,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .enableAccount:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.Account.enableAccount
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -600,9 +601,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .turnEnabled:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.turnEnabled
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -624,9 +625,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                     return cell
                 case .upnpEnabled:
                     let cell = DisposableCell()
-                    cell.backgroundColor = UIColor.jamiBackgroundColor
                     cell.textLabel?.text = L10n.AccountPage.upnpEnabled
                     let switchView = UISwitch()
+                    switchView.onTintColor = .jamiButtonDark
                     cell.selectionStyle = .none
                     cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
                     cell.accessoryView = switchView
@@ -670,6 +671,9 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
             }
 
         let settingsItemDataSource = RxTableViewSectionedReloadDataSource<SettingsSection>(configureCell: configureCell)
+        settingsItemDataSource.titleForHeaderInSection = { dataSource, sectionIndex in
+            return dataSource[sectionIndex].title
+        }
         self.viewModel.settings
             .bind(to: self.settingsTable.rx.items(dataSource: settingsItemDataSource))
             .disposed(by: disposeBag)
@@ -720,7 +724,6 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
     func configureTurnCell(cellType: SettingsSection.SectionRow,
                            value: String) -> UITableViewCell {
         let cell = DisposableCell(style: .value1, reuseIdentifier: accountStateCell)
-        cell.backgroundColor = UIColor.jamiBackgroundColor
         cell.selectionStyle = .none
         let textField = UITextField()
         textField.tag = self.sipCredentialsTAG
@@ -772,15 +775,15 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
         cell.detailTextLabel?.textColor = UIColor.clear
 
         var frame = CGRect(x: self.connectivityMargin, y: 0,
-                           width: self.view.frame.width - self.connectivityMargin,
+                           width: self.settingsTable.frame.width - self.connectivityMargin,
                            height: cell.frame.height)
         if cell.isRightToLeft {
             frame = CGRect(x: 0, y: 0,
-                           width: self.view.frame.width - self.connectivityMargin - 10,
+                           width: self.settingsTable.frame.width - self.connectivityMargin - 10,
                            height: cell.frame.height)
         }
 
-        if self.view.frame.width - self.connectivityMargin < textField.frame.size.width {
+        if self.settingsTable.frame.width - self.connectivityMargin < textField.frame.size.width {
             let origin = CGPoint(x: 10, y: cell.textLabel!.frame.size.height + 25)
             let size = textField.frame.size
             frame.origin = origin
@@ -800,15 +803,14 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
     func configureSipCredentialsCell(cellType: SettingsSection.SectionRow,
                                      value: String) -> UITableViewCell {
         let cell = DisposableCell(style: .value1, reuseIdentifier: sipAccountCredentialsCell)
-        cell.backgroundColor = UIColor.jamiBackgroundColor
         cell.selectionStyle = .none
-        let text = UITextField()
-        text.tag = self.sipCredentialsTAG
-        text.font = UIFont.preferredFont(forTextStyle: .callout)
-        text.returnKeyType = .done
-        text.text = value
-        text.sizeToFit()
-        text.rx.controlEvent(.editingDidEndOnExit)
+        let textField = UITextField()
+        textField.tag = self.sipCredentialsTAG
+        textField.font = UIFont.preferredFont(forTextStyle: .callout)
+        textField.returnKeyType = .done
+        textField.text = value
+        textField.sizeToFit()
+        textField.rx.controlEvent(.editingDidEndOnExit)
             .observe(on: MainScheduler.instance)
             .subscribe(onNext: { [weak self] _ in
                 self?.viewModel.updateSipSettings()
@@ -816,17 +818,17 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
             .disposed(by: cell.disposeBag)
         switch cellType {
         case .port:
-            text.rx.text.orEmpty.distinctUntilChanged()
+            textField.rx.text.orEmpty.distinctUntilChanged()
                 .bind(to: self.viewModel.port)
                 .disposed(by: cell.disposeBag)
             cell.textLabel?.text = L10n.Account.port
         case .proxyServer:
-            text.rx.text.orEmpty.distinctUntilChanged()
+            textField.rx.text.orEmpty.distinctUntilChanged()
                 .bind(to: self.viewModel.proxyServer)
                 .disposed(by: cell.disposeBag)
             cell.textLabel?.text = L10n.Account.proxyServer
         case .sipServer:
-            text.rx.text.orEmpty.distinctUntilChanged()
+            textField.rx.text.orEmpty.distinctUntilChanged()
                 .bind(to: self.viewModel.sipServer)
                 .disposed(by: cell.disposeBag)
             cell.textLabel?.text = L10n.Account.sipServer
@@ -835,13 +837,13 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
             // show password button
             let rightButton = UIButton(type: .custom)
             var insets = rightButton.contentEdgeInsets
-            insets.right = 20.0
+            insets.right = 60
             rightButton.contentEdgeInsets = insets
             self.viewModel.secureTextEntry
                 .asObservable()
                 .observe(on: MainScheduler.instance)
                 .subscribe(onNext: { (secure) in
-                    text.isSecureTextEntry = secure
+                    textField.isSecureTextEntry = secure
                     if secure {
                         rightButton.setImage(UIImage(asset: Asset.icHideInput),
                                              for: .normal)
@@ -852,15 +854,15 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                 })
                 .disposed(by: cell.disposeBag)
             rightButton.tintColor = UIColor.darkGray
-            text.rightViewMode = .always
-            text.rightView = rightButton
+            textField.rightViewMode = .always
+            textField.rightView = rightButton
             rightButton.rx.tap
                 .subscribe(onNext: { [weak self] _ in
                     self?.viewModel.secureTextEntry
-                        .onNext(!text.isSecureTextEntry)
+                        .onNext(!textField.isSecureTextEntry)
                 })
                 .disposed(by: cell.disposeBag)
-            text.rx.text.orEmpty.distinctUntilChanged()
+            textField.rx.text.orEmpty.distinctUntilChanged()
                 .bind { [weak self, weak rightButton] newText in
                     self?.viewModel.sipPassword.accept(newText)
                     rightButton?.isHidden = newText.isEmpty
@@ -868,7 +870,7 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
                 }
                 .disposed(by: cell.disposeBag)
         case .sipUserName:
-            text.rx.text.orEmpty.distinctUntilChanged()
+            textField.rx.text.orEmpty.distinctUntilChanged()
                 .bind(to: self.viewModel.sipUsername)
                 .disposed(by: cell.disposeBag)
             cell.textLabel?.text = L10n.Account.sipUsername
@@ -880,11 +882,11 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
         cell.detailTextLabel?.font = UIFont.preferredFont(forTextStyle: .callout)
         cell.detailTextLabel?.textColor = UIColor.clear
         var frame = CGRect(x: self.sipCredentialsMargin, y: 0,
-                           width: self.view.frame.width - self.sipCredentialsMargin,
+                           width: self.settingsTable.frame.width - self.sipCredentialsMargin,
                            height: cell.frame.height)
-        if self.view.frame.width - self.sipCredentialsMargin < text.frame.size.width {
+        if self.settingsTable.frame.width - self.sipCredentialsMargin < textField.frame.size.width {
             let origin = CGPoint(x: 10, y: cell.textLabel!.frame.size.height + 25)
-            let size = text.frame.size
+            let size = textField.frame.size
             frame.origin = origin
             frame.size = size
             cell.detailTextLabel?.text = value
@@ -892,8 +894,8 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
             cell.detailTextLabel?.text = ""
         }
         cell.detailTextLabel?.sizeToFit()
-        text.frame = frame
-        cell.contentView.addSubview(text)
+        textField.frame = frame
+        cell.contentView.addSubview(textField)
         cell.sizeToFit()
         return cell
     }
@@ -1242,6 +1244,25 @@ class MeViewController: EditProfileViewController, StoryboardBased, ViewModelBas
 }
 
 extension MeViewController: UITableViewDelegate {
+    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
+        if let dataSourceProxy = tableView.dataSource as? RxTableViewDataSourceProxy,
+           let actualDataSource = dataSourceProxy.forwardToDelegate() as? RxTableViewSectionedReloadDataSource<SettingsSection> {
+            let headerTitle = actualDataSource[section].title
+            if headerTitle == nil || headerTitle == .some("") {
+                return 10
+            }
+        }
+        return 50
+    }
+
+    func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
+        return nil
+    }
+
+    func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
+        return CGFloat.leastNonzeroMagnitude
+    }
+
     func scrollViewDidScroll(_ scrollView: UIScrollView) {
         let navigationHeight = self.navigationController?.navigationBar.bounds.height
         var size = self.view.bounds.size

Ring/Ring/Features/Me/Me/MeViewModel.swift

@@ -4,6 +4,7 @@
  *  Author: Thibault Wittemberg <thibault.wittemberg@savoirfairelinux.com>
  *  Author: Kateryna Kostiuk <kateryna.kostiuk@savoirfairelinux.com>
  *  Author: Quentin Muret <quentin.muret@savoirfairelinux.com>
+ *  Author: Alireza Toghiani Khorasgani <alireza.toghiani@savoirfairelinux.com>
  *
  *  This program is free software; you can redistribute it and/or modify
  *  it under the terms of the GNU General Public License as published by
@@ -31,9 +32,12 @@ enum SettingsSection: SectionModelType {
     typealias Item = SectionRow
 
     case linkedDevices(items: [SectionRow])
-    case linkNewDevice(items: [SectionRow])
     case accountSettings(items: [SectionRow])
+    case notificationSettings(items: [SectionRow])
+    case connectivitySettings(items: [SectionRow])
     case credentials(items: [SectionRow])
+    case otherSettings(items: [SectionRow])
+    case removeAccountSettings(items: [SectionRow])
 
     enum SectionRow {
         case device(device: DeviceModel)
@@ -41,7 +45,6 @@ enum SettingsSection: SectionModelType {
         case blockedList
         case removeAccount
         case shareAccountDetails
-        case sectionHeader(title: String)
         case ordinary(label: String)
         case jamiID(label: String)
         case jamiUserName(label: String)
@@ -68,27 +71,46 @@ enum SettingsSection: SectionModelType {
 
     var items: [SectionRow] {
         switch self {
-        case .linkedDevices(let items):
-            return items
-        case .linkNewDevice(let items):
-            return items
-        case .accountSettings(let items):
-            return items
-        case .credentials(let items):
+        case .linkedDevices(let items), .removeAccountSettings(items: let items), .notificationSettings(let items), .connectivitySettings(let items), .credentials(let items), .otherSettings(items: let items), .accountSettings(items: let items):
             return items
         }
     }
 
+    var title: String? {
+        switch self {
+        case .linkedDevices:
+            return L10n.AccountPage.devicesListHeader
+        case .otherSettings:
+            return L10n.AccountPage.other
+        case .removeAccountSettings:
+            return nil
+        case .notificationSettings:
+            return L10n.AccountPage.notificationsHeader
+        case .connectivitySettings:
+            return L10n.AccountPage.connectivityHeader
+        case .credentials:
+            return L10n.AccountPage.credentialsHeader
+        case .accountSettings(items: let items):
+            return nil
+        }
+    }
+
     init(original: SettingsSection, items: [SectionRow]) {
         switch original {
+        case .accountSettings(items: let items):
+            self = .accountSettings(items: items)
         case .linkedDevices:
             self = .linkedDevices(items: items)
-        case .linkNewDevice:
-            self = .linkNewDevice(items: items)
-        case .accountSettings:
-            self = .accountSettings(items: items)
+        case .notificationSettings:
+            self = .notificationSettings(items: items)
+        case .connectivitySettings:
+            self = .connectivitySettings(items: items)
         case .credentials:
             self = .credentials(items: items)
+        case .otherSettings(items: let items):
+            self = .otherSettings(items: items)
+        case .removeAccountSettings(items: let items):
+            self = .removeAccountSettings(items: items)
         }
     }
 }
@@ -134,8 +156,7 @@ class MeViewModel: ViewModel, Stateable {
     lazy var accountCredentials: Observable<SettingsSection> = {
         return Observable
             .combineLatest(userName.startWith(""), ringId.startWith("")) { (name, ringID) in
-                var items: [SettingsSection.SectionRow] = [.sectionHeader(title: L10n.AccountPage.credentialsHeader),
-                                                           .jamiID(label: ringID)]
+                var items: [SettingsSection.SectionRow] = [.jamiID(label: ringID)]
                 items.append(.jamiUserName(label: name))
                 items.append(.shareAccountDetails)
                 return SettingsSection
@@ -147,14 +168,9 @@ class MeViewModel: ViewModel, Stateable {
         return self.accountService.accountInfoToShare
     }
 
-    lazy var linkNewDevice: Observable<SettingsSection> = {
-        return Observable.just(.linkNewDevice(items: [.linkNew]))
-    }()
-
     lazy var removeAccount: Observable<SettingsSection> = {
         return Observable
-            .just(.accountSettings( items: [.sectionHeader(title: ""),
-                                            .ordinary(label: L10n.Global.removeAccount)]))
+            .just(.removeAccountSettings( items: [.ordinary(label: L10n.Global.removeAccount)]))
     }()
 
     lazy var accountStatus: BehaviorRelay<String> = {
@@ -188,8 +204,7 @@ class MeViewModel: ViewModel, Stateable {
 
     lazy var accountJamiSettings: Observable<SettingsSection> = {
         return Observable
-            .just(.accountSettings( items: [.sectionHeader(title: L10n.AccountPage.settingsHeader),
-                                            .notifications]))
+            .just(.notificationSettings( items: [.notifications]))
     }()
 
     lazy var connectivitySettings: Observable<SettingsSection> = {
@@ -209,8 +224,7 @@ class MeViewModel: ViewModel, Stateable {
             self.turnRealm.accept(realm)
         }
         return Observable
-            .just(.accountSettings(items: [.sectionHeader(title: L10n.AccountPage.connectivityHeader),
-                                           .turnEnabled,
+            .just(.connectivitySettings(items: [.turnEnabled,
                                                 .turnServer,
                                                 .turnUsername,
                                                 .turnPassword,
@@ -219,14 +233,12 @@ class MeViewModel: ViewModel, Stateable {
     }()
 
     lazy var otherJamiSettings: Observable<SettingsSection> = {
-        let items: [SettingsSection.SectionRow] = [.sectionHeader(title: L10n.AccountPage.other),
-                                                   .peerDiscovery,
+        let items: [SettingsSection.SectionRow] = [.peerDiscovery,
                                                    .blockedList,
                                                    .accountState(state: self.accountStatus),
                                                    .enableAccount,
                                                    .changePassword,
-                                                   .boothMode,
-                                                   .removeAccount]
+                                                   .boothMode]
 
         return Observable.combineLatest(Observable.just(items),
                                         self.accountService.currentAccountChanged.asObservable().startWith(nil),
@@ -237,7 +249,7 @@ class MeViewModel: ViewModel, Stateable {
                                                 items.remove(at: items.count - 2) // remove .boothMode
                                                 items.remove(at: items.count - 2) // remove .changePassword
                                             }
-                                            return SettingsSection.accountSettings(items: items)
+                                            return SettingsSection.otherSettings(items: items)
                                         })
     }()
 
@@ -248,12 +260,12 @@ class MeViewModel: ViewModel, Stateable {
 
     lazy var jamiSettings: Observable<[SettingsSection]> = {
         Observable.combineLatest(accountCredentials,
-                                 linkNewDevice,
                                  linkedDevices,
                                  accountJamiSettings,
                                  connectivitySettings,
-                                 otherJamiSettings) { (credentials, linkNew, devices, settings, connectivity, other) in
-            return [credentials, devices, linkNew, settings, connectivity, other]
+                                 otherJamiSettings,
+                                 removeAccountSettings) { (credentials, devices, settings, connectivity, other, removeAccount) in
+            return [credentials, devices, settings, connectivity, other, removeAccount]
         }
     }()
 
@@ -262,11 +274,14 @@ class MeViewModel: ViewModel, Stateable {
 
     lazy var otherSipSettings: Observable<SettingsSection> = {
         return Observable
-            .just(SettingsSection.accountSettings( items: [.sectionHeader(title: ""),
-                                                           .accountState(state: self.accountStatus),
+            .just(SettingsSection.accountSettings( items: [.accountState(state: self.accountStatus),
                                                            .enableAccount,
-                                                           .autoRegistration,
-                                                           .removeAccount]))
+                                                           .autoRegistration]))
+    }()
+
+    lazy var removeAccountSettings: Observable<SettingsSection> = {
+        return Observable
+            .just(SettingsSection.removeAccountSettings( items: [.removeAccount]))
     }()
 
     lazy var sipCredentials: Observable<SettingsSection> = {
@@ -292,14 +307,12 @@ class MeViewModel: ViewModel, Stateable {
             }
             // isIP2IP
             if server.isEmpty {
-                return .accountSettings( items: [.sectionHeader(title: ""),
-                                                 .sipUserName(value: username),
+                return .accountSettings( items: [.sipUserName(value: username),
                                                  .sipPassword(value: password),
                                                  .sipServer(value: server),
                                                  .shareAccountDetails])
             }
-            return .accountSettings( items: [.sectionHeader(title: ""),
-                                             .sipUserName(value: username),
+            return .accountSettings( items: [.sipUserName(value: username),
                                              .sipPassword(value: password),
                                              .sipServer(value: server),
                                              .port(value: port),
@@ -624,9 +637,11 @@ class MeViewModel: ViewModel, Stateable {
                                                     isCurrent: true))]
                 }
                 if rows != nil {
-                    rows?.insert(.sectionHeader(title: L10n.AccountPage.devicesListHeader), at: 0)
+                    rows!.append(.linkNew)
                     let devicesSection: SettingsSection = .linkedDevices(items: rows!)
                     return devicesSection
+                } else {
+                    rows = [.linkNew]
                 }
                 return empptySection
             }

Ring/Ring/Resources/en.lproj/Localizable.strings

@@ -235,6 +235,7 @@
 //Account Page
 "accountPage.devicesListHeader" = "Devices";
 "accountPage.settingsHeader" = "Settings";
+"accountPage.notificationsHeader" = "Notifications";
 "accountPage.usernameNotRegistered" = "username: not registered";
 "accountPage.credentialsHeader" = "Account Details";
 "accountPage.blockedContacts" = "Blocked contacts";
@@ -260,7 +261,7 @@
 "accountPage.other" = "Other";
 "accountPage.removeAccountMessage" = "By clicking \"Remove\" you will remove this account on this device! This action can not be undone. Also, your registered name can be lost.";
 "accountPage.removeAccountButton" = "Remove";
-"accountPage.shareAccountDetails" = "Share Account Details";
+"accountPage.inviteFriends" = "Invite friends";
 "accountPage.contactMeOnJamiTitle" = "Contact me on Jami!";
 "accountPage.contactMeOnJamiContant" = "Contact me using \"%s\" on the Jami distributed communication platform: https://jami.net";
 "accountPage.passwordPlaceholder" = "Enter account password";

Ring/Ring/UI/SettingsTableView.swift

@@ -24,6 +24,16 @@
  */
 
 final class SettingsTableView: UITableView {
+
+    override var contentOffset: CGPoint {
+        didSet {
+            if contentOffset.x != 0 && !alwaysBounceHorizontal {
+                print("********* Unexpected horizontal scroll detected!")
+                contentOffset.x = 0
+            }
+        }
+    }
+
     override func scrollRectToVisible(_ rect: CGRect, animated: Bool) {
         // Don'd do anything here to prevent autoscrolling.
     }