AA-29 | Reyaz | Change kyc screen layout

app/build.gradle

@@ -33,6 +33,11 @@ android {
     }
 }
 
+repositories {
+    mavenCentral()
+    google()
+}
+
 dependencies {
     implementation fileTree(dir: 'libs', include: ['*.jar'])
     implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
@@ -59,4 +64,6 @@ dependencies {
     implementation 'org.jetbrains.kotlin:kotlin-stdlib-jdk7:1.3.50'
     implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-android:1.3.2'
     implementation 'com.itkacher.okhttpprofiler:okhttpprofiler:1.0.5'
+    implementation 'com.github.bumptech.glide:glide:4.10.0'
+    annotationProcessor 'com.github.bumptech.glide:compiler:4.10.0'
 }

app/src/main/java/com/navi/medici/androidCustomerApp/api/KycDocumentUploadApi.kt

@@ -5,7 +5,10 @@ import com.navi.medici.androidCustomerApp.models.response.UploadDocumentResponse
 import okhttp3.MultipartBody
 import okhttp3.RequestBody
 import retrofit2.Response
-import retrofit2.http.*
+import retrofit2.http.Multipart
+import retrofit2.http.POST
+import retrofit2.http.Part
+import retrofit2.http.Path
 
 interface KycDocumentUploadApi {
     @Multipart
@@ -14,7 +17,7 @@ interface KycDocumentUploadApi {
 
     @Multipart
     @POST("/loan-origination-manager/loan-applications/{loanApplicationId}/selfie")
-    suspend fun submitSelfie(@Part("type") type: RequestBody, @Part file: MultipartBody.Part): Response<UploadDocumentResponse>
+    suspend fun submitSelfie(@Path("loanApplicationId") loanApplicationId: String, @Part("type") type: RequestBody, @Part file: MultipartBody.Part): Response<UploadDocumentResponse>
 
     companion object {
         operator fun invoke(): KycDocumentUploadApi {

app/src/main/java/com/navi/medici/androidCustomerApp/repositories/KycDocumentUploadRepository.kt

@@ -15,9 +15,10 @@ class KycDocumentUploadRepository(private val kycDocumentUploadApi: KycDocumentU
             )
         }.invoke()
 
-    suspend fun submitSelfie(@Part type: RequestBody, @Part file: MultipartBody.Part) =
+    suspend fun submitSelfie(loanApplicationId: String, @Part type: RequestBody, @Part file: MultipartBody.Part) =
         suspend {
             kycDocumentUploadApi.submitSelfie(
+                loanApplicationId,
                 type,
                 file
             )

app/src/main/java/com/navi/medici/androidCustomerApp/ui/fragments/KycDocumentUploadFragment.kt

@@ -19,19 +19,17 @@ import androidx.databinding.DataBindingUtil
 import androidx.fragment.app.Fragment
 import androidx.lifecycle.Observer
 import androidx.lifecycle.ViewModelProviders
+import com.bumptech.glide.Glide
 import com.navi.medici.androidCustomerApp.R
 import com.navi.medici.androidCustomerApp.common.PreferenceManager
 import com.navi.medici.androidCustomerApp.databinding.KycDocumentUploadFragmentBinding
 import com.navi.medici.androidCustomerApp.ui.activities.BottomNavigationActivity
 import com.navi.medici.androidCustomerApp.viewModels.KycDocumentUploadViewModel
 import java.io.ByteArrayOutputStream
-import java.io.File
-import java.io.FileOutputStream
 
 class KycDocumentUploadFragment : Fragment() {
     private lateinit var binding: KycDocumentUploadFragmentBinding
     private lateinit var viewModel: KycDocumentUploadViewModel
-    private var bitmap: Bitmap? = null
 
     override fun onCreateView(
         inflater: LayoutInflater, container: ViewGroup?,
@@ -59,22 +57,47 @@ class KycDocumentUploadFragment : Fragment() {
         binding.continueButton.setOnClickListener { onClickContinueButton() }
         binding.selfieUploadButton.setOnClickListener { onClickSelfieUploadButton() }
 
-        viewModel.showMessage.observe(this, showToastObserver())
+        viewModel.poaDocumentUploadUri.observe(this, poaDocumentUploadObserver())
+        viewModel.selfieUploadUri.observe(this, selfieUploadObserver())
+
         return binding.root
     }
 
-    private fun onClickSelfieUploadButton() {
-        val intent: Intent = Intent(MediaStore.ACTION_IMAGE_CAPTURE)
-        intent.putExtra("android.intent.extras.CAMERA_FACING", 1);
-        startActivityForResult(intent, REQUEST_IMAGE_CAPTURE)
+    private fun selfieUploadObserver(): Observer<String> {
+        return Observer {
+            it?.let { image ->
+                binding.selfieProgress.visibility = View.GONE
+                binding.selfiePreview.visibility = View.VISIBLE
+                Glide.with(this).load(image).centerCrop().into(binding.selfiePreview)
+            } ?: run {
+                binding.selfieBeforeUploadPreview.visibility = View.VISIBLE
+                binding.selfieAfterUploadPreview.visibility = View.GONE
+                Toast.makeText(activity, getString(R.string.upload_failed), Toast.LENGTH_LONG)
+                    .show()
+            }
+        }
     }
 
-    private fun showToastObserver(): Observer<String> {
+    private fun poaDocumentUploadObserver(): Observer<String> {
         return Observer {
-            Toast.makeText(activity, it, Toast.LENGTH_LONG).show()
+            it?.let { image ->
+                binding.poaProgress.visibility = View.GONE
+                binding.poaPreview.visibility = View.VISIBLE
+                Glide.with(this).load(image).centerCrop().into(binding.poaPreview)
+            } ?: run {
+                binding.poaBeforeUploadPreview.visibility = View.VISIBLE
+                binding.poaAfterUploadPreview.visibility = View.GONE
+                Toast.makeText(activity, getString(R.string.upload_failed), Toast.LENGTH_LONG)
+                    .show()
+            }
         }
     }
 
+    private fun onClickSelfieUploadButton() {
+        val intent = Intent(MediaStore.ACTION_IMAGE_CAPTURE)
+        startActivityForResult(intent, REQUEST_IMAGE_CAPTURE)
+    }
+
     private fun onClickContinueButton() {
         (activity as BottomNavigationActivity).onClickBottomNavigationMenuItem(MyLoansFragment.TAG)
     }
@@ -100,21 +123,23 @@ class KycDocumentUploadFragment : Fragment() {
         super.onActivityResult(requestCode, resultCode, intent)
         if (requestCode == FILE_SELECT_CODE) {
             intent?.data?.let { uri ->
+                binding.poaBeforeUploadPreview.visibility = View.INVISIBLE
+                binding.poaAfterUploadPreview.visibility = View.VISIBLE
+                binding.poaType.text = viewModel.documentSelectedForUpload.value
                 activity?.contentResolver?.openInputStream(uri)?.readBytes()?.let {
-                    viewModel.submitPoaDocument(it, getLoanApplicationId().toString())
+                    viewModel.submitPoaDocument(it, getLoanApplicationId())
                 }
             }
         }
         if (requestCode == REQUEST_IMAGE_CAPTURE && resultCode == Activity.RESULT_OK) {
             intent?.extras?.let {
-                bitmap = it?.get("data") as? Bitmap
-                binding.selfieUploadButton.visibility = View.GONE
-                binding.previewImage.visibility = View.VISIBLE
-                binding.previewImage.setImageBitmap(bitmap)
+                val bitmapImage = it.get("data") as Bitmap
+                binding.selfieBeforeUploadPreview.visibility = View.GONE
+                binding.selfieAfterUploadPreview.visibility = View.VISIBLE
 
                 val outputStream = ByteArrayOutputStream()
-                bitmap?.compress(Bitmap.CompressFormat.JPEG, 0, outputStream)
-                viewModel.submitSelfie(outputStream.toByteArray())
+                bitmapImage.compress(Bitmap.CompressFormat.JPEG, 0, outputStream)
+                viewModel.submitSelfie(outputStream.toByteArray(), getLoanApplicationId())
             }
         }
     }
@@ -141,7 +166,15 @@ class KycDocumentUploadFragment : Fragment() {
                 position: Int,
                 id: Long
             ) {
-                binding.uploadDocumentButton.isEnabled = position != 0
+                if (position != 0) {
+                    binding.uploadDocumentButton.visibility = View.VISIBLE
+                    binding.uploadDocumentButton.text = getString(
+                        R.string.upload_document_button_label,
+                        parent?.selectedItem.toString()
+                    )
+                } else {
+                    binding.uploadDocumentButton.visibility = View.INVISIBLE
+                }
                 viewModel.documentSelectedForUpload.value = parent?.selectedItem.toString()
             }
 
@@ -163,7 +196,6 @@ class KycDocumentUploadFragment : Fragment() {
         )
     }
 
-
     companion object {
         const val TAG = "KYC_DOCUMENT_UPLOAD_FRAGMENT"
         private const val FILE_SELECT_CODE = 100

app/src/main/java/com/navi/medici/androidCustomerApp/viewModels/KycDocumentUploadViewModel.kt

@@ -10,13 +10,15 @@ import kotlinx.coroutines.launch
 import okhttp3.MediaType
 import okhttp3.MultipartBody
 import okhttp3.RequestBody
+import timber.log.Timber
 
 class KycDocumentUploadViewModel : ViewModel() {
     val proofOfAddresses = arrayOf("Choose POA Document", "Aadhar card", "PAN card")
     private val kycDocumentUploadRepository = KycDocumentUploadRepository(KycDocumentUploadApi())
     private val coroutineScope = CoroutineScope(Dispatchers.Main)
     val documentSelectedForUpload = MutableLiveData<String>()
-    val showMessage = MutableLiveData<String>()
+    val poaDocumentUploadUri = MutableLiveData<String>()
+    val selfieUploadUri = MutableLiveData<String>()
 
     fun submitPoaDocument(bytes: ByteArray, loanApplicationId: String?) {
         val reqFile = RequestBody.create(
@@ -31,16 +33,22 @@ class KycDocumentUploadViewModel : ViewModel() {
         )
         coroutineScope.launch {
             loanApplicationId?.let { loanApplicationId ->
-                kycDocumentUploadRepository.submitPoaDocument(
+                val response = kycDocumentUploadRepository.submitPoaDocument(
                     loanApplicationId,
                     requestType,
                     body
                 )
+                Timber.i("POA document upload ${response.body()}")
+                if (response.isSuccessful) {
+                    poaDocumentUploadUri.value = response.body()?.uri
+                } else {
+                    poaDocumentUploadUri.value = null
+                }
             }
         }
     }
 
-    fun submitSelfie(bytes: ByteArray) {
+    fun submitSelfie(bytes: ByteArray, loanApplicationId: String?) {
         val reqFile = RequestBody.create(
             MediaType.parse("application/x-www-form-urlencoded"),
             bytes
@@ -52,10 +60,19 @@ class KycDocumentUploadViewModel : ViewModel() {
         )
 
         coroutineScope.launch {
-            val response = kycDocumentUploadRepository.submitSelfie(
-                requestType,
-                body
-            )
+            loanApplicationId?.let { loanApplicationId ->
+                val response = kycDocumentUploadRepository.submitSelfie(
+                    loanApplicationId,
+                    requestType,
+                    body
+                )
+                Timber.i("Selfie upload ${response.body()}")
+                if (response.isSuccessful) {
+                    selfieUploadUri.value = response.body()?.uri
+                } else {
+                    selfieUploadUri.value = null
+                }
+            }
         }
     }
 }

app/src/main/res/drawable/poa_icon_fix.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item
+        android:id="@+id/half_overlay"
+        android:drawable="@drawable/poa_icon"
+        android:width="40sp"
+        android:height="25sp"
+        />
+</layer-list>

app/src/main/res/drawable/upload_button_background_selector.xml

@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="@color/colorWhite" android:state_enabled="true" />
-    <item android:color="@android:color/darker_gray" android:state_enabled="false" />
-</selector>

app/src/main/res/drawable/upload_button_color_selector.xml

@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="@color/colorGray" android:state_enabled="true" />
-    <item android:color="@color/colorWhite" android:state_enabled="false" />
-</selector>

app/src/main/res/layout/kyc_document_upload_fragment.xml

@@ -1,121 +1,228 @@
 <?xml version="1.0" encoding="utf-8"?>
-<layout xmlns:android="http://schemas.android.com/apk/res/android">
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
 
-    <LinearLayout
+    <RelativeLayout
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         android:orientation="vertical"
         android:padding="16dp">
 
         <TextView
+            android:id="@+id/document_upload_label"
             style="@style/largeCustomFontStyle"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="@string/kyc_documents_upload_text" />
 
-        <LinearLayout
+        <RelativeLayout
+            android:id="@+id/poaUploadLayout"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_below="@+id/document_upload_label"
             android:layout_marginTop="32dp"
-            android:layout_weight="1"
+            android:layout_marginBottom="16dp"
             android:orientation="vertical">
 
-            <TextView
-                style="@style/mediumLightCustomFontStyle"
+            <LinearLayout
+                android:id="@+id/poa_heading_layout"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:text="@string/proof_of_address_label_text" />
+                android:layout_marginBottom="16dp"
+                android:gravity="center_vertical">
 
-            <com.google.android.material.card.MaterialCardView
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="8dp"
-                android:layout_marginTop="24dp"
-                android:layout_marginEnd="8dp"
-                android:elevation="8dp">
+                <ImageView
+                    android:layout_width="wrap_content"
+                    android:layout_height="22sp"
+                    android:layout_marginEnd="8dp"
+                    android:adjustViewBounds="true"
+                    android:src="@drawable/tick_mark" />
 
-                <Spinner
-                    android:id="@+id/proof_of_address_spinner"
+                <TextView
+                    style="@style/mediumLightCustomFontStyle"
                     android:layout_width="match_parent"
-                    android:layout_height="wrap_content" />
-            </com.google.android.material.card.MaterialCardView>
+                    android:layout_height="wrap_content"
+                    android:text="@string/proof_of_address_label_text" />
+            </LinearLayout>
 
-            <Button
-                android:id="@+id/upload_document_button"
-                style="@style/mediumCustomFontStyle"
+            <LinearLayout
+                android:id="@+id/poaBeforeUploadPreview"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:layout_marginStart="8dp"
-                android:layout_marginTop="24dp"
-                android:layout_marginEnd="8dp"
-                android:background="@android:color/white"
-                android:backgroundTint="@drawable/upload_button_background_selector"
+                android:layout_below="@+id/poa_heading_layout"
+                android:orientation="vertical">
+
+                <com.google.android.material.card.MaterialCardView
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_marginStart="8dp"
+                    android:layout_marginEnd="8dp"
+                    android:elevation="8dp">
+
+                    <Spinner
+                        android:id="@+id/proof_of_address_spinner"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content" />
+                </com.google.android.material.card.MaterialCardView>
+
+                <Button
+                    android:id="@+id/upload_document_button"
+                    style="@style/mediumCustomFontStyle"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_margin="8dp"
+                    android:background="@android:color/white"
+                    android:backgroundTint="@color/colorWhite"
+                    android:drawableEnd="@drawable/poa_icon_fix"
+                    android:paddingStart="8dp"
+                    android:paddingEnd="8dp"
+                    android:scaleY="1.0"
+                    android:textAlignment="textStart"
+                    android:textColor="@color/colorGray"
+                    android:textSize="20sp"
+                    android:visibility="invisible" />
+            </LinearLayout>
+
+            <RelativeLayout
+                android:id="@+id/poaAfterUploadPreview"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/poa_heading_layout"
                 android:paddingStart="8dp"
                 android:paddingEnd="8dp"
-                android:text="@string/upload_document_button_label"
-                android:textAlignment="textStart"
-                android:textColor="@drawable/upload_button_color_selector"
-                android:textSize="20sp" />
-        </LinearLayout>
+                android:visibility="gone">
+
+                <TextView
+                    android:id="@+id/poaType"
+                    style="@style/mediumCustomFontStyle"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_centerVertical="true"
+                    tools:text="Adhaar Card" />
+
+                <ImageView
+                    android:id="@+id/poaPreview"
+                    android:layout_width="100sp"
+                    android:layout_height="80sp"
+                    android:layout_alignParentEnd="true"
+                    android:visibility="gone" />
+
+                <ProgressBar
+                    android:id="@+id/poaProgress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_alignParentEnd="true" />
+            </RelativeLayout>
+        </RelativeLayout>
 
         <LinearLayout
+            android:id="@+id/selfieUploadLayout"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_below="@+id/poaUploadLayout"
             android:layout_marginTop="16dp"
-            android:layout_weight="4"
             android:orientation="vertical">
 
-            <TextView
-                style="@style/mediumLightCustomFontStyle"
+            <LinearLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:text="@string/selfie_label_text" />
+                android:layout_marginBottom="16dp"
+                android:gravity="center_vertical">
 
-            <Button
-                android:id="@+id/selfie_upload_button"
-                style="@style/mediumCustomFontStyle"
+                <ImageView
+                    android:layout_width="wrap_content"
+                    android:layout_height="22sp"
+                    android:layout_marginEnd="8dp"
+                    android:adjustViewBounds="true"
+                    android:src="@drawable/tick_mark" />
+
+                <TextView
+                    style="@style/mediumLightCustomFontStyle"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:text="@string/selfie_label_text" />
+            </LinearLayout>
+
+            <LinearLayout
+                android:id="@+id/selfieBeforeUploadPreview"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:orientation="vertical">
+
+                <Button
+                    android:id="@+id/selfie_upload_button"
+                    style="@style/mediumCustomFontStyle"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_margin="8dp"
+                    android:background="@android:color/white"
+                    android:paddingStart="8dp"
+                    android:paddingEnd="8dp"
+                    android:text="@string/upload_your_selfie_button_label"
+                    android:textAlignment="textStart"
+                    android:textSize="20sp" />
+            </LinearLayout>
+
+            <RelativeLayout
+                android:id="@+id/selfieAfterUploadPreview"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:layout_marginStart="8dp"
-                android:layout_marginTop="24dp"
-                android:layout_marginEnd="8dp"
-                android:background="@android:color/white"
                 android:paddingStart="8dp"
                 android:paddingEnd="8dp"
-                android:text="@string/upload_your_selfie_button_label"
-                android:textAlignment="textStart"
-                android:textSize="20sp" />
+                android:visibility="gone">
 
-            <ImageView
-                android:id="@+id/preview_image"
-                android:layout_width="142dp"
-                android:layout_height="172dp"
-                android:layout_gravity="end"
-                android:visibility="invisible" />
+                <TextView
+                    style="@style/mediumCustomFontStyle"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_centerVertical="true"
+                    android:text="@string/your_photo" />
+
+                <ImageView
+                    android:id="@+id/selfiePreview"
+                    android:layout_width="100sp"
+                    android:layout_height="80sp"
+                    android:layout_alignParentEnd="true"
+                    android:visibility="gone" />
+
+                <ProgressBar
+                    android:id="@+id/selfieProgress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_alignParentEnd="true" />
+            </RelativeLayout>
         </LinearLayout>
 
         <TextView
+            android:id="@+id/take_original_photo_label"
             style="@style/paragraphCustomFontStyle"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_above="@id/ssl_protection_secure_label"
             android:background="@drawable/clear_photos_border"
             android:padding="8dp"
-            android:text="@string/clear_document_photos" />
+            android:text="@string/clear_document_photos"
+            android:textAlignment="center"
+            android:textSize="12sp" />
 
         <TextView
+            android:id="@+id/ssl_protection_secure_label"
             style="@style/paragraphCustomFontStyle"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_weight="1"
-            android:gravity="center"
+            android:layout_above="@+id/continue_button"
+            android:padding="8dp"
             android:text="@string/_128_bit_ssl_protection_secure"
             android:textAlignment="center"
-            android:textColor="@color/colorMonteCarlo" />
+            android:textColor="@color/colorMonteCarlo"
+            android:textSize="12sp" />
 
         <Button
             android:id="@+id/continue_button"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_alignParentBottom="true"
+            android:enabled="true"
             android:text="@string/continue_text" />
-    </LinearLayout>
+    </RelativeLayout>
 </layout>

app/src/main/res/values/strings.xml

@@ -31,7 +31,7 @@
     <string name="proof_of_address_label_text">Proof of Address</string>
     <string name="selfie_label_text">Selfie</string>
     <string name="upload_your_selfie_button_label">Upload Your Selfie</string>
-    <string name="upload_document_button_label">Upload document</string>
+    <string name="upload_document_button_label">Upload %s</string>
     <string name="pan_label">Please enter your exact pan card number</string>
     <string name="enter_pan">Enter Your Pan Number</string>
     <string name="consent_text">By proceeding you give the consent to use your pan card to         make call to bureau</string>
@@ -74,6 +74,8 @@
     <string name="something_wrong">Something wrong</string>
     <string name="clear_document_photos">Ensure you are taking clear photos of original documents</string>
     <string name="_128_bit_ssl_protection_secure">128 bit SSL protection secure</string>
+    <string name="your_photo">Your Photo</string>
+    <string name="upload_failed">Upload Failed, Try again</string>
     <string-array name="reason_list">
         <item>Home Loan</item>
         <item>Person loan</item>