feat(iOS): search placeholder

apps/mobile/metro-now/metro-now/ContentView.swift

@@ -11,6 +11,8 @@ struct ContentView: View {
         AppStorageKeys.hasSeenWelcomeScreen.rawValue
     ) var hasSeenWelcomeScreen = false
     @State private var showWelcomeScreen: Bool = false
+    @State private var showSearchScreen: Bool = true
+    @State private var searchText = ""
 
     var body: some View {
         ZStack {
@@ -24,15 +26,24 @@ struct ContentView: View {
                                 Label("Settings", systemImage: "gearshape")
                             }
                         }
-//                        ToolbarItem(placement: .topBarTrailing) {
-//                            NavigationLink {
-//                                SettingsPageView()
-//                            } label: {
-//                                Label("Search", systemImage: "magnifyingglass")
-//                            }
-//                        }
+                        ToolbarItem(placement: .topBarTrailing) {
+                            Button(action: {
+                                showSearchScreen = true
+                            }) {
+                                Label("Search", systemImage: "magnifyingglass")
+                            }
+                        }
                     }
             }
+            .sheet(
+                isPresented: $showSearchScreen,
+                onDismiss: {
+                    showSearchScreen = false
+                }
+            ) {
+                SearchPageView()
+                    .presentationDetents([.large])
+            }
             .sheet(
                 isPresented: $showWelcomeScreen,
                 onDismiss: dismissWelcomeScreen

apps/mobile/metro-now/metro-now/pages/search/search-page.view.swift

@@ -0,0 +1,85 @@
+// metro-now
+// https://github.com/krystxf/metro-now
+
+import SwiftUI
+
+private enum Sorting: String, CaseIterable, Identifiable {
+    case alphabetical, distance
+    var id: Self { self }
+}
+
+private enum Filter: String, CaseIterable, Identifiable {
+    case all, metro
+    var id: Self { self }
+}
+
+struct SearchPageView: View {
+    @State private var searchText = ""
+    @StateObject private var viewModel = ClosestStopPageViewModel()
+
+    @Environment(\.dismiss) private var dismiss
+    @State private var sorting: Sorting = .distance
+    @State private var filter: Filter = .metro
+
+    var body: some View {
+        NavigationStack {
+            List {
+                if filter == .metro {
+                    if let stops = viewModel.metroStops {
+                        ForEach(stops, id: \.id) { stop in
+                            Text(stop.name)
+                        }
+                    }
+                } else {
+                    if let stops = viewModel.allStops {
+                        ForEach(stops, id: \.id) { stop in
+                            Text(stop.name)
+                        }
+                    }
+                }
+            }
+            .searchable(
+                text: $searchText,
+                placement: .navigationBarDrawer(displayMode: .always)
+            )
+            .navigationTitle("Search")
+            .toolbar {
+                ToolbarItem(placement: .topBarLeading) {
+                    Menu {
+                        Button("Distance", action: {})
+                        Button("A-Z", action: {})
+                    } label: {
+                        Label("Sorting", systemImage: "arrow.up.arrow.down")
+                    }
+                }
+                ToolbarItem(placement: .principal) {
+                    Picker("Filter", selection: $filter) {
+                        Text("Metro").tag(Filter.metro)
+                        Text("All").tag(Filter.all)
+                    }
+                    .pickerStyle(.inline)
+                    .frame(maxWidth: 200)
+                }
+                ToolbarItem(placement: .topBarTrailing) {
+                    Button(
+                        action: {
+                            dismiss()
+                        }
+                    ) {
+                        Label("Close", systemImage: "xmark")
+                    }
+                    //                    Picker("Flavor", selection: $selectedFlavor) {
+//                        Text("Distance").tag(Sorting.distance)
+//                        Label("A-Z", systemImage: "textformat.characters").tag(Sorting.alphabetical)
+//                        }
+//
+//                    .pickerStyle(.menu)
+                }
+            }
+        }
+    }
+}
+
+#Preview {
+    SearchPageView()
+}