merge, finish swiftui and add theming

2026-04-19 16:13:42 +02:00 · 2021-08-06 00:27:13 +01:00
parent 634be310db c4351e1e67
commit b40333fbfd
175 changed files with 4808 additions and 1281 deletions
@@ -0,0 +1,51 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Foundation
+import Reusable
+
+class RoomNotificationSettingsAvatarView: UIView {
+    
+    @IBOutlet weak var avatarView: MXKImageView!
+    @IBOutlet weak var nameLabel: UILabel!
+    
+    func configure(viewData: AvatarViewDataProtocol) {
+        let avatarImage = AvatarGenerator.generateAvatar(forMatrixItem: viewData.matrixItemId, withDisplayName: viewData.displayName)
+        
+        if let avatarUrl = viewData.avatarUrl {
+            avatarView.enableInMemoryCache = true
+
+            avatarView.setImageURI(avatarUrl,
+                                        withType: nil,
+                                        andImageOrientation: .up,
+                                        toFitViewSize: avatarView.frame.size,
+                                        with: MXThumbnailingMethodCrop,
+                                        previewImage: avatarImage,
+                                        mediaManager: viewData.mediaManager)
+        } else {
+            avatarView.image = avatarImage
+        }
+        nameLabel.text = viewData.displayName
+    }
+}
+
+extension RoomNotificationSettingsAvatarView: NibLoadable { }
+extension RoomNotificationSettingsAvatarView: Themable {
+    func update(theme: Theme) {
+        nameLabel?.font = theme.fonts.title3SB
+        nameLabel?.textColor = theme.textPrimaryColor
+    }
+}
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="18122" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
+    <device id="retina6_1" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="18093"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <objects>
+        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
+        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
+        <view contentMode="scaleToFill" id="iN0-l3-epB" customClass="RoomNotificationSettingsAvatarView" customModule="Riot" customModuleProvider="target">
+            <rect key="frame" x="0.0" y="0.0" width="414" height="192"/>
+            <autoresizingMask key="autoresizingMask" widthSizable="YES"/>
+            <subviews>
+                <view autoresizesSubviews="NO" clipsSubviews="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="q3Z-S1-Py9" customClass="MXKImageView">
+                    <rect key="frame" x="167" y="20" width="80" height="80"/>
+                    <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                    <constraints>
+                        <constraint firstAttribute="height" constant="80" id="tFe-kl-KGy"/>
+                        <constraint firstAttribute="width" constant="80" id="tOu-Mt-atQ"/>
+                    </constraints>
+                    <userDefinedRuntimeAttributes>
+                        <userDefinedRuntimeAttribute type="number" keyPath="layer.cornerRadius">
+                            <integer key="value" value="40"/>
+                        </userDefinedRuntimeAttribute>
+                    </userDefinedRuntimeAttributes>
+                </view>
+                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="pBK-NN-5cI">
+                    <rect key="frame" x="182" y="108" width="50" height="24"/>
+                    <constraints>
+                        <constraint firstAttribute="height" constant="24" id="yzb-2V-G1M"/>
+                    </constraints>
+                    <fontDescription key="fontDescription" type="system" weight="semibold" pointSize="20"/>
+                    <nil key="textColor"/>
+                    <nil key="highlightedColor"/>
+                </label>
+            </subviews>
+            <viewLayoutGuide key="safeArea" id="vUN-kp-3ea"/>
+            <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+            <constraints>
+                <constraint firstItem="q3Z-S1-Py9" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" constant="20" id="1EV-ZD-9aG"/>
+                <constraint firstItem="pBK-NN-5cI" firstAttribute="top" secondItem="q3Z-S1-Py9" secondAttribute="bottom" constant="8" id="Rcf-3z-sEY"/>
+                <constraint firstItem="vUN-kp-3ea" firstAttribute="bottom" secondItem="pBK-NN-5cI" secondAttribute="bottom" constant="60" id="V3E-vX-joC"/>
+                <constraint firstItem="pBK-NN-5cI" firstAttribute="centerX" secondItem="q3Z-S1-Py9" secondAttribute="centerX" id="vNG-KB-1Vd"/>
+                <constraint firstItem="q3Z-S1-Py9" firstAttribute="centerX" secondItem="iN0-l3-epB" secondAttribute="centerX" id="wKJ-BP-2RA"/>
+            </constraints>
+            <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
+            <connections>
+                <outlet property="avatarView" destination="q3Z-S1-Py9" id="cLO-Y3-6If"/>
+                <outlet property="nameLabel" destination="pBK-NN-5cI" id="Wt8-Oe-9mK"/>
+            </connections>
+            <point key="canvasLocation" x="86.956521739130437" y="99.776785714285708"/>
+        </view>
+    </objects>
+</document>
@@ -0,0 +1,22 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Foundation
+
+struct RoomNotificationSettingsCellViewData {
+    let notificicationState: RoomNotificationState
+    let selected: Bool
+}
@@ -0,0 +1,60 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import UIKit
+import Reusable
+
+class RoomNotificationSettingsFooter: UITableViewHeaderFooterView {
+    
+    struct State {
+        let showEncryptedNotice: Bool
+        let showAccountLink: Bool
+    }
+    
+    @IBOutlet weak var label: UILabel!
+    
+    func update(footerState: State) {
+        
+        // Don't include link until global settings in place
+//        let paragraphStyle = NSMutableParagraphStyle()
+//        paragraphStyle.lineHeightMultiple = 1.16
+//        let paragraphAttributes: [NSAttributedString.Key: Any] = [
+//            NSAttributedString.Key.kern: -0.08,
+//            NSAttributedString.Key.paragraphStyle: paragraphStyle,
+//            NSAttributedString.Key.font: UIFont.systemFont(ofSize: 13.0)
+//        ]
+//        let linkStr = VectorL10n.roomNotifsSettingsAccountSettings
+//        let formatStr = VectorL10n.roomNotifsSettingsManageNotifications(linkStr)
+//
+//        let formattedStr = String(format: formatStr, arguments: [linkStr])
+//        let footer0 = NSMutableAttributedString(string: formattedStr, attributes: paragraphAttributes)
+//        let linkRange = (footer0.string as NSString).range(of: linkStr)
+//        footer0.addAttribute(NSAttributedString.Key.link, value: Constants.linkToAccountSettings, range: linkRange)
+        
+        label.text = footerState.showEncryptedNotice ? VectorL10n.roomNotifsSettingsEncryptedRoomNotice : nil
+
+    }
+}
+
+
+extension RoomNotificationSettingsFooter: NibReusable {}
+extension RoomNotificationSettingsFooter: Themable {
+    
+    func update(theme: Theme) {
+        contentView.backgroundColor = theme.headerBackgroundColor
+        label.textColor = theme.headerTextSecondaryColor
+    }
+}
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="18122" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
+    <device id="retina6_1" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="18093"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <objects>
+        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
+        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
+        <tableViewCell clipsSubviews="YES" contentMode="scaleToFill" preservesSuperviewLayoutMargins="YES" selectionStyle="default" indentationWidth="10" id="Ecs-Zf-2tR" customClass="RoomNotificationSettingsFooter" customModule="Riot" customModuleProvider="target">
+            <rect key="frame" x="0.0" y="0.0" width="414" height="76"/>
+            <autoresizingMask key="autoresizingMask"/>
+            <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" preservesSuperviewLayoutMargins="YES" insetsLayoutMarginsFromSafeArea="NO" tableViewCell="Ecs-Zf-2tR" id="f2j-NO-hdS">
+                <rect key="frame" x="0.0" y="0.0" width="414" height="76"/>
+                <autoresizingMask key="autoresizingMask"/>
+                <subviews>
+                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="xlF-dY-Ud8">
+                        <rect key="frame" x="20" y="16" width="374" height="44"/>
+                        <fontDescription key="fontDescription" type="system" pointSize="17"/>
+                        <nil key="textColor"/>
+                        <nil key="highlightedColor"/>
+                    </label>
+                </subviews>
+                <constraints>
+                    <constraint firstItem="xlF-dY-Ud8" firstAttribute="bottom" secondItem="f2j-NO-hdS" secondAttribute="bottom" constant="-16" id="BWu-8S-Qnj"/>
+                    <constraint firstItem="xlF-dY-Ud8" firstAttribute="top" secondItem="f2j-NO-hdS" secondAttribute="top" constant="16" id="Lpw-g0-S41"/>
+                    <constraint firstItem="xlF-dY-Ud8" firstAttribute="leading" secondItem="f2j-NO-hdS" secondAttribute="leadingMargin" id="Zf5-c0-agj"/>
+                    <constraint firstAttribute="trailingMargin" secondItem="xlF-dY-Ud8" secondAttribute="trailing" id="wIa-z6-N5E"/>
+                </constraints>
+            </tableViewCellContentView>
+            <connections>
+                <outlet property="label" destination="xlF-dY-Ud8" id="qhR-4x-7Yt"/>
+            </connections>
+            <point key="canvasLocation" x="37" y="-210"/>
+        </tableViewCell>
+    </objects>
+</document>
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="18122" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="V8j-Lb-PgC">
+    <device id="retina6_1" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="18093"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
+        <capability name="System colors in document resources" minToolsVersion="11.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <scenes>
+        <!--Room Notification Settings View Controller-->
+        <scene sceneID="mt5-wz-YKA">
+            <objects>
+                <viewController extendedLayoutIncludesOpaqueBars="YES" automaticallyAdjustsScrollViewInsets="NO" id="V8j-Lb-PgC" customClass="RoomNotificationSettingsViewController" customModule="Riot" customModuleProvider="target" sceneMemberID="viewController">
+                    <view key="view" contentMode="scaleToFill" id="EL9-GA-lwo">
+                        <rect key="frame" x="0.0" y="0.0" width="414" height="896"/>
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <subviews>
+                            <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="prototypes" style="grouped" separatorStyle="default" rowHeight="-1" estimatedRowHeight="-1" sectionHeaderHeight="18" sectionFooterHeight="18" translatesAutoresizingMaskIntoConstraints="NO" id="1Jo-Pf-c9m">
+                                <rect key="frame" x="0.0" y="44" width="414" height="818"/>
+                                <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                                <connections>
+                                    <outlet property="dataSource" destination="V8j-Lb-PgC" id="pQ7-Q4-4cn"/>
+                                    <outlet property="delegate" destination="V8j-Lb-PgC" id="snv-x4-IWg"/>
+                                </connections>
+                            </tableView>
+                        </subviews>
+                        <viewLayoutGuide key="safeArea" id="bFg-jh-JZB"/>
+                        <color key="backgroundColor" red="0.94509803921568625" green="0.96078431372549022" blue="0.97254901960784312" alpha="1" colorSpace="calibratedRGB"/>
+                        <constraints>
+                            <constraint firstItem="bFg-jh-JZB" firstAttribute="bottom" secondItem="1Jo-Pf-c9m" secondAttribute="bottom" id="TYv-T2-NmY"/>
+                            <constraint firstItem="1Jo-Pf-c9m" firstAttribute="leading" secondItem="bFg-jh-JZB" secondAttribute="leading" id="f6H-cf-mjJ"/>
+                            <constraint firstItem="1Jo-Pf-c9m" firstAttribute="top" secondItem="bFg-jh-JZB" secondAttribute="top" id="gcX-5S-aMb"/>
+                            <constraint firstItem="bFg-jh-JZB" firstAttribute="trailing" secondItem="1Jo-Pf-c9m" secondAttribute="trailing" id="hJ7-5d-23W"/>
+                        </constraints>
+                    </view>
+                    <connections>
+                        <outlet property="mainTableView" destination="1Jo-Pf-c9m" id="Edg-Ng-fo9"/>
+                    </connections>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="zK0-v6-7Wt" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="-3198" y="-647"/>
+        </scene>
+    </scenes>
+    <resources>
+        <systemColor name="systemBackgroundColor">
+            <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+        </systemColor>
+    </resources>
+</document>
@@ -0,0 +1,233 @@
+// File created from ScreenTemplate
+// $ createScreen.sh Room/NotificationSettings RoomNotificationSettings
+/*
+ Copyright 2021 New Vector Ltd
+ 
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ 
+ http://www.apache.org/licenses/LICENSE-2.0
+ 
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+
+import UIKit
+
+final class RoomNotificationSettingsViewController: UIViewController {
+     
+    // MARK: - Properties
+    
+    private enum Constants {
+        static let linkToAccountSettings = "linkToAccountSettings"
+    }
+    
+    // MARK: Outlets
+
+    @IBOutlet private weak var mainTableView: UITableView!
+    
+    // MARK: Private
+
+    private var viewModel: RoomNotificationSettingsViewModelType!
+    private var theme: Theme!
+    private var errorPresenter: MXKErrorPresentation!
+    private var activityPresenter: ActivityIndicatorPresenter!
+    private lazy var avatarView: RoomNotificationSettingsAvatarView = {
+        RoomNotificationSettingsAvatarView.loadFromNib()
+    }()
+
+    private struct Row {
+        var cellViewData: RoomNotificationSettingsCellViewData
+        var action: (() -> Void)?
+    }
+
+    private struct Section {
+        var title: String
+        var rows: [Row]
+        var footerState: RoomNotificationSettingsFooter.State
+    }
+
+    private var sections: [Section] = [] {
+        didSet {
+            mainTableView.reloadData()
+        }
+    }
+    
+    private var viewState: RoomNotificationSettingsViewStateType!
+    
+    // MARK: - Setup
+    
+    class func instantiate(with viewModel: RoomNotificationSettingsViewModelType) -> RoomNotificationSettingsViewController {
+        let viewController = StoryboardScene.RoomNotificationSettingsViewController.initialScene.instantiate()
+        viewController.viewModel = viewModel
+        viewController.theme = ThemeService.shared().theme
+        return viewController
+    }
+    
+    // MARK: - Life cycle
+    
+    override func viewDidLoad() {
+        super.viewDidLoad()
+        
+        // Do any additional setup after loading the view.
+        
+        setupViews()
+        activityPresenter = ActivityIndicatorPresenter()
+        errorPresenter = MXKErrorAlertPresentation()
+        
+        registerThemeServiceDidChangeThemeNotification()
+        update(theme: theme)
+        
+        viewModel.viewDelegate = self
+        viewModel.process(viewAction: .load)
+    }
+
+    override var preferredStatusBarStyle: UIStatusBarStyle {
+        return theme.statusBarStyle
+    }
+    
+    // MARK: - Private
+    
+    private func update(theme: Theme) {
+        self.theme = theme
+        
+        view.backgroundColor = theme.headerBackgroundColor
+        mainTableView.backgroundColor = theme.headerBackgroundColor
+        
+        if let navigationBar = navigationController?.navigationBar {
+            theme.applyStyle(onNavigationBar: navigationBar)
+        }
+        mainTableView.reloadData()
+    }
+    
+    private func registerThemeServiceDidChangeThemeNotification() {
+        NotificationCenter.default.addObserver(self, selector: #selector(themeDidChange), name: .themeServiceDidChangeTheme, object: nil)
+    }
+    
+    @objc private func themeDidChange() {
+        update(theme: ThemeService.shared().theme)
+    }
+    
+    private func setupViews() {
+        
+        self.title = VectorL10n.roomDetailsNotifs
+        let doneBarButtonItem = MXKBarButtonItem(title: VectorL10n.roomNotifsSettingsDoneAction, style: .plain) { [weak self] in
+            self?.viewModel.process(viewAction: .save)
+        }
+        
+        let cancelBarButtonItem = MXKBarButtonItem(title: VectorL10n.roomNotifsSettingsCancelAction, style: .plain) { [weak self] in
+            self?.viewModel.process(viewAction: .cancel)
+        }
+        
+        if navigationController?.navigationBar.backItem == nil {
+            navigationItem.leftBarButtonItem = cancelBarButtonItem
+        }
+        navigationItem.rightBarButtonItem = doneBarButtonItem
+        mainTableView.register(cellType: RoomNotificationSettingsCell.self)
+        mainTableView.register(headerFooterViewType: RoomNotificationSettingsFooter.self)
+        mainTableView.register(headerFooterViewType: TitleHeaderView.self)
+        mainTableView.sectionFooterHeight = UITableView.automaticDimension
+        mainTableView.sectionHeaderHeight = UITableView.automaticDimension
+        mainTableView.estimatedSectionFooterHeight = 50
+        mainTableView.estimatedSectionHeaderHeight = 30
+    }
+    
+    private func render(viewState: RoomNotificationSettingsViewStateType) {
+        
+        if viewState.saving {
+            activityPresenter.presentActivityIndicator(on: view, animated: true)
+        } else {
+            activityPresenter.removeCurrentActivityIndicator(animated: true)
+        }
+        self.viewState = viewState
+        if let avatarData = viewState.avatarData {
+            mainTableView.tableHeaderView = avatarView
+            avatarView.configure(viewData: avatarData)
+            avatarView.update(theme: theme)
+        }
+        updateSections()
+    }
+    
+    private func updateSections() {
+        let rows = viewState.notificationOptions.map({ (setting) -> Row in
+            let cellViewData = RoomNotificationSettingsCellViewData(notificicationState: setting, selected: viewState.notificationState == setting)
+            return Row(cellViewData: cellViewData,
+                       action: {
+                        self.viewModel.process(viewAction: .selectNotificationState(setting))
+            })
+        })
+        let footerState = RoomNotificationSettingsFooter.State(showEncryptedNotice: viewState.roomEncrypted, showAccountLink: false)
+        let section0 = Section(title: VectorL10n.roomNotifsSettingsNotifyMeFor, rows: rows, footerState: footerState)
+        sections = [
+            section0
+        ]
+    }
+}
+
+// MARK: - UITableViewDataSource
+extension RoomNotificationSettingsViewController: UITableViewDataSource {
+
+    func numberOfSections(in tableView: UITableView) -> Int {
+        return sections.count
+    }
+
+    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
+        return sections[section].rows.count
+    }
+
+    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
+        let row = sections[indexPath.section].rows[indexPath.row]
+        let cell: RoomNotificationSettingsCell = tableView.dequeueReusableCell(for: indexPath)
+        cell.update(state: row.cellViewData)
+        cell.update(theme: theme)
+        return cell
+    }
+
+    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
+        return UITableView.automaticDimension
+    }
+    
+    func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
+        return UITableView.automaticDimension
+    }
+
+}
+
+// MARK: - UITableViewDelegate
+extension RoomNotificationSettingsViewController: UITableViewDelegate {
+
+    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
+        guard let headerView: TitleHeaderView = tableView.dequeueReusableHeaderFooterView() else { return nil }
+        headerView.update(title: sections[section].title)
+        headerView.update(theme: theme)
+        return headerView
+    }
+    
+    func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
+        guard let footerView: RoomNotificationSettingsFooter = tableView.dequeueReusableHeaderFooterView() else { return nil }
+        let footerState = sections[section].footerState
+        footerView.update(footerState: footerState)
+        footerView.update(theme: theme)
+        return footerView
+    }
+
+    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
+        tableView.deselectRow(at: indexPath, animated: true)
+
+        let row = sections[indexPath.section].rows[indexPath.row]
+        row.action?()
+    }
+    
+}
+
+// MARK: - RoomNotificationSettingsViewModelViewDelegate
+extension RoomNotificationSettingsViewController: RoomNotificationSettingsViewModelViewDelegate {
+
+    func roomNotificationSettingsViewModel(_ viewModel: RoomNotificationSettingsViewModelType, didUpdateViewState viewSate: RoomNotificationSettingsViewStateType) {
+        render(viewState: viewSate)
+    }
+}
@@ -0,0 +1,56 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+import UIKit
+import Reusable
+
+class RoomNotificationSettingsCell: UITableViewCell {
+    
+    func update(state: RoomNotificationSettingsCellViewData) {
+        textLabel?.text = state.notificicationState.title
+        if state.selected {
+            accessoryView = UIImageView(image: Asset.Images.checkmark.image)
+        } else {
+            accessoryView = nil
+        }
+    }
+}
+
+extension RoomNotificationSettingsCell: Reusable {}
+
+extension RoomNotificationSettingsCell: Themable {
+    func update(theme: Theme) {
+        textLabel?.font = theme.fonts.body
+        textLabel?.textColor = theme.textPrimaryColor
+        backgroundColor = theme.backgroundColor
+        contentView.backgroundColor = .clear
+        tintColor = theme.tintColor
+        selectedBackgroundView = UIView()
+        selectedBackgroundView?.backgroundColor = theme.selectedBackgroundColor
+    }
+}
+
+fileprivate extension RoomNotificationState {
+    var title: String {
+        switch self {
+        case .all:
+            return VectorL10n.roomNotifsSettingsAllMessages
+        case .mentionsAndKeywordsOnly:
+            return VectorL10n.roomNotifsSettingsMentionsAndKeywords
+        case .mute:
+            return VectorL10n.roomNotifsSettingsNone
+        }
+    }
+}