PM-10084: Move save button into navigation bar (#775)

Author: matt-livefront

BitwardenShared/UI/Auth/Landing/SelfHosted/SelfHostedView.swift

@@ -16,7 +16,6 @@ struct SelfHostedView: View {
         VStack(spacing: 16) {
             selfHostedEnvironment
             customEnvironment
-            saveButton
         }
         .textFieldConfiguration(.url)
         .navigationBar(title: Localizations.settings, titleDisplayMode: .inline)
@@ -25,6 +24,10 @@ struct SelfHostedView: View {
             cancelToolbarItem {
                 store.send(.dismiss)
             }
+
+            saveToolbarItem {
+                await store.perform(.saveEnvironment)
+            }
         }
     }
 
@@ -77,18 +80,6 @@ struct SelfHostedView: View {
         .padding(.top, 8)
     }
 
-    /// The save button.
-    private var saveButton: some View {
-        AsyncButton {
-            await store.perform(.saveEnvironment)
-        } label: {
-            Text(Localizations.save)
-        }
-        .accessibilityIdentifier("SaveButton")
-        .buttonStyle(.primary())
-        .padding(.top, 8)
-    }
-
     /// The self-hosted environment section.
     private var selfHostedEnvironment: some View {
         section(

BitwardenShared/UI/Auth/Landing/SelfHosted/SelfHostedViewTests.swift

@@ -4,10 +4,47 @@ import XCTest
 @testable import BitwardenShared
 
 class SelfHostedViewTests: BitwardenTestCase {
-    let subject = SelfHostedView(store: Store(processor: StateProcessor(state: SelfHostedState())))
+    // MARK: Properties
+
+    var processor: MockProcessor<SelfHostedState, SelfHostedAction, SelfHostedEffect>!
+    var subject: SelfHostedView!
+
+    // MARK: Setup & Teardown
+
+    override func setUp() {
+        super.setUp()
+
+        processor = MockProcessor(state: SelfHostedState())
+
+        subject = SelfHostedView(store: Store(processor: processor))
+    }
+
+    override func tearDown() {
+        super.tearDown()
+
+        subject = nil
+    }
+
+    // MARK: Tests
+
+    /// Tapping the cancel button dispatches the `.dismiss` action.
+    func test_cancelButton_tap() throws {
+        let button = try subject.inspect().find(button: Localizations.cancel)
+        try button.tap()
+        XCTAssertEqual(processor.dispatchedActions.last, .dismiss)
+    }
+
+    /// Tapping the save button dispatches the `.saveEnvironment` action.
+    func test_saveButton_tap() async throws {
+        let button = try subject.inspect().find(asyncButton: Localizations.save)
+        try await button.tap()
+        XCTAssertEqual(processor.effects.last, .saveEnvironment)
+    }
+
+    // MARK: Snapshots
 
     /// Tests that the view renders correctly.
     func test_viewRender() {
-        assertSnapshot(of: subject, as: .defaultPortrait)
+        assertSnapshot(of: subject.navStackWrapped, as: .defaultPortrait)
     }
 }

BitwardenShared/UI/Auth/Landing/SelfHosted/__Snapshots__/SelfHostedViewTests/test_viewRender.1.png

@@ -48,6 +48,16 @@ extension View {
             .accessibilityIdentifier("EditItemButton")
     }
 
+    /// Returns a toolbar button configured for saving an item.
+    ///
+    /// - Parameter action: The action to perform when the save button is tapped.
+    /// - Returns: A `Button` configured for saving an item.
+    ///
+    func saveToolbarButton(action: @escaping () async -> Void) -> some View {
+        toolbarButton(Localizations.save, action: action)
+            .accessibilityIdentifier("SaveButton")
+    }
+
     /// Returns a `Button` that displays an image for use in a toolbar.
     ///
     /// - Parameters:
@@ -140,4 +150,15 @@ extension View {
             optionsToolbarMenu(content: content)
         }
     }
+
+    /// A `ToolbarItem` for views with a save button.
+    ///
+    /// - Parameter action: The action to perform when the save button is tapped.
+    /// - Returns: A `ToolbarItem` with a save button.
+    ///
+    func saveToolbarItem(_ action: @escaping () async -> Void) -> some ToolbarContent {
+        ToolbarItem(placement: .topBarTrailing) {
+            saveToolbarButton(action: action)
+        }
+    }
 }

BitwardenShared/UI/Platform/Application/Extensions/View+Toolbar.swift

@@ -31,6 +31,10 @@ struct AddEditFolderView: View {
                 cancelToolbarItem {
                     store.send(.dismiss)
                 }
+
+                saveToolbarItem {
+                    await store.perform(.saveTapped)
+                }
             }
     }
 
@@ -39,24 +43,28 @@ struct AddEditFolderView: View {
         content
             .navigationBar(title: Localizations.editFolder, titleDisplayMode: .inline)
             .toolbar {
-                optionsToolbarItem {
-                    AsyncButton(Localizations.delete, role: .destructive) {
-                        await store.perform(.deleteTapped)
-                    }
-                }
-
                 cancelToolbarItem {
                     store.send(.dismiss)
                 }
+
+                ToolbarItemGroup(placement: .topBarTrailing) {
+                    saveToolbarButton {
+                        await store.perform(.saveTapped)
+                    }
+
+                    optionsToolbarMenu {
+                        AsyncButton(Localizations.delete, role: .destructive) {
+                            await store.perform(.deleteTapped)
+                        }
+                    }
+                }
             }
     }
 
     /// The content of the view in either mode.
     private var content: some View {
         VStack(alignment: .leading, spacing: 20) {
             nameEntryTextField
-
-            saveButton
         }
         .scrollView()
     }
@@ -71,13 +79,4 @@ struct AddEditFolderView: View {
             )
         )
     }
-
-    /// The save button.
-    private var saveButton: some View {
-        AsyncButton(Localizations.save) {
-            await store.perform(.saveTapped)
-        }
-        .accessibilityIdentifier("SaveButton")
-        .buttonStyle(.primary())
-    }
 }

BitwardenShared/UI/Platform/Settings/Settings/Vault/Folders/AddEditFolder/AddEditFolderView.swift

@@ -61,31 +61,48 @@ class AddEditFolderViewTests: BitwardenTestCase {
         XCTAssertEqual(processor.dispatchedActions.last, .folderNameTextChanged("text"))
     }
 
-    /// Tapping the save button performs the `.saveTapped` effect.
-    func test_saveButton_tap() async throws {
+    /// Tapping the save button in add mode performs the `.saveTapped` effect.
+    func test_saveButton_tapAdd() async throws {
         let button = try subject.inspect().find(asyncButton: Localizations.save)
         try await button.tap()
 
         XCTAssertEqual(processor.effects.last, .saveTapped)
     }
 
+    /// Tapping the save button in edit mode performs the `.saveTapped` effect.
+    func test_saveButton_tapEdit() async throws {
+        processor.state.mode = .edit(.fixture())
+        let button = try subject.inspect().find(asyncButton: Localizations.save)
+        try await button.tap()
+        XCTAssertEqual(processor.effects.last, .saveTapped)
+    }
+
     // MARK: Snapshots
 
     /// Tests the view renders correctly when the text field is empty.
     func test_snapshot_add_empty() {
-        assertSnapshots(matching: subject, as: [.defaultPortrait, .defaultPortraitDark, .defaultPortraitAX5])
+        assertSnapshots(
+            matching: subject.navStackWrapped,
+            as: [.defaultPortrait, .defaultPortraitDark, .defaultPortraitAX5]
+        )
     }
 
     /// Tests the view renders correctly when the text field is populated.
     func test_snapshot_add_populated() {
         processor.state.folderName = "Super cool folder name"
-        assertSnapshots(matching: subject, as: [.defaultPortrait, .defaultPortraitDark, .defaultPortraitAX5])
+        assertSnapshots(
+            matching: subject.navStackWrapped,
+            as: [.defaultPortrait, .defaultPortraitDark, .defaultPortraitAX5]
+        )
     }
 
     /// Tests the view renders correctly when the text field is populated.
     func test_snapshot_edit_populated() {
         processor.state.mode = .edit(.fixture())
         processor.state.folderName = "Super cool folder name"
-        assertSnapshots(matching: subject, as: [.defaultPortrait, .defaultPortraitDark, .defaultPortraitAX5])
+        assertSnapshots(
+            matching: subject.navStackWrapped,
+            as: [.defaultPortrait, .defaultPortraitDark, .defaultPortraitAX5]
+        )
     }
 }