fix out of order cards

OnCuePresenter Watch App/OnCuePresenterApp.swift

@@ -6,12 +6,29 @@
 //
 
 import SwiftUI
+import SwiftData
 
 @main
 struct OnCuePresenter_Watch_AppApp: App {
+    var sharedModelContainer: ModelContainer = {
+        let schema = Schema([
+            OCProject.self,
+            OCCard.self,
+//            Item.self,
+        ])
+        let modelConfiguration = ModelConfiguration(schema: schema, isStoredInMemoryOnly: false)
+
+        do {
+            return try ModelContainer(for: schema, configurations: [modelConfiguration])
+        } catch {
+            fatalError("Could not create ModelContainer: \(error)")
+        }
+    }()
+    
     var body: some Scene {
         WindowGroup {
             MainViewPresenter()
         }
+        .modelContainer(sharedModelContainer)
     }
 }

OnCuePresenter Watch App/View/CueCardViewPresenter.swift

@@ -0,0 +1,40 @@
+//
+//  CueCardViewPresenter.swift
+//  OnCuePresenter Watch App
+//
+//  Created by Pradyun Setti on 22/06/2024.
+//
+
+import SwiftUI
+
+struct CueCardViewPresenter: View {
+    let project: OCProject
+    
+    var body: some View {
+        TabView() {
+            ForEach(project.cards) { card in
+                CueCardView(card: card)
+            }
+        }
+        .tabViewStyle(PageTabViewStyle(indexDisplayMode: .always))
+    }
+}
+
+struct CueCardView: View {
+    let card: OCCard
+    
+    var body: some View {
+        VStack(alignment: .leading) {
+            Text(card.content)
+                .foregroundColor(.primary)
+                .font(.system(size: 25))
+                .padding()
+                .frame(height: 550)
+            Spacer()
+        }
+    }
+}
+
+#Preview {
+    CueCardViewPresenter(project: PreviewData.project)
+}

OnCuePresenter Watch App/View/MainViewPresenter.swift

@@ -6,19 +6,54 @@
 //
 
 import SwiftUI
+import SwiftData
 
 struct MainViewPresenter: View {
+    @Environment(\.modelContext) private var modelContext
+    @Query private var items: [OCProject]
+    
+    @State private var newProjectName = ""
+    @State private var addNewProject = false
+    
     var body: some View {
-        VStack {
-            Image(systemName: "globe")
-                .imageScale(.large)
-                .foregroundStyle(.tint)
-            Text("Hello, world!")
+        NavigationSplitView {
+            List {
+                ForEach(items) { project in
+                    NavigationLink {
+                        CueCardViewPresenter(project: project)
+                    } label: {
+                        VStack(alignment: .leading) {
+                            Text("\(project.name)")
+                                .bold()
+                                .font(.title2)
+                                .foregroundStyle(Color(hex: project.color) ?? .white)
+                            Text("\(project.cards.count) \(project.cards.count == 1 ? "Card" : "Cards")")
+                        }
+                    }
+                    .padding(.vertical, 3)
+                }
+                
+            }
+            .toolbar {
+                ToolbarItem {
+                    Button(action: { modelContext.insert(PreviewData.project); try! modelContext.save() }) {
+                        Label("Add Item", systemImage: "plus")
+                    }
+                }
+            }
+            .navigationTitle("Projects")
+        } detail: {
+            Text("Select an item")
         }
-        .padding()
     }
 }
 
 #Preview {
-    MainViewPresenter()
+    let config = ModelConfiguration(isStoredInMemoryOnly: true)
+    let container = try! ModelContainer(for: OCProject.self, configurations: config)
+    
+    container.mainContext.insert(PreviewData.project)
+    
+    return MainViewPresenter()
+            .modelContainer(container)
 }