Refactor to use Bedrock's iCloudSyncSettingsView and CloudSyncable protocol

SelfieCam/Features/Settings/SettingsView.swift

@@ -517,82 +517,12 @@ struct SettingsView: View {
     // MARK: - iCloud Sync Section
     
     private var iCloudSyncSection: some View {
-        VStack(alignment: .leading, spacing: Design.Spacing.small) {
-            // Sync toggle
-            Toggle(isOn: $viewModel.iCloudEnabled) {
-                VStack(alignment: .leading, spacing: Design.Spacing.xxSmall) {
-                    Text(String(localized: "Sync Settings"))
-                        .font(.system(size: Design.BaseFontSize.medium, weight: .medium))
-                        .foregroundStyle(.white)
-                    
-                    Text(viewModel.iCloudAvailable
-                        ? String(localized: "Sync settings across all your devices")
-                        : String(localized: "Sign in to iCloud to enable sync"))
-                        .font(.system(size: Design.BaseFontSize.body))
-                        .foregroundStyle(.white.opacity(Design.Opacity.medium))
-                }
-            }
-            .tint(AppAccent.primary)
-            .padding(.vertical, Design.Spacing.xSmall)
-            .disabled(!viewModel.iCloudAvailable)
-            .accessibilityHint(String(localized: "Syncs settings across all your devices via iCloud"))
-            
-            // Sync status (show when enabled and available)
-            if viewModel.iCloudEnabled && viewModel.iCloudAvailable {
-                HStack(spacing: Design.Spacing.small) {
-                    Image(systemName: syncStatusIcon)
-                        .font(.system(size: Design.BaseFontSize.body))
-                        .foregroundStyle(syncStatusColor)
-                    
-                    Text(syncStatusText)
-                        .font(.system(size: Design.BaseFontSize.caption))
-                        .foregroundStyle(.white.opacity(Design.Opacity.medium))
-                    
-                    Spacer()
-                    
-                    Button {
-                        viewModel.forceSync()
-                    } label: {
-                        Text(String(localized: "Sync Now"))
-                            .font(.system(size: Design.BaseFontSize.caption, weight: .medium))
-                            .foregroundStyle(AppAccent.primary)
-                    }
-                }
-                .padding(.top, Design.Spacing.xSmall)
-            }
-        }
-    }
-    
-    // MARK: - Sync Status Helpers
-    
-    private var syncStatusIcon: String {
-        if !viewModel.hasCompletedInitialSync {
-            return "arrow.triangle.2.circlepath"
-        }
-        return viewModel.syncStatus.isEmpty ? "checkmark.icloud" : "icloud"
-    }
-    
-    private var syncStatusColor: Color {
-        if !viewModel.hasCompletedInitialSync {
-            return AppStatus.warning
-        }
-        return AppStatus.success
-    }
-    
-    private var syncStatusText: String {
-        if !viewModel.hasCompletedInitialSync {
-            return String(localized: "Syncing...")
-        }
-        
-        if let lastSync = viewModel.lastSyncDate {
-            let formatter = RelativeDateTimeFormatter()
-            formatter.unitsStyle = .abbreviated
-            return String(localized: "Last synced \(formatter.localizedString(for: lastSync, relativeTo: Date()))")
-        }
-        
-        return viewModel.syncStatus.isEmpty
-            ? String(localized: "Synced")
-            : viewModel.syncStatus
+        iCloudSyncSettingsView(
+            viewModel: viewModel,
+            accentColor: AppAccent.primary,
+            successColor: AppStatus.success,
+            warningColor: AppStatus.warning
+        )
     }
     
     // MARK: - Acknowledgments Section

SelfieCam/Features/Settings/SettingsViewModel.swift

@@ -38,7 +38,7 @@ enum TimerOption: String, CaseIterable, Identifiable {
 /// Premium features are automatically reset to defaults when user doesn't have premium.
 @MainActor
 @Observable
-final class SettingsViewModel: RingLightConfigurable {
+final class SettingsViewModel: RingLightConfigurable, CloudSyncable {
     
     // MARK: - Ring Size Limits