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/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.
     }