[Building Sync-ups Tutorial] fixes in "Navigating to sync-up detail" chapter (#3581)

* Update CardView to use foregroundStyle instead of deprecated foregroundColor

* Update SyncUps tutorial code to use Array with shared collection in ForEach

* refactor: update shared SyncUp and path handling to fix compilation errors

- Encapsulate `sharedSyncUp` with `Shared`.
- Update path manipulation to use case-based 
access. 
- Update `syncUps` list with locking mechanism.

* Update Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation.tutorial

---------

Co-authored-by: Stephen Celis <[email protected]>

Author: FredericRuaudel

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation-03-code-0001-previous.swift

@@ -66,7 +66,7 @@ struct CardView: View {
       .font(.caption)
     }
     .padding()
-    .foregroundColor(syncUp.theme.accentColor)
+    .foregroundStyle(syncUp.theme.accentColor)
   }
 }
 

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation-03-code-0001.swift

@@ -66,7 +66,7 @@ struct CardView: View {
       .font(.caption)
     }
     .padding()
-    .foregroundColor(syncUp.theme.accentColor)
+    .foregroundStyle(syncUp.theme.accentColor)
   }
 }
 

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation-03-code-0002.swift

@@ -66,7 +66,7 @@ struct CardView: View {
       .font(.caption)
     }
     .padding()
-    .foregroundColor(syncUp.theme.accentColor)
+    .foregroundStyle(syncUp.theme.accentColor)
   }
 }
 

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation-03-code-0003.swift

@@ -11,7 +11,7 @@ struct SyncUpsListView: View {
 
   var body: some View {
     List {
-      ForEach(store.$syncUps) { $syncUp in
+      ForEach(Array(store.$syncUps)) { $syncUp in
         NavigationLink(
           state: AppFeature.Path.State.detail(SyncUpDetail.State(syncUp: <#Shared<SyncUp>#>))
         ) {
@@ -66,7 +66,7 @@ struct CardView: View {
       .font(.caption)
     }
     .padding()
-    .foregroundColor(syncUp.theme.accentColor)
+    .foregroundStyle(syncUp.theme.accentColor)
   }
 }
 

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation-03-code-0004.swift

@@ -66,7 +66,7 @@ struct CardView: View {
       .font(.caption)
     }
     .padding()
-    .foregroundColor(syncUp.theme.accentColor)
+    .foregroundStyle(syncUp.theme.accentColor)
   }
 }
 

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/SyncUpDetailNavigation.tutorial

@@ -238,8 +238,12 @@
       element in the collection.
 
       @Step {
-        Pass the shared collection to the `ForEach` to derive a `Shared<SyncUp>` for each element in
-        the `Shared<IdentifiedArrayOf<SyncUp>>`.
+        Convert the shared collection of sync-ups into a collection of shared sync-ups and pass it
+        along to `ForEach`.
+
+        > Tip: While we use an `Array` initializer to do this conversion, it is possible to use any range
+        > replaceable collection.
+        
         @Code(name: "SyncUpsList.swift", file: SyncUpDetailNavigation-03-code-0003.swift)
       }
 

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/TestingNavigation-01-code-0005.swift

@@ -14,7 +14,7 @@ struct AppFeatureTests {
       AppFeature()
     }
 
-    let sharedSyncUp = try #require($syncUps[id: syncUp.id])
+    let sharedSyncUp = try #require(Shared($syncUps[id: syncUp.id]))
 
     await store.send(\.path.push, (id: 0, .detail(SyncUpDetail.State(syncUp: sharedSyncUp)))) {
       $0.path[id: 0] = .detail(SyncUpDetail.State(syncUp: sharedSyncUp))

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/TestingNavigation-01-code-0006.swift

@@ -14,14 +14,14 @@ struct AppFeatureTests {
       AppFeature()
     }
 
-    let sharedSyncUp = try #require($syncUps[id: syncUp.id])
+    let sharedSyncUp = try #require(Shared($syncUps[id: syncUp.id]))
 
     await store.send(\.path.push, (id: 0, .detail(SyncUpDetail.State(syncUp: sharedSyncUp)))) {
       $0.path[id: 0] = .detail(SyncUpDetail.State(syncUp: sharedSyncUp))
     }
 
     await store.send(\.path[id:0].detail.deleteButtonTapped) {
-      $0.path[id: 0]?.detail?.destination = .alert(.deleteSyncUp)
+      $0.path[id: 0, case: \.detail]?.destination = .alert(.deleteSyncUp)
     }
   }
 }

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/TestingNavigation-01-code-0007.swift

@@ -14,19 +14,19 @@ struct AppFeatureTests {
       AppFeature()
     }
 
-    let sharedSyncUp = try #require($syncUps[id: syncUp.id])
+    let sharedSyncUp = try #require(Shared($syncUps[id: syncUp.id]))
 
     await store.send(\.path.push, (id: 0, .detail(SyncUpDetail.State(syncUp: sharedSyncUp)))) {
       $0.path[id: 0] = .detail(SyncUpDetail.State(syncUp: sharedSyncUp))
     }
 
     await store.send(\.path[id:0].detail.deleteButtonTapped) {
-      $0.path[id: 0]?.detail?.destination = .alert(.deleteSyncUp)
+      $0.path[id: 0, case: \.detail]?.destination = .alert(.deleteSyncUp)
     }
 
     await store.send(\.path[id:0].detail.destination.alert.confirmButtonTapped) {
       $0.path[id: 0, case: \.detail]?.destination = nil
-      $0.syncUpsList.syncUps = []
+      $0.syncUpsList.$syncUps.withLock { $0 = [] }
     }
   }
 }

Sources/ComposableArchitecture/Documentation.docc/Tutorials/BuildingSyncUps/07-SyncUpDetailNavigation/TestingNavigation-01-code-0008.swift

@@ -14,19 +14,19 @@ struct AppFeatureTests {
       AppFeature()
     }
 
-    let sharedSyncUp = try #require($syncUps[id: syncUp.id])
+    let sharedSyncUp = try #require(Shared($syncUps[id: syncUp.id]))
 
     await store.send(\.path.push, (id: 0, .detail(SyncUpDetail.State(syncUp: sharedSyncUp)))) {
       $0.path[id: 0] = .detail(SyncUpDetail.State(syncUp: sharedSyncUp))
     }
 
     await store.send(\.path[id:0].detail.deleteButtonTapped) {
-      $0.path[id: 0]?.detail?.destination = .alert(.deleteSyncUp)
+      $0.path[id: 0, case: \.detail]?.destination = .alert(.deleteSyncUp)
     }
 
     await store.send(\.path[id:0].detail.destination.alert.confirmButtonTapped) {
       $0.path[id: 0, case: \.detail]?.destination = nil
-      $0.syncUpsList.syncUps = []
+      $0.syncUpsList.$syncUps.withLock { $0 = [] }
     }
 
     await store.receive(\.path.popFrom) {