Add WatchOS App

Author: alfianlosari

Shared/ContentView.swift

@@ -36,9 +36,11 @@ struct ContentView: View {
                     }
                 }
 
+                #if !os(watchOS)
                 Divider()
                 bottomView(image: "profile", proxy: proxy)
                 Spacer()
+                #endif
             }
             .onChange(of: vm.messages.last?.responseText) { _ in  scrollToBottom(proxy: proxy)
             }
@@ -64,7 +66,9 @@ struct ContentView: View {
             }
 
             TextField("Send message", text: $vm.inputMessage, axis: .vertical)
+                #if !os(watchOS)
                 .textFieldStyle(.roundedBorder)
+                #endif
                 .focused($isTextFieldFocused)
                 .disabled(vm.isInteractingWithChatGPT)
 

Shared/MessageRowView.swift

@@ -15,64 +15,81 @@ struct MessageRowView: View {
 
     var body: some View {
         VStack(spacing: 0) {
-            
             messageRow(text: message.sendText, image: message.sendImage, bgColor: colorScheme == .light ? .white : Color(red: 52/255, green: 53/255, blue: 65/255, opacity: 0.5))
 
             if let text = message.responseText {
                 Divider()
                 messageRow(text: text, image: message.responseImage, bgColor: colorScheme == .light ? .gray.opacity(0.1) : Color(red: 52/255, green: 53/255, blue: 65/255, opacity: 1), responseError: message.responseError, showDotLoading: message.isInteractingWithChatGPT)
                 Divider()
             }
-            
         }
-        
     }
 
     func messageRow(text: String, image: String, bgColor: Color, responseError: String? = nil, showDotLoading: Bool = false) -> some View {
+        #if os(watchOS)
+        VStack(alignment: .leading, spacing: 8) {
+            messageRowContent(text: text, image: image, responseError: responseError, showDotLoading: showDotLoading)
+        }
+        
+        .padding(16)
+        .frame(maxWidth: .infinity, alignment: .leading)
+        .background(bgColor)
+        
+        #else
         HStack(alignment: .top, spacing: 24) {
-            if image.hasPrefix("http"), let url = URL(string: image) {
-                AsyncImage(url: url) { image in
-                    image
-                        .resizable()
-                        .frame(width: 25, height: 25)
-                } placeholder: {
-                    ProgressView()
-                }
-
-            } else {
-                Image(image)
+            messageRowContent(text: text, image: image, responseError: responseError, showDotLoading: showDotLoading)
+        }
+        .padding(16)
+        .frame(maxWidth: .infinity, alignment: .leading)
+        .background(bgColor)
+        #endif
+    }
+    
+    @ViewBuilder
+    func messageRowContent(text: String, image: String, responseError: String? = nil, showDotLoading: Bool = false) -> some View {
+        if image.hasPrefix("http"), let url = URL(string: image) {
+            AsyncImage(url: url) { image in
+                image
                     .resizable()
                     .frame(width: 25, height: 25)
+            } placeholder: {
+                ProgressView()
+            }
+
+        } else {
+            Image(image)
+                .resizable()
+                .frame(width: 25, height: 25)
+        }
+        
+        VStack(alignment: .leading) {
+            if !text.isEmpty {
+                Text(text)
+                    .multilineTextAlignment(.leading)
+                    #if !os(watchOS)
+                    .textSelection(.enabled)
+                    #endif
             }
 
-            VStack(alignment: .leading) {
-                if !text.isEmpty {
-                    Text(text)
-                        .multilineTextAlignment(.leading)
-                        .textSelection(.enabled)
-                }
-                
-                if let error = responseError {
-                    Text("Error: \(error)")
-                        .foregroundColor(.red)
-                        .multilineTextAlignment(.leading)
-                    
-                    Button("Regenerate response") {
-                        retryCallback(message)
-                    }
-                    .foregroundColor(.accentColor)
-                    .padding(.top)
-                }
+            if let error = responseError {
+                Text("Error: \(error)")
+                    .foregroundColor(.red)
+                    .multilineTextAlignment(.leading)
 
-                if showDotLoading {
-                    DotLoadingView()
-                        .frame(width: 60, height: 30)
+                Button("Regenerate response") {
+                    retryCallback(message)
                 }
+                .foregroundColor(.accentColor)
+                .padding(.top)
+            }
+            
+            if showDotLoading {
+                DotLoadingView()
+                    .frame(width: 60, height: 30)
             }
         }
-        .padding(16)
-        .frame(maxWidth: .infinity, alignment: .leading)
-        .background(bgColor)
+
+        
     }
 
 }