Feature/timetable feature grid2

app-ios/Sources/CommonComponents/Timetable/TimetableGridCard.swift

@@ -0,0 +1,88 @@
+import Foundation
+import SwiftUI
+import Theme
+import class shared.TimetableItem
+
+public struct TimetableGridCard: View {
+    let timetableItem: TimetableItem?
+    let onTap: (TimetableItem) -> Void
+
+    public init(
+        timetableItem: TimetableItem?,
+        onTap: @escaping (TimetableItem) -> Void
+    ) {
+        self.timetableItem = timetableItem
+        self.onTap = onTap
+    }
+
+    public var body: some View {
+        if let timetableItem {
+            Button {
+                onTap(timetableItem)
+            } label: {
+                VStack(alignment: .leading, spacing: 8) {
+                    HStack(spacing: 4) {
+                        timetableItem.room.type.shape
+                            .foregroundColor(timetableItem.room.roomTheme.primaryColor)
+                        Text("\(timetableItem.startsTimeString) - \(timetableItem.endsTimeString)")
+                            .textStyle(.labelMedium)
+                            .foregroundColor(timetableItem.room.roomTheme.primaryColor)
+                        Spacer()
+                    }
+
+                    Text(timetableItem.title.currentLangTitle)
+                        .textStyle(.titleMedium)
+                        .foregroundColor(timetableItem.room.roomTheme.primaryColor)
+                        .multilineTextAlignment(.leading)
+
+                    Spacer()
+
+                    ForEach(timetableItem.speakers, id: \.id) { speaker in
+                        HStack(spacing: 8) {
+                            Group {
+                                AsyncImage(url: URL(string: speaker.iconUrl)) {
+                                    $0.resizable()
+                                } placeholder: {
+                                    Color.gray
+                                }
+                            }
+                            .frame(width: 32, height: 32)
+                            .clipShape(Circle())
+
+                            Text(speaker.name)
+                                .textStyle(.titleSmall)
+                                .foregroundStyle(AssetColors.Surface.onSurfaceVariant.swiftUIColor)
+                                .lineLimit(1)
+                        }
+                    }
+                }
+                .frame(maxWidth: .infinity)
+                .padding(12)
+                .frame(width: 192, height: 153)
+                .background(timetableItem.room.roomTheme.containerColor, in: RoundedRectangle(cornerRadius: 4))
+                .overlay(RoundedRectangle(cornerRadius: 4).stroke(timetableItem.room.roomTheme.primaryColor, lineWidth: 1))
+            }
+        } else {
+            VStack {
+                //Empty on purpose
+            }
+            .frame(maxWidth: .infinity)
+            .padding(12)
+            .frame(width: 192, height: 153)
+            .background(Color.clear, in: RoundedRectangle(cornerRadius: 4))
+        }
+
+    }
+}
+
+#Preview {
+    VStack {
+        TimetableGridCard(
+            timetableItem: TimetableItem.Session.companion.fake(),
+            onTap: { _ in }
+        )
+        .padding(.horizontal, 16)
+    }
+    .frame(maxWidth: .infinity, maxHeight: .infinity)
+    .background(Color.black)
+}

app-ios/Sources/TimetableFeature/SampleData.swift

@@ -1,4 +1,5 @@
 import Foundation
+import CommonComponents
 import shared
 
 public enum DayTab: String, CaseIterable, Identifiable, Sendable {
@@ -28,6 +29,12 @@ public struct TimetableTimeGroupItems: Identifiable, Equatable, Hashable {
         self.endsTimeString = endsTimeString
         self.items = items
     }
+
+    func getItemForRoom(forRoom: RoomType) -> TimetableItemWithFavorite? {
+        items.filter {
+            $0.timetableItem.room.type == forRoom
+        }.first
+    }
 }
 
 // This exists only for previews now.

app-ios/Sources/TimetableFeature/TimetableListView.swift

@@ -33,8 +33,7 @@
             case TimetableMode.list:
                 TimetableListView(store: store)
             case TimetableMode.grid:
-                Text("Grid view placeholder")
-                    .foregroundStyle(AssetColors.Surface.onSurface.swiftUIColor)
+                TimetableGridView(store: store)
             }
             Spacer()
         }
@@ -107,6 +106,53 @@
     }
 }
 
+struct TimetableGridView: View {
+    private let store: StoreOf<TimetableReducer>
+
+    public init(store: StoreOf<TimetableReducer>) {
+        self.store = store
+    }
+
+    var body: some View {
+        let rooms = RoomType.allCases.filter {$0 != RoomType.roomIj}
+
+        ScrollView([.horizontal, .vertical]) {
+            Grid {
+                GridRow {
+                    Color.clear
+                        .gridCellUnsizedAxes([.horizontal, .vertical])
+
+                    ForEach(rooms, id: \.self) { column in
+
+                        let room = getTimetableRoom(type: column)
+
+                        Text(room.name.currentLangTitle).foregroundStyle(room.roomTheme.primaryColor)
+                            .frame(width: 192)
+                    }
+                }
+                ForEach(store.timetableItems, id: \.self) { timeBlock in
+                    GridRow {
+                        VStack {
+                            Text(timeBlock.startsTimeString).foregroundStyle(AssetColors.Surface.onSurface.swiftUIColor)
+                            Spacer()
+
+                        }.frame(height: 153)
+
+
+                        ForEach(rooms, id: \.self) { room in
+
+                            timeBlock.getCellForRoom(room: room, onTap: { item in
+                                store.send(.view(.timetableItemTapped))
+                            })
+                        }
+                    }
+                }
+            }
+        }
+
+    }
+}
+
 struct TimeGroupMiniList: View {
     let contents: TimetableTimeGroupItems
     let onItemTap: (TimetableItemWithFavorite) -> Void
@@ -136,38 +182,86 @@
     }
 }
 
-struct TagView: View {
-    let tagText: String
-    let highlight: Bool
-
-    var body: some View {
-        HStack {
-            if highlight {
-                Image(systemName: "diamond.fill").resizable().frame(width: 11,height: 11).foregroundStyle(AssetColors.Custom.flamingo.swiftUIColor)
-                    .padding(-3)
-            }
-            Text(tagText).foregroundStyle(highlight ? AssetColors.Custom.flamingo.swiftUIColor : AssetColors.Surface.onSurface.swiftUIColor)
-        }
-        .padding(
-            EdgeInsets(top: 2,leading: 7, bottom: 2, trailing: 7))
-        .border(highlight ? AssetColors.Custom.flamingo.swiftUIColor : AssetColors.Surface.onSurface.swiftUIColor)
-        .padding(-2)
+func getTimetableRoom(type: RoomType) -> TimetableRoom {
+    switch (type) {
+    case .roomI:
+        return TimetableRoom(
+            id: 1,
+            name: MultiLangText(
+                jaTitle: "Iguana",
+                enTitle: "Iguana"
+            ),
+            type: .roomI,
+            sort: 1
+        )
+    case .roomG:
+        return TimetableRoom(
+            id: 2,
+            name: MultiLangText(
+                jaTitle: "Giraffe",
+                enTitle: "Giraffe"
+            ),
+            type: .roomG,
+            sort: 2
+        )
+    case .roomH:
+        return TimetableRoom(
+            id: 3,
+            name: MultiLangText(
+                jaTitle: "Hedgehog",
+                enTitle: "Hedgehog"
+            ),
+            type: .roomH,
+            sort: 3
+        )
+    case .roomF:
+        return TimetableRoom(
+            id: 4,
+            name: MultiLangText(
+                jaTitle: "Flamingo",
+                enTitle: "Flamingo"
+            ),
+            type: .roomF,
+            sort: 4
+        )
+    case .roomJ:
+        return TimetableRoom(
+            id: 5,
+            name: MultiLangText(
+                jaTitle: "Jellyfish",
+                enTitle: "Jellyfish"
+            ),
+            type: .roomJ,
+            sort: 5
+        )
+    case .roomIj:
+        return TimetableRoom(
+            id: 6,
+            name: MultiLangText(
+                jaTitle: "All",
+                enTitle: "All"
+            ),
+            type: .roomIj,
+            sort: 6
+        )
     }
 }
 
-struct PhotoView: View {
-    //TODO: Replace this with an actual photo render
-    let photo: String
-    let name: String
-
-    var body: some View {
-        HStack {
-            Image(systemName:photo).resizable().frame(width: 32,height: 32).foregroundStyle(AssetColors.Custom.flamingo.swiftUIColor)
-            Text(name)
+extension TimetableTimeGroupItems {
+    func getCellForRoom(room: RoomType, onTap: @escaping (TimetableItem) -> Void) -> TimetableGridCard {
+        return if let cell = getItemForRoom(forRoom: room) {
+            TimetableGridCard(timetableItem: cell.timetableItem) { timetableItem in
+                onTap(timetableItem)
+            }
+        } else {
+            TimetableGridCard(timetableItem: nil) { _ in
+                // Does nothing
+            }
         }
     }
 }
 
+
 #Preview {
     TimetableView(
         store: .init(initialState: .init(timetableItems: SampleData.init().workdayResults),