[Payment Method Improvements] The Payment Details section should display two text fields

[backwardstruck]

This GH issue is for the Payment Details section, which should display two text fields: One text field labeled "Cash received" displaying the value given (by default the total due). One text field labeled "Change due" displaying the value "$0.00".

In addition, some follow up work from the previous PR requested by @kidinov :

1. make passing orderId mandatory and have compile time validation you can declare argument as part of the arguments for the fragment:

    <fragment
        android:id="@+id/changeDueCalculatorFragment"
        android:name="com.woocommerce.android.ui.payments.methodselection.ChangeDueCalculatorFragment"
        android:label="ChangeDueCalculatorFragment" >
        <argument
            android:name="orderId"
            app:argType="long" />
    </fragment>

2. then in the VM you can get the object with

private val navArgs: ChangeDueCalculatorFragmentArgs by savedStateHandle.navArgs()
navArgs.orderId

3. I noticed that you placed these calses into methodselection package which probably not the most appropriate place for that. I'd go with payments/changeduecalculator

Tasks

Beta Give feedback

1. make passing orderId mandatory and have compile time validation you can declare argument as part of the arguments for the fragment
2. in the VM you can get the object with private val navArgs: ChangeDueCalculatorFragmentArgs by savedStateHandle.navArgs() navArgs.orderId
3. place these calses into package payments/changeduecalculator
4. UI for this creen should basically match the payment details section on iOS
5. Update compose previews

[dangermattic]

Thanks for reporting! 👍