Sync UI from VertexAI for Firebase (#172)

Author: 1998code

Examples/GenerativeAISample/ChatSample/Screens/ConversationScreen.swift

@@ -94,6 +94,8 @@ struct ConversationScreen: View {
   }
 
   private func sendOrStop() {
+    focusedField = nil
+
     if viewModel.busy {
       viewModel.stop()
     } else {

Examples/GenerativeAISample/FunctionCallingSample/Screens/FunctionCallingScreen.swift

@@ -65,6 +65,9 @@ struct FunctionCallingScreen: View {
             }
           }
         })
+        .onTapGesture {
+          focusedField = nil
+        }
       }
       InputField("Message...", text: $userPrompt) {
         Image(systemName: viewModel.busy ? "stop.circle.fill" : "arrow.up.circle.fill")

Examples/GenerativeAISample/GenerativeAIMultimodalSample/Screens/PhotoReasoningScreen.swift

@@ -20,9 +20,17 @@ import SwiftUI
 struct PhotoReasoningScreen: View {
   @StateObject var viewModel = PhotoReasoningViewModel()
 
+  enum FocusedField: Hashable {
+    case message
+  }
+
+  @FocusState
+  var focusedField: FocusedField?
+
   var body: some View {
     VStack {
       MultimodalInputField(text: $viewModel.userInput, selection: $viewModel.selectedItems)
+        .focused($focusedField, equals: .message)
         .onSubmit {
           onSendTapped()
         }
@@ -47,11 +55,16 @@ struct PhotoReasoningScreen: View {
       }
     }
     .navigationTitle("Multimodal sample")
+    .onAppear {
+      focusedField = .message
+    }
   }
 
   // MARK: - Actions
 
   private func onSendTapped() {
+    focusedField = nil
+
     Task {
       await viewModel.reason()
     }

Examples/GenerativeAISample/GenerativeAITextSample/Screens/SummarizeScreen.swift

@@ -28,19 +28,23 @@ struct SummarizeScreen: View {
 
   var body: some View {
     VStack {
-      Text("Enter some text, then tap on _Go_ to summarize it.")
-      HStack(alignment: .top) {
-        TextField("Enter text summarize", text: $userInput, axis: .vertical)
-          .textFieldStyle(.roundedBorder)
-          .onSubmit {
+      VStack(alignment: .leading) {
+        Text("Enter some text, then tap on _Go_ to summarize it.")
+          .padding(.horizontal, 6)
+        HStack(alignment: .top) {
+          TextField("Enter text summarize", text: $userInput, axis: .vertical)
+            .focused($focusedField, equals: .message)
+            .textFieldStyle(.roundedBorder)
+            .onSubmit {
+              onSummarizeTapped()
+            }
+          Button("Go") {
             onSummarizeTapped()
           }
-        Button("Go") {
-          onSummarizeTapped()
+          .padding(.top, 4)
         }
-        .padding(.top, 4)
       }
-      .padding([.horizontal, .bottom])
+      .padding(.horizontal, 16)
 
       List {
         HStack(alignment: .top) {
@@ -61,6 +65,8 @@ struct SummarizeScreen: View {
   }
 
   private func onSummarizeTapped() {
+    focusedField = nil
+
     Task {
       await viewModel.summarize(inputText: userInput)
     }

Examples/GenerativeAISample/GenerativeAIUIComponents/Sources/GenerativeAIUIComponents/InputField.swift

@@ -60,10 +60,10 @@ public struct InputField<Label>: View where Label: View {
         }
 
         Button(action: submit, label: label)
-          .padding(.top, 4)
+          .padding(.bottom, 4)
       }
     }
-    .padding(.horizontal)
+    .padding(8)
   }
 }
 

Examples/GenerativeAISample/GenerativeAIUIComponents/Sources/GenerativeAIUIComponents/MultimodalInputField.swift

@@ -69,7 +69,7 @@ public struct MultimodalInputField: View {
         Button(action: showChooseAttachmentTypePicker) {
           Image(systemName: "plus")
         }
-        .padding(.top, 4)
+        .padding(.top, 10)
 
         VStack(alignment: .leading) {
           TextField(
@@ -110,7 +110,7 @@ public struct MultimodalInputField: View {
         Button(action: submit) {
           Text("Go")
         }
-        .padding(.top, 4)
+        .padding(.top, 8)
       }
     }
     .padding(.horizontal)