MS-496: Pay button text

Sample/lib/feature/home/home_screen.dart

@@ -263,6 +263,17 @@ class _HomeScreenState extends State<HomeScreen> {
                           ),
                           const Text('Auto debit'),
                         ],
+                      ),Row(
+                        children: [
+                          Checkbox(
+                            checkColor: Colors.white,
+                            value: state.useCustomText ?? false,
+                            onChanged: (bool? value) {
+                              context.read<HomeScreenCubit>().onUseCustomTextChecked(value);
+                            },
+                          ),
+                          const Text('Use custom text'),
+                        ],
                       ),
                       Row(
                         children: [

Sample/lib/feature/home/home_screen_cubit.dart

@@ -15,7 +15,10 @@ import 'package:ottu_flutter_checkout_sample/api/ottu_api.dart';
 import 'package:ottu_flutter_checkout_sample/feature/home/home_screen_state.dart';
 import 'package:ottu_flutter_checkout_sample/main.dart';
 
-const merchantId = String.fromEnvironment('MERCHANT_ID', defaultValue: "add your merchant Id there");
+const merchantId = String.fromEnvironment(
+  'MERCHANT_ID',
+  defaultValue: "add your merchant Id there",
+);
 const apiKey = String.fromEnvironment('API_KEY', defaultValue: "add your Api key there");
 const customerId = "john2";
 const currencyCode = "KWD";
@@ -175,6 +178,10 @@ class HomeScreenCubit extends Cubit<HomeScreenState> {
     emit(state.copyWith(isAutoDebit: isChecked));
   }
 
+  void onUseCustomTextChecked(bool? isChecked) {
+    emit(state.copyWith(useCustomText: isChecked));
+  }
+
   void onAmountChanged(String amount) async {
     emit(state.copyWith(amount: amount));
   }
@@ -250,6 +257,9 @@ class HomeScreenCubit extends Cubit<HomeScreenState> {
       setupPreload: state.preloadPayload == true ? _apiTransactionDetails : null,
       formsOfPayment: formOfPayments?.isNotEmpty == true ? formOfPayments : null,
       theme: _theme,
+      payButtonText: state.useCustomText == true
+          ? PayButtonText(en: "Checkout", ar: "الدفع")
+          : null,
     );
     _navigator.push(
       "/checkout",

Sample/lib/feature/home/home_screen_state.dart

@@ -21,6 +21,7 @@ final class HomeScreenState extends Equatable {
   final bool? isAutoDebit;
   final bool hasSessionLoaded;
   final bool? failPaymentValidation;
+  final bool useCustomText;
   final PaymentOptionsDisplayMode? paymentOptionsDisplayMode;
   final Map<FormsOfPayment, bool>? formsOfPaymentChecked;
   final Map<PGCode, bool>? pgCodesChecked;
@@ -45,6 +46,7 @@ final class HomeScreenState extends Equatable {
     this.paymentOptionsDisplayMode,
     this.formsOfPaymentChecked,
     this.pgCodesChecked,
+    this.useCustomText = false,
   });
 
   HomeScreenState copyWith({
@@ -64,6 +66,7 @@ final class HomeScreenState extends Equatable {
     bool? isAutoDebit,
     bool? hasSessionLoaded,
     bool? failPaymentValidation,
+    bool? useCustomText,
     PaymentOptionsDisplayMode? paymentOptionsDisplayMode,
     Map<FormsOfPayment, bool>? formsOfPaymentChecked,
     Map<PGCode, bool>? pgCodesChecked,
@@ -84,6 +87,7 @@ final class HomeScreenState extends Equatable {
       preloadPayload: preloadPayload ?? this.preloadPayload,
       isAutoDebit: isAutoDebit ?? this.isAutoDebit,
       failPaymentValidation: failPaymentValidation ?? this.failPaymentValidation,
+      useCustomText: useCustomText ?? this.useCustomText,
       hasSessionLoaded: hasSessionLoaded ?? this.hasSessionLoaded,
       paymentOptionsDisplayMode: paymentOptionsDisplayMode ?? this.paymentOptionsDisplayMode,
       formsOfPaymentChecked: formsOfPaymentChecked ?? this.formsOfPaymentChecked,
@@ -107,6 +111,7 @@ final class HomeScreenState extends Equatable {
     preloadPayload,
     isAutoDebit,
     failPaymentValidation,
+    useCustomText,
     phoneNumber,
     hasSessionLoaded,
     paymentOptionsDisplayMode?.name,

android/src/main/kotlin/com/ottu/flutter/checkout/CheckoutArguments.kt

@@ -15,4 +15,5 @@ data class CheckoutArguments(
     val formsOfPayment: List<String>?,
     val theme: CustomerTheme?,
     val paymentOptionsDisplaySettings: PaymentOptionsDisplaySettings,
+    val payButtonText: PayButtonText?,
 )

android/src/main/kotlin/com/ottu/flutter/checkout/CheckoutView.kt

@@ -22,6 +22,7 @@ import com.ottu.flutter.checkout.ext.toCheckoutRipple
 import com.ottu.flutter.checkout.ext.toCheckoutSwitch
 import com.ottu.flutter.checkout.ext.toCheckoutText
 import com.ottu.flutter.checkout.ext.toCheckoutTextField
+import com.ottu.flutter.checkout.ext.toPayButtonText
 import com.squareup.moshi.JsonAdapter
 import io.flutter.plugin.common.BinaryMessenger
 import io.flutter.plugin.common.MethodChannel
@@ -202,7 +203,8 @@ internal class CheckoutView(
                             errorData.toString()
                         )
                     },
-                    verifyPayment = ::verifyPayment
+                    verifyPayment = ::verifyPayment,
+                    payButtonText = arguments.payButtonText?.toPayButtonText(),
                 )
 
                 onInitialized(sdkFragment)

android/src/main/kotlin/com/ottu/flutter/checkout/PayButtonText.kt

@@ -0,0 +1,6 @@
+package com.ottu.flutter.checkout
+
+import kotlinx.serialization.Serializable
+
+@Serializable
+data class PayButtonText(val en: String, val ar: String)

android/src/main/kotlin/com/ottu/flutter/checkout/ext/Extensions.kt

@@ -7,12 +7,14 @@ import com.ottu.checkout.ui.theme.CheckoutTheme
 import com.ottu.flutter.checkout.ButtonComponent
 import com.ottu.flutter.checkout.ColorState
 import com.ottu.flutter.checkout.Margins
+import com.ottu.flutter.checkout.PayButtonText
 import com.ottu.flutter.checkout.RippleColor
 import com.ottu.flutter.checkout.SwitchComponent
 import com.ottu.flutter.checkout.TextFieldStyle
 import com.ottu.flutter.checkout.TextStyle
 import java.lang.Exception
 import com.ottu.checkout.ui.theme.style.Margins as CheckoutMargins
+import com.ottu.checkout.data.model.localization.PayButtonText as pbt
 
 fun String.toColor() = this.let {
     try {
@@ -73,4 +75,6 @@ fun SwitchComponent.toCheckoutSwitch() = CheckoutTheme.Switch(
     uncheckedTrackTintColor = this.uncheckedTrackTintColor?.toColor(),
     checkedTrackDecorationColor = this.checkedTrackDecorationColor?.toColor(),
     uncheckedTrackDecorationColor = this.uncheckedTrackDecorationColor?.toColor()
-)
+)
+
+fun PayButtonText.toPayButtonText() = pbt(en = en, ar = ar)

ios/ottu_flutter_checkout/Sources/ottu_flutter_checkout/CheckoutArguments.swift

@@ -15,4 +15,5 @@ struct CheckoutArguments: Decodable {
     let apiTransactionDetails: String?
     let formsOfPayment: [String]?
     let theme: CustomerTheme?
+    let payButtonText: PayButtonText?
 }