Added transaction option in group options & fix otp keyboard issue

Splito.xcodeproj/project.pbxproj

@@ -10,6 +10,7 @@
 		0BF8F99614F85846D78DE106 /* Pods_Splito_SplitoUITests.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = C2B9BBF3F71277A6AA5329CB /* Pods_Splito_SplitoUITests.framework */; };
 		213BA0602C0F465000116130 /* GroupSettleUpRouteView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 213BA05F2C0F465000116130 /* GroupSettleUpRouteView.swift */; };
 		213BA0662C11B70F00116130 /* HomeRouteViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 213BA0652C11B70F00116130 /* HomeRouteViewModel.swift */; };
+		2156A8B02C24069800CFAB64 /* GroupTransactionsRouteView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2156A8AF2C24069800CFAB64 /* GroupTransactionsRouteView.swift */; };
 		2177692B2C203160009B3B37 /* GroupTransactionDetailView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2177692A2C203160009B3B37 /* GroupTransactionDetailView.swift */; };
 		2177692D2C20316B009B3B37 /* GroupTransactionDetailViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2177692C2C20316B009B3B37 /* GroupTransactionDetailViewModel.swift */; };
 		217BEC122C00AD78000CBBB4 /* GoogleService-Info.plist in Resources */ = {isa = PBXBuildFile; fileRef = 217BEC112C00AD78000CBBB4 /* GoogleService-Info.plist */; };
@@ -138,6 +139,7 @@
 		038CCD15E82A4E16A4AD213C /* Pods-Splito-SplitoUITests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Splito-SplitoUITests.release.xcconfig"; path = "Target Support Files/Pods-Splito-SplitoUITests/Pods-Splito-SplitoUITests.release.xcconfig"; sourceTree = "<group>"; };
 		213BA05F2C0F465000116130 /* GroupSettleUpRouteView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupSettleUpRouteView.swift; sourceTree = "<group>"; };
 		213BA0652C11B70F00116130 /* HomeRouteViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HomeRouteViewModel.swift; sourceTree = "<group>"; };
+		2156A8AF2C24069800CFAB64 /* GroupTransactionsRouteView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupTransactionsRouteView.swift; sourceTree = "<group>"; };
 		2177692A2C203160009B3B37 /* GroupTransactionDetailView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupTransactionDetailView.swift; sourceTree = "<group>"; };
 		2177692C2C20316B009B3B37 /* GroupTransactionDetailViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupTransactionDetailViewModel.swift; sourceTree = "<group>"; };
 		217BEC0F2C00AB9E000CBBB4 /* Secrets.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; path = Secrets.xcconfig; sourceTree = "<group>"; };
@@ -274,6 +276,17 @@
 /* End PBXFrameworksBuildPhase section */
 
 /* Begin PBXGroup section */
+		2156A8AE2C24064400CFAB64 /* Transactions */ = {
+			isa = PBXGroup;
+			children = (
+				2156A8AF2C24069800CFAB64 /* GroupTransactionsRouteView.swift */,
+				21B1C0992C1C59F10098B4FD /* GroupTransactionListView.swift */,
+				21B1C09B2C1C5A040098B4FD /* GroupTransactionListViewModel.swift */,
+				2177692E2C206678009B3B37 /* Transaction Detail */,
+			);
+			path = Transactions;
+			sourceTree = "<group>";
+		};
 		2177692E2C206678009B3B37 /* Transaction Detail */ = {
 			isa = PBXGroup;
 			children = (
@@ -286,22 +299,11 @@
 		21B1C0972C1C59630098B4FD /* More Options */ = {
 			isa = PBXGroup;
 			children = (
-				21B1C0982C1C59C10098B4FD /* Transactions */,
 				D8A7CA732BA486290014EC67 /* Group Setting */,
 			);
 			path = "More Options";
 			sourceTree = "<group>";
 		};
-		21B1C0982C1C59C10098B4FD /* Transactions */ = {
-			isa = PBXGroup;
-			children = (
-				21B1C0992C1C59F10098B4FD /* GroupTransactionListView.swift */,
-				21B1C09B2C1C5A040098B4FD /* GroupTransactionListViewModel.swift */,
-				2177692E2C206678009B3B37 /* Transaction Detail */,
-			);
-			path = Transactions;
-			sourceTree = "<group>";
-		};
 		7530D0A01F0D8D2C363B2A6E /* Frameworks */ = {
 			isa = PBXGroup;
 			children = (
@@ -342,6 +344,7 @@
 			isa = PBXGroup;
 			children = (
 				D83344562C0DD03B00CD9F05 /* Settle up */,
+				2156A8AE2C24064400CFAB64 /* Transactions */,
 				D83344552C0DD02F00CD9F05 /* Balances */,
 				D833445F2C0EF1D300CD9F05 /* Totals */,
 			);
@@ -1030,6 +1033,7 @@
 				D85E86E92BB3FD49002EDF76 /* ChoosePayerView.swift in Sources */,
 				D833446E2C0F2D4C00CD9F05 /* GroupWhoGettingPaidViewModel.swift in Sources */,
 				D856C7342BCFD2260008A341 /* ExpenseDetailsViewModel.swift in Sources */,
+				2156A8B02C24069800CFAB64 /* GroupTransactionsRouteView.swift in Sources */,
 				D8AC26F62B84B12800CEAAD3 /* LoginViewModel.swift in Sources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;

Splito/Localization/Localizable.xcstrings

@@ -127,6 +127,9 @@
     },
     "Choose Payer" : {
 
+    },
+    "Code" : {
+
     },
     "Countries" : {
 
@@ -355,9 +358,6 @@
     },
     "Share this invitation code with your trusted one in your own style. Connecting with your friends is as flexible as you are." : {
 
-    },
-    "Show transaction" : {
-
     },
     "Sign in with Apple" : {
       "extractionState" : "manual"

Splito/UI/Home/Groups/Add Member/JoinMemberView.swift

@@ -47,7 +47,7 @@ private struct JoinWithCodeView: View {
 
     var body: some View {
         VStack(alignment: .center, spacing: 10) {
-            TextField("", text: $code)
+            TextField("Code", text: $code)
                 .font(.subTitle1(34))
                 .foregroundColor(primaryText)
                 .kerning(16)

Splito/UI/Home/Groups/Group/Group Options/Settle up/Payment/GroupPaymentViewModel.swift

@@ -23,9 +23,6 @@ class GroupPaymentViewModel: BaseViewModel, ObservableObject {
     @Published private(set) var receiver: AppUser?
     @Published private(set) var viewState: ViewState = .initial
 
-    @Published private(set) var payerId: String
-    @Published private(set) var receiverId: String
-    @Published private(set) var transactionId: String?
     @Published private(set) var dismissPaymentFlow: () -> Void
 
     var payerName: String {
@@ -38,7 +35,10 @@ class GroupPaymentViewModel: BaseViewModel, ObservableObject {
         return user.id == receiverId ? "You" : receiver?.nameWithLastInitial ?? "Unknown"
     }
 
+    let transactionId: String?
     private let groupId: String
+    private let payerId: String
+    private let receiverId: String
     private var transaction: Transactions?
     private let router: Router<AppRoute>?
 

Splito/UI/Home/Groups/Group/More Options/Transactions/GroupTransactionListView.swift → Splito/UI/Home/Groups/Group/Group Options/Transactions/GroupTransactionListView.swift

@@ -13,6 +13,8 @@ struct GroupTransactionListView: View {
 
     @StateObject var viewModel: GroupTransactionListViewModel
 
+    @Environment(\.dismiss) var dismiss
+
     var body: some View {
         VStack(alignment: .center) {
             if case .loading = viewModel.currentViewState {
@@ -35,6 +37,13 @@ struct GroupTransactionListView: View {
         .backport.alert(isPresented: $viewModel.showAlert, alertStruct: viewModel.alert)
         .frame(maxWidth: isIpad ? 600 : nil, alignment: .center)
         .navigationBarTitle("Transactions", displayMode: .inline)
+        .toolbar {
+            ToolbarItem(placement: .topBarLeading) {
+                Button("Cancel") {
+                    dismiss()
+                }
+            }
+        }
         .onAppear(perform: viewModel.fetchTransactions)
     }
 }

Splito/UI/Home/Groups/Group/Group Options/Transactions/GroupTransactionsRouteView.swift

@@ -0,0 +1,39 @@
+//
+//  GroupTransactionsRouteView.swift
+//  Splito
+//
+//  Created by Nirali Sonani on 20/06/24.
+//
+
+import BaseStyle
+import Data
+import SwiftUI
+
+struct GroupTransactionsRouteView: View {
+
+    @StateObject var appRoute: Router<AppRoute>
+
+    var dismissPaymentFlow: () -> Void
+
+    init(appRoute: Router<AppRoute>, dismissPaymentFlow: @escaping () -> Void) {
+        self._appRoute = StateObject(wrappedValue: appRoute)
+        self.dismissPaymentFlow = dismissPaymentFlow
+    }
+
+    var body: some View {
+        RouterView(router: appRoute) { route in
+            switch route {
+            case .TransactionListView(let groupId):
+                GroupTransactionListView(viewModel: GroupTransactionListViewModel(router: appRoute, groupId: groupId))
+            case .TransactionDetailView(let transactionId, let groupId):
+                GroupTransactionDetailView(viewModel: GroupTransactionDetailViewModel(router: appRoute, transactionId: transactionId, groupId: groupId))
+            case .GroupPaymentView(let transactionId, let groupId, let payerId, let receiverId, let amount):
+                GroupPaymentView(viewModel: GroupPaymentViewModel(router: appRoute, transactionId: transactionId, groupId: groupId,
+                                                                  payerId: payerId, receiverId: receiverId,
+                                                                  amount: amount, dismissPaymentFlow: dismissPaymentFlow))
+            default:
+                EmptyRouteView(routeName: self)
+            }
+        }
+    }
+}

Splito/UI/Home/Groups/Group/GroupExpenseListView.swift

@@ -38,6 +38,7 @@ struct GroupExpenseListView: View {
 
                         GroupOptionsListView(isSettleUpEnable: viewModel.group?.members.count ?? 1 > 1,
                                              onSettleUpTap: viewModel.handleSettleUpBtnTap,
+                                             onTransactionsTap: viewModel.handleTransactionsBtnTap,
                                              onBalanceTap: viewModel.handleBalancesBtnTap,
                                              onTotalsTap: viewModel.handleTotalBtnTap)
 
@@ -62,7 +63,6 @@ struct GroupExpenseListView: View {
                             }
                         }
                     }
-                    .padding(.horizontal, 20)
                     .listRowSeparator(.hidden)
                     .listRowInsets(EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 0))
                     .listRowBackground(backgroundColor)
@@ -78,6 +78,7 @@ struct GroupExpenseListView: View {
             .font(.subTitle2())
             .foregroundStyle(primaryText)
             .padding(.bottom, 8)
+            .padding(.horizontal, 20)
     }
 }
 
@@ -162,7 +163,7 @@ private struct GroupExpenseItemView: View {
             .foregroundStyle(isBorrowed ? amountBorrowedColor : amountLentColor)
         }
         .padding(.vertical, 8)
-        .padding(.horizontal, 6)
+        .padding(.horizontal, 26)
     }
 }
 
@@ -197,6 +198,7 @@ private struct GroupExpenseHeaderView: View {
                 }
             }
         }
+        .padding(.horizontal, 20)
         .padding(.vertical, 24)
     }
 }
@@ -245,6 +247,7 @@ private struct ExpenseNotFoundView: View {
 
             VSpacer()
         }
+        .padding(.horizontal, 20)
         .frame(minHeight: geometry.size.height / 2, maxHeight: .infinity, alignment: .center)
     }
 }

Splito/UI/Home/Groups/Group/GroupHomeView.swift

@@ -41,6 +41,11 @@ struct GroupHomeView: View {
                 viewModel.showSettleUpSheet = false
             }
         }
+        .fullScreenCover(isPresented: $viewModel.showTransactionsSheet) {
+            GroupTransactionsRouteView(appRoute: .init(root: .TransactionListView(groupId: viewModel.group?.id ?? ""))) {
+                viewModel.showTransactionsSheet = false
+            }
+        }
         .fullScreenCover(isPresented: $viewModel.showBalancesSheet) {
             NavigationStack {
                 GroupBalancesView(viewModel: GroupBalancesViewModel(groupId: viewModel.group?.id ?? ""))
@@ -59,9 +64,6 @@ struct GroupHomeView: View {
                             Label("Search", systemImage: "magnifyingglass")
                         }
                     }
-                    Button(action: viewModel.handleShowTransactionOptionTap) {
-                        Label("Show transaction", systemImage: "list.bullet.rectangle.portrait")
-                    }
                     Button(action: viewModel.handleSettingsOptionTap) {
                         Label("Settings", systemImage: "gearshape")
                     }
@@ -86,19 +88,25 @@ struct GroupOptionsListView: View {
     var isSettleUpEnable: Bool
 
     let onSettleUpTap: () -> Void
+    let onTransactionsTap: () -> Void
     let onBalanceTap: () -> Void
     let onTotalsTap: () -> Void
 
     var body: some View {
-        HStack(spacing: 16) {
-            GroupOptionsButtonView(text: "Settle up", isForSettleUp: isSettleUpEnable, onTap: onSettleUpTap)
+        ScrollView(.horizontal, showsIndicators: false) {
+            HStack(spacing: 16) {
+                GroupOptionsButtonView(text: "Settle up", isForSettleUp: isSettleUpEnable, onTap: onSettleUpTap)
 
-            GroupOptionsButtonView(text: "Balances", onTap: onBalanceTap)
+                GroupOptionsButtonView(text: "Transactions", onTap: onTransactionsTap)
 
-            GroupOptionsButtonView(text: "Totals", onTap: onTotalsTap)
+                GroupOptionsButtonView(text: "Balances", onTap: onBalanceTap)
+
+                GroupOptionsButtonView(text: "Totals", onTap: onTotalsTap)
+            }
+            .padding(.bottom, 4)
+            .padding(.vertical, 6)
+            .padding(.horizontal, 20)
         }
-        .padding(.bottom, 4)
-        .padding(.vertical, 6)
     }
 }
 

Splito/UI/Home/Groups/Group/GroupHomeViewModel.swift

@@ -23,6 +23,7 @@ class GroupHomeViewModel: BaseViewModel, ObservableObject {
     @Published var memberOwingAmount: [String: Double] = [:]
 
     @Published var showSettleUpSheet = false
+    @Published var showTransactionsSheet = false
     @Published var showBalancesSheet = false
     @Published var showGroupTotalSheet = false
     @Published private(set) var showSearchBar = false
@@ -46,7 +47,7 @@ class GroupHomeViewModel: BaseViewModel, ObservableObject {
 
     private let groupId: String
     private let router: Router<AppRoute>
-	private var groupUserData: [AppUser] = []
+    private var groupUserData: [AppUser] = []
     private let onGroupSelected: ((String?) -> Void)?
 
     init(router: Router<AppRoute>, groupId: String, onGroupSelected: ((String?) -> Void)?) {
@@ -255,8 +256,8 @@ class GroupHomeViewModel: BaseViewModel, ObservableObject {
     private func setGroupViewState() {
         guard let group else { return }
         groupState = group.members.count > 1 ?
-            (expenses.isEmpty ? .noExpense : .hasExpense) :
-            (expenses.isEmpty ? .noMember : .hasExpense)
+        (expenses.isEmpty ? .noExpense : .hasExpense) :
+        (expenses.isEmpty ? .noMember : .hasExpense)
     }
 
     func showExpenseDeleteAlert(expenseId: String) {
@@ -300,10 +301,6 @@ extension GroupHomeViewModel {
         router.push(.GroupSettingView(groupId: groupId))
     }
 
-    func handleShowTransactionOptionTap() {
-        router.push(.TransactionListView(groupId: groupId))
-    }
-
     func handleExpenseItemTap(expenseId: String) {
         router.push(.ExpenseDetailView(expenseId: expenseId))
     }
@@ -324,6 +321,10 @@ extension GroupHomeViewModel {
         showGroupTotalSheet = true
     }
 
+    func handleTransactionsBtnTap() {
+        showTransactionsSheet = true
+    }
+
     func handleSearchOptionTap() {
         withAnimation {
             searchedExpense = ""

Splito/UI/Login/PhoneLogin/VerifyOtp/VerifyOtpView.swift

@@ -98,25 +98,39 @@ private struct PhoneLoginOtpView: View {
     let onResendOtp: () -> Void
 
     private let OTP_TOTAL_CHARACTERS = 6
+    @FocusState private var isFocused: Bool
 
     var body: some View {
         VStack(spacing: 0) {
             VStack(alignment: .center, spacing: 0) {
-                CustomTextField(text: $otp, selectedField: $selectedField, placeholder: "Enter code", font: .inter(.medium, size: 34),
-                                placeholderFont: .inter(.medium, size: 16), tag: 1, isDisabled: showLoader, keyboardType: .numberPad,
-                                returnKey: .default, textAlignment: .center, characterLimit: 6, textContentType: .oneTimeCode)
-                .frame(height: 45, alignment: .center)
-                .background(Color.clear)
+                TextField("", text: $otp)
+                    .font(.subTitle1(34))
+                    .foregroundColor(primaryText)
+                    .kerning(16)
+                    .multilineTextAlignment(.center)
+                    .keyboardType(.numberPad)
+                    .textContentType(.oneTimeCode)
+                    .disableAutocorrection(true)
+                    .focused($isFocused)
+                    .onChange(of: otp) { newValue in
+                        if newValue.count > OTP_TOTAL_CHARACTERS {
+                            otp = String(newValue.prefix(OTP_TOTAL_CHARACTERS))
+                        }
+                        if newValue.count == OTP_TOTAL_CHARACTERS {
+                            onVerify()
+                            UIApplication.shared.endEditing()
+                        }
+                    }
 
                 Divider()
                     .background(outlineColor)
                     .padding(.horizontal, 60)
             }
             .onAppear {
                 if otp.isEmpty {
-                    selectedField = 1
+                    isFocused = true
                 } else {
-                    selectedField = 0
+                    isFocused = false
                     UIApplication.shared.endEditing()
                 }
             }
@@ -150,11 +164,8 @@ private struct PhoneLoginOtpView: View {
             }
         }
         .padding(.horizontal, 16)
-        .onChange(of: otp) { _ in
-            if otp.count == OTP_TOTAL_CHARACTERS {
-                onVerify()
-                UIApplication.shared.endEditing()
-            }
+        .onChange(of: selectedField) { newValue in
+            isFocused = (newValue == 1)
         }
     }
 }