Convert About and Device Capabilities to macOS-native helpers

Yattee/Views/Settings/AboutView.swift

@@ -12,17 +12,16 @@ struct AboutView: View {
     @Environment(\.openURL) private var openURL
 
     var body: some View {
-        Form {
+        SettingsFormContainer {
             #if !os(tvOS)
-            Section {
+            SettingsFormSection("settings.about.community") {
                 communityLink("GitHub", icon: "github", url: "https://github.com/yattee/yattee")
                 communityLink("Discord", icon: "discord", url: "https://yattee.stream/discord")
-            } header: {
-                Text(String(localized: "settings.about.community"))
             }
             #endif
 
-            Section {
+            SettingsFormSection {
+                #if os(tvOS)
                 NavigationLink {
                     ContributorsView()
                 } label: {
@@ -40,14 +39,34 @@ struct AboutView: View {
                 } label: {
                     Label(String(localized: "settings.acknowledgements.title"), systemImage: "heart.text.square")
                 }
+                #else
+                SettingsNavigationRow("settings.contributors.title", systemImage: "person.3") {
+                    ContributorsView()
+                }
+                SettingsNavigationRow("settings.translators.title", systemImage: "globe") {
+                    TranslationContributorsView()
+                }
+                SettingsNavigationRow("settings.acknowledgements.title", systemImage: "heart.text.square") {
+                    AcknowledgementsView()
+                }
+                #endif
             }
+            #if os(macOS)
+            .labelStyle(FixedIconWidthLabelStyle())
+            #endif
 
-            Section {
+            SettingsFormSection {
+                #if os(tvOS)
                 NavigationLink {
                     DeviceCapabilitiesView()
                 } label: {
                     Label(String(localized: "settings.advanced.deviceCapabilities"), systemImage: "cpu")
                 }
+                #else
+                SettingsNavigationRow("settings.advanced.deviceCapabilities", systemImage: "cpu") {
+                    DeviceCapabilitiesView()
+                }
+                #endif
             }
 
             versionInfoSection
@@ -65,26 +84,32 @@ struct AboutView: View {
 
     @ViewBuilder
     private var versionInfoSection: some View {
-        Section {
-            LabeledContent(String(localized: "settings.advanced.debug.appVersion")) {
-                Text(appVersion)
-            }
-
-            LabeledContent(String(localized: "settings.advanced.debug.buildNumber")) {
-                Text(buildNumber)
-            }
-
-            LabeledContent(String(localized: "settings.advanced.debug.osVersion")) {
-                Text(osVersion)
-            }
-        } header: {
-            Text(String(localized: "settings.about.versionInfo"))
+        SettingsFormSection("settings.about.versionInfo") {
+            versionInfoRow(label: String(localized: "settings.advanced.debug.appVersion"), value: appVersion)
+            versionInfoRow(label: String(localized: "settings.advanced.debug.buildNumber"), value: buildNumber)
+            versionInfoRow(label: String(localized: "settings.advanced.debug.osVersion"), value: osVersion)
         }
     }
 
+    @ViewBuilder
+    private func versionInfoRow(label: String, value: String) -> some View {
+        #if os(macOS)
+        HStack {
+            Text(label)
+            Spacer()
+            Text(value)
+                .foregroundStyle(.secondary)
+        }
+        #else
+        LabeledContent(label) {
+            Text(value)
+        }
+        #endif
+    }
+
     @ViewBuilder
     private var mpvInfoSection: some View {
-        Section {
+        SettingsFormSection("settings.about.mpvInfo") {
             if let versionInfo = appEnvironment?.playerService.mpvVersionInfo {
                 LabeledContent(String(localized: "settings.advanced.debug.mpvVersion")) {
                     Text(versionInfo.mpvVersion ?? "Unknown")
@@ -124,8 +149,6 @@ struct AboutView: View {
                     .foregroundStyle(.secondary)
                     .font(.footnote)
             }
-        } header: {
-            Text(String(localized: "settings.about.mpvInfo"))
         }
     }
 

Yattee/Views/Settings/DeviceCapabilitiesView.swift

@@ -11,7 +11,7 @@ struct DeviceCapabilitiesView: View {
     @Environment(\.appEnvironment) private var appEnvironment
 
     var body: some View {
-        List {
+        SettingsFormContainer {
             hardwareDecodingSection
             networkStatusSection
             effectiveSettingsSection
@@ -26,7 +26,7 @@ struct DeviceCapabilitiesView: View {
 
     @ViewBuilder
     private var hardwareDecodingSection: some View {
-        Section {
+        SettingsFormSection("settings.deviceCapabilities.hardwareDecoding", footer: "settings.deviceCapabilities.hardwareDecoding.footer") {
             ForEach(HardwareCapabilities.shared.allCapabilities, id: \.name) { capability in
                 HStack {
                     Text(capability.name)
@@ -40,10 +40,6 @@ struct DeviceCapabilitiesView: View {
                     }
                 }
             }
-        } header: {
-            Text(String(localized: "settings.deviceCapabilities.hardwareDecoding"))
-        } footer: {
-            Text(String(localized: "settings.deviceCapabilities.hardwareDecoding.footer"))
         }
     }
 
@@ -52,9 +48,12 @@ struct DeviceCapabilitiesView: View {
     @ViewBuilder
     private var networkStatusSection: some View {
         if let connectivity = appEnvironment?.connectivityMonitor {
-            Section {
-                LabeledContent(String(localized: "settings.deviceCapabilities.network.connection")) {
+            SettingsFormSection("settings.deviceCapabilities.networkStatus", footer: "settings.deviceCapabilities.networkStatus.footer") {
+                HStack {
+                    Text(String(localized: "settings.deviceCapabilities.network.connection"))
+                    Spacer()
                     Text(connectionTypeString(connectivity))
+                        .foregroundStyle(.secondary)
                 }
 
                 HStack {
@@ -74,10 +73,6 @@ struct DeviceCapabilitiesView: View {
                     Spacer()
                     statusIndicator(connectivity.isConstrained)
                 }
-            } header: {
-                Text(String(localized: "settings.deviceCapabilities.networkStatus"))
-            } footer: {
-                Text(String(localized: "settings.deviceCapabilities.networkStatus.footer"))
             }
         }
     }
@@ -88,18 +83,20 @@ struct DeviceCapabilitiesView: View {
     private var effectiveSettingsSection: some View {
         if let settings = appEnvironment?.settingsManager,
            let connectivity = appEnvironment?.connectivityMonitor {
-            Section {
-                LabeledContent(String(localized: "settings.deviceCapabilities.effective.qualityLimit")) {
+            SettingsFormSection("settings.deviceCapabilities.effectiveSettings", footer: "settings.deviceCapabilities.effectiveSettings.footer") {
+                HStack {
+                    Text(String(localized: "settings.deviceCapabilities.effective.qualityLimit"))
+                    Spacer()
                     Text(effectiveQualityString(settings: settings, connectivity: connectivity))
+                        .foregroundStyle(.secondary)
                 }
 
-                LabeledContent(String(localized: "settings.deviceCapabilities.effective.preferredCodecs")) {
+                HStack {
+                    Text(String(localized: "settings.deviceCapabilities.effective.preferredCodecs"))
+                    Spacer()
                     Text(HardwareCapabilities.shared.preferredCodecOrder.joined(separator: ", "))
+                        .foregroundStyle(.secondary)
                 }
-            } header: {
-                Text(String(localized: "settings.deviceCapabilities.effectiveSettings"))
-            } footer: {
-                Text(String(localized: "settings.deviceCapabilities.effectiveSettings.footer"))
             }
         }
     }