From d93874d83191cd376413f7f2d87595246683e5b3 Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Tue, 27 May 2025 17:39:51 +0700
Subject: [PATCH 01/10] fixed chat

---
 app/src/main/AndroidManifest.xml              |   7 +-
 .../data/api/retrofit/ApiService.kt           |   7 +
 .../data/repository/ChatRepository.kt         | 149 ++++++++++----
 .../ui/auth/RegisterActivity.kt               |   2 +
 .../auth/fragments/RegisterStep3Fragment.kt   |  56 ++++++
 .../ecommerce_serang/ui/chat/ChatActivity.kt  | 184 ++++++++++++------
 .../ecommerce_serang/ui/chat/ChatAdapter.kt   |  19 +-
 .../ecommerce_serang/ui/chat/ChatViewModel.kt |  18 +-
 .../ui/notif/PersonalNotificationAdapter.kt   |  11 +-
 app/src/main/res/layout/activity_chat.xml     |  25 +--
 app/src/main/res/layout/activity_checkout.xml |   1 +
 .../layout/activity_detail_order_status.xml   |   1 +
 .../res/layout/activity_detail_payment.xml    |   1 +
 .../res/layout/activity_detail_profile.xml    |   1 +
 .../res/layout/activity_edit_profile_cust.xml |   1 +
 .../main/res/layout/activity_notification.xml |  30 +--
 app/src/main/res/layout/activity_payment.xml  |   1 +
 .../main/res/layout/activity_payment_info.xml |   1 +
 app/src/main/res/layout/activity_register.xml |   1 +
 .../res/layout/activity_register_store.xml    |   5 +-
 app/src/main/res/values/themes.xml            |   3 +
 21 files changed, 384 insertions(+), 140 deletions(-)

diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index c7690ea..4edca1b 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -34,6 +34,7 @@
             android:exported="false" />
         <activity
             android:name=".ui.auth.RegisterStoreActivity"
+            android:windowSoftInputMode="adjustResize"
             android:exported="false" />
         <activity
             android:name=".ui.profile.editprofile.EditProfileCustActivity"
@@ -49,6 +50,7 @@
             android:exported="false" />
         <activity
             android:name=".ui.profile.mystore.profile.EditStoreProfileActivity"
+            android:windowSoftInputMode="adjustResize"
             android:exported="false" />
         <activity
             android:name=".ui.profile.mystore.sells.shipment.DetailShipmentActivity"
@@ -61,7 +63,8 @@
             android:exported="false" />
         <activity
             android:name=".ui.chat.ChatActivity"
-            android:exported="false" /> <!-- <provider -->
+            android:exported="false"
+            android:windowSoftInputMode="adjustResize|stateHidden" /> <!-- <provider -->
         <!-- android:name="androidx.startup.InitializationProvider" -->
         <!-- android:authorities="${applicationId}.androidx-startup" -->
         <!-- tools:node="remove" /> -->
@@ -94,6 +97,7 @@
             android:exported="false" />
         <activity
             android:name=".ui.order.address.AddAddressActivity"
+            android:windowSoftInputMode="adjustResize"
             android:exported="false" />
         <activity
             android:name=".ui.order.address.AddressActivity"
@@ -142,6 +146,7 @@
             android:exported="false" />
         <activity
             android:name=".ui.auth.RegisterActivity"
+            android:windowSoftInputMode="adjustResize"
             android:exported="true">
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
index 2e1e579..6bfc8da 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
@@ -443,6 +443,13 @@ interface ApiService {
         @Part chatimg: MultipartBody.Part?
     ): Response<SendChatResponse>
 
+    @Multipart
+    @POST("sendchat")
+    suspend fun sendChatMessage(
+        @PartMap parts: Map<String, @JvmSuppressWildcards RequestBody>,
+        @Part chatimg: MultipartBody.Part? = null
+    ): Response<SendChatResponse>
+
     @PUT("chatstatus")
     suspend fun updateChatStatus(
         @Body request: UpdateChatRequest
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
index 68c0a94..ccfb887 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
@@ -8,8 +8,9 @@ import com.alya.ecommerce_serang.data.api.response.chat.ChatItemList
 import com.alya.ecommerce_serang.data.api.response.chat.SendChatResponse
 import com.alya.ecommerce_serang.data.api.response.chat.UpdateChatResponse
 import com.alya.ecommerce_serang.data.api.retrofit.ApiService
-import okhttp3.MediaType.Companion.toMediaTypeOrNull
+import okhttp3.MediaType.Companion.toMediaType
 import okhttp3.MultipartBody
+import okhttp3.RequestBody
 import okhttp3.RequestBody.Companion.asRequestBody
 import okhttp3.RequestBody.Companion.toRequestBody
 import java.io.File
@@ -38,62 +39,130 @@ class ChatRepository @Inject constructor(
     suspend fun sendChatMessage(
         storeId: Int,
         message: String,
-        productId: Int? = null,
-        imageFile: File? = null,
-        chatRoomId: Int? = null // Not used in the actual API call but kept for compatibility
+        productId: Int?,           // Nullable and optional
+        imageFile: File? = null    // Nullable and optional
     ): Result<SendChatResponse> {
         return try {
-            // Create multipart request parts
-            val storeIdPart = storeId.toString().toRequestBody("text/plain".toMediaTypeOrNull())
-            val messagePart = message.toRequestBody("text/plain".toMediaTypeOrNull())
+            val parts = mutableMapOf<String, RequestBody>()
 
-            // Add product ID part if provided
-            val productIdPart = if (productId != null && productId > 0) {
-                productId.toString().toRequestBody("text/plain".toMediaTypeOrNull())
-            } else {
-                null
+            // Required fields
+            parts["store_id"] = storeId.toString().toRequestBody("text/plain".toMediaType())
+            parts["message"] = message.toRequestBody("text/plain".toMediaType())
+
+            // Optional: Only include if productId is valid
+            if (productId != null && productId > 0) {
+                parts["product_id"] = productId.toString().toRequestBody("text/plain".toMediaType())
             }
 
-            // Create image part if file is provided
-            val imagePart = if (imageFile != null && imageFile.exists()) {
-                val requestFile = imageFile.asRequestBody("image/*".toMediaTypeOrNull())
-                MultipartBody.Part.createFormData("chatimg", imageFile.name, requestFile)
-            } else {
-                null
+            // Optional: Only include if imageFile is valid
+            val imagePart = imageFile?.takeIf { it.exists() }?.let { file ->
+//                val requestFile = file.asRequestBody("image/*".toMediaType())
+                val mimeType = when {
+                    file.name.endsWith(".png", ignoreCase = true) -> "image/png"
+                    file.name.endsWith(".jpg", ignoreCase = true) || file.name.endsWith(".jpeg", ignoreCase = true) -> "image/jpeg"
+                    else -> "image/jpeg"  // fallback
+                }
+                val requestFile = file.asRequestBody(mimeType.toMediaType())
+                MultipartBody.Part.createFormData("chatimg", file.name, requestFile)
             }
 
-            // Debug log the request parameters
-            Log.d("ChatRepository", "Sending chat with: storeId=$storeId, productId=$productId, " +
-                    "message length=${message.length}, hasImage=${imageFile != null}")
+            // Log the parts map keys and values (string representations)
+            Log.d("ChatRepository", "Sending chat message with parts:")
+            parts.forEach { (key, body) ->
+                Log.d("ChatRepository", "Key: $key, Value (approx): ${bodyToString(body)}")
+            }
+            Log.d("ChatRepository", "Sending chat message with imagePart: ${imagePart != null}")
 
-            // Make API call using your actual endpoint and parameter names
-            val response = apiService.sendChatLine(
-                storeId = storeIdPart,
-                message = messagePart,
-                productId = productIdPart,
-                chatimg = imagePart
-            )
-
-            Log.d("ChatRepository", "check data productId=$productIdPart, storeId=$storeIdPart, messageTxt=$messagePart, chatImg=$imagePart")
+            // Send request
+            val response = apiService.sendChatMessage(parts, imagePart)
 
             if (response.isSuccessful) {
-                val body = response.body()
-                if (body != null) {
-                    Result.Success(body)
-                } else {
-                    Result.Error(Exception("Empty response body"))
-                }
+                response.body()?.let { Result.Success(it) } ?: Result.Error(Exception("Empty response body"))
             } else {
-                val errorBody = response.errorBody()?.string() ?: "{}"
-                Log.e("ChatRepository", "API Error: ${response.code()} - $errorBody")
-                Result.Error(Exception("API Error: ${response.code()} - $errorBody"))
+                val errorMsg = response.errorBody()?.string().orEmpty()
+                Log.e("ChatRepository", "API Error: ${response.code()} - $errorMsg")
+                Result.Error(Exception("API Error: ${response.code()} - $errorMsg"))
             }
+
         } catch (e: Exception) {
-            Log.e("ChatRepository", "Exception sending message", e)
+            Log.e("ChatRepository", "Exception sending chat message", e)
             Result.Error(e)
         }
     }
 
+    // Helper function to get string content from RequestBody (best effort)
+    private fun bodyToString(requestBody: RequestBody): String {
+        return try {
+            val buffer = okio.Buffer()
+            requestBody.writeTo(buffer)
+            buffer.readUtf8()
+        } catch (e: Exception) {
+            "Could not read body"
+        }
+    }
+
+//    suspend fun sendChatMessage(
+//        storeId: Int,
+//        message: String,
+//        productId: Int?,
+//        imageFile: File? = null,
+//        chatRoomId: Int? = null
+//    ): Result<SendChatResponse> {
+//        return try {
+//            Log.d(TAG, "=== SEND CHAT MESSAGE ===")
+//            Log.d(TAG, "StoreId: $storeId")
+//            Log.d(TAG, "Message: '$message'")
+//            Log.d(TAG, "ProductId: $productId")
+//            Log.d(TAG, "ImageFile: ${imageFile?.absolutePath}")
+//            Log.d(TAG, "ImageFile exists: ${imageFile?.exists()}")
+//            Log.d(TAG, "ImageFile size: ${imageFile?.length()} bytes")
+//
+//            // Convert primitive fields to RequestBody
+//            val storeIdBody = storeId.toString().toRequestBody("text/plain".toMediaTypeOrNull())
+//            val messageBody = message.toRequestBody("text/plain".toMediaTypeOrNull())
+//            val productIdBody = productId?.takeIf { it > 0 } // null if 0
+//                ?.toString()
+//                ?.toRequestBody("text/plain".toMediaTypeOrNull())
+//
+//            // Convert image file to MultipartBody.Part if exists
+//            val imagePart: MultipartBody.Part? = imageFile?.takeIf { it.exists() }?.let { file ->
+//                val requestFile = file.asRequestBody("image/*".toMediaTypeOrNull())
+//                MultipartBody.Part.createFormData("chatimg", file.name, requestFile)
+//            }
+//
+//
+//
+//            // Call the API
+//            Log.d(TAG, "Sending request. ProductIdBody is null: ${productIdBody == null}")
+//
+//            val response = apiService.sendChatLine(
+//                storeId = storeIdBody,
+//                message = messageBody,
+//                productId = productIdBody,
+//                chatimg = imagePart
+//            )
+//
+//            // Handle API response
+//            if (response.isSuccessful) {
+//                response.body()?.let {
+//                    Log.d(TAG, "Success: ${it.message}")
+//                    Result.Success(it)
+//                } ?: run {
+//                    Log.e(TAG, "Response body is null")
+//                    Result.Error(Exception("Empty response body"))
+//                }
+//            } else {
+//                val errorMsg = response.errorBody()?.string() ?: "Unknown error"
+//                Log.e(TAG, "API Error: ${response.code()} - $errorMsg")
+//                Result.Error(Exception("API Error: ${response.code()} - $errorMsg"))
+//            }
+//
+//        } catch (e: Exception) {
+//            Log.e(TAG, "Exception sending chat message", e)
+//            Result.Error(e)
+//        }
+//    }
+
     suspend fun updateMessageStatus(
         messageId: Int,
         status: String
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt
index c8f6585..04b5780 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt
@@ -59,6 +59,8 @@ class RegisterActivity : AppCompatActivity() {
             windowInsets
         }
 
+
+
         Log.d("RegisterActivity", "Token in storage: '${sessionManager.getToken()}'")
         Log.d("RegisterActivity", "User ID in storage: '${sessionManager.getUserId()}'")
 
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/auth/fragments/RegisterStep3Fragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/auth/fragments/RegisterStep3Fragment.kt
index ec34458..e73281e 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/auth/fragments/RegisterStep3Fragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/auth/fragments/RegisterStep3Fragment.kt
@@ -8,6 +8,9 @@ import android.view.View
 import android.view.ViewGroup
 import android.widget.TextView
 import android.widget.Toast
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowInsetsAnimationCompat
+import androidx.core.view.WindowInsetsCompat
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.activityViewModels
 import com.alya.ecommerce_serang.R
@@ -91,6 +94,8 @@ class RegisterStep3Fragment : Fragment() {
         // Set up province and city dropdowns
         setupAutoComplete()
 
+        setupEdgeToEdge()
+
         // Set up button listeners
         binding.btnPrevious.setOnClickListener {
             // Go back to the previous step
@@ -116,6 +121,55 @@ class RegisterStep3Fragment : Fragment() {
         setupCityObserver()
     }
 
+    private fun setupEdgeToEdge() {
+        // Apply insets to your fragment's root view
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                systemBars.bottom
+            )
+            windowInsets
+        }
+
+        // Set up IME animation callback
+        ViewCompat.setWindowInsetsAnimationCallback(
+            binding.root,
+            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
+                var startBottom = 0f
+                var endBottom = 0f
+
+                override fun onPrepare(animation: WindowInsetsAnimationCompat) {
+                    startBottom = binding.root.bottom.toFloat()
+                }
+
+                override fun onStart(
+                    animation: WindowInsetsAnimationCompat,
+                    bounds: WindowInsetsAnimationCompat.BoundsCompat
+                ): WindowInsetsAnimationCompat.BoundsCompat {
+                    endBottom = binding.root.bottom.toFloat()
+                    return bounds
+                }
+
+                override fun onProgress(
+                    insets: WindowInsetsCompat,
+                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
+                ): WindowInsetsCompat {
+                    val imeAnimation = runningAnimations.find {
+                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
+                    } ?: return insets
+
+                    binding.root.translationY =
+                        (startBottom - endBottom) * (1 - imeAnimation.interpolatedFraction)
+
+                    return insets
+                }
+            }
+        )
+    }
+
     private fun setupAutoComplete() {
         // Same implementation as before
         binding.autoCompleteProvinsi.setAdapter(provinceAdapter)
@@ -351,6 +405,8 @@ class RegisterStep3Fragment : Fragment() {
 
     override fun onDestroyView() {
         super.onDestroyView()
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root, null)
+        ViewCompat.setWindowInsetsAnimationCallback(binding.root, null)
         _binding = null
     }
 //
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt
index 453c9b2..d9cc397 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt
@@ -3,6 +3,7 @@ package com.alya.ecommerce_serang.ui.chat
 import android.Manifest
 import android.app.Activity
 import android.app.AlertDialog
+import android.content.Context
 import android.content.Intent
 import android.content.pm.PackageManager
 import android.net.Uri
@@ -12,6 +13,7 @@ import android.text.Editable
 import android.text.TextWatcher
 import android.util.Log
 import android.view.View
+import android.view.inputmethod.InputMethodManager
 import android.widget.Toast
 import androidx.activity.enableEdgeToEdge
 import androidx.activity.result.contract.ActivityResultContracts
@@ -22,6 +24,7 @@ import androidx.core.content.ContextCompat
 import androidx.core.content.FileProvider
 import androidx.core.view.ViewCompat
 import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsAnimationCompat
 import androidx.core.view.WindowInsetsCompat
 import androidx.lifecycle.Observer
 import androidx.recyclerview.widget.LinearLayoutManager
@@ -40,6 +43,7 @@ import java.text.SimpleDateFormat
 import java.util.Date
 import java.util.Locale
 import javax.inject.Inject
+import kotlin.math.max
 
 @AndroidEntryPoint
 class ChatActivity : AppCompatActivity() {
@@ -100,16 +104,7 @@ class ChatActivity : AppCompatActivity() {
         enableEdgeToEdge()
 
         // Apply insets to your root layout
-        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
-            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
-            view.setPadding(
-                systemBars.left,
-                systemBars.top,
-                systemBars.right,
-                systemBars.bottom
-            )
-            windowInsets
-        }
+
 
         // Get parameters from intent
         val storeId = intent.getIntExtra(Constants.EXTRA_STORE_ID, 0)
@@ -146,6 +141,84 @@ class ChatActivity : AppCompatActivity() {
             .placeholder(R.drawable.placeholder_image)
             .into(binding.imgProfile)
 
+        ViewCompat.setOnApplyWindowInsetsListener(binding.layoutChatInput) { view, insets ->
+            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
+            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+
+            val bottomPadding = max(imeInsets.bottom, navBarInsets.bottom)
+            view.setPadding(view.paddingLeft, view.paddingTop, view.paddingRight, bottomPadding)
+            insets
+        }
+
+// Handle top inset on toolbar (status bar height)
+        ViewCompat.setOnApplyWindowInsetsListener(binding.chatToolbar) { view, insets ->
+            val statusBarHeight = insets.getInsets(WindowInsetsCompat.Type.statusBars()).top
+            view.setPadding(view.paddingLeft, statusBarHeight, view.paddingRight, view.paddingBottom)
+            insets
+        }
+
+        ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerChat) { view, insets ->
+            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+            val bottomPadding = binding.layoutChatInput.height + navBarInsets.bottom
+
+            view.setPadding(
+                view.paddingLeft,
+                view.paddingTop,
+                view.paddingRight,
+                bottomPadding
+            )
+            insets
+        }
+
+// For RecyclerView, add bottom padding = chat input height + nav bar height (to avoid last message hidden)
+
+        ViewCompat.setWindowInsetsAnimationCallback(binding.root,
+            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
+
+                private var startPaddingBottom = 0
+                private var endPaddingBottom = 0
+
+                override fun onPrepare(animation: WindowInsetsAnimationCompat) {
+                    startPaddingBottom = binding.layoutChatInput.paddingBottom
+                }
+
+                override fun onStart(
+                    animation: WindowInsetsAnimationCompat,
+                    bounds: WindowInsetsAnimationCompat.BoundsCompat
+                ): WindowInsetsAnimationCompat.BoundsCompat {
+                    endPaddingBottom = binding.layoutChatInput.paddingBottom
+                    return bounds
+                }
+
+                override fun onProgress(
+                    insets: WindowInsetsCompat,
+                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
+                ): WindowInsetsCompat {
+                    val imeAnimation = runningAnimations.find {
+                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
+                    } ?: return insets
+
+                    val animatedBottomPadding = startPaddingBottom +
+                            (endPaddingBottom - startPaddingBottom) * imeAnimation.interpolatedFraction
+
+                    binding.layoutChatInput.setPadding(
+                        binding.layoutChatInput.paddingLeft,
+                        binding.layoutChatInput.paddingTop,
+                        binding.layoutChatInput.paddingRight,
+                        animatedBottomPadding.toInt()
+                    )
+
+                    binding.recyclerChat.setPadding(
+                        binding.recyclerChat.paddingLeft,
+                        binding.recyclerChat.paddingTop,
+                        binding.recyclerChat.paddingRight,
+                        animatedBottomPadding.toInt() + binding.layoutChatInput.height
+                    )
+
+                    return insets
+                }
+            })
+
                 // Set chat parameters to ViewModel
         viewModel.setChatParameters(
             storeId = storeId,
@@ -178,6 +251,12 @@ class ChatActivity : AppCompatActivity() {
                 stackFromEnd = true
             }
         }
+//        binding.recyclerChat.setPadding(
+//            binding.recyclerChat.paddingLeft,
+//            binding.recyclerChat.paddingTop,
+//            binding.recyclerChat.paddingRight,
+//            binding.layoutChatInput.height + binding.root.rootWindowInsets?.getInsets(WindowInsetsCompat.Type.navigationBars())?.bottom ?: 0
+//        )
     }
 
 
@@ -222,6 +301,11 @@ class ChatActivity : AppCompatActivity() {
 
             override fun afterTextChanged(s: Editable?) {}
         })
+
+        binding.editTextMessage.requestFocus()
+        val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
+        imm.showSoftInput(binding.editTextMessage, InputMethodManager.SHOW_IMPLICIT)
+
     }
 
     private fun observeViewModel() {
@@ -256,10 +340,17 @@ class ChatActivity : AppCompatActivity() {
                 binding.tvSellerName.text = state.storeName
                 binding.tvStoreName.text=state.storeName
 
+                val fullImageUrl = when (val img = state.productImageUrl) {
+                    is String -> {
+                        if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                    }
+                    else -> R.drawable.placeholder_image
+                }
+
                 // Load product image
                 if (!state.productImageUrl.isNullOrEmpty()) {
                     Glide.with(this@ChatActivity)
-                        .load(BASE_URL + state.productImageUrl)
+                        .load(fullImageUrl)
                         .centerCrop()
                         .placeholder(R.drawable.placeholder_image)
                         .error(R.drawable.placeholder_image)
@@ -294,8 +385,6 @@ class ChatActivity : AppCompatActivity() {
         })
     }
 
-
-
     private fun showOptionsMenu() {
         val options = arrayOf(
             getString(R.string.block_user),
@@ -380,67 +469,36 @@ class ChatActivity : AppCompatActivity() {
         try {
             Log.d(TAG, "Processing selected image: $uri")
 
-            // First try the direct approach to get the file path
-            var filePath: String? = null
+            // Always use the copy-to-cache approach for reliability
+            contentResolver.openInputStream(uri)?.use { inputStream ->
+                val fileName = "chat_img_${System.currentTimeMillis()}.jpg"
+                val outputFile = File(cacheDir, fileName)
 
-            // For newer Android versions, we need to handle content URIs properly
-            if (uri.scheme == "content") {
-                val cursor = contentResolver.query(uri, null, null, null, null)
-                cursor?.use {
-                    if (it.moveToFirst()) {
-                        val columnIndex = it.getColumnIndex(MediaStore.Images.Media.DATA)
-                        if (columnIndex != -1) {
-                            filePath = it.getString(columnIndex)
-                            Log.d(TAG, "Found file path from cursor: $filePath")
-                        }
-                    }
+                outputFile.outputStream().use { outputStream ->
+                    inputStream.copyTo(outputStream)
                 }
 
-                // If we couldn't get the path directly, create a copy in our cache directory
-                if (filePath == null) {
-                    contentResolver.openInputStream(uri)?.use { inputStream ->
-                        val fileName = "img_${System.currentTimeMillis()}.jpg"
-                        val outputFile = File(cacheDir, fileName)
-
-                        outputFile.outputStream().use { outputStream ->
-                            inputStream.copyTo(outputStream)
-                        }
-
-                        filePath = outputFile.absolutePath
-                        Log.d(TAG, "Created temp file from input stream: $filePath")
-                    }
-                }
-            } else if (uri.scheme == "file") {
-                // Direct file URI
-                filePath = uri.path
-                Log.d(TAG, "Got file path directly from URI: $filePath")
-            }
-
-            // Process the file path
-            if (filePath != null) {
-                val file = File(filePath)
-                if (file.exists()) {
-                    // Check file size (limit to 5MB)
-                    if (file.length() > 5 * 1024 * 1024) {
-                        Toast.makeText(this, "Image too large (max 5MB), please select a smaller image", Toast.LENGTH_SHORT).show()
+                if (outputFile.exists() && outputFile.length() > 0) {
+                    if (outputFile.length() > 5 * 1024 * 1024) {
+                        Log.e(TAG, "File too large: ${outputFile.length()} bytes")
+                        Toast.makeText(this, "Image too large (max 5MB)", Toast.LENGTH_SHORT).show()
                         return
                     }
 
-                    // Set the file to the ViewModel
-                    viewModel.setSelectedImageFile(file)
-                    Toast.makeText(this, R.string.image_selected, Toast.LENGTH_SHORT).show()
-                    Log.d(TAG, "Successfully set image file: ${file.absolutePath}, size: ${file.length()} bytes")
+                    Log.d(TAG, "Image processed successfully: ${outputFile.absolutePath}, size: ${outputFile.length()}")
+                    viewModel.setSelectedImageFile(outputFile)
+                    Toast.makeText(this, "Image selected", Toast.LENGTH_SHORT).show()
                 } else {
-                    Log.e(TAG, "File does not exist: $filePath")
-                    Toast.makeText(this, "Could not access the selected image", Toast.LENGTH_SHORT).show()
+                    Log.e(TAG, "Failed to create image file")
+                    Toast.makeText(this, "Failed to process image", Toast.LENGTH_SHORT).show()
                 }
-            } else {
-                Log.e(TAG, "Could not get file path from URI: $uri")
-                Toast.makeText(this, "Could not process the selected image", Toast.LENGTH_SHORT).show()
+            } ?: run {
+                Log.e(TAG, "Could not open input stream for URI: $uri")
+                Toast.makeText(this, "Could not access image", Toast.LENGTH_SHORT).show()
             }
         } catch (e: Exception) {
             Log.e(TAG, "Error handling selected image", e)
-            Toast.makeText(this, "Error processing image: ${e.message}", Toast.LENGTH_SHORT).show()
+            Toast.makeText(this, "Error: ${e.message}", Toast.LENGTH_SHORT).show()
         }
     }
 
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt
index 0e2f083..484803f 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt
@@ -78,8 +78,16 @@ class ChatAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMess
             // Handle attachment if exists
             if (message.attachment?.isNotEmpty() == true) {
                 binding.imgAttachment.visibility = View.VISIBLE
+
+                val fullImageUrl = when (val img = message.attachment) {
+                    is String -> {
+                        if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                    }
+                    else -> R.drawable.placeholder_image
+                }
+
                 Glide.with(binding.root.context)
-                    .load(BASE_URL + message.attachment)
+                    .load(fullImageUrl)
                     .centerCrop()
                     .placeholder(R.drawable.placeholder_image)
                     .error(R.drawable.placeholder_image)
@@ -101,10 +109,17 @@ class ChatAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMess
             binding.tvTimestamp.text = message.time
 
             // Handle attachment if exists
+            val fullImageUrl = when (val img = message.attachment) {
+                is String -> {
+                    if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                }
+                else -> R.drawable.placeholder_image
+            }
+
             if (message.attachment?.isNotEmpty() == true) {
                 binding.imgAttachment.visibility = View.VISIBLE
                 Glide.with(binding.root.context)
-                    .load(BASE_URL + message.attachment)
+                    .load(fullImageUrl)
                     .centerCrop()
                     .placeholder(R.drawable.placeholder_image)
                     .error(R.drawable.placeholder_image)
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
index 989dedd..1f15130 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
@@ -46,7 +46,7 @@ class ChatViewModel @Inject constructor(
 
     // Store and product parameters
     private var storeId: Int = 0
-    private var productId: Int? = 0
+    private var productId: Int = 0
     private var currentUserId: Int? = null
     private var defaultUserId: Int = 0
 
@@ -100,8 +100,9 @@ class ChatViewModel @Inject constructor(
         productRating: Float? = 0f,
         storeName: String
     ) {
+        this.productId = if (productId != null && productId > 0) productId else 0
+
         this.storeId = storeId
-        this.productId = productId!!
         this.productName = productName.toString()
         this.productPrice = productPrice.toString()
         this.productImage = productImage.toString()
@@ -247,6 +248,11 @@ class ChatViewModel @Inject constructor(
      * Sends a chat message
      */
     fun sendMessage(message: String) {
+        Log.d(TAG, "=== SEND MESSAGE ===")
+        Log.d(TAG, "Message: '$message'")
+        Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
+        Log.d(TAG, "Selected image file: ${selectedImageFile?.absolutePath}")
+        Log.d(TAG, "File exists: ${selectedImageFile?.exists()}")
         if (message.isBlank() && selectedImageFile == null) {
             Log.e(TAG, "Cannot send message: Both message and image are empty")
             return
@@ -282,12 +288,14 @@ class ChatViewModel @Inject constructor(
                 // Send the message using the repository
                 // Note: We keep the chatRoomId parameter for compatibility with the repository method signature,
                 // but it's not actually used in the API call
+                val safeProductId = if (productId == 0) null else productId
+
+
                 val result = chatRepository.sendChatMessage(
                     storeId = storeId,
                     message = message,
-                    productId = productId,
-                    imageFile = selectedImageFile,
-                    chatRoomId = existingChatRoomId
+                    productId = safeProductId,
+                    imageFile = selectedImageFile
                 )
 
                 when (result) {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/notif/PersonalNotificationAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/notif/PersonalNotificationAdapter.kt
index e60aa1c..cafb9e5 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/notif/PersonalNotificationAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/notif/PersonalNotificationAdapter.kt
@@ -44,7 +44,14 @@ class PersonalNotificationAdapter(
 
         fun bind(notification: NotifItem) {
             binding.apply {
-                tvNotificationType.text = notification.type
+                val typeNotif = notification.type.toString()
+                if(typeNotif == "User"){
+                    tvNotificationType.text = "Pembelian"
+                } else if (typeNotif == "Store"){
+                    tvNotificationType.text = "Penjualan"
+                } else {
+                    tvNotificationType.text = notification.type
+                }
                 tvTitle.text = notification.title
                 tvDescription.text = notification.message
 
@@ -63,7 +70,7 @@ class PersonalNotificationAdapter(
             try {
                 // Parse the date with the expected format from API
                 val inputFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
-                val outputFormat = SimpleDateFormat("HH:mm", Locale.getDefault())
+                val outputFormat = SimpleDateFormat("dd/MM/yyyy HH:mm", Locale.getDefault())
 
                 val date = inputFormat.parse(createdAt)
                 date?.let {
diff --git a/app/src/main/res/layout/activity_chat.xml b/app/src/main/res/layout/activity_chat.xml
index 902de35..d60c39e 100644
--- a/app/src/main/res/layout/activity_chat.xml
+++ b/app/src/main/res/layout/activity_chat.xml
@@ -4,6 +4,7 @@
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:fitsSystemWindows="false"
     android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.chat.ChatActivity">
 
@@ -55,17 +56,17 @@
                 app:layout_constraintTop_toTopOf="@+id/imgProfile"
                 app:layout_constraintEnd_toStartOf="@+id/btnOptions" />
 
-            <TextView
-                android:id="@+id/tvLastActive"
-                android:layout_width="0dp"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="8dp"
-                android:text="Aktif 3 jam lalu"
-                android:textColor="#888888"
-                android:textSize="12sp"
-                app:layout_constraintStart_toEndOf="@+id/imgProfile"
-                app:layout_constraintTop_toBottomOf="@+id/tvStoreName"
-                app:layout_constraintEnd_toEndOf="@+id/tvStoreName" />
+<!--            <TextView-->
+<!--                android:id="@+id/tvLastActive"-->
+<!--                android:layout_width="0dp"-->
+<!--                android:layout_height="wrap_content"-->
+<!--                android:layout_marginStart="8dp"-->
+<!--                android:text="Aktif 3 jam lalu"-->
+<!--                android:textColor="#888888"-->
+<!--                android:textSize="12sp"-->
+<!--                app:layout_constraintStart_toEndOf="@+id/imgProfile"-->
+<!--                app:layout_constraintTop_toBottomOf="@+id/tvStoreName"-->
+<!--                app:layout_constraintEnd_toEndOf="@+id/tvStoreName" />-->
 
             <ImageButton
                 android:id="@+id/btnOptions"
@@ -225,6 +226,8 @@
             android:hint="Tulis pesan"
             android:fontFamily="@font/dmsans_regular"
             android:inputType="textMultiLine"
+            android:focusable="true"
+            android:focusableInTouchMode="true"
             android:maxLines="4"
             android:minHeight="40dp"
             android:padding="8dp" />
diff --git a/app/src/main/res/layout/activity_checkout.xml b/app/src/main/res/layout/activity_checkout.xml
index ba30bd8..8c793d4 100644
--- a/app/src/main/res/layout/activity_checkout.xml
+++ b/app/src/main/res/layout/activity_checkout.xml
@@ -7,6 +7,7 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:background="@color/black_800"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.order.CheckoutActivity">
 
     <com.google.android.material.appbar.MaterialToolbar
diff --git a/app/src/main/res/layout/activity_detail_order_status.xml b/app/src/main/res/layout/activity_detail_order_status.xml
index 1d05c02..930d5c5 100644
--- a/app/src/main/res/layout/activity_detail_order_status.xml
+++ b/app/src/main/res/layout/activity_detail_order_status.xml
@@ -5,6 +5,7 @@
     android:id="@+id/main"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.order.history.detailorder.DetailOrderStatusActivity">
 
     <include
diff --git a/app/src/main/res/layout/activity_detail_payment.xml b/app/src/main/res/layout/activity_detail_payment.xml
index 7880b91..2be86b4 100644
--- a/app/src/main/res/layout/activity_detail_payment.xml
+++ b/app/src/main/res/layout/activity_detail_payment.xml
@@ -8,6 +8,7 @@
     android:layout_height="match_parent"
     android:orientation="vertical"
     android:background="@color/white"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.profile.mystore.sells.payment.DetailPaymentActivity">
 
     <include
diff --git a/app/src/main/res/layout/activity_detail_profile.xml b/app/src/main/res/layout/activity_detail_profile.xml
index 55d422d..84023ee 100644
--- a/app/src/main/res/layout/activity_detail_profile.xml
+++ b/app/src/main/res/layout/activity_detail_profile.xml
@@ -6,6 +6,7 @@
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@color/white"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.profile.DetailProfileActivity">
 
     <LinearLayout
diff --git a/app/src/main/res/layout/activity_edit_profile_cust.xml b/app/src/main/res/layout/activity_edit_profile_cust.xml
index 97589d7..ca3cde3 100644
--- a/app/src/main/res/layout/activity_edit_profile_cust.xml
+++ b/app/src/main/res/layout/activity_edit_profile_cust.xml
@@ -5,6 +5,7 @@
     android:id="@+id/main"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.profile.editprofile.EditProfileCustActivity">
 
     <LinearLayout
diff --git a/app/src/main/res/layout/activity_notification.xml b/app/src/main/res/layout/activity_notification.xml
index d75af86..9bfba0a 100644
--- a/app/src/main/res/layout/activity_notification.xml
+++ b/app/src/main/res/layout/activity_notification.xml
@@ -6,6 +6,7 @@
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.notif.NotificationActivity">
 
     <androidx.appcompat.widget.Toolbar
@@ -31,7 +32,7 @@
             android:text="Notifikasi"
             android:textColor="@android:color/black"
             android:textSize="18sp"
-            android:textStyle="bold" />
+            android:fontFamily="@font/dmsans_semibold" />
     </androidx.appcompat.widget.Toolbar>
 
     <com.google.android.material.tabs.TabLayout
@@ -46,6 +47,7 @@
         <com.google.android.material.tabs.TabItem
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
+            style="@style/body_medium"
             android:text="Notifikasi Saya" />
 
         <com.google.android.material.tabs.TabItem
@@ -54,17 +56,17 @@
             android:text="Notifikasi Toko" />
     </com.google.android.material.tabs.TabLayout>
 
-    <TextView
-        android:id="@+id/tvMarkAllRead"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginEnd="16dp"
-        android:padding="8dp"
-        android:text="Tandai Sudah Dibaca Semua"
-        android:textColor="@color/blue_500"
-        android:textSize="12sp"
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintTop_toBottomOf="@id/tabLayout" />
+<!--    <TextView-->
+<!--        android:id="@+id/tvMarkAllRead"-->
+<!--        android:layout_width="wrap_content"-->
+<!--        android:layout_height="wrap_content"-->
+<!--        android:layout_marginEnd="16dp"-->
+<!--        android:padding="8dp"-->
+<!--        android:text="Tandai Sudah Dibaca Semua"-->
+<!--        android:textColor="@color/blue_500"-->
+<!--        android:textSize="12sp"-->
+<!--        app:layout_constraintEnd_toEndOf="parent"-->
+<!--        app:layout_constraintTop_toBottomOf="@id/tabLayout" />-->
 
     <TextView
         android:id="@+id/tvNewest"
@@ -75,9 +77,9 @@
         android:text="Terbaru"
         android:textColor="@android:color/black"
         android:textSize="14sp"
-        android:textStyle="bold"
+        android:fontFamily="@font/dmsans_semibold"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@id/tvMarkAllRead" />
+        app:layout_constraintTop_toBottomOf="@id/tabLayout" />
 
     <androidx.swiperefreshlayout.widget.SwipeRefreshLayout
         android:id="@+id/swipeRefreshLayout"
diff --git a/app/src/main/res/layout/activity_payment.xml b/app/src/main/res/layout/activity_payment.xml
index f28fff8..c8d993d 100644
--- a/app/src/main/res/layout/activity_payment.xml
+++ b/app/src/main/res/layout/activity_payment.xml
@@ -5,6 +5,7 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:background="@color/white"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.order.detail.PaymentActivity">
 
     <com.google.android.material.appbar.AppBarLayout
diff --git a/app/src/main/res/layout/activity_payment_info.xml b/app/src/main/res/layout/activity_payment_info.xml
index 107cb4d..949395a 100644
--- a/app/src/main/res/layout/activity_payment_info.xml
+++ b/app/src/main/res/layout/activity_payment_info.xml
@@ -5,6 +5,7 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:background="@android:color/white"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.profile.mystore.profile.payment_info.PaymentInfoActivity">
 
     <include
diff --git a/app/src/main/res/layout/activity_register.xml b/app/src/main/res/layout/activity_register.xml
index a7e0848..c58fe3d 100644
--- a/app/src/main/res/layout/activity_register.xml
+++ b/app/src/main/res/layout/activity_register.xml
@@ -17,6 +17,7 @@
         android:layout_marginTop="16dp"
         android:text="Daftar Akun"
         android:textAlignment="center"
+        android:fontFamily="@font/dmsans_bold"
         android:textSize="20sp"
         android:textStyle="bold" />
 
diff --git a/app/src/main/res/layout/activity_register_store.xml b/app/src/main/res/layout/activity_register_store.xml
index 36f8916..2ac26d7 100644
--- a/app/src/main/res/layout/activity_register_store.xml
+++ b/app/src/main/res/layout/activity_register_store.xml
@@ -21,7 +21,7 @@
             android:text="Buka Toko"
             android:textColor="@android:color/white"
             android:textSize="20sp"
-            android:textStyle="bold" />
+            android:fontFamily="@font/dmsans_medium" />
 
         <TextView
             android:layout_width="match_parent"
@@ -570,7 +570,8 @@
                 android:layout_height="wrap_content"
                 android:layout_marginTop="24dp"
                 android:layout_marginBottom="16dp"
-                android:background="#3F9CE8"
+                android:background="@color/blue_500"
+                android:fontFamily="@font/dmsans_medium"
                 android:text="Daftar"
                 android:textColor="@android:color/white" />
         </LinearLayout>
diff --git a/app/src/main/res/values/themes.xml b/app/src/main/res/values/themes.xml
index 24782af..adeeaac 100644
--- a/app/src/main/res/values/themes.xml
+++ b/app/src/main/res/values/themes.xml
@@ -40,6 +40,9 @@
         <item name="android:statusBarColor">@android:color/transparent</item>
         <item name="android:navigationBarColor">@android:color/transparent</item>
 <!--        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>-->
+
+        <item name="android:textViewStyle">@style/body_medium</item>
+
     </style>
 
     <!-- Text Styles -->

From 1c443232aed521e410c20b6f32951d65fa362cf0 Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Tue, 27 May 2025 18:03:42 +0700
Subject: [PATCH 02/10] update font and chat

---
 gradle/libs.versions.toml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
index 5b78d69..7ee4510 100644
--- a/gradle/libs.versions.toml
+++ b/gradle/libs.versions.toml
@@ -1,5 +1,5 @@
 [versions]
-agp = "8.10.0"
+agp = "8.9.2"
 glide = "4.16.0"
 gson = "2.11.0"
 hiltAndroid = "2.56.2"  # Updated from 2.44 for better compatibility

From b1db662494e9f162a2e0c0b801bef83c6a698120 Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Wed, 28 May 2025 17:32:36 +0700
Subject: [PATCH 03/10] add all order tab

---
 .../data/api/dto/OrdersItem.kt                | 10 ++-
 .../data/repository/OrderRepository.kt        |  1 +
 .../ui/order/history/HistoryViewModel.kt      | 85 ++++++++++++++++---
 .../ui/order/history/OrderHistoryAdapter.kt   | 20 ++++-
 .../ui/order/history/OrderListFragment.kt     | 23 +++--
 app/src/main/res/values/strings.xml           |  2 +-
 6 files changed, 107 insertions(+), 34 deletions(-)

diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/OrdersItem.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/OrdersItem.kt
index 5d16279..439b949 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/OrdersItem.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/OrdersItem.kt
@@ -27,7 +27,7 @@ data class OrdersItem(
     val street: String,
 
     @field:SerializedName("cancel_date")
-    val cancelDate: String? = null,
+    val cancelDate: String,
 
     @field:SerializedName("longitude")
     val longitude: String,
@@ -42,7 +42,7 @@ data class OrdersItem(
     val autoCompletedAt: String? = null,
 
     @field:SerializedName("is_store_location")
-    val isStoreLocation: Boolean? = null,
+    val isStoreLocation: Boolean? = false,
 
     @field:SerializedName("voucher_name")
     val voucherName: String? = null,
@@ -81,7 +81,7 @@ data class OrdersItem(
     val paymentInfoId: Int? = null,
 
     @field:SerializedName("detail")
-    val detail: String,
+    val detail: String? = null,
 
     @field:SerializedName("postal_code")
     val postalCode: String,
@@ -90,5 +90,7 @@ data class OrdersItem(
     val orderId: Int,
 
     @field:SerializedName("city_id")
-    val cityId: Int
+    val cityId: Int,
+
+    var displayStatus: String? = null
 )
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/OrderRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/OrderRepository.kt
index e162141..0f4f587 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/OrderRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/OrderRepository.kt
@@ -511,4 +511,5 @@ class OrderRepository(private val apiService: ApiService) {
         }
     }
 
+
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryViewModel.kt
index 9c36c28..c2df487 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryViewModel.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryViewModel.kt
@@ -15,8 +15,13 @@ import com.alya.ecommerce_serang.data.api.response.order.CompletedOrderResponse
 import com.alya.ecommerce_serang.data.repository.OrderRepository
 import com.alya.ecommerce_serang.data.repository.Result
 import com.alya.ecommerce_serang.ui.order.address.ViewState
+import kotlinx.coroutines.async
+import kotlinx.coroutines.awaitAll
+import kotlinx.coroutines.coroutineScope
 import kotlinx.coroutines.launch
 import java.io.File
+import java.text.SimpleDateFormat
+import java.util.Locale
 
 class HistoryViewModel(private val repository: OrderRepository) : ViewModel()  {
 
@@ -57,28 +62,80 @@ class HistoryViewModel(private val repository: OrderRepository) : ViewModel()  {
     fun getOrderList(status: String) {
         _orders.value = ViewState.Loading
         viewModelScope.launch {
-            _orders.value = ViewState.Loading
-
             try {
-                when (val result = repository.getOrderList(status)) {
-                    is Result.Success -> {
-                        _orders.value = ViewState.Success(result.data.orders)
-                        Log.d("HistoryViewModel", "Orders loaded successfully: ${result.data.orders.size} items")
-                    }
-                    is Result.Error -> {
-                        _orders.value = ViewState.Error(result.exception.message ?: "Unknown error occurred")
-                        Log.e("HistoryViewModel", "Error loading orders", result.exception)
-                    }
-                    is Result.Loading -> {
-                        null
+                if (status == "all") {
+                    // Get all orders by combining all statuses
+                    getAllOrdersCombined()
+                } else {
+                    // Get orders for specific status
+                    when (val result = repository.getOrderList(status)) {
+                        is Result.Success -> {
+                            _orders.value = ViewState.Success(result.data.orders)
+                            Log.d(TAG, "Orders loaded successfully: ${result.data.orders.size} items")
+                        }
+                        is Result.Error -> {
+                            _orders.value = ViewState.Error(result.exception.message ?: "Unknown error occurred")
+                            Log.e(TAG, "Error loading orders", result.exception)
+                        }
+                        is Result.Loading -> {
+                            // Keep loading state
+                        }
                     }
                 }
             } catch (e: Exception) {
                 _orders.value = ViewState.Error("An unexpected error occurred: ${e.message}")
-                Log.e("HistoryViewModel", "Exception in getOrderList", e)
+                Log.e(TAG, "Exception in getOrderList", e)
             }
         }
     }
+
+    private suspend fun getAllOrdersCombined() {
+        try {
+            val allStatuses = listOf("pending", "unpaid", "processed", "shipped", "completed", "canceled")
+            val allOrders = mutableListOf<OrdersItem>()
+
+            // Use coroutineScope to allow launching async blocks
+            coroutineScope {
+                val deferreds = allStatuses.map { status ->
+                    async {
+                        when (val result = repository.getOrderList(status)) {
+                            is Result.Success -> {
+                                // Tag each order with the status it was fetched from
+                                result.data.orders.onEach { it.displayStatus = status }
+                            }
+                            is Result.Error -> {
+                                Log.e(TAG, "Error loading orders for status $status", result.exception)
+                                emptyList<OrdersItem>()
+                            }
+                            is Result.Loading -> emptyList<OrdersItem>()
+                        }
+                    }
+                }
+
+                // Await all results and combine
+                deferreds.awaitAll().forEach { orders ->
+                    allOrders.addAll(orders)
+                }
+            }
+
+            // Sort orders
+            val sortedOrders = allOrders.sortedByDescending { order ->
+                try {
+                    SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault()).parse(order.createdAt)
+                } catch (e: Exception) {
+                    null
+                }
+            }
+
+            _orders.value = ViewState.Success(sortedOrders)
+            Log.d(TAG, "All orders loaded successfully: ${sortedOrders.size} items")
+
+        } catch (e: Exception) {
+            _orders.value = ViewState.Error("An unexpected error occurred: ${e.message}")
+            Log.e(TAG, "Exception in getAllOrdersCombined", e)
+        }
+    }
+
     fun confirmOrderCompleted(orderId: Int, status: String) {
         Log.d(TAG, "Confirming order completed: orderId=$orderId, status=$status")
         viewModelScope.launch {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderHistoryAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderHistoryAdapter.kt
index 5432f78..a67a2d7 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderHistoryAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderHistoryAdapter.kt
@@ -119,8 +119,8 @@ class OrderHistoryAdapter(
                 onOrderClickListener(order)
             }
 
-            //adjust each fragment
-            adjustButtonsAndText(fragmentStatus, order)
+            val actualStatus = if (fragmentStatus == "all") order.displayStatus ?: "" else fragmentStatus
+            adjustButtonsAndText(actualStatus, order)
 
         }
 
@@ -253,7 +253,7 @@ class OrderHistoryAdapter(
                 "completed" -> {
                     statusOrder.apply {
                         visibility = View.VISIBLE
-                        text = itemView.context.getString(R.string.shipped_orders)
+                        text = itemView.context.getString(R.string.completed_orders)
                     }
                     deadlineLabel.apply {
                         visibility = View.VISIBLE
@@ -268,12 +268,26 @@ class OrderHistoryAdapter(
                             // Handle click event
                         }
                     }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDate(order.updatedAt)
+                    }
                 }
                 "canceled" -> {
                     statusOrder.apply {
                         visibility = View.VISIBLE
                         text = itemView.context.getString(R.string.canceled_orders)
                     }
+
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = itemView.context.getString(R.string.dl_canceled)
+                    }
+
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDate(order.cancelDate)
+                    }
                 }
             }
         }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderListFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderListFragment.kt
index fcc9837..5e43898 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderListFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderListFragment.kt
@@ -27,7 +27,6 @@ class OrderListFragment : Fragment() {
     private val binding get() = _binding!!
     private lateinit var sessionManager: SessionManager
 
-
     private val viewModel: HistoryViewModel by viewModels {
         BaseViewModelFactory {
             val apiService = ApiConfig.getApiService(sessionManager)
@@ -80,10 +79,9 @@ class OrderListFragment : Fragment() {
     private fun setupRecyclerView() {
         orderAdapter = OrderHistoryAdapter(
             onOrderClickListener = { order ->
-                // Handle order click
                 navigateToOrderDetail(order)
             },
-            viewModel = viewModel // Pass the ViewModel to the adapter
+            viewModel = viewModel
         )
 
         orderAdapter.setFragmentStatus(status)
@@ -95,6 +93,7 @@ class OrderListFragment : Fragment() {
     }
 
     private fun observeOrderList() {
+        // Now we only need to observe one LiveData for all cases
         viewModel.orders.observe(viewLifecycleOwner) { result ->
             when (result) {
                 is ViewState.Success -> {
@@ -115,13 +114,14 @@ class OrderListFragment : Fragment() {
                     Toast.makeText(requireContext(), result.message, Toast.LENGTH_SHORT).show()
                 }
                 is ViewState.Loading -> {
-                    null
+                    binding.progressBar.visibility = View.VISIBLE
                 }
             }
         }
     }
 
     private fun loadOrders() {
+        // Simple - just call getOrderList for any status including "all"
         viewModel.getOrderList(status)
     }
 
@@ -130,15 +130,15 @@ class OrderListFragment : Fragment() {
     ) { result ->
         if (result.resultCode == Activity.RESULT_OK) {
             // Refresh order list when returning with OK result
-            viewModel.getOrderList(status)
+            loadOrders()
         }
     }
 
     private fun navigateToOrderDetail(order: OrdersItem) {
         val intent = Intent(requireContext(), DetailOrderStatusActivity::class.java).apply {
             putExtra("ORDER_ID", order.orderId)
-            putExtra("ORDER_STATUS", status) // Pass the current status
-        }
+            val actualStatus = if (status == "all") order.displayStatus ?: "" else status
+            putExtra("ORDER_STATUS", actualStatus)        }
         detailOrderLauncher.launch(intent)
     }
 
@@ -147,11 +147,11 @@ class OrderListFragment : Fragment() {
         _binding = null
     }
 
-    private fun observeOrderCompletionStatus(){
-        viewModel.orderCompletionStatus.observe(viewLifecycleOwner){ result ->
-            when(result){
+    private fun observeOrderCompletionStatus() {
+        viewModel.orderCompletionStatus.observe(viewLifecycleOwner) { result ->
+            when (result) {
                 is Result.Loading -> {
-
+                    // Handle loading state if needed
                 }
                 is Result.Success -> {
                     Toast.makeText(requireContext(), "Order completed successfully!", Toast.LENGTH_SHORT).show()
@@ -163,5 +163,4 @@ class OrderListFragment : Fragment() {
             }
         }
     }
-
 }
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 43c932d..1623228 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -85,7 +85,7 @@
     <string name="dl_delivered">Semua Pesanan </string>
     <string name="dl_completed">Semua Pesanan </string>
     <string name="dl_shipped">Tanggal Pesanan Sampai</string>
-    <string name="dl_canceled">Semua Pesanan </string>
+    <string name="dl_canceled">Tanggal Pesanan Dibatalkan </string>
 
     <string name="sent_evidence">Kirim Bukti Pembayaran </string>
     <string name="canceled_order_btn">Batalkan Pesanan </string>

From 9b0ae95dfc80e936044b280df066c6017448120b Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Wed, 28 May 2025 18:51:32 +0700
Subject: [PATCH 04/10] add chat store

---
 app/src/main/AndroidManifest.xml              |  23 +-
 .../data/api/retrofit/ApiService.kt           |  11 +
 .../data/repository/ChatRepository.kt         |  76 +++
 .../ecommerce_serang/ui/chat/ChatViewModel.kt | 134 ++++
 .../ui/profile/mystore/MyStoreActivity.kt     |   8 +-
 .../profile/mystore/chat/ChatListAdapter.kt   |  69 ++
 .../mystore/chat/ChatListStoreActivity.kt     | 114 ++++
 .../mystore/chat/ChatListStoreFragment.kt     |  96 +++
 .../profile/mystore/chat/ChatStoreActivity.kt | 593 ++++++++++++++++++
 .../res/layout/activity_chat_list_store.xml   |  40 ++
 10 files changed, 1151 insertions(+), 13 deletions(-)
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
 create mode 100644 app/src/main/res/layout/activity_chat_list_store.xml

diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index 4edca1b..a5327c7 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -29,13 +29,16 @@
         android:theme="@style/Theme.Ecommerce_serang"
         android:usesCleartextTraffic="true"
         tools:targetApi="31">
+        <activity
+            android:name=".ui.profile.mystore.chat.ChatListStoreActivity"
+            android:exported="false" />
         <activity
             android:name=".ui.product.storeDetail.StoreDetailActivity"
             android:exported="false" />
         <activity
             android:name=".ui.auth.RegisterStoreActivity"
-            android:windowSoftInputMode="adjustResize"
-            android:exported="false" />
+            android:exported="false"
+            android:windowSoftInputMode="adjustResize" />
         <activity
             android:name=".ui.profile.editprofile.EditProfileCustActivity"
             android:exported="false" />
@@ -50,8 +53,8 @@
             android:exported="false" />
         <activity
             android:name=".ui.profile.mystore.profile.EditStoreProfileActivity"
-            android:windowSoftInputMode="adjustResize"
-            android:exported="false" />
+            android:exported="false"
+            android:windowSoftInputMode="adjustResize" />
         <activity
             android:name=".ui.profile.mystore.sells.shipment.DetailShipmentActivity"
             android:exported="false" />
@@ -73,6 +76,10 @@
             android:enabled="true"
             android:exported="false"
             android:foregroundServiceType="dataSync" />
+        <activity
+            android:name=".ui.profile.mystore.chat.ChatStoreActivity"
+            android:exported="false"
+            android:windowSoftInputMode="adjustResize|stateHidden" />
 
         <activity
             android:name=".ui.profile.mystore.profile.shipping_service.ShippingServiceActivity"
@@ -97,8 +104,8 @@
             android:exported="false" />
         <activity
             android:name=".ui.order.address.AddAddressActivity"
-            android:windowSoftInputMode="adjustResize"
-            android:exported="false" />
+            android:exported="false"
+            android:windowSoftInputMode="adjustResize" />
         <activity
             android:name=".ui.order.address.AddressActivity"
             android:exported="false" />
@@ -146,8 +153,8 @@
             android:exported="false" />
         <activity
             android:name=".ui.auth.RegisterActivity"
-            android:windowSoftInputMode="adjustResize"
-            android:exported="true">
+            android:exported="true"
+            android:windowSoftInputMode="adjustResize">
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
 
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
index 6bfc8da..8fe84d8 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
@@ -443,6 +443,17 @@ interface ApiService {
         @Part chatimg: MultipartBody.Part?
     ): Response<SendChatResponse>
 
+    @Multipart
+    @POST("store/sendchat")
+    suspend fun sendChatMessageStore(
+        @PartMap parts: Map<String, @JvmSuppressWildcards RequestBody>,
+        @Part chatimg: MultipartBody.Part? = null
+    ): Response<SendChatResponse>
+
+    @GET("store/chat")
+    suspend fun getChatListStore(
+    ): Response<ChatListResponse>
+
     @Multipart
     @POST("sendchat")
     suspend fun sendChatMessage(
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
index ccfb887..7ad1656 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
@@ -90,6 +90,60 @@ class ChatRepository @Inject constructor(
         }
     }
 
+    suspend fun sendChatMessageStore(
+        storeId: Int,
+        message: String,
+        productId: Int?,           // Nullable and optional
+        imageFile: File? = null    // Nullable and optional
+    ): Result<SendChatResponse> {
+        return try {
+            val parts = mutableMapOf<String, RequestBody>()
+
+            // Required fields
+            parts["store_id"] = storeId.toString().toRequestBody("text/plain".toMediaType())
+            parts["message"] = message.toRequestBody("text/plain".toMediaType())
+
+            // Optional: Only include if productId is valid
+            if (productId != null && productId > 0) {
+                parts["product_id"] = productId.toString().toRequestBody("text/plain".toMediaType())
+            }
+
+            // Optional: Only include if imageFile is valid
+            val imagePart = imageFile?.takeIf { it.exists() }?.let { file ->
+//                val requestFile = file.asRequestBody("image/*".toMediaType())
+                val mimeType = when {
+                    file.name.endsWith(".png", ignoreCase = true) -> "image/png"
+                    file.name.endsWith(".jpg", ignoreCase = true) || file.name.endsWith(".jpeg", ignoreCase = true) -> "image/jpeg"
+                    else -> "image/jpeg"  // fallback
+                }
+                val requestFile = file.asRequestBody(mimeType.toMediaType())
+                MultipartBody.Part.createFormData("chatimg", file.name, requestFile)
+            }
+
+            // Log the parts map keys and values (string representations)
+            Log.d("ChatRepository", "Sending chat message with parts:")
+            parts.forEach { (key, body) ->
+                Log.d("ChatRepository", "Key: $key, Value (approx): ${bodyToString(body)}")
+            }
+            Log.d("ChatRepository", "Sending chat message with imagePart: ${imagePart != null}")
+
+            // Send request
+            val response = apiService.sendChatMessageStore(parts, imagePart)
+
+            if (response.isSuccessful) {
+                response.body()?.let { Result.Success(it) } ?: Result.Error(Exception("Empty response body"))
+            } else {
+                val errorMsg = response.errorBody()?.string().orEmpty()
+                Log.e("ChatRepository", "API Error: ${response.code()} - $errorMsg")
+                Result.Error(Exception("API Error: ${response.code()} - $errorMsg"))
+            }
+
+        } catch (e: Exception) {
+            Log.e("ChatRepository", "Exception sending chat message", e)
+            Result.Error(e)
+        }
+    }
+
     // Helper function to get string content from RequestBody (best effort)
     private fun bodyToString(requestBody: RequestBody): String {
         return try {
@@ -217,4 +271,26 @@ class ChatRepository @Inject constructor(
             Result.Error(e)
         }
     }
+
+    suspend fun getListChatStore(): Result<List<ChatItemList>> {
+        return try {
+            Log.d("ChatRepository", "Calling getChatListStore() from ApiService")
+
+            val response = apiService.getChatListStore()
+
+            Log.d("ChatRepository", "Response received: isSuccessful=${response.isSuccessful}, code=${response.code()}")
+
+            if (response.isSuccessful) {
+                val chat = response.body()?.chat ?: emptyList()
+                Log.d("ChatRepository", "Chat list size: ${chat.size}")
+                Result.Success(chat)
+            } else {
+                Log.e("ChatRepository", "Failed response: ${response.errorBody()?.string()}")
+                Result.Error(Exception("Failed to fetch chat list. Code: ${response.code()}"))
+            }
+        } catch (e: Exception) {
+            Log.e("ChatRepository", "Exception during getChatListStore", e)
+            Result.Error(e)
+        }
+    }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
index 1f15130..35edf9c 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
@@ -41,6 +41,9 @@ class ChatViewModel @Inject constructor(
     private val _chatList = MutableLiveData<Result<List<ChatItemList>>>()
     val chatList: LiveData<Result<List<ChatItemList>>> = _chatList
 
+    private val _chatListStore = MutableLiveData<Result<List<ChatItemList>>>()
+    val chatListStore: LiveData<Result<List<ChatItemList>>> = _chatListStore
+
     private val _storeDetail = MutableLiveData<Result<StoreProduct?>>()
     val storeDetail : LiveData<Result<StoreProduct?>> get() = _storeDetail
 
@@ -367,6 +370,126 @@ class ChatViewModel @Inject constructor(
         }
     }
 
+    fun sendMessageStore(message: String) {
+        Log.d(TAG, "=== SEND MESSAGE ===")
+        Log.d(TAG, "Message: '$message'")
+        Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
+        Log.d(TAG, "Selected image file: ${selectedImageFile?.absolutePath}")
+        Log.d(TAG, "File exists: ${selectedImageFile?.exists()}")
+        if (message.isBlank() && selectedImageFile == null) {
+            Log.e(TAG, "Cannot send message: Both message and image are empty")
+            return
+        }
+
+        // Check if we have the necessary parameters
+        if (storeId <= 0) {
+            Log.e(TAG, "Cannot send message: Store ID is invalid")
+            updateState { it.copy(error = "Cannot send message. Invalid store ID.") }
+            return
+        }
+
+        // Get the existing chatRoomId (not used in API but may be needed for Socket.IO)
+        val existingChatRoomId = _chatRoomId.value ?: 0
+
+        // Log debug information
+        Log.d(TAG, "Sending message with params: storeId=$storeId, productId=$productId")
+        Log.d(TAG, "Current user ID: $currentUserId")
+        Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
+
+        // Check image file size if present
+        selectedImageFile?.let { file ->
+            if (file.exists() && file.length() > 5 * 1024 * 1024) { // 5MB limit
+                updateState { it.copy(error = "Image file is too large. Please select a smaller image.") }
+                return
+            }
+        }
+
+        viewModelScope.launch {
+            updateState { it.copy(isSending = true) }
+
+            try {
+                // Send the message using the repository
+                // Note: We keep the chatRoomId parameter for compatibility with the repository method signature,
+                // but it's not actually used in the API call
+                val safeProductId = if (productId == 0) null else productId
+
+
+                val result = chatRepository.sendChatMessageStore(
+                    storeId = storeId,
+                    message = message,
+                    productId = safeProductId,
+                    imageFile = selectedImageFile
+                )
+
+                when (result) {
+                    is Result.Success -> {
+                        // Add new message to the list
+                        val chatLine = result.data.chatLine
+                        val newMessage = convertChatLineToUiMessage(chatLine)
+
+                        val currentMessages = _state.value?.messages ?: listOf()
+                        val updatedMessages = currentMessages.toMutableList().apply {
+                            add(newMessage)
+                        }
+
+                        updateState {
+                            it.copy(
+                                messages = updatedMessages,
+                                isSending = false,
+                                hasAttachment = false,
+                                error = null
+                            )
+                        }
+
+                        Log.d(TAG, "Message sent successfully: ${chatLine.id}")
+
+                        // Update the chat room ID if it's the first message
+                        val newChatRoomId = chatLine.chatRoomId
+                        if (existingChatRoomId == 0 && newChatRoomId > 0) {
+                            Log.d(TAG, "Chat room created: $newChatRoomId")
+                            _chatRoomId.value = newChatRoomId
+
+                            // Now that we have a chat room ID, we can join the Socket.IO room
+                            joinSocketRoom(newChatRoomId)
+                        }
+
+                        // Emit the message via Socket.IO for real-time updates
+                        socketService.sendMessage(chatLine)
+
+                        // Clear the image attachment
+                        selectedImageFile = null
+                    }
+                    is Result.Error -> {
+                        val errorMsg = if (result.exception.message.isNullOrEmpty() || result.exception.message == "{}") {
+                            "Failed to send message. Please try again."
+                        } else {
+                            result.exception.message
+                        }
+
+                        updateState {
+                            it.copy(
+                                isSending = false,
+                                error = errorMsg
+                            )
+                        }
+                        Log.e(TAG, "Error sending message: ${result.exception.message}")
+                    }
+                    is Result.Loading -> {
+                        updateState { it.copy(isSending = true) }
+                    }
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception in sendMessage", e)
+                updateState {
+                    it.copy(
+                        isSending = false,
+                        error = "An unexpected error occurred: ${e.message}"
+                    )
+                }
+            }
+        }
+    }
+
     /**
      * Updates a message status (delivered, read)
      */
@@ -488,6 +611,17 @@ class ChatViewModel @Inject constructor(
             _chatList.value = chatRepository.getListChat()
         }
     }
+
+    fun getChatListStore() {
+        Log.d("ChatViewModel", "getChatListStore() called")
+        _chatListStore.value = Result.Loading
+
+        viewModelScope.launch {
+            val result = chatRepository.getListChatStore()
+            Log.d("ChatViewModel", "getChatListStore() result: $result")
+            _chatListStore.value = result
+        }
+    }
 }
 
 /**
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/MyStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/MyStoreActivity.kt
index a40035b..545d7b9 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/MyStoreActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/MyStoreActivity.kt
@@ -14,8 +14,8 @@ import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
 import com.alya.ecommerce_serang.data.api.retrofit.ApiService
 import com.alya.ecommerce_serang.data.repository.MyStoreRepository
 import com.alya.ecommerce_serang.databinding.ActivityMyStoreBinding
-import com.alya.ecommerce_serang.ui.chat.ChatListFragment
 import com.alya.ecommerce_serang.ui.profile.mystore.balance.BalanceActivity
+import com.alya.ecommerce_serang.ui.profile.mystore.chat.ChatListStoreActivity
 import com.alya.ecommerce_serang.ui.profile.mystore.product.ProductActivity
 import com.alya.ecommerce_serang.ui.profile.mystore.profile.DetailStoreProfileActivity
 import com.alya.ecommerce_serang.ui.profile.mystore.review.ReviewFragment
@@ -124,10 +124,8 @@ class MyStoreActivity : AppCompatActivity() {
         }
 
         binding.layoutInbox.setOnClickListener {
-            supportFragmentManager.beginTransaction()
-                .replace(android.R.id.content, ChatListFragment())
-                .addToBackStack(null)
-                .commit()
+            val intent = Intent(this, ChatListStoreActivity::class.java)
+            startActivity(intent)
         }
     }
 
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt
new file mode 100644
index 0000000..dd42766
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt
@@ -0,0 +1,69 @@
+package com.alya.ecommerce_serang.ui.profile.mystore.chat
+
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.recyclerview.widget.RecyclerView
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
+import com.alya.ecommerce_serang.R
+import com.alya.ecommerce_serang.data.api.response.chat.ChatItemList
+import com.alya.ecommerce_serang.databinding.ItemChatBinding
+import com.bumptech.glide.Glide
+import java.text.SimpleDateFormat
+import java.util.Date
+import java.util.Locale
+import java.util.TimeZone
+
+class ChatListAdapter(
+    private val chatList: List<ChatItemList>,
+    private val onClick: (ChatItemList) -> Unit
+) : RecyclerView.Adapter<ChatListAdapter.ChatViewHolder>() {
+
+    inner class ChatViewHolder(private val binding: ItemChatBinding) :
+        RecyclerView.ViewHolder(binding.root) {
+        fun bind(chat: ChatItemList) {
+            binding.txtStoreName.text = chat.storeName
+            binding.txtMessage.text = chat.message
+            binding.txtTime.text = formatTime(chat.latestMessageTime)
+
+            // Process image URL properly
+            val imageUrl = chat.storeImage?.let {
+                if (it.startsWith("/")) BASE_URL + it else it
+            }
+
+            Glide.with(binding.imgStore.context)
+                .load(imageUrl)
+                .placeholder(R.drawable.ic_person)
+                .error(R.drawable.placeholder_image)
+                .into(binding.imgStore)
+
+            // Handle click event
+            binding.root.setOnClickListener {
+                onClick(chat)
+            }
+        }
+
+        private fun formatTime(isoTime: String): String {
+            return try {
+                val inputFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
+                inputFormat.timeZone = TimeZone.getTimeZone("UTC")
+                val date = inputFormat.parse(isoTime)
+
+                val outputFormat = SimpleDateFormat("HH:mm", Locale.getDefault())
+                outputFormat.format(date ?: Date())
+            } catch (e: Exception) {
+                ""
+            }
+        }
+    }
+
+    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ChatViewHolder {
+        val binding = ItemChatBinding.inflate(LayoutInflater.from(parent.context), parent, false)
+        return ChatViewHolder(binding)
+    }
+
+    override fun getItemCount(): Int = chatList.size
+
+    override fun onBindViewHolder(holder: ChatViewHolder, position: Int) {
+        holder.bind(chatList[position])
+    }
+}
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
new file mode 100644
index 0000000..045c957
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
@@ -0,0 +1,114 @@
+package com.alya.ecommerce_serang.ui.profile.mystore.chat
+
+import android.os.Bundle
+import android.util.Log
+import android.widget.Toast
+import androidx.activity.enableEdgeToEdge
+import androidx.activity.viewModels
+import androidx.appcompat.app.AppCompatActivity
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowInsetsCompat
+import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
+import com.alya.ecommerce_serang.data.api.retrofit.ApiService
+import com.alya.ecommerce_serang.data.repository.ChatRepository
+import com.alya.ecommerce_serang.data.repository.Result
+import com.alya.ecommerce_serang.databinding.ActivityChatListStoreBinding
+import com.alya.ecommerce_serang.ui.chat.ChatViewModel
+import com.alya.ecommerce_serang.ui.chat.SocketIOService
+import com.alya.ecommerce_serang.utils.BaseViewModelFactory
+import com.alya.ecommerce_serang.utils.SessionManager
+
+class ChatListStoreActivity : AppCompatActivity() {
+    private lateinit var binding: ActivityChatListStoreBinding
+    private lateinit var socketService: SocketIOService
+    private lateinit var apiService: ApiService
+    private lateinit var sessionManager: SessionManager
+
+    private val TAG = "ChatListStoreActivity"
+
+    private val viewModel: ChatViewModel by viewModels {
+        BaseViewModelFactory {
+            val apiService = ApiConfig.getApiService(sessionManager)
+            val chatRepository = ChatRepository(apiService)
+            ChatViewModel(chatRepository, socketService, sessionManager)
+        }
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        // Initialize SessionManager and SocketService
+        sessionManager = SessionManager(this)
+        socketService = SocketIOService(sessionManager)
+
+        // Inflate the layout and set content view
+        binding = ActivityChatListStoreBinding.inflate(layoutInflater)
+        setContentView(binding.root)
+        apiService = ApiConfig.getApiService(sessionManager)
+
+        enableEdgeToEdge()
+
+        setupToolbar()
+
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                systemBars.bottom
+            )
+            windowInsets
+        }
+
+        Log.d(TAG, "Fetching chat list from ViewModel")
+        viewModel.getChatListStore()
+        observeChatList()
+    }
+
+    private fun setupToolbar(){
+        binding.header.headerLeftIcon.setOnClickListener{
+            finish()
+        }
+        binding.header.headerTitle.text = "Pesan"
+    }
+
+    private fun observeChatList() {
+        viewModel.chatListStore.observe(this) { result ->
+            Log.d(TAG, "Observer triggered with result: $result")
+
+            when (result) {
+                is Result.Success -> {
+                    Log.d(TAG, "Chat list fetch success. Data size: ${result.data.size}")
+                    val adapter = ChatListAdapter(result.data) { chatItem ->
+                        Log.d(TAG, "Chat item clicked: storeId=${chatItem.storeId}, chatRoomId=${chatItem.chatRoomId}")
+                        val intent = ChatStoreActivity.createIntent(
+                            context = this,
+                            storeId = chatItem.storeId,
+                            productId = 0,
+                            productName = null,
+                            productPrice = "",
+                            productImage = null,
+                            productRating = null,
+                            storeName = chatItem.storeName,
+                            chatRoomId = chatItem.chatRoomId,
+                            storeImage = chatItem.storeImage
+                        )
+                        startActivity(intent)
+                    }
+                    binding.chatListRecyclerView.adapter = adapter
+                    Log.d(TAG, "Adapter set successfully")
+                }
+
+                is Result.Error -> {
+                    Log.e(TAG, "Failed to load chats: ${result.exception.message}")
+                    Toast.makeText(this, "Failed to load chats", Toast.LENGTH_SHORT).show()
+                }
+
+                Result.Loading -> {
+                    Log.d(TAG, "Chat list is loading...")
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt
new file mode 100644
index 0000000..3e8e0b6
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt
@@ -0,0 +1,96 @@
+//package com.alya.ecommerce_serang.ui.profile.mystore.chat
+//
+//import android.os.Bundle
+//import android.view.LayoutInflater
+//import android.view.View
+//import android.view.ViewGroup
+//import android.widget.Toast
+//import androidx.fragment.app.Fragment
+//import androidx.fragment.app.viewModels
+//import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
+//import com.alya.ecommerce_serang.data.repository.ChatRepository
+//import com.alya.ecommerce_serang.data.repository.Result
+//import com.alya.ecommerce_serang.databinding.FragmentChatListBinding
+//import com.alya.ecommerce_serang.ui.chat.ChatViewModel
+//import com.alya.ecommerce_serang.ui.chat.SocketIOService
+//import com.alya.ecommerce_serang.utils.BaseViewModelFactory
+//import com.alya.ecommerce_serang.utils.SessionManager
+//
+//class ChatListStoreFragment : Fragment() {
+//
+//    private var _binding: FragmentChatListBinding? = null
+//
+//    private val  binding get() = _binding!!
+//    private lateinit var socketService: SocketIOService
+//    private lateinit var sessionManager: SessionManager
+//
+//    private val viewModel: com.alya.ecommerce_serang.ui.chat.ChatViewModel by viewModels {
+//        BaseViewModelFactory {
+//            val apiService = ApiConfig.getApiService(sessionManager)
+//            val chatRepository = ChatRepository(apiService)
+//            ChatViewModel(chatRepository, socketService, sessionManager)
+//        }
+//    }
+//    override fun onCreate(savedInstanceState: Bundle?) {
+//        super.onCreate(savedInstanceState)
+//        sessionManager = SessionManager(requireContext())
+//        socketService = SocketIOService(sessionManager)
+//
+//    }
+//
+//    override fun onCreateView(
+//        inflater: LayoutInflater, container: ViewGroup?,
+//        savedInstanceState: Bundle?
+//    ): View {
+//        _binding = FragmentChatListBinding.inflate(inflater, container, false)
+//        return _binding!!.root
+//    }
+//
+//    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+//        super.onViewCreated(view, savedInstanceState)
+//
+//        viewModel.getChatListStore()
+//        observeChatList()
+//    }
+//
+//    private fun observeChatList() {
+//        viewModel.chatListStore.observe(viewLifecycleOwner) { result ->
+//            when (result) {
+//                is Result.Success -> {
+//                    val adapter = ChatListAdapter(result.data) { chatItem ->
+//                        // Use the ChatActivity.createIntent factory method for proper navigation
+//                        ChatStoreActivity.createIntent(
+//                            context = requireActivity(),
+//                            storeId = chatItem.storeId,
+//                            productId = 0, // Default value since we don't have it in ChatListItem
+//                            productName = null, // Null is acceptable as per ChatActivity
+//                            productPrice = "",
+//                            productImage = null,
+//                            productRating = null,
+//                            storeName = chatItem.storeName,
+//                            chatRoomId = chatItem.chatRoomId,
+//                            storeImage = chatItem.storeImage
+//                        )
+//                    }
+//                    binding.chatListRecyclerView.adapter = adapter
+//                }
+//                is Result.Error -> {
+//                    Toast.makeText(requireContext(), "Failed to load chats", Toast.LENGTH_SHORT).show()
+//                }
+//                Result.Loading -> {
+//                    // Optional: show progress bar
+//                }
+//            }
+//        }
+//    }
+//
+//
+//    override fun onDestroyView() {
+//        super.onDestroyView()
+//        _binding = null
+//    }
+//
+//    companion object{
+//
+//    }
+//}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
new file mode 100644
index 0000000..bf9541f
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
@@ -0,0 +1,593 @@
+package com.alya.ecommerce_serang.ui.profile.mystore.chat
+
+import android.Manifest
+import android.app.Activity
+import android.app.AlertDialog
+import android.content.Context
+import android.content.Intent
+import android.content.pm.PackageManager
+import android.net.Uri
+import android.os.Bundle
+import android.provider.MediaStore
+import android.text.Editable
+import android.text.TextWatcher
+import android.util.Log
+import android.view.View
+import android.view.inputmethod.InputMethodManager
+import android.widget.Toast
+import androidx.activity.enableEdgeToEdge
+import androidx.activity.result.contract.ActivityResultContracts
+import androidx.activity.viewModels
+import androidx.appcompat.app.AppCompatActivity
+import androidx.core.app.ActivityCompat
+import androidx.core.content.ContextCompat
+import androidx.core.content.FileProvider
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsAnimationCompat
+import androidx.core.view.WindowInsetsCompat
+import androidx.lifecycle.Observer
+import androidx.recyclerview.widget.LinearLayoutManager
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
+import com.alya.ecommerce_serang.R
+import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
+import com.alya.ecommerce_serang.data.api.retrofit.ApiService
+import com.alya.ecommerce_serang.databinding.ActivityChatBinding
+import com.alya.ecommerce_serang.ui.auth.LoginActivity
+import com.alya.ecommerce_serang.ui.chat.ChatAdapter
+import com.alya.ecommerce_serang.ui.chat.ChatViewModel
+import com.alya.ecommerce_serang.utils.Constants
+import com.alya.ecommerce_serang.utils.SessionManager
+import com.bumptech.glide.Glide
+import dagger.hilt.android.AndroidEntryPoint
+import java.io.File
+import java.text.SimpleDateFormat
+import java.util.Date
+import java.util.Locale
+import javax.inject.Inject
+import kotlin.math.max
+
+@AndroidEntryPoint
+class ChatStoreActivity : AppCompatActivity() {
+
+    private lateinit var binding: ActivityChatBinding
+
+    @Inject
+    lateinit var sessionManager: SessionManager
+
+    @Inject
+    lateinit var apiService: ApiService
+
+    private lateinit var chatAdapter: ChatAdapter
+
+    private val viewModel: ChatViewModel by viewModels()
+
+    // For image attachment
+    private var tempImageUri: Uri? = null
+
+    // Typing indicator handler
+    private val typingHandler = android.os.Handler(android.os.Looper.getMainLooper())
+    private val stopTypingRunnable = Runnable {
+        viewModel.sendTypingStatus(false)
+    }
+
+    // Activity Result Launchers
+    private val pickImageLauncher = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result ->
+        if (result.resultCode == Activity.RESULT_OK) {
+            result.data?.data?.let { uri ->
+                handleSelectedImage(uri)
+            }
+        }
+    }
+
+    private val takePictureLauncher = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result ->
+        if (result.resultCode == Activity.RESULT_OK) {
+            tempImageUri?.let { uri ->
+                handleSelectedImage(uri)
+            }
+        }
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        binding = ActivityChatBinding.inflate(layoutInflater)
+        setContentView(binding.root)
+
+        sessionManager = SessionManager(this)
+        apiService = ApiConfig.getApiService(sessionManager)
+
+        Log.d("ChatActivity", "Token in storage: '${sessionManager.getToken()}'")
+
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+        enableEdgeToEdge()
+
+        // Apply insets to your root layout
+
+
+        // Get parameters from intent
+        val storeId = intent.getIntExtra(Constants.EXTRA_STORE_ID, 0)
+        val productId = intent.getIntExtra(Constants.EXTRA_PRODUCT_ID, 0)
+        val productName = intent.getStringExtra(Constants.EXTRA_PRODUCT_NAME) ?: ""
+        val productPrice = intent.getStringExtra(Constants.EXTRA_PRODUCT_PRICE) ?: ""
+        val productImage = intent.getStringExtra(Constants.EXTRA_PRODUCT_IMAGE) ?: ""
+        val productRating = intent.getFloatExtra(Constants.EXTRA_PRODUCT_RATING, 0f)
+        val storeName = intent.getStringExtra(Constants.EXTRA_STORE_NAME) ?: ""
+        val chatRoomId = intent.getIntExtra(Constants.EXTRA_CHAT_ROOM_ID, 0)
+        val storeImg = intent.getStringExtra(Constants.EXTRA_STORE_IMAGE) ?: ""
+
+        // Check if user is logged in
+        val token = sessionManager.getToken()
+
+        if (token.isEmpty()) {
+            // User not logged in, redirect to login
+            Toast.makeText(this, "Please login first", Toast.LENGTH_SHORT).show()
+            startActivity(Intent(this, LoginActivity::class.java))
+            finish()
+            return
+        }
+
+        binding.tvStoreName.text = storeName
+        val fullImageUrl = when (val img = storeImg) {
+            is String -> {
+                if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+            }
+            else -> R.drawable.placeholder_image
+        }
+
+        Glide.with(this)
+            .load(fullImageUrl)
+            .placeholder(R.drawable.placeholder_image)
+            .into(binding.imgProfile)
+
+        ViewCompat.setOnApplyWindowInsetsListener(binding.layoutChatInput) { view, insets ->
+            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
+            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+
+            val bottomPadding = max(imeInsets.bottom, navBarInsets.bottom)
+            view.setPadding(view.paddingLeft, view.paddingTop, view.paddingRight, bottomPadding)
+            insets
+        }
+
+// Handle top inset on toolbar (status bar height)
+        ViewCompat.setOnApplyWindowInsetsListener(binding.chatToolbar) { view, insets ->
+            val statusBarHeight = insets.getInsets(WindowInsetsCompat.Type.statusBars()).top
+            view.setPadding(view.paddingLeft, statusBarHeight, view.paddingRight, view.paddingBottom)
+            insets
+        }
+
+        ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerChat) { view, insets ->
+            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+            val bottomPadding = binding.layoutChatInput.height + navBarInsets.bottom
+
+            view.setPadding(
+                view.paddingLeft,
+                view.paddingTop,
+                view.paddingRight,
+                bottomPadding
+            )
+            insets
+        }
+
+// For RecyclerView, add bottom padding = chat input height + nav bar height (to avoid last message hidden)
+
+        ViewCompat.setWindowInsetsAnimationCallback(binding.root,
+            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
+
+                private var startPaddingBottom = 0
+                private var endPaddingBottom = 0
+
+                override fun onPrepare(animation: WindowInsetsAnimationCompat) {
+                    startPaddingBottom = binding.layoutChatInput.paddingBottom
+                }
+
+                override fun onStart(
+                    animation: WindowInsetsAnimationCompat,
+                    bounds: WindowInsetsAnimationCompat.BoundsCompat
+                ): WindowInsetsAnimationCompat.BoundsCompat {
+                    endPaddingBottom = binding.layoutChatInput.paddingBottom
+                    return bounds
+                }
+
+                override fun onProgress(
+                    insets: WindowInsetsCompat,
+                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
+                ): WindowInsetsCompat {
+                    val imeAnimation = runningAnimations.find {
+                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
+                    } ?: return insets
+
+                    val animatedBottomPadding = startPaddingBottom +
+                            (endPaddingBottom - startPaddingBottom) * imeAnimation.interpolatedFraction
+
+                    binding.layoutChatInput.setPadding(
+                        binding.layoutChatInput.paddingLeft,
+                        binding.layoutChatInput.paddingTop,
+                        binding.layoutChatInput.paddingRight,
+                        animatedBottomPadding.toInt()
+                    )
+
+                    binding.recyclerChat.setPadding(
+                        binding.recyclerChat.paddingLeft,
+                        binding.recyclerChat.paddingTop,
+                        binding.recyclerChat.paddingRight,
+                        animatedBottomPadding.toInt() + binding.layoutChatInput.height
+                    )
+
+                    return insets
+                }
+            })
+
+                // Set chat parameters to ViewModel
+        viewModel.setChatParameters(
+            storeId = storeId,
+            productId = productId,
+            productName = productName,
+            productPrice = productPrice,
+            productImage = productImage,
+            productRating = productRating,
+            storeName = storeName
+        )
+
+        // Setup UI components
+        setupRecyclerView()
+        setupListeners()
+        setupTypingIndicator()
+        observeViewModel()
+
+        // If opened from ChatListFragment with a valid chatRoomId
+        if (chatRoomId > 0) {
+            // Directly set the chatRoomId and load chat history
+            viewModel._chatRoomId.value = chatRoomId
+        }
+    }
+
+    private fun setupRecyclerView() {
+        chatAdapter = ChatAdapter()
+        binding.recyclerChat.apply {
+            adapter = chatAdapter
+            layoutManager = LinearLayoutManager(this@ChatStoreActivity).apply {
+                stackFromEnd = true
+            }
+        }
+//        binding.recyclerChat.setPadding(
+//            binding.recyclerChat.paddingLeft,
+//            binding.recyclerChat.paddingTop,
+//            binding.recyclerChat.paddingRight,
+//            binding.layoutChatInput.height + binding.root.rootWindowInsets?.getInsets(WindowInsetsCompat.Type.navigationBars())?.bottom ?: 0
+//        )
+    }
+
+
+    private fun setupListeners() {
+        // Back button
+        binding.btnBack.setOnClickListener {
+            onBackPressed()
+        }
+
+        // Options button
+        binding.btnOptions.setOnClickListener {
+            showOptionsMenu()
+        }
+
+        // Send button
+        binding.btnSend.setOnClickListener {
+            val message = binding.editTextMessage.text.toString().trim()
+            val currentState = viewModel.state.value
+            if (message.isNotEmpty() || (currentState != null && currentState.hasAttachment)) {
+                viewModel.sendMessageStore(message)
+                binding.editTextMessage.text.clear()
+            }
+        }
+
+        // Attachment button
+        binding.btnAttachment.setOnClickListener {
+            checkPermissionsAndShowImagePicker()
+        }
+    }
+
+    private fun setupTypingIndicator() {
+        binding.editTextMessage.addTextChangedListener(object : TextWatcher {
+            override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {}
+
+            override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
+                viewModel.sendTypingStatus(true)
+
+                // Reset the timer
+                typingHandler.removeCallbacks(stopTypingRunnable)
+                typingHandler.postDelayed(stopTypingRunnable, 1000)
+            }
+
+            override fun afterTextChanged(s: Editable?) {}
+        })
+
+        binding.editTextMessage.requestFocus()
+        val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
+        imm.showSoftInput(binding.editTextMessage, InputMethodManager.SHOW_IMPLICIT)
+
+    }
+
+    private fun observeViewModel() {
+        viewModel.chatRoomId.observe(this, Observer { chatRoomId ->
+            if (chatRoomId > 0) {
+                // Chat room has been created, now we can join the Socket.IO room
+                viewModel.joinSocketRoom(chatRoomId)
+
+                // Now we can also load chat history
+                viewModel.loadChatHistory(chatRoomId)
+                Log.d(TAG, "Chat Activity started - Chat Room: $chatRoomId")
+
+            }
+        })
+
+        // Observe state changes using LiveData
+        viewModel.state.observe(this, Observer { state ->
+            // Update messages
+            chatAdapter.submitList(state.messages)
+
+            // Scroll to bottom if new message
+            if (state.messages.isNotEmpty()) {
+                binding.recyclerChat.scrollToPosition(state.messages.size - 1)
+            }
+
+            // Update product info
+            if (!state.productName.isNullOrEmpty()) {
+                binding.tvProductName.text = state.productName
+                binding.tvProductPrice.text = state.productPrice
+                binding.ratingBar.rating = state.productRating
+                binding.tvRating.text = state.productRating.toString()
+                binding.tvSellerName.text = state.storeName
+                binding.tvStoreName.text=state.storeName
+
+                val fullImageUrl = when (val img = state.productImageUrl) {
+                    is String -> {
+                        if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                    }
+                    else -> R.drawable.placeholder_image
+                }
+
+                // Load product image
+                if (!state.productImageUrl.isNullOrEmpty()) {
+                    Glide.with(this@ChatStoreActivity)
+                        .load(fullImageUrl)
+                        .centerCrop()
+                        .placeholder(R.drawable.placeholder_image)
+                        .error(R.drawable.placeholder_image)
+                        .into(binding.imgProduct)
+                }
+
+                // Make sure the product section is visible
+                binding.productContainer.visibility = View.VISIBLE
+            } else {
+                // Hide the product section if info is missing
+                binding.productContainer.visibility = View.GONE
+            }
+
+
+            // Update attachment hint
+            if (state.hasAttachment) {
+                binding.editTextMessage.hint = getString(R.string.image_attached)
+            } else {
+                binding.editTextMessage.hint = getString(R.string.write_message)
+            }
+
+
+            // Show typing indicator
+            binding.tvTypingIndicator.visibility =
+                if (state.isOtherUserTyping) View.VISIBLE else View.GONE
+
+            // Show error if any
+            state.error?.let { error ->
+                Toast.makeText(this@ChatStoreActivity, error, Toast.LENGTH_SHORT).show()
+                viewModel.clearError()
+            }
+        })
+    }
+
+    private fun showOptionsMenu() {
+        val options = arrayOf(
+            getString(R.string.block_user),
+            getString(R.string.report),
+            getString(R.string.clear_chat),
+            getString(R.string.cancel)
+        )
+
+        AlertDialog.Builder(this)
+            .setTitle(getString(R.string.options))
+            .setItems(options) { dialog, which ->
+                when (which) {
+                    0 -> Toast.makeText(this, R.string.block_user_selected, Toast.LENGTH_SHORT).show()
+                    1 -> Toast.makeText(this, R.string.report_selected, Toast.LENGTH_SHORT).show()
+                    2 -> Toast.makeText(this, R.string.clear_chat_selected, Toast.LENGTH_SHORT).show()
+                }
+                dialog.dismiss()
+            }
+            .show()
+    }
+
+    private fun checkPermissionsAndShowImagePicker() {
+        if (ContextCompat.checkSelfPermission(
+                this,
+                Manifest.permission.READ_EXTERNAL_STORAGE
+            ) != PackageManager.PERMISSION_GRANTED
+        ) {
+            ActivityCompat.requestPermissions(
+                this,
+                arrayOf(Manifest.permission.READ_EXTERNAL_STORAGE, Manifest.permission.CAMERA),
+                Constants.REQUEST_STORAGE_PERMISSION
+            )
+        } else {
+            showImagePickerOptions()
+        }
+    }
+
+    private fun showImagePickerOptions() {
+        val options = arrayOf(
+            getString(R.string.take_photo),
+            getString(R.string.choose_from_gallery),
+            getString(R.string.cancel)
+        )
+
+        AlertDialog.Builder(this)
+            .setTitle(getString(R.string.select_attachment))
+            .setItems(options) { dialog, which ->
+                when (which) {
+                    0 -> openCamera()
+                    1 -> openGallery()
+                }
+                dialog.dismiss()
+            }
+            .show()
+    }
+
+    private fun openCamera() {
+        val timeStamp = SimpleDateFormat("yyyyMMdd_HHmmss", Locale.getDefault()).format(Date())
+        val imageFileName = "IMG_${timeStamp}.jpg"
+        val storageDir = getExternalFilesDir(null)
+        val imageFile = File(storageDir, imageFileName)
+
+        tempImageUri = FileProvider.getUriForFile(
+            this,
+            "${applicationContext.packageName}.fileprovider",
+            imageFile
+        )
+
+        val intent = Intent(MediaStore.ACTION_IMAGE_CAPTURE).apply {
+            putExtra(MediaStore.EXTRA_OUTPUT, tempImageUri)
+        }
+
+        takePictureLauncher.launch(intent)
+    }
+
+    private fun openGallery() {
+        val intent = Intent(Intent.ACTION_PICK, MediaStore.Images.Media.EXTERNAL_CONTENT_URI)
+        pickImageLauncher.launch(intent)
+    }
+
+    private fun handleSelectedImage(uri: Uri) {
+        try {
+            Log.d(TAG, "Processing selected image: $uri")
+
+            // Always use the copy-to-cache approach for reliability
+            contentResolver.openInputStream(uri)?.use { inputStream ->
+                val fileName = "chat_img_${System.currentTimeMillis()}.jpg"
+                val outputFile = File(cacheDir, fileName)
+
+                outputFile.outputStream().use { outputStream ->
+                    inputStream.copyTo(outputStream)
+                }
+
+                if (outputFile.exists() && outputFile.length() > 0) {
+                    if (outputFile.length() > 5 * 1024 * 1024) {
+                        Log.e(TAG, "File too large: ${outputFile.length()} bytes")
+                        Toast.makeText(this, "Image too large (max 5MB)", Toast.LENGTH_SHORT).show()
+                        return
+                    }
+
+                    Log.d(TAG, "Image processed successfully: ${outputFile.absolutePath}, size: ${outputFile.length()}")
+                    viewModel.setSelectedImageFile(outputFile)
+                    Toast.makeText(this, "Image selected", Toast.LENGTH_SHORT).show()
+                } else {
+                    Log.e(TAG, "Failed to create image file")
+                    Toast.makeText(this, "Failed to process image", Toast.LENGTH_SHORT).show()
+                }
+            } ?: run {
+                Log.e(TAG, "Could not open input stream for URI: $uri")
+                Toast.makeText(this, "Could not access image", Toast.LENGTH_SHORT).show()
+            }
+        } catch (e: Exception) {
+            Log.e(TAG, "Error handling selected image", e)
+            Toast.makeText(this, "Error: ${e.message}", Toast.LENGTH_SHORT).show()
+        }
+    }
+
+    override fun onRequestPermissionsResult(
+        requestCode: Int,
+        permissions: Array<out String>,
+        grantResults: IntArray
+    ) {
+        super.onRequestPermissionsResult(requestCode, permissions, grantResults)
+        if (requestCode == Constants.REQUEST_STORAGE_PERMISSION) {
+            if (grantResults.isNotEmpty() && grantResults[0] == PackageManager.PERMISSION_GRANTED) {
+                showImagePickerOptions()
+            } else {
+                Toast.makeText(this, R.string.permission_denied, Toast.LENGTH_SHORT).show()
+            }
+        }
+    }
+
+    override fun onDestroy() {
+        super.onDestroy()
+        typingHandler.removeCallbacks(stopTypingRunnable)
+    }
+
+    companion object {
+        private const val TAG = "ChatActivity"
+
+        /**
+         * Create an intent to start the ChatActivity
+         */
+        fun createIntent(
+            context: Activity,
+            storeId: Int,
+            productId: Int = 0,
+            productName: String? = null,
+            productPrice: String = "",
+            productImage: String? = null,
+            productRating: String? = null,
+            storeName: String? = null,
+            chatRoomId: Int = 0,
+            storeImage: String? = null
+        ): Intent {
+            return Intent(context, ChatStoreActivity::class.java).apply {
+                putExtra(Constants.EXTRA_STORE_ID, storeId)
+                putExtra(Constants.EXTRA_PRODUCT_ID, productId)
+                putExtra(Constants.EXTRA_PRODUCT_NAME, productName)
+                putExtra(Constants.EXTRA_PRODUCT_PRICE, productPrice)
+                putExtra(Constants.EXTRA_PRODUCT_IMAGE, productImage)
+                putExtra(Constants.EXTRA_STORE_IMAGE, storeImage)
+
+                // Convert productRating string to float if provided
+                if (productRating != null) {
+                    try {
+                        putExtra(Constants.EXTRA_PRODUCT_RATING, productRating.toFloat())
+                    } catch (e: NumberFormatException) {
+                        putExtra(Constants.EXTRA_PRODUCT_RATING, 0f)
+                    }
+                } else {
+                    putExtra(Constants.EXTRA_PRODUCT_RATING, 0f)
+                }
+
+                putExtra(Constants.EXTRA_STORE_NAME, storeName)
+
+                if (chatRoomId > 0) {
+                    putExtra(Constants.EXTRA_CHAT_ROOM_ID, chatRoomId)
+                }
+            }
+        }
+    }
+}
+
+//if implement typing status
+//    private fun handleConnectionState(state: ConnectionState) {
+//        when (state) {
+//            is ConnectionState.Connected -> {
+//                binding.tvConnectionStatus.visibility = View.GONE
+//            }
+//            is ConnectionState.Connecting -> {
+//                binding.tvConnectionStatus.visibility = View.VISIBLE
+//                binding.tvConnectionStatus.text = getString(R.string.connecting)
+//            }
+//            is ConnectionState.Disconnected -> {
+//                binding.tvConnectionStatus.visibility = View.VISIBLE
+//                binding.tvConnectionStatus.text = getString(R.string.disconnected_reconnecting)
+//            }
+//            is ConnectionState.Error -> {
+//                binding.tvConnectionStatus.visibility = View.VISIBLE
+//                binding.tvConnectionStatus.text = getString(R.string.connection_error, state.message)
+//            }
+//        }
+//    }
\ No newline at end of file
diff --git a/app/src/main/res/layout/activity_chat_list_store.xml b/app/src/main/res/layout/activity_chat_list_store.xml
new file mode 100644
index 0000000..b3f8edf
--- /dev/null
+++ b/app/src/main/res/layout/activity_chat_list_store.xml
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/main"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    tools:context=".ui.profile.mystore.chat.ChatListStoreActivity">
+
+    <include
+        android:id="@+id/header"
+        layout="@layout/header" />
+
+<!--    <TextView-->
+<!--        android:id="@+id/chatHeaderTitle"-->
+<!--        android:layout_width="match_parent"-->
+<!--        android:layout_height="wrap_content"-->
+<!--        android:text="Pesan"-->
+<!--        android:textSize="24sp"-->
+<!--        android:padding="16dp"-->
+<!--        android:layout_marginHorizontal="8dp"-->
+<!--        android:fontFamily="@font/dmsans_bold" />-->
+
+    <com.google.android.material.divider.MaterialDivider
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        app:dividerColor="@color/black_100" />
+
+    <androidx.recyclerview.widget.RecyclerView
+        android:id="@+id/chatListRecyclerView"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_weight="1"
+        android:padding="8dp"
+        android:clipToPadding="false"
+        tools:listitem="@layout/item_chat"
+        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />
+
+</LinearLayout>
\ No newline at end of file

From 3075af3f7bfd923affe0a5a56a9f8c1dc9b91086 Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Wed, 28 May 2025 22:38:58 +0700
Subject: [PATCH 05/10] update chat store

---
 .../data/repository/ChatRepository.kt         |  4 +-
 .../ecommerce_serang/ui/chat/ChatViewModel.kt | 53 +++++++++++++++++--
 .../mystore/chat/ChatListStoreActivity.kt     |  3 +-
 .../profile/mystore/chat/ChatStoreActivity.kt |  8 ++-
 .../alya/ecommerce_serang/utils/Constants.kt  |  1 +
 5 files changed, 59 insertions(+), 10 deletions(-)

diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
index 7ad1656..8838fe1 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
@@ -91,7 +91,7 @@ class ChatRepository @Inject constructor(
     }
 
     suspend fun sendChatMessageStore(
-        storeId: Int,
+        userId: Int,
         message: String,
         productId: Int?,           // Nullable and optional
         imageFile: File? = null    // Nullable and optional
@@ -100,7 +100,7 @@ class ChatRepository @Inject constructor(
             val parts = mutableMapOf<String, RequestBody>()
 
             // Required fields
-            parts["store_id"] = storeId.toString().toRequestBody("text/plain".toMediaType())
+            parts["user_id"] = userId.toString().toRequestBody("text/plain".toMediaType())
             parts["message"] = message.toRequestBody("text/plain".toMediaType())
 
             // Optional: Only include if productId is valid
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
index 35edf9c..73a57b2 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
@@ -134,6 +134,47 @@ class ChatViewModel @Inject constructor(
         }
     }
 
+    fun setChatParametersStore(
+        storeId: Int,
+        userId: Int,
+        productId: Int? = 0,
+        productName: String? = null,
+        productPrice: String? = null,
+        productImage: String? = null,
+        productRating: Float? = 0f,
+        storeName: String
+    ) {
+        this.productId = if (productId != null && productId > 0) productId else 0
+
+        this.storeId = storeId
+        this.defaultUserId = userId  // Store the user_id for store-side chat
+        this.productName = productName.toString()
+        this.productPrice = productPrice.toString()
+        this.productImage = productImage.toString()
+        this.productRating = productRating!!
+        this.storeName = storeName
+        // Update state with product info
+        updateState {
+            it.copy(
+                productName = productName.toString(),
+                productPrice = productPrice.toString(),
+                productImageUrl = productImage.toString(),
+                productRating = productRating,
+                storeName = storeName
+            )
+        }
+
+        // Connect to socket and load chat history
+        val existingChatRoomId = _chatRoomId.value ?: 0
+        if (existingChatRoomId > 0) {
+            // If we already have a chat room ID, we can load the chat history
+            loadChatHistory(existingChatRoomId)
+
+            // And join the Socket.IO room
+            joinSocketRoom(existingChatRoomId)
+        }
+    }
+
     fun joinSocketRoom(roomId: Int) {
         if (roomId <= 0) {
             Log.e(TAG, "Cannot join room: Invalid room ID")
@@ -404,18 +445,20 @@ class ChatViewModel @Inject constructor(
             }
         }
 
+        if (defaultUserId <= 0) {  // Check userId instead of storeId
+            Log.e(TAG, "Cannot send message: User ID is invalid")
+            updateState { it.copy(error = "Cannot send message. Invalid user ID.") }
+            return
+        }
+
         viewModelScope.launch {
             updateState { it.copy(isSending = true) }
 
             try {
-                // Send the message using the repository
-                // Note: We keep the chatRoomId parameter for compatibility with the repository method signature,
-                // but it's not actually used in the API call
                 val safeProductId = if (productId == 0) null else productId
 
-
                 val result = chatRepository.sendChatMessageStore(
-                    storeId = storeId,
+                    userId = defaultUserId,  // Pass userId instead of storeId
                     message = message,
                     productId = safeProductId,
                     imageFile = selectedImageFile
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
index 045c957..9620907 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
@@ -92,7 +92,8 @@ class ChatListStoreActivity : AppCompatActivity() {
                             productRating = null,
                             storeName = chatItem.storeName,
                             chatRoomId = chatItem.chatRoomId,
-                            storeImage = chatItem.storeImage
+                            storeImage = chatItem.storeImage,
+                            userId = chatItem.userId
                         )
                         startActivity(intent)
                     }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
index bf9541f..c872f50 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
@@ -110,6 +110,7 @@ class ChatStoreActivity : AppCompatActivity() {
 
         // Get parameters from intent
         val storeId = intent.getIntExtra(Constants.EXTRA_STORE_ID, 0)
+        val userId = intent.getIntExtra(Constants.EXTRA_USER_ID, 0)
         val productId = intent.getIntExtra(Constants.EXTRA_PRODUCT_ID, 0)
         val productName = intent.getStringExtra(Constants.EXTRA_PRODUCT_NAME) ?: ""
         val productPrice = intent.getStringExtra(Constants.EXTRA_PRODUCT_PRICE) ?: ""
@@ -222,8 +223,9 @@ class ChatStoreActivity : AppCompatActivity() {
             })
 
                 // Set chat parameters to ViewModel
-        viewModel.setChatParameters(
+        viewModel.setChatParametersStore(
             storeId = storeId,
+            userId = userId,  // The user you want to chat with
             productId = productId,
             productName = productName,
             productPrice = productPrice,
@@ -540,7 +542,8 @@ class ChatStoreActivity : AppCompatActivity() {
             productRating: String? = null,
             storeName: String? = null,
             chatRoomId: Int = 0,
-            storeImage: String? = null
+            storeImage: String? = null,
+            userId: Int
         ): Intent {
             return Intent(context, ChatStoreActivity::class.java).apply {
                 putExtra(Constants.EXTRA_STORE_ID, storeId)
@@ -549,6 +552,7 @@ class ChatStoreActivity : AppCompatActivity() {
                 putExtra(Constants.EXTRA_PRODUCT_PRICE, productPrice)
                 putExtra(Constants.EXTRA_PRODUCT_IMAGE, productImage)
                 putExtra(Constants.EXTRA_STORE_IMAGE, storeImage)
+                putExtra(Constants.EXTRA_USER_ID, userId)
 
                 // Convert productRating string to float if provided
                 if (productRating != null) {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt b/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt
index 225725f..4ec6689 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt
@@ -21,6 +21,7 @@ object Constants {
     const val EXTRA_PRODUCT_IMAGE = "product_image"
     const val EXTRA_PRODUCT_RATING = "product_rating"
     const val EXTRA_STORE_IMAGE = "store_image"
+    const val EXTRA_USER_ID = "user_id"
 
     // Request codes
     const val REQUEST_IMAGE_PICK = 1001

From f4e130b93a611c0a235ccafeb797c61e0a2da86c Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Thu, 29 May 2025 02:46:31 +0700
Subject: [PATCH 06/10] update chat customer and store

---
 app/src/main/AndroidManifest.xml              |   4 +-
 .../data/repository/ChatRepository.kt         |  19 +
 .../ecommerce_serang/ui/chat/ChatActivity.kt  | 332 ++++--
 .../ecommerce_serang/ui/chat/ChatAdapter.kt   | 156 ++-
 .../ecommerce_serang/ui/chat/ChatViewModel.kt | 972 +++++++++++-------
 .../ui/product/DetailProductActivity.kt       |   6 +-
 .../mystore/chat/ChatListStoreActivity.kt     |   7 +-
 .../profile/mystore/chat/ChatStoreActivity.kt | 272 +++--
 .../profile/mystore/chat/ChatStoreAdapter.kt  | 152 +++
 ...ListAdapter.kt => ChatStoreListAdapter.kt} |   8 +-
 .../alya/ecommerce_serang/utils/Constants.kt  |   5 +
 .../main/res/drawable/bg_product_bubble.xml   |   9 +
 .../main/res/drawable/bg_product_normal.xml   |   9 +
 .../main/res/drawable/bg_product_selected.xml |   9 +
 .../layout/item_message_product_received.xml  |  87 ++
 .../res/layout/item_message_product_sent.xml  |  95 ++
 16 files changed, 1532 insertions(+), 610 deletions(-)
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt
 rename app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/{ChatListAdapter.kt => ChatStoreListAdapter.kt} (92%)
 create mode 100644 app/src/main/res/drawable/bg_product_bubble.xml
 create mode 100644 app/src/main/res/drawable/bg_product_normal.xml
 create mode 100644 app/src/main/res/drawable/bg_product_selected.xml
 create mode 100644 app/src/main/res/layout/item_message_product_received.xml
 create mode 100644 app/src/main/res/layout/item_message_product_sent.xml

diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index a5327c7..ddbfa98 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -67,7 +67,7 @@
         <activity
             android:name=".ui.chat.ChatActivity"
             android:exported="false"
-            android:windowSoftInputMode="adjustResize|stateHidden" /> <!-- <provider -->
+            android:windowSoftInputMode="adjustResize" /> <!-- <provider -->
         <!-- android:name="androidx.startup.InitializationProvider" -->
         <!-- android:authorities="${applicationId}.androidx-startup" -->
         <!-- tools:node="remove" /> -->
@@ -79,7 +79,7 @@
         <activity
             android:name=".ui.profile.mystore.chat.ChatStoreActivity"
             android:exported="false"
-            android:windowSoftInputMode="adjustResize|stateHidden" />
+            android:windowSoftInputMode="adjustResize" />
 
         <activity
             android:name=".ui.profile.mystore.profile.shipping_service.ShippingServiceActivity"
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
index 8838fe1..9d4f703 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ChatRepository.kt
@@ -7,6 +7,7 @@ import com.alya.ecommerce_serang.data.api.response.chat.ChatHistoryResponse
 import com.alya.ecommerce_serang.data.api.response.chat.ChatItemList
 import com.alya.ecommerce_serang.data.api.response.chat.SendChatResponse
 import com.alya.ecommerce_serang.data.api.response.chat.UpdateChatResponse
+import com.alya.ecommerce_serang.data.api.response.customer.product.ProductResponse
 import com.alya.ecommerce_serang.data.api.retrofit.ApiService
 import okhttp3.MediaType.Companion.toMediaType
 import okhttp3.MultipartBody
@@ -293,4 +294,22 @@ class ChatRepository @Inject constructor(
             Result.Error(e)
         }
     }
+
+    suspend fun fetchProductDetail(productId: Int): ProductResponse? {
+        return try {
+            val response = apiService.getDetailProduct(productId)
+            if (response.isSuccessful) {
+                val productResponse = response.body()
+                Log.d("Order Repository", "Product detail fetched successfully: ${productResponse?.product?.productName}")
+                productResponse
+            } else {
+                val errorBody = response.errorBody()?.string() ?: "Unknown error"
+                Log.e("Order Repository", "Error fetching product detail. Code: ${response.code()}, Error: $errorBody")
+                null
+            }
+        } catch (e: Exception) {
+            Log.e("Order Repository", "Exception fetching product", e)
+            null
+        }
+    }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt
index d9cc397..2151030 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatActivity.kt
@@ -34,6 +34,7 @@ import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
 import com.alya.ecommerce_serang.data.api.retrofit.ApiService
 import com.alya.ecommerce_serang.databinding.ActivityChatBinding
 import com.alya.ecommerce_serang.ui.auth.LoginActivity
+import com.alya.ecommerce_serang.ui.product.DetailProductActivity
 import com.alya.ecommerce_serang.utils.Constants
 import com.alya.ecommerce_serang.utils.SessionManager
 import com.bumptech.glide.Glide
@@ -43,7 +44,6 @@ import java.text.SimpleDateFormat
 import java.util.Date
 import java.util.Locale
 import javax.inject.Inject
-import kotlin.math.max
 
 @AndroidEntryPoint
 class ChatActivity : AppCompatActivity() {
@@ -103,9 +103,6 @@ class ChatActivity : AppCompatActivity() {
         WindowCompat.setDecorFitsSystemWindows(window, false)
         enableEdgeToEdge()
 
-        // Apply insets to your root layout
-
-
         // Get parameters from intent
         val storeId = intent.getIntExtra(Constants.EXTRA_STORE_ID, 0)
         val productId = intent.getIntExtra(Constants.EXTRA_PRODUCT_ID, 0)
@@ -117,6 +114,8 @@ class ChatActivity : AppCompatActivity() {
         val chatRoomId = intent.getIntExtra(Constants.EXTRA_CHAT_ROOM_ID, 0)
         val storeImg = intent.getStringExtra(Constants.EXTRA_STORE_IMAGE) ?: ""
 
+        val shouldAttachProduct = intent.getBooleanExtra(Constants.EXTRA_ATTACH_PRODUCT, false)
+
         // Check if user is logged in
         val token = sessionManager.getToken()
 
@@ -141,84 +140,6 @@ class ChatActivity : AppCompatActivity() {
             .placeholder(R.drawable.placeholder_image)
             .into(binding.imgProfile)
 
-        ViewCompat.setOnApplyWindowInsetsListener(binding.layoutChatInput) { view, insets ->
-            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
-            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
-
-            val bottomPadding = max(imeInsets.bottom, navBarInsets.bottom)
-            view.setPadding(view.paddingLeft, view.paddingTop, view.paddingRight, bottomPadding)
-            insets
-        }
-
-// Handle top inset on toolbar (status bar height)
-        ViewCompat.setOnApplyWindowInsetsListener(binding.chatToolbar) { view, insets ->
-            val statusBarHeight = insets.getInsets(WindowInsetsCompat.Type.statusBars()).top
-            view.setPadding(view.paddingLeft, statusBarHeight, view.paddingRight, view.paddingBottom)
-            insets
-        }
-
-        ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerChat) { view, insets ->
-            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
-            val bottomPadding = binding.layoutChatInput.height + navBarInsets.bottom
-
-            view.setPadding(
-                view.paddingLeft,
-                view.paddingTop,
-                view.paddingRight,
-                bottomPadding
-            )
-            insets
-        }
-
-// For RecyclerView, add bottom padding = chat input height + nav bar height (to avoid last message hidden)
-
-        ViewCompat.setWindowInsetsAnimationCallback(binding.root,
-            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
-
-                private var startPaddingBottom = 0
-                private var endPaddingBottom = 0
-
-                override fun onPrepare(animation: WindowInsetsAnimationCompat) {
-                    startPaddingBottom = binding.layoutChatInput.paddingBottom
-                }
-
-                override fun onStart(
-                    animation: WindowInsetsAnimationCompat,
-                    bounds: WindowInsetsAnimationCompat.BoundsCompat
-                ): WindowInsetsAnimationCompat.BoundsCompat {
-                    endPaddingBottom = binding.layoutChatInput.paddingBottom
-                    return bounds
-                }
-
-                override fun onProgress(
-                    insets: WindowInsetsCompat,
-                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
-                ): WindowInsetsCompat {
-                    val imeAnimation = runningAnimations.find {
-                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
-                    } ?: return insets
-
-                    val animatedBottomPadding = startPaddingBottom +
-                            (endPaddingBottom - startPaddingBottom) * imeAnimation.interpolatedFraction
-
-                    binding.layoutChatInput.setPadding(
-                        binding.layoutChatInput.paddingLeft,
-                        binding.layoutChatInput.paddingTop,
-                        binding.layoutChatInput.paddingRight,
-                        animatedBottomPadding.toInt()
-                    )
-
-                    binding.recyclerChat.setPadding(
-                        binding.recyclerChat.paddingLeft,
-                        binding.recyclerChat.paddingTop,
-                        binding.recyclerChat.paddingRight,
-                        animatedBottomPadding.toInt() + binding.layoutChatInput.height
-                    )
-
-                    return insets
-                }
-            })
-
                 // Set chat parameters to ViewModel
         viewModel.setChatParameters(
             storeId = storeId,
@@ -230,8 +151,14 @@ class ChatActivity : AppCompatActivity() {
             storeName = storeName
         )
 
+        if (shouldAttachProduct && productId > 0) {
+            viewModel.enableProductAttachment()
+            showProductAttachmentToast()
+        }
+
         // Setup UI components
         setupRecyclerView()
+        setupWindowInsets()
         setupListeners()
         setupTypingIndicator()
         observeViewModel()
@@ -243,20 +170,95 @@ class ChatActivity : AppCompatActivity() {
         }
     }
 
+    private fun showProductAttachmentToast() {
+        Toast.makeText(
+            this,
+            "Product will be attached to your message",
+            Toast.LENGTH_LONG
+        ).show()
+    }
+
     private fun setupRecyclerView() {
-        chatAdapter = ChatAdapter()
+        chatAdapter = ChatAdapter { productInfo ->
+            // This lambda will be called when user taps on a product bubble
+            handleProductClick(productInfo)
+        }
         binding.recyclerChat.apply {
             adapter = chatAdapter
-            layoutManager = LinearLayoutManager(this@ChatActivity).apply {
-                stackFromEnd = true
-            }
+            layoutManager = LinearLayoutManager(this@ChatActivity)
+            // Use clipToPadding to allow content to scroll under padding
+            clipToPadding = false
+            // Set minimal padding - we'll handle spacing differently
+            setPadding(paddingLeft, paddingTop, paddingRight, 16)
         }
-//        binding.recyclerChat.setPadding(
-//            binding.recyclerChat.paddingLeft,
-//            binding.recyclerChat.paddingTop,
-//            binding.recyclerChat.paddingRight,
-//            binding.layoutChatInput.height + binding.root.rootWindowInsets?.getInsets(WindowInsetsCompat.Type.navigationBars())?.bottom ?: 0
-//        )
+    }
+
+    private fun setupWindowInsets() {
+        ViewCompat.setOnApplyWindowInsetsListener(binding.chatToolbar) { view, insets ->
+            val statusBarInsets = insets.getInsets(WindowInsetsCompat.Type.statusBars())
+            view.updatePadding(top = statusBarInsets.top)
+            insets
+        }
+
+        // Handle IME (keyboard) and navigation bar insets for the input layout only
+        ViewCompat.setOnApplyWindowInsetsListener(binding.layoutChatInput) { view, insets ->
+            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
+            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+
+            Log.d(TAG, "Insets - IME: ${imeInsets.bottom}, NavBar: ${navBarInsets.bottom}")
+
+            val bottomInset = if (imeInsets.bottom > 0) {
+                imeInsets.bottom
+            } else {
+                navBarInsets.bottom
+            }
+
+            // Only apply padding to the input layout
+            view.updatePadding(bottom = bottomInset)
+
+            // When keyboard appears, scroll to bottom to keep last message visible
+            if (imeInsets.bottom > 0) {
+                // Keyboard is visible - scroll to bottom with delay to ensure layout is complete
+                binding.recyclerChat.postDelayed({
+                    scrollToBottomSmooth()
+                }, 100)
+            }
+
+            insets
+        }
+
+        // Smooth animation for keyboard transitions
+        ViewCompat.setWindowInsetsAnimationCallback(
+            binding.layoutChatInput,
+            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
+
+                override fun onProgress(
+                    insets: WindowInsetsCompat,
+                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
+                ): WindowInsetsCompat {
+                    val imeAnimation = runningAnimations.find {
+                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
+                    }
+
+                    if (imeAnimation != null) {
+                        val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
+                        val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+                        val targetBottomInset = if (imeInsets.bottom > 0) imeInsets.bottom else navBarInsets.bottom
+
+                        // Only animate input layout padding
+                        binding.layoutChatInput.updatePadding(bottom = targetBottomInset)
+                    }
+
+                    return insets
+                }
+
+                override fun onEnd(animation: WindowInsetsAnimationCompat) {
+                    super.onEnd(animation)
+                    // Smooth scroll to bottom after animation
+                    scrollToBottomSmooth()
+                }
+            }
+        )
     }
 
 
@@ -276,8 +278,14 @@ class ChatActivity : AppCompatActivity() {
             val message = binding.editTextMessage.text.toString().trim()
             val currentState = viewModel.state.value
             if (message.isNotEmpty() || (currentState != null && currentState.hasAttachment)) {
+                // This will automatically handle product attachment if enabled
                 viewModel.sendMessage(message)
                 binding.editTextMessage.text.clear()
+
+                // Instantly scroll to show new message
+                binding.recyclerChat.postDelayed({
+                    scrollToBottomInstant()
+                }, 50)
             }
         }
 
@@ -285,6 +293,38 @@ class ChatActivity : AppCompatActivity() {
         binding.btnAttachment.setOnClickListener {
             checkPermissionsAndShowImagePicker()
         }
+
+        // Product card click to enable/disable product attachment
+        binding.productContainer.setOnClickListener {
+            toggleProductAttachment()
+        }
+    }
+
+    private fun toggleProductAttachment() {
+        val currentState = viewModel.state.value
+        if (currentState?.hasProductAttachment == true) {
+            // Disable product attachment
+            viewModel.disableProductAttachment()
+            updateProductAttachmentUI(false)
+            Toast.makeText(this, "Product attachment disabled", Toast.LENGTH_SHORT).show()
+        } else {
+            // Enable product attachment
+            viewModel.enableProductAttachment()
+            updateProductAttachmentUI(true)
+            Toast.makeText(this, "Product will be attached to your next message", Toast.LENGTH_SHORT).show()
+        }
+    }
+
+    private fun updateProductAttachmentUI(isEnabled: Boolean) {
+        if (isEnabled) {
+            // Show visual indicator that product will be attached
+            binding.productContainer.setBackgroundResource(R.drawable.bg_product_selected)
+            binding.editTextMessage.hint = "Type your message (product will be attached)"
+        } else {
+            // Reset to normal state
+            binding.productContainer.setBackgroundResource(R.drawable.bg_product_normal)
+            binding.editTextMessage.hint = getString(R.string.write_message)
+        }
     }
 
     private fun setupTypingIndicator() {
@@ -302,33 +342,64 @@ class ChatActivity : AppCompatActivity() {
             override fun afterTextChanged(s: Editable?) {}
         })
 
+        // Focus and show keyboard
         binding.editTextMessage.requestFocus()
-        val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
-        imm.showSoftInput(binding.editTextMessage, InputMethodManager.SHOW_IMPLICIT)
+        binding.editTextMessage.post {
+            val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
+            imm.showSoftInput(binding.editTextMessage, InputMethodManager.SHOW_IMPLICIT)
+        }
+    }
 
+    private fun scrollToBottomSmooth() {
+        val messageCount = chatAdapter.itemCount
+        if (messageCount > 0) {
+            binding.recyclerChat.post {
+                // Use smooth scroll to bottom
+                binding.recyclerChat.smoothScrollToPosition(messageCount - 1)
+            }
+        }
+    }
+
+    private fun scrollToBottomInstant() {
+        val messageCount = chatAdapter.itemCount
+        if (messageCount > 0) {
+            binding.recyclerChat.post {
+                // Instant scroll for new messages
+                binding.recyclerChat.scrollToPosition(messageCount - 1)
+            }
+        }
+    }
+
+    // Extension function to make padding updates cleaner
+    private fun View.updatePadding(
+        left: Int = paddingLeft,
+        top: Int = paddingTop,
+        right: Int = paddingRight,
+        bottom: Int = paddingBottom
+    ) {
+        setPadding(left, top, right, bottom)
     }
 
     private fun observeViewModel() {
         viewModel.chatRoomId.observe(this, Observer { chatRoomId ->
             if (chatRoomId > 0) {
-                // Chat room has been created, now we can join the Socket.IO room
                 viewModel.joinSocketRoom(chatRoomId)
-
-                // Now we can also load chat history
                 viewModel.loadChatHistory(chatRoomId)
                 Log.d(TAG, "Chat Activity started - Chat Room: $chatRoomId")
-
             }
         })
 
-        // Observe state changes using LiveData
         viewModel.state.observe(this, Observer { state ->
-            // Update messages
-            chatAdapter.submitList(state.messages)
+            Log.d(TAG, "State updated - Messages: ${state.messages.size}")
 
-            // Scroll to bottom if new message
-            if (state.messages.isNotEmpty()) {
-                binding.recyclerChat.scrollToPosition(state.messages.size - 1)
+            // Update messages
+            val previousCount = chatAdapter.itemCount
+            chatAdapter.submitList(state.messages) {
+                Log.d(TAG, "Messages submitted to adapter")
+                // Only auto-scroll for new messages or initial load
+                if (previousCount == 0 || state.messages.size > previousCount) {
+                    scrollToBottomInstant()
+                }
             }
 
             // Update product info
@@ -338,7 +409,7 @@ class ChatActivity : AppCompatActivity() {
                 binding.ratingBar.rating = state.productRating
                 binding.tvRating.text = state.productRating.toString()
                 binding.tvSellerName.text = state.storeName
-                binding.tvStoreName.text=state.storeName
+                binding.tvStoreName.text = state.storeName
 
                 val fullImageUrl = when (val img = state.productImageUrl) {
                     is String -> {
@@ -347,7 +418,6 @@ class ChatActivity : AppCompatActivity() {
                     else -> R.drawable.placeholder_image
                 }
 
-                // Load product image
                 if (!state.productImageUrl.isNullOrEmpty()) {
                     Glide.with(this@ChatActivity)
                         .load(fullImageUrl)
@@ -357,13 +427,15 @@ class ChatActivity : AppCompatActivity() {
                         .into(binding.imgProduct)
                 }
 
-                // Make sure the product section is visible
                 binding.productContainer.visibility = View.VISIBLE
             } else {
-                // Hide the product section if info is missing
                 binding.productContainer.visibility = View.GONE
             }
 
+            updateInputHint(state)
+
+            // Update product card visual feedback
+            updateProductCardUI(state.hasProductAttachment)
 
             // Update attachment hint
             if (state.hasAttachment) {
@@ -372,7 +444,6 @@ class ChatActivity : AppCompatActivity() {
                 binding.editTextMessage.hint = getString(R.string.write_message)
             }
 
-
             // Show typing indicator
             binding.tvTypingIndicator.visibility =
                 if (state.isOtherUserTyping) View.VISIBLE else View.GONE
@@ -385,6 +456,45 @@ class ChatActivity : AppCompatActivity() {
         })
     }
 
+    private fun updateInputHint(state: ChatUiState) {
+        binding.editTextMessage.hint = when {
+            state.hasAttachment -> getString(R.string.image_attached)
+            state.hasProductAttachment -> "Type your message (product will be attached)"
+            else -> getString(R.string.write_message)
+        }
+    }
+
+    private fun updateProductCardUI(hasProductAttachment: Boolean) {
+        if (hasProductAttachment) {
+            // Show visual indicator that product will be attached
+            binding.productContainer.setBackgroundResource(R.drawable.bg_product_selected)
+        } else {
+            // Reset to normal state
+            binding.productContainer.setBackgroundResource(R.drawable.bg_product_normal)
+        }
+    }
+
+    private fun handleProductClick(productInfo: ProductInfo) {
+        // Navigate to product detail
+        Toast.makeText(this, "Opening: ${productInfo.productName}", Toast.LENGTH_SHORT).show()
+
+        // You can navigate to product detail here
+         navigateToProductDetail(productInfo.productId)
+    }
+
+    private fun navigateToProductDetail(productId: Int) {
+        try {
+            val intent = Intent(this, DetailProductActivity::class.java).apply {
+                putExtra("PRODUCT_ID", productId)
+                // Add other necessary extras
+            }
+            startActivity(intent)
+        } catch (e: Exception) {
+            Toast.makeText(this, "Cannot open product details", Toast.LENGTH_SHORT).show()
+            Log.e(TAG, "Error navigating to product detail", e)
+        }
+    }
+
     private fun showOptionsMenu() {
         val options = arrayOf(
             getString(R.string.block_user),
@@ -538,7 +648,8 @@ class ChatActivity : AppCompatActivity() {
             productRating: String? = null,
             storeName: String? = null,
             chatRoomId: Int = 0,
-            storeImage: String? = null
+            storeImage: String? = null,
+            attachProduct: Boolean = false // NEW: Flag to auto-attach product
         ) {
             val intent = Intent(context, ChatActivity::class.java).apply {
                 putExtra(Constants.EXTRA_STORE_ID, storeId)
@@ -547,6 +658,7 @@ class ChatActivity : AppCompatActivity() {
                 putExtra(Constants.EXTRA_PRODUCT_PRICE, productPrice)
                 putExtra(Constants.EXTRA_PRODUCT_IMAGE, productImage)
                 putExtra(Constants.EXTRA_STORE_IMAGE, storeImage)
+                putExtra(Constants.EXTRA_ATTACH_PRODUCT, attachProduct) // NEW
 
                 // Convert productRating string to float if provided
                 if (productRating != null) {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt
index 484803f..05cfbfc 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatAdapter.kt
@@ -8,56 +8,71 @@ import androidx.recyclerview.widget.ListAdapter
 import androidx.recyclerview.widget.RecyclerView
 import com.alya.ecommerce_serang.BuildConfig.BASE_URL
 import com.alya.ecommerce_serang.R
+import com.alya.ecommerce_serang.databinding.ItemMessageProductReceivedBinding
+import com.alya.ecommerce_serang.databinding.ItemMessageProductSentBinding
 import com.alya.ecommerce_serang.databinding.ItemMessageReceivedBinding
 import com.alya.ecommerce_serang.databinding.ItemMessageSentBinding
 import com.alya.ecommerce_serang.utils.Constants
 import com.bumptech.glide.Glide
 
-class ChatAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMessageDiffCallback()) {
+class ChatAdapter(
+    private val onProductClick: ((ProductInfo) -> Unit)? = null
+) : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMessageDiffCallback()) {
 
     companion object {
         private const val VIEW_TYPE_MESSAGE_SENT = 1
         private const val VIEW_TYPE_MESSAGE_RECEIVED = 2
+        private const val VIEW_TYPE_PRODUCT_SENT = 3
+        private const val VIEW_TYPE_PRODUCT_RECEIVED = 4
+    }
+
+    override fun getItemViewType(position: Int): Int {
+        val message = getItem(position)
+        return when {
+            message.messageType == MessageType.PRODUCT && message.isSentByMe -> VIEW_TYPE_PRODUCT_SENT
+            message.messageType == MessageType.PRODUCT && !message.isSentByMe -> VIEW_TYPE_PRODUCT_RECEIVED
+            message.isSentByMe -> VIEW_TYPE_MESSAGE_SENT
+            else -> VIEW_TYPE_MESSAGE_RECEIVED
+        }
     }
 
     override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
-        return if (viewType == VIEW_TYPE_MESSAGE_SENT) {
-            val binding = ItemMessageSentBinding.inflate(
-                LayoutInflater.from(parent.context),
-                parent,
-                false
-            )
-            SentMessageViewHolder(binding)
-        } else {
-            val binding = ItemMessageReceivedBinding.inflate(
-                LayoutInflater.from(parent.context),
-                parent,
-                false
-            )
-            ReceivedMessageViewHolder(binding)
+        val inflater = LayoutInflater.from(parent.context)
+
+        return when (viewType) {
+            VIEW_TYPE_MESSAGE_SENT -> {
+                val binding = ItemMessageSentBinding.inflate(inflater, parent, false)
+                SentMessageViewHolder(binding)
+            }
+            VIEW_TYPE_MESSAGE_RECEIVED -> {
+                val binding = ItemMessageReceivedBinding.inflate(inflater, parent, false)
+                ReceivedMessageViewHolder(binding)
+            }
+            VIEW_TYPE_PRODUCT_SENT -> {
+                val binding = ItemMessageProductSentBinding.inflate(inflater, parent, false)
+                SentProductViewHolder(binding)
+            }
+            VIEW_TYPE_PRODUCT_RECEIVED -> {
+                val binding = ItemMessageProductReceivedBinding.inflate(inflater, parent, false)
+                ReceivedProductViewHolder(binding)
+            }
+            else -> throw IllegalArgumentException("Unknown view type: $viewType")
         }
     }
 
     override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
         val message = getItem(position)
 
-        when (holder.itemViewType) {
-            VIEW_TYPE_MESSAGE_SENT -> (holder as SentMessageViewHolder).bind(message)
-            VIEW_TYPE_MESSAGE_RECEIVED -> (holder as ReceivedMessageViewHolder).bind(message)
-        }
-    }
-
-    override fun getItemViewType(position: Int): Int {
-        val message = getItem(position)
-        return if (message.isSentByMe) {
-            VIEW_TYPE_MESSAGE_SENT
-        } else {
-            VIEW_TYPE_MESSAGE_RECEIVED
+        when (holder) {
+            is SentMessageViewHolder -> holder.bind(message)
+            is ReceivedMessageViewHolder -> holder.bind(message)
+            is SentProductViewHolder -> holder.bind(message)
+            is ReceivedProductViewHolder -> holder.bind(message)
         }
     }
 
     /**
-     * ViewHolder for messages sent by the current user
+     * ViewHolder for regular messages sent by the current user
      */
     inner class SentMessageViewHolder(private val binding: ItemMessageSentBinding) :
         RecyclerView.ViewHolder(binding.root) {
@@ -99,7 +114,7 @@ class ChatAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMess
     }
 
     /**
-     * ViewHolder for messages received from other users
+     * ViewHolder for regular messages received from other users
      */
     inner class ReceivedMessageViewHolder(private val binding: ItemMessageReceivedBinding) :
         RecyclerView.ViewHolder(binding.root) {
@@ -135,6 +150,89 @@ class ChatAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMess
                 .into(binding.imgAvatar)
         }
     }
+
+    /**
+     * ViewHolder for product messages sent by the current user
+     */
+    inner class SentProductViewHolder(private val binding: ItemMessageProductSentBinding) :
+        RecyclerView.ViewHolder(binding.root) {
+
+        fun bind(message: ChatUiMessage) {
+            // For product bubble, we don't show the text message here
+            binding.tvTimestamp.text = message.time
+
+            // Show message status
+            val statusIcon = when (message.status) {
+                Constants.STATUS_SENT -> R.drawable.check_single_24
+                Constants.STATUS_DELIVERED -> R.drawable.check_double_24
+                Constants.STATUS_READ -> R.drawable.check_double_read_24
+                else -> R.drawable.check_single_24
+            }
+            binding.imgStatus.setImageResource(statusIcon)
+
+            // Bind product info
+            message.productInfo?.let { product ->
+                binding.tvProductName.text = product.productName
+                binding.tvProductPrice.text = product.productPrice
+
+                // Load product image
+                val fullImageUrl = if (product.productImage.startsWith("/")) {
+                    BASE_URL + product.productImage.substring(1)
+                } else {
+                    product.productImage
+                }
+
+                Glide.with(binding.root.context)
+                    .load(fullImageUrl)
+                    .centerCrop()
+                    .placeholder(R.drawable.placeholder_image)
+                    .error(R.drawable.placeholder_image)
+                    .into(binding.imgProduct)
+
+                // Handle product click
+                binding.layoutProduct.setOnClickListener {
+                    onProductClick?.invoke(product)
+                }
+            }
+        }
+    }
+
+    /**
+     * ViewHolder for product messages received from other users
+     */
+    inner class ReceivedProductViewHolder(private val binding: ItemMessageProductReceivedBinding) :
+        RecyclerView.ViewHolder(binding.root) {
+
+        fun bind(message: ChatUiMessage) {
+            // For product bubble, we don't show the text message here
+            binding.tvTimestamp.text = message.time
+
+            // Bind product info
+            message.productInfo?.let { product ->
+                binding.tvProductName.text = product.productName
+                binding.tvProductPrice.text = product.productPrice
+
+                // Load product image
+                val fullImageUrl = if (product.productImage.startsWith("/")) {
+                    BASE_URL + product.productImage.substring(1)
+                } else {
+                    product.productImage
+                }
+
+                Glide.with(binding.root.context)
+                    .load(fullImageUrl)
+                    .centerCrop()
+                    .placeholder(R.drawable.placeholder_image)
+                    .error(R.drawable.placeholder_image)
+                    .into(binding.imgProduct)
+
+                // Handle product click
+                binding.layoutProduct.setOnClickListener {
+                    onProductClick?.invoke(product)
+                }
+            }
+        }
+    }
 }
 
 /**
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
index 73a57b2..2b8383f 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/chat/ChatViewModel.kt
@@ -24,12 +24,12 @@ import javax.inject.Inject
 class ChatViewModel @Inject constructor(
     private val chatRepository: ChatRepository,
     private val socketService: SocketIOService,
-
-
     private val sessionManager: SessionManager
 ) : ViewModel() {
 
     private val TAG = "ChatViewModel"
+    // Product attachment flag
+    private var shouldAttachProduct = false
 
     // UI state using LiveData
     private val _state = MutableLiveData(ChatUiState())
@@ -45,9 +45,9 @@ class ChatViewModel @Inject constructor(
     val chatListStore: LiveData<Result<List<ChatItemList>>> = _chatListStore
 
     private val _storeDetail = MutableLiveData<Result<StoreProduct?>>()
-    val storeDetail : LiveData<Result<StoreProduct?>> get() = _storeDetail
+    val storeDetail: LiveData<Result<StoreProduct?>> get() = _storeDetail
 
-    // Store and product parameters
+    // Chat parameters
     private var storeId: Int = 0
     private var productId: Int = 0
     private var currentUserId: Int? = null
@@ -64,36 +64,39 @@ class ChatViewModel @Inject constructor(
     private var selectedImageFile: File? = null
 
     init {
-        // Try to get current user ID from the repository
+        Log.d(TAG, "ChatViewModel initialized")
+        initializeUser()
+    }
+
+    private fun initializeUser() {
         viewModelScope.launch {
+            Log.d(TAG, "Initializing user session...")
+
             when (val result = chatRepository.fetchUserProfile()) {
                 is Result.Success -> {
                     currentUserId = result.data?.userId
-                    Log.e(TAG, "User ID: $currentUserId")
+                    Log.d(TAG, "User session initialized - User ID: $currentUserId")
 
-                    // Move the validation and subsequent logic inside the coroutine
                     if (currentUserId == null || currentUserId == 0) {
-                        Log.e(TAG, "Error: User ID is not set or invalid")
+                        Log.e(TAG, "Invalid user ID detected")
                         updateState { it.copy(error = "User authentication error. Please login again.") }
                     } else {
-                        // Set up socket listeners
+                        Log.d(TAG, "Setting up socket listeners...")
                         setupSocketListeners()
                     }
                 }
                 is Result.Error -> {
-                    Log.e(TAG, "Error fetching user profile: ${result.exception.message}")
+                    Log.e(TAG, "Failed to fetch user profile: ${result.exception.message}")
                     updateState { it.copy(error = "User authentication error. Please login again.") }
                 }
                 is Result.Loading -> {
-                    // Handle loading state if needed
+                    Log.d(TAG, "Loading user profile...")
                 }
             }
         }
     }
 
-    /**
-     * Set chat parameters received from activity
-     */
+    // set chat parameter for buyer
     fun setChatParameters(
         storeId: Int,
         productId: Int? = 0,
@@ -103,8 +106,9 @@ class ChatViewModel @Inject constructor(
         productRating: Float? = 0f,
         storeName: String
     ) {
-        this.productId = if (productId != null && productId > 0) productId else 0
+        Log.d(TAG, "Setting chat parameters - StoreID: $storeId, ProductID: $productId")
 
+        this.productId = if (productId != null && productId > 0) productId else 0
         this.storeId = storeId
         this.productName = productName.toString()
         this.productPrice = productPrice.toString()
@@ -112,7 +116,6 @@ class ChatViewModel @Inject constructor(
         this.productRating = productRating!!
         this.storeName = storeName
 
-        // Update state with product info
         updateState {
             it.copy(
                 productName = productName.toString(),
@@ -123,17 +126,15 @@ class ChatViewModel @Inject constructor(
             )
         }
 
-        // Connect to socket and load chat history
         val existingChatRoomId = _chatRoomId.value ?: 0
         if (existingChatRoomId > 0) {
-            // If we already have a chat room ID, we can load the chat history
+            Log.d(TAG, "Loading existing chat room: $existingChatRoomId")
             loadChatHistory(existingChatRoomId)
-
-            // And join the Socket.IO room
             joinSocketRoom(existingChatRoomId)
         }
     }
 
+    // set chat parameter for store
     fun setChatParametersStore(
         storeId: Int,
         userId: Int,
@@ -144,16 +145,17 @@ class ChatViewModel @Inject constructor(
         productRating: Float? = 0f,
         storeName: String
     ) {
-        this.productId = if (productId != null && productId > 0) productId else 0
+        Log.d(TAG, "Setting store chat parameters - StoreID: $storeId, UserID: $userId, ProductID: $productId")
 
+        this.productId = if (productId != null && productId > 0) productId else 0
         this.storeId = storeId
-        this.defaultUserId = userId  // Store the user_id for store-side chat
+        this.defaultUserId = userId
         this.productName = productName.toString()
         this.productPrice = productPrice.toString()
         this.productImage = productImage.toString()
         this.productRating = productRating!!
         this.storeName = storeName
-        // Update state with product info
+
         updateState {
             it.copy(
                 productName = productName.toString(),
@@ -164,95 +166,111 @@ class ChatViewModel @Inject constructor(
             )
         }
 
-        // Connect to socket and load chat history
         val existingChatRoomId = _chatRoomId.value ?: 0
         if (existingChatRoomId > 0) {
-            // If we already have a chat room ID, we can load the chat history
+            Log.d(TAG, "Loading existing store chat room: $existingChatRoomId")
             loadChatHistory(existingChatRoomId)
-
-            // And join the Socket.IO room
             joinSocketRoom(existingChatRoomId)
         }
     }
 
+    //enable product attach from detailproductactivity
+    fun enableProductAttachment() {
+        Log.d(TAG, "Product attachment enabled - ProductID: $productId, ProductName: $productName")
+        shouldAttachProduct = true
+        updateState { it.copy(hasProductAttachment = true) }
+    }
+
+    // disable product attach
+    fun disableProductAttachment() {
+        Log.d(TAG, "Product attachment disabled")
+        shouldAttachProduct = false
+        updateState { it.copy(hasProductAttachment = false) }
+    }
+
+    private fun setupSocketListeners() {
+        Log.d(TAG, "Setting up socket listeners...")
+
+        viewModelScope.launch {
+            socketService.connectionState.collect { connectionState ->
+                Log.d(TAG, "Socket connection state changed: $connectionState")
+                updateState { it.copy(connectionState = connectionState) }
+
+                if (connectionState is ConnectionState.Connected) {
+                    Log.d(TAG, "Socket connected, joining room...")
+                    socketService.joinRoom()
+                }
+            }
+        }
+
+        viewModelScope.launch {
+            socketService.newMessages.collect { chatLine ->
+                chatLine?.let {
+                    Log.d(TAG, "New message received via socket - ID: ${it.id}, SenderID: ${it.senderId}")
+                    val currentMessages = _state.value?.messages ?: listOf()
+                    val updatedMessages = currentMessages.toMutableList().apply {
+                        add(convertChatLineToUiMessage(it))
+                    }
+                    updateState { it.copy(messages = updatedMessages) }
+
+                    if (it.senderId != currentUserId) {
+                        Log.d(TAG, "Marking message as read: ${it.id}")
+                        updateMessageStatus(it.id, Constants.STATUS_READ)
+                    }
+                }
+            }
+        }
+
+        viewModelScope.launch {
+            socketService.typingStatus.collect { typingStatus ->
+                typingStatus?.let {
+                    val currentRoomId = _chatRoomId.value ?: 0
+                    if (typingStatus.roomId == currentRoomId && typingStatus.userId != currentUserId) {
+                        Log.d(TAG, "Typing status updated: ${typingStatus.isTyping}")
+                        updateState { it.copy(isOtherUserTyping = typingStatus.isTyping) }
+                    }
+                }
+            }
+        }
+    }
+
     fun joinSocketRoom(roomId: Int) {
         if (roomId <= 0) {
             Log.e(TAG, "Cannot join room: Invalid room ID")
             return
         }
 
+        Log.d(TAG, "Joining socket room: $roomId")
         socketService.joinRoom()
     }
 
-    /**
-     * Sets up listeners for Socket.IO events
-     */
-    private fun setupSocketListeners() {
-        viewModelScope.launch {
-            // Listen for connection state changes
-            socketService.connectionState.collect { connectionState ->
-                updateState { it.copy(connectionState = connectionState) }
-
-                // Join room when connected
-                if (connectionState is ConnectionState.Connected) {
-                    socketService.joinRoom()
-                }
-            }
-        }
-
-        viewModelScope.launch {
-            // Listen for new messages
-            socketService.newMessages.collect { chatLine ->
-                chatLine?.let {
-                    val currentMessages = _state.value?.messages ?: listOf()
-                    val updatedMessages = currentMessages.toMutableList().apply {
-                        add(convertChatLineToUiMessage(it))
-                    }
-                    updateState { it.copy(messages = updatedMessages) }
-
-                    // Update message status if received from others
-                    if (it.senderId != currentUserId) {
-                        updateMessageStatus(it.id, Constants.STATUS_READ)
-                    }
-                }
-            }
-        }
-
-        viewModelScope.launch {
-            // Listen for typing status updates
-            socketService.typingStatus.collect { typingStatus ->
-                typingStatus?.let {
-                    if (typingStatus.roomId == (_chatRoomId.value ?: 0) && typingStatus.userId != currentUserId) {
-                        updateState { it.copy(isOtherUserTyping = typingStatus.isTyping) }
-                    }
-                }
-            }
-        }
-    }
-
-    /**
-     * Helper function to update LiveData state
-     */
-    private fun updateState(update: (ChatUiState) -> ChatUiState) {
-        _state.value?.let {
-            _state.value = update(it)
-        }
-    }
-
-    /**
-     * Loads chat history
-     */
-    fun loadChatHistory(chatRoomId: Int) {
-        if (chatRoomId <= 0) {
-            Log.e(TAG, "Cannot load chat history: Chat room ID is 0")
+    fun sendTypingStatus(isTyping: Boolean) {
+        val roomId = _chatRoomId.value ?: 0
+        if (roomId <= 0) {
+            Log.w(TAG, "Cannot send typing status: No active room")
             return
         }
 
+        Log.d(TAG, "Sending typing status: $isTyping for room: $roomId")
+        socketService.sendTypingStatus(roomId, isTyping)
+    }
+
+    // load chat history
+    fun loadChatHistory(chatRoomId: Int) {
+        if (chatRoomId <= 0) {
+            Log.e(TAG, "Cannot load chat history: Invalid chat room ID")
+            return
+        }
+
+        Log.d(TAG, "Loading chat history for room: $chatRoomId")
+
         viewModelScope.launch {
             updateState { it.copy(isLoading = true) }
 
             when (val result = chatRepository.getChatHistory(chatRoomId)) {
                 is Result.Success -> {
+                    Log.d(TAG, "Chat history loaded successfully - ${result.data.chat.size} messages")
+
                     val messages = result.data.chat.map { chatLine ->
                         convertChatLineToUiMessageHistory(chatLine)
                     }
@@ -265,21 +283,24 @@ class ChatViewModel @Inject constructor(
                         )
                     }
 
-                    Log.d(TAG, "Loaded ${messages.size} messages for chat room $chatRoomId")
-
                     // Update status of unread messages
-                    result.data.chat
-                        .filter { it.senderId != currentUserId && it.status != Constants.STATUS_READ }
-                        .forEach { updateMessageStatus(it.id, Constants.STATUS_READ) }
+                    val unreadMessages = result.data.chat.filter {
+                        it.senderId != currentUserId && it.status != Constants.STATUS_READ
+                    }
+
+                    if (unreadMessages.isNotEmpty()) {
+                        Log.d(TAG, "Marking ${unreadMessages.size} messages as read")
+                        unreadMessages.forEach { updateMessageStatus(it.id, Constants.STATUS_READ) }
+                    }
                 }
                 is Result.Error -> {
+                    Log.e(TAG, "Error loading chat history: ${result.exception.message}")
                     updateState {
                         it.copy(
                             isLoading = false,
                             error = result.exception.message
                         )
                     }
-                    Log.e(TAG, "Error loading chat history: ${result.exception.message}")
                 }
                 is Result.Loading -> {
                     updateState { it.copy(isLoading = true) }
@@ -288,52 +309,329 @@ class ChatViewModel @Inject constructor(
         }
     }
 
-    /**
-     * Sends a chat message
-     */
+    fun getChatList() {
+        Log.d(TAG, "Getting chat list...")
+        viewModelScope.launch {
+            _chatList.value = Result.Loading
+            _chatList.value = chatRepository.getListChat()
+        }
+    }
+
+    fun getChatListStore() {
+        Log.d(TAG, "Getting store chat list...")
+        _chatListStore.value = Result.Loading
+
+        viewModelScope.launch {
+            val result = chatRepository.getListChatStore()
+            Log.d(TAG, "Store chat list result: $result")
+            _chatListStore.value = result
+        }
+    }
+
+    // handle regular message and product message
     fun sendMessage(message: String) {
         Log.d(TAG, "=== SEND MESSAGE ===")
         Log.d(TAG, "Message: '$message'")
-        Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
-        Log.d(TAG, "Selected image file: ${selectedImageFile?.absolutePath}")
-        Log.d(TAG, "File exists: ${selectedImageFile?.exists()}")
+        Log.d(TAG, "Should attach product: $shouldAttachProduct")
+        Log.d(TAG, "Has image attachment: ${selectedImageFile != null}")
+        Log.d(TAG, "Product ID: $productId")
+
         if (message.isBlank() && selectedImageFile == null) {
-            Log.e(TAG, "Cannot send message: Both message and image are empty")
+            Log.w(TAG, "Cannot send message: Both message and image are empty")
             return
         }
 
-        // Check if we have the necessary parameters
         if (storeId <= 0) {
-            Log.e(TAG, "Cannot send message: Store ID is invalid")
+            Log.e(TAG, "Cannot send message: Invalid store ID")
             updateState { it.copy(error = "Cannot send message. Invalid store ID.") }
             return
         }
 
-        // Get the existing chatRoomId (not used in API but may be needed for Socket.IO)
-        val existingChatRoomId = _chatRoomId.value ?: 0
+        // Check for product attachment
+        if (shouldAttachProduct && productId > 0) {
+            Log.d(TAG, "Sending message with product attachment")
+            sendMessageWithProduct(message)
+            shouldAttachProduct = false
+            updateState { it.copy(hasProductAttachment = false) }
+            return
+        }
 
-        // Log debug information
-        Log.d(TAG, "Sending message with params: storeId=$storeId, productId=$productId")
-        Log.d(TAG, "Current user ID: $currentUserId")
+        Log.d(TAG, "Sending regular message")
+        sendRegularMessage(message)
+    }
+
+    //send message for store
+    fun sendMessageStore(message: String) {
+        Log.d(TAG, "=== SEND MESSAGE STORE ===")
+        Log.d(TAG, "Message: '$message'")
         Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
+        Log.d(TAG, "Default User ID: $defaultUserId")
+
+        if (message.isBlank() && selectedImageFile == null) {
+            Log.w(TAG, "Cannot send store message: Both message and image are empty")
+            return
+        }
+
+        if (storeId <= 0) {
+            Log.e(TAG, "Cannot send store message: Invalid store ID")
+            updateState { it.copy(error = "Cannot send message. Invalid store ID.") }
+            return
+        }
+
+        if (defaultUserId <= 0) {
+            Log.e(TAG, "Cannot send store message: Invalid user ID")
+            updateState { it.copy(error = "Cannot send message. Invalid user ID.") }
+            return
+        }
 
-        // Check image file size if present
         selectedImageFile?.let { file ->
-            if (file.exists() && file.length() > 5 * 1024 * 1024) { // 5MB limit
+            if (file.exists() && file.length() > 5 * 1024 * 1024) {
+                Log.e(TAG, "Image file too large: ${file.length()} bytes")
                 updateState { it.copy(error = "Image file is too large. Please select a smaller image.") }
                 return
             }
         }
 
+        val existingChatRoomId = _chatRoomId.value ?: 0
+        Log.d(TAG, "Sending store message - StoreID: $storeId, UserID: $defaultUserId, RoomID: $existingChatRoomId")
+
         viewModelScope.launch {
             updateState { it.copy(isSending = true) }
 
             try {
-                // Send the message using the repository
-                // Note: We keep the chatRoomId parameter for compatibility with the repository method signature,
-                // but it's not actually used in the API call
                 val safeProductId = if (productId == 0) null else productId
 
+                val result = chatRepository.sendChatMessageStore(
+                    userId = defaultUserId,
+                    message = message,
+                    productId = safeProductId,
+                    imageFile = selectedImageFile
+                )
+
+                when (result) {
+                    is Result.Success -> {
+                        val chatLine = result.data.chatLine
+                        Log.d(TAG, "Store message sent successfully - ID: ${chatLine.id}")
+
+                        val newMessage = convertChatLineToUiMessage(chatLine)
+                        val currentMessages = _state.value?.messages ?: listOf()
+                        val updatedMessages = currentMessages.toMutableList().apply {
+                            add(newMessage)
+                        }
+
+                        updateState {
+                            it.copy(
+                                messages = updatedMessages,
+                                isSending = false,
+                                hasAttachment = false,
+                                error = null
+                            )
+                        }
+
+                        handleChatRoomCreation(existingChatRoomId, chatLine.chatRoomId)
+                        socketService.sendMessage(chatLine)
+                        selectedImageFile = null
+                    }
+                    is Result.Error -> {
+                        val errorMsg = result.exception.message?.takeIf { it.isNotBlank() && it != "{}" }
+                            ?: "Failed to send message. Please try again."
+
+                        Log.e(TAG, "Error sending store message: $errorMsg")
+                        updateState {
+                            it.copy(
+                                isSending = false,
+                                error = errorMsg
+                            )
+                        }
+                    }
+                    is Result.Loading -> {
+                        updateState { it.copy(isSending = true) }
+                    }
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception in sendMessageStore", e)
+                updateState {
+                    it.copy(
+                        isSending = false,
+                        error = "An unexpected error occurred: ${e.message}"
+                    )
+                }
+            }
+        }
+    }
+
+    // send message with product info
+    private fun sendMessageWithProduct(userMessage: String) {
+        Log.d(TAG, "Sending message with product attachment")
+        Log.d(TAG, "User message: '$userMessage'")
+        Log.d(TAG, "Product: $productName")
+
+        // Send product bubble FIRST
+        sendProductBubble()
+
+        // Then send user's text message after a small delay
+        viewModelScope.launch {
+            kotlinx.coroutines.delay(100)
+            sendTextMessage(userMessage)
+        }
+    }
+
+    // send only text message w/o product info
+    private fun sendTextMessage(message: String) {
+        if (message.isBlank()) {
+            Log.w(TAG, "Cannot send text message: Message is blank")
+            return
+        }
+
+        Log.d(TAG, "Sending text message: '$message'")
+
+        viewModelScope.launch {
+            updateState { it.copy(isSending = true) }
+
+            try {
+                val result = chatRepository.sendChatMessage(
+                    storeId = storeId,
+                    message = message,
+                    productId = null,
+                    imageFile = selectedImageFile
+                )
+
+                when (result) {
+                    is Result.Success -> {
+                        val chatLine = result.data.chatLine
+                        Log.d(TAG, "Text message sent successfully - ID: ${chatLine.id}")
+
+                        val newMessage = convertChatLineToUiMessage(chatLine)
+                        val currentMessages = _state.value?.messages ?: listOf()
+                        val updatedMessages = currentMessages.toMutableList().apply {
+                            add(newMessage)
+                        }
+
+                        updateState {
+                            it.copy(
+                                messages = updatedMessages,
+                                isSending = false,
+                                hasAttachment = false,
+                                error = null
+                            )
+                        }
+
+                        val existingChatRoomId = _chatRoomId.value ?: 0
+                        handleChatRoomCreation(existingChatRoomId, chatLine.chatRoomId)
+                        socketService.sendMessage(chatLine)
+                        selectedImageFile = null
+                    }
+                    is Result.Error -> {
+                        Log.e(TAG, "Error sending text message: ${result.exception.message}")
+                        updateState {
+                            it.copy(
+                                isSending = false,
+                                error = result.exception.message ?: "Failed to send message"
+                            )
+                        }
+                    }
+                    is Result.Loading -> {
+                        updateState { it.copy(isSending = true) }
+                    }
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception in sendTextMessage", e)
+                updateState {
+                    it.copy(
+                        isSending = false,
+                        error = "An unexpected error occurred: ${e.message}"
+                    )
+                }
+            }
+        }
+    }
+
+    // send product bubble message
+    private fun sendProductBubble() {
+        Log.d(TAG, "Sending product bubble - ProductID: $productId, ProductName: $productName")
+
+        viewModelScope.launch {
+            try {
+                val result = chatRepository.sendChatMessage(
+                    storeId = storeId,
+                    message = "",
+                    productId = productId,
+                    imageFile = null
+                )
+
+                when (result) {
+                    is Result.Success -> {
+                        val chatLine = result.data.chatLine
+                        Log.d(TAG, "Product bubble sent successfully - ID: ${chatLine.id}")
+
+                        val newMessage = convertChatLineToUiMessage(chatLine).copy(
+                            messageType = MessageType.PRODUCT,
+                            productInfo = ProductInfo(
+                                productId = productId,
+                                productName = productName,
+                                productPrice = productPrice,
+                                productImage = productImage,
+                                productRating = productRating,
+                                storeName = storeName
+                            )
+                        )
+
+                        val currentMessages = _state.value?.messages ?: listOf()
+                        val updatedMessages = currentMessages.toMutableList().apply {
+                            add(newMessage)
+                        }
+
+                        updateState {
+                            it.copy(
+                                messages = updatedMessages,
+                                error = null
+                            )
+                        }
+
+                        socketService.sendMessage(chatLine)
+                    }
+                    is Result.Error -> {
+                        Log.e(TAG, "Error sending product bubble: ${result.exception.message}")
+                        updateState {
+                            it.copy(
+                                error = "Failed to send product info: ${result.exception.message}"
+                            )
+                        }
+                    }
+                    is Result.Loading -> {
+                        // Handle loading if needed
+                    }
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception in sendProductBubble", e)
+                updateState {
+                    it.copy(
+                        error = "An unexpected error occurred: ${e.message}"
+                    )
+                }
+            }
+        }
+    }
+
+    // send regular message for normal chat
+    private fun sendRegularMessage(message: String) {
+        Log.d(TAG, "Sending regular message: '$message'")
+
+        selectedImageFile?.let { file ->
+            if (file.exists() && file.length() > 5 * 1024 * 1024) {
+                Log.e(TAG, "Image file too large: ${file.length()} bytes")
+                updateState { it.copy(error = "Image file is too large. Please select a smaller image.") }
+                return
+            }
+        }
+
+        val existingChatRoomId = _chatRoomId.value ?: 0
+
+        viewModelScope.launch {
+            updateState { it.copy(isSending = true) }
+
+            try {
+                val safeProductId = if (productId == 0) null else productId
 
                 val result = chatRepository.sendChatMessage(
                     storeId = storeId,
@@ -344,10 +642,10 @@ class ChatViewModel @Inject constructor(
 
                 when (result) {
                     is Result.Success -> {
-                        // Add new message to the list
                         val chatLine = result.data.chatLine
-                        val newMessage = convertChatLineToUiMessage(chatLine)
+                        Log.d(TAG, "Regular message sent successfully - ID: ${chatLine.id}")
 
+                        val newMessage = convertChatLineToUiMessage(chatLine)
                         val currentMessages = _state.value?.messages ?: listOf()
                         val updatedMessages = currentMessages.toMutableList().apply {
                             add(newMessage)
@@ -362,45 +660,28 @@ class ChatViewModel @Inject constructor(
                             )
                         }
 
-                        Log.d(TAG, "Message sent successfully: ${chatLine.id}")
-
-                        // Update the chat room ID if it's the first message
-                        val newChatRoomId = chatLine.chatRoomId
-                        if (existingChatRoomId == 0 && newChatRoomId > 0) {
-                            Log.d(TAG, "Chat room created: $newChatRoomId")
-                            _chatRoomId.value = newChatRoomId
-
-                            // Now that we have a chat room ID, we can join the Socket.IO room
-                            joinSocketRoom(newChatRoomId)
-                        }
-
-                        // Emit the message via Socket.IO for real-time updates
+                        handleChatRoomCreation(existingChatRoomId, chatLine.chatRoomId)
                         socketService.sendMessage(chatLine)
-
-                        // Clear the image attachment
                         selectedImageFile = null
                     }
                     is Result.Error -> {
-                        val errorMsg = if (result.exception.message.isNullOrEmpty() || result.exception.message == "{}") {
-                            "Failed to send message. Please try again."
-                        } else {
-                            result.exception.message
-                        }
+                        val errorMsg = result.exception.message?.takeIf { it.isNotBlank() && it != "{}" }
+                            ?: "Failed to send message. Please try again."
 
+                        Log.e(TAG, "Error sending regular message: $errorMsg")
                         updateState {
                             it.copy(
                                 isSending = false,
                                 error = errorMsg
                             )
                         }
-                        Log.e(TAG, "Error sending message: ${result.exception.message}")
                     }
                     is Result.Loading -> {
                         updateState { it.copy(isSending = true) }
                     }
                 }
             } catch (e: Exception) {
-                Log.e(TAG, "Exception in sendMessage", e)
+                Log.e(TAG, "Exception in sendRegularMessage", e)
                 updateState {
                     it.copy(
                         isSending = false,
@@ -411,138 +692,15 @@ class ChatViewModel @Inject constructor(
         }
     }
 
-    fun sendMessageStore(message: String) {
-        Log.d(TAG, "=== SEND MESSAGE ===")
-        Log.d(TAG, "Message: '$message'")
-        Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
-        Log.d(TAG, "Selected image file: ${selectedImageFile?.absolutePath}")
-        Log.d(TAG, "File exists: ${selectedImageFile?.exists()}")
-        if (message.isBlank() && selectedImageFile == null) {
-            Log.e(TAG, "Cannot send message: Both message and image are empty")
-            return
-        }
-
-        // Check if we have the necessary parameters
-        if (storeId <= 0) {
-            Log.e(TAG, "Cannot send message: Store ID is invalid")
-            updateState { it.copy(error = "Cannot send message. Invalid store ID.") }
-            return
-        }
-
-        // Get the existing chatRoomId (not used in API but may be needed for Socket.IO)
-        val existingChatRoomId = _chatRoomId.value ?: 0
-
-        // Log debug information
-        Log.d(TAG, "Sending message with params: storeId=$storeId, productId=$productId")
-        Log.d(TAG, "Current user ID: $currentUserId")
-        Log.d(TAG, "Has attachment: ${selectedImageFile != null}")
-
-        // Check image file size if present
-        selectedImageFile?.let { file ->
-            if (file.exists() && file.length() > 5 * 1024 * 1024) { // 5MB limit
-                updateState { it.copy(error = "Image file is too large. Please select a smaller image.") }
-                return
-            }
-        }
-
-        if (defaultUserId <= 0) {  // Check userId instead of storeId
-            Log.e(TAG, "Cannot send message: User ID is invalid")
-            updateState { it.copy(error = "Cannot send message. Invalid user ID.") }
-            return
-        }
-
-        viewModelScope.launch {
-            updateState { it.copy(isSending = true) }
-
-            try {
-                val safeProductId = if (productId == 0) null else productId
-
-                val result = chatRepository.sendChatMessageStore(
-                    userId = defaultUserId,  // Pass userId instead of storeId
-                    message = message,
-                    productId = safeProductId,
-                    imageFile = selectedImageFile
-                )
-
-                when (result) {
-                    is Result.Success -> {
-                        // Add new message to the list
-                        val chatLine = result.data.chatLine
-                        val newMessage = convertChatLineToUiMessage(chatLine)
-
-                        val currentMessages = _state.value?.messages ?: listOf()
-                        val updatedMessages = currentMessages.toMutableList().apply {
-                            add(newMessage)
-                        }
-
-                        updateState {
-                            it.copy(
-                                messages = updatedMessages,
-                                isSending = false,
-                                hasAttachment = false,
-                                error = null
-                            )
-                        }
-
-                        Log.d(TAG, "Message sent successfully: ${chatLine.id}")
-
-                        // Update the chat room ID if it's the first message
-                        val newChatRoomId = chatLine.chatRoomId
-                        if (existingChatRoomId == 0 && newChatRoomId > 0) {
-                            Log.d(TAG, "Chat room created: $newChatRoomId")
-                            _chatRoomId.value = newChatRoomId
-
-                            // Now that we have a chat room ID, we can join the Socket.IO room
-                            joinSocketRoom(newChatRoomId)
-                        }
-
-                        // Emit the message via Socket.IO for real-time updates
-                        socketService.sendMessage(chatLine)
-
-                        // Clear the image attachment
-                        selectedImageFile = null
-                    }
-                    is Result.Error -> {
-                        val errorMsg = if (result.exception.message.isNullOrEmpty() || result.exception.message == "{}") {
-                            "Failed to send message. Please try again."
-                        } else {
-                            result.exception.message
-                        }
-
-                        updateState {
-                            it.copy(
-                                isSending = false,
-                                error = errorMsg
-                            )
-                        }
-                        Log.e(TAG, "Error sending message: ${result.exception.message}")
-                    }
-                    is Result.Loading -> {
-                        updateState { it.copy(isSending = true) }
-                    }
-                }
-            } catch (e: Exception) {
-                Log.e(TAG, "Exception in sendMessage", e)
-                updateState {
-                    it.copy(
-                        isSending = false,
-                        error = "An unexpected error occurred: ${e.message}"
-                    )
-                }
-            }
-        }
-    }
-
-    /**
-     * Updates a message status (delivered, read)
-     */
+   //update message status
     fun updateMessageStatus(messageId: Int, status: String) {
+        Log.d(TAG, "Updating message status - ID: $messageId, Status: $status")
+
         viewModelScope.launch {
             try {
                 val result = chatRepository.updateMessageStatus(messageId, status)
 
                 if (result is Result.Success) {
-                    // Update local message status
                     val currentMessages = _state.value?.messages ?: listOf()
                     val updatedMessages = currentMessages.map { message ->
                         if (message.id == messageId) {
@@ -552,8 +710,7 @@ class ChatViewModel @Inject constructor(
                         }
                     }
                     updateState { it.copy(messages = updatedMessages) }
-
-                    Log.d(TAG, "Message status updated: $messageId -> $status")
+                    Log.d(TAG, "Message status updated successfully")
                 } else if (result is Result.Error) {
                     Log.e(TAG, "Error updating message status: ${result.exception.message}")
                 }
@@ -563,118 +720,245 @@ class ChatViewModel @Inject constructor(
         }
     }
 
-    /**
-     * Sets the selected image file for attachment
-     */
+   //set image attachment
     fun setSelectedImageFile(file: File?) {
         selectedImageFile = file
         updateState { it.copy(hasAttachment = file != null) }
-
-        Log.d(TAG, "Image attachment ${if (file != null) "selected" else "cleared"}")
+        Log.d(TAG, "Image attachment ${if (file != null) "selected: ${file.name}" else "cleared"}")
     }
 
-    /**
-     * Sends typing status to the other user
-     */
-    fun sendTypingStatus(isTyping: Boolean) {
-        val roomId = _chatRoomId.value ?: 0
-        if (roomId <= 0) return
-
-        socketService.sendTypingStatus(roomId, isTyping)
-    }
-
-    /**
-     * Clears any error message in the state
-     */
-    fun clearError() {
-        updateState { it.copy(error = null) }
-    }
-
-    /**
-     * Converts a ChatLine from API to a UI message model
-     */
+    // convert form chatLine api to UI chat messages
     private fun convertChatLineToUiMessage(chatLine: ChatLine): ChatUiMessage {
-        // Format the timestamp for display
-        val formattedTime = try {
-            val inputFormat = java.text.SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
-            inputFormat.timeZone = TimeZone.getTimeZone("UTC")
-            val outputFormat = java.text.SimpleDateFormat("HH:mm", Locale.getDefault())
-
-            val date = inputFormat.parse(chatLine.createdAt)
-            date?.let { outputFormat.format(it) } ?: ""
-        } catch (e: Exception) {
-            Log.e(TAG, "Error formatting date: ${chatLine.createdAt}", e)
-            ""
-        }
+        val formattedTime = formatTimestamp(chatLine.createdAt)
 
         return ChatUiMessage(
             id = chatLine.id,
             message = chatLine.message,
-            attachment = chatLine.attachment ?: "", // Handle null attachment
+            attachment = chatLine.attachment ?: "",
             status = chatLine.status,
             time = formattedTime,
             isSentByMe = chatLine.senderId == currentUserId
         )
     }
 
+   // convert chat history item to ui
     private fun convertChatLineToUiMessageHistory(chatItem: ChatItem): ChatUiMessage {
-        // Format the timestamp for display
-        val formattedTime = try {
+        val formattedTime = formatTimestamp(chatItem.createdAt)
+
+        val messageType = when {
+            chatItem.productId > 0 -> MessageType.PRODUCT
+            !chatItem.attachment.isNullOrEmpty() -> MessageType.IMAGE
+            else -> MessageType.TEXT
+        }
+
+        val productInfo = if (messageType == MessageType.PRODUCT) {
+            if (chatItem.senderId == currentUserId && chatItem.productId == productId) {
+                ProductInfo(
+                    productId = productId,
+                    productName = productName,
+                    productPrice = productPrice,
+                    productImage = productImage,
+                    productRating = productRating,
+                    storeName = storeName
+                )
+            } else {
+                ProductInfo(
+                    productId = chatItem.productId,
+                    productName = "Loading...",
+                    productPrice = "Loading...",
+                    productImage = "",
+                    productRating = 0f,
+                    storeName = "Loading..."
+                )
+            }
+        } else null
+
+        val message = ChatUiMessage(
+            id = chatItem.id,
+            message = chatItem.message,
+            attachment = chatItem.attachment,
+            status = chatItem.status,
+            time = formattedTime,
+            isSentByMe = chatItem.senderId == currentUserId,
+            messageType = messageType,
+            productInfo = productInfo
+        )
+
+        // Fetch product info for non-current-user products
+        if (messageType == MessageType.PRODUCT &&
+            (chatItem.senderId != currentUserId || chatItem.productId != productId)) {
+            fetchProductInfoForHistoryMessage(message, chatItem.productId)
+        }
+
+        return message
+    }
+
+    // fetch produc =t info in chat history
+    private fun fetchProductInfoForHistoryMessage(message: ChatUiMessage, productId: Int) {
+        Log.d(TAG, "Fetching product info for message ${message.id}, productId: $productId")
+
+        viewModelScope.launch {
+            try {
+                val productResult = chatRepository.fetchProductDetail(productId)
+
+                if (productResult != null) {
+                    val product = productResult.product
+                    Log.d(TAG, "Product fetched successfully: ${product.productName}")
+
+                    val productInfo = ProductInfo(
+                        productId = product.productId,
+                        productName = product.productName,
+                        productPrice = formatPrice(product.price),
+                        productImage = product.image,
+                        productRating = parseRating(product.rating),
+                        storeName = getStoreName(product.storeId)
+                    )
+
+                    updateMessageWithProductInfo(message.id, productInfo)
+                } else {
+                    Log.e(TAG, "Failed to fetch product info for productId: $productId")
+                    val errorProductInfo = ProductInfo(
+                        productId = productId,
+                        productName = "Product not available",
+                        productPrice = "N/A",
+                        productImage = "",
+                        productRating = 0f,
+                        storeName = "Unknown Store"
+                    )
+                    updateMessageWithProductInfo(message.id, errorProductInfo)
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception fetching product info for message: ${message.id}", e)
+                val errorProductInfo = ProductInfo(
+                    productId = productId,
+                    productName = "Error loading product",
+                    productPrice = "N/A",
+                    productImage = "",
+                    productRating = 0f,
+                    storeName = "Unknown Store"
+                )
+                updateMessageWithProductInfo(message.id, errorProductInfo)
+            }
+        }
+    }
+
+    //update specific message with product info
+    private fun updateMessageWithProductInfo(messageId: Int, productInfo: ProductInfo) {
+        Log.d(TAG, "Updating message $messageId with product info: ${productInfo.productName}")
+
+        val currentMessages = _state.value?.messages ?: listOf()
+        val updatedMessages = currentMessages.map { message ->
+            if (message.id == messageId) {
+                message.copy(productInfo = productInfo)
+            } else {
+                message
+            }
+        }
+        updateState { it.copy(messages = updatedMessages) }
+    }
+
+    //handle chat room when initiate chat
+    private fun handleChatRoomCreation(existingChatRoomId: Int, newChatRoomId: Int) {
+        if (existingChatRoomId == 0 && newChatRoomId > 0) {
+            Log.d(TAG, "Chat room created: $newChatRoomId")
+            _chatRoomId.value = newChatRoomId
+            joinSocketRoom(newChatRoomId)
+        }
+    }
+
+    //format timestamp
+    private fun formatTimestamp(timestamp: String): String {
+        return try {
             val inputFormat = java.text.SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
             inputFormat.timeZone = TimeZone.getTimeZone("UTC")
             val outputFormat = java.text.SimpleDateFormat("HH:mm", Locale.getDefault())
 
-            val date = inputFormat.parse(chatItem.createdAt)
+            val date = inputFormat.parse(timestamp)
             date?.let { outputFormat.format(it) } ?: ""
         } catch (e: Exception) {
-            Log.e(TAG, "Error formatting date: ${chatItem.createdAt}", e)
+            Log.e(TAG, "Error formatting date: $timestamp", e)
             ""
         }
+    }
 
-        return ChatUiMessage(
-            attachment = chatItem.attachment, // Handle null attachment
-            id = chatItem.id,
-            message = chatItem.message,
-            status = chatItem.status,
-            time = formattedTime,
-            isSentByMe = chatItem.senderId == currentUserId,
-        )
+   //format price
+    private fun formatPrice(price: String): String {
+        return if (price.startsWith("Rp")) price else "Rp$price"
+    }
+
+    // parse string to float
+    private fun parseRating(rating: String): Float {
+        return try {
+            rating.toFloat()
+        } catch (e: Exception) {
+            Log.w(TAG, "Error parsing rating: $rating", e)
+            0f
+        }
+    }
+
+    //get store name by Id
+    private fun getStoreName(storeId: Int): String {
+        return if (storeId == this.storeId) {
+            storeName
+        } else {
+            "Store #$storeId"
+        }
+    }
+
+    // helper function to update live data
+    private fun updateState(update: (ChatUiState) -> ChatUiState) {
+        _state.value?.let {
+            _state.value = update(it)
+        }
+    }
+
+    //clear any error messages
+    fun clearError() {
+        Log.d(TAG, "Clearing error state")
+        updateState { it.copy(error = null) }
     }
 
     override fun onCleared() {
         super.onCleared()
-        // Disconnect Socket.IO when ViewModel is cleared
+        Log.d(TAG, "ChatViewModel cleared - Disconnecting socket")
         socketService.disconnect()
-        Log.d(TAG, "ViewModel cleared, Socket.IO disconnected")
-    }
-
-    fun getChatList() {
-        viewModelScope.launch {
-            _chatList.value = com.alya.ecommerce_serang.data.repository.Result.Loading
-            _chatList.value = chatRepository.getListChat()
-        }
-    }
-
-    fun getChatListStore() {
-        Log.d("ChatViewModel", "getChatListStore() called")
-        _chatListStore.value = Result.Loading
-
-        viewModelScope.launch {
-            val result = chatRepository.getListChatStore()
-            Log.d("ChatViewModel", "getChatListStore() result: $result")
-            _chatListStore.value = result
-        }
     }
 }
 
-/**
- * Data class representing the UI state for the chat screen
- */
+enum class MessageType {
+    TEXT,           // Regular text message
+    IMAGE,          // Image message
+    PRODUCT         // Product share message
+}
+
+data class ProductInfo(
+    val productId: Int,
+    val productName: String,
+    val productPrice: String,
+    val productImage: String,
+    val productRating: Float,
+    val storeName: String
+)
+
+// representing chat messages to UI
+data class ChatUiMessage(
+    val id: Int,
+    val message: String,
+    val attachment: String?,
+    val status: String,
+    val time: String,
+    val isSentByMe: Boolean,
+    val messageType: MessageType = MessageType.TEXT,
+    val productInfo: ProductInfo? = null
+)
+
+// representing UI state to screen
 data class ChatUiState(
     val messages: List<ChatUiMessage> = emptyList(),
     val isLoading: Boolean = false,
     val isSending: Boolean = false,
     val hasAttachment: Boolean = false,
+    val hasProductAttachment: Boolean = false,
     val isOtherUserTyping: Boolean = false,
     val error: String? = null,
     val connectionState: ConnectionState = ConnectionState.Disconnected(),
@@ -685,16 +969,4 @@ data class ChatUiState(
     val productImageUrl: String = "",
     val productRating: Float = 0f,
     val storeName: String = ""
-)
-
-/**
- * Data class representing a chat message in the UI
- */
-data class ChatUiMessage(
-    val id: Int,
-    val message: String,
-    val attachment: String?,
-    val status: String,
-    val time: String,
-    val isSentByMe: Boolean
 )
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt
index 83d156c..3e62dea 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt
@@ -483,8 +483,10 @@ class DetailProductActivity : AppCompatActivity() {
             productRating = productDetail.rating,
             storeName = storeDetail.data.storeName,
             chatRoomId = 0,
-            storeImage = storeDetail.data.storeImage
-            )
+            storeImage = storeDetail.data.storeImage,
+            attachProduct = true // This will auto-attach the product!
+
+        )
 
     }
 
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
index 9620907..c68e3de 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreActivity.kt
@@ -80,7 +80,7 @@ class ChatListStoreActivity : AppCompatActivity() {
             when (result) {
                 is Result.Success -> {
                     Log.d(TAG, "Chat list fetch success. Data size: ${result.data.size}")
-                    val adapter = ChatListAdapter(result.data) { chatItem ->
+                    val adapter = ChatStoreListAdapter(result.data) { chatItem ->
                         Log.d(TAG, "Chat item clicked: storeId=${chatItem.storeId}, chatRoomId=${chatItem.chatRoomId}")
                         val intent = ChatStoreActivity.createIntent(
                             context = this,
@@ -93,7 +93,10 @@ class ChatListStoreActivity : AppCompatActivity() {
                             storeName = chatItem.storeName,
                             chatRoomId = chatItem.chatRoomId,
                             storeImage = chatItem.storeImage,
-                            userId = chatItem.userId
+                            userId = chatItem.userId,
+                            userName = chatItem.userName,
+                            userImg = chatItem.userImage
+
                         )
                         startActivity(intent)
                     }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
index c872f50..8dfabfc 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreActivity.kt
@@ -15,7 +15,6 @@ import android.util.Log
 import android.view.View
 import android.view.inputmethod.InputMethodManager
 import android.widget.Toast
-import androidx.activity.enableEdgeToEdge
 import androidx.activity.result.contract.ActivityResultContracts
 import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
@@ -23,7 +22,6 @@ import androidx.core.app.ActivityCompat
 import androidx.core.content.ContextCompat
 import androidx.core.content.FileProvider
 import androidx.core.view.ViewCompat
-import androidx.core.view.WindowCompat
 import androidx.core.view.WindowInsetsAnimationCompat
 import androidx.core.view.WindowInsetsCompat
 import androidx.lifecycle.Observer
@@ -45,7 +43,6 @@ import java.text.SimpleDateFormat
 import java.util.Date
 import java.util.Locale
 import javax.inject.Inject
-import kotlin.math.max
 
 @AndroidEntryPoint
 class ChatStoreActivity : AppCompatActivity() {
@@ -102,10 +99,10 @@ class ChatStoreActivity : AppCompatActivity() {
 
         Log.d("ChatActivity", "Token in storage: '${sessionManager.getToken()}'")
 
-        WindowCompat.setDecorFitsSystemWindows(window, false)
-        enableEdgeToEdge()
-
-        // Apply insets to your root layout
+//        WindowCompat.setDecorFitsSystemWindows(window, false)
+//        enableEdgeToEdge()
+//
+//        // Apply insets to your root layout
 
 
         // Get parameters from intent
@@ -119,6 +116,8 @@ class ChatStoreActivity : AppCompatActivity() {
         val storeName = intent.getStringExtra(Constants.EXTRA_STORE_NAME) ?: ""
         val chatRoomId = intent.getIntExtra(Constants.EXTRA_CHAT_ROOM_ID, 0)
         val storeImg = intent.getStringExtra(Constants.EXTRA_STORE_IMAGE) ?: ""
+        val userName = intent.getStringExtra(Constants.EXTRA_USER_NAME) ?: ""
+        val userImg = intent.getStringExtra(Constants.EXTRA_USER_IMAGE) ?: ""
 
         // Check if user is logged in
         val token = sessionManager.getToken()
@@ -131,8 +130,8 @@ class ChatStoreActivity : AppCompatActivity() {
             return
         }
 
-        binding.tvStoreName.text = storeName
-        val fullImageUrl = when (val img = storeImg) {
+        binding.tvStoreName.text = userName
+        val fullImageUrl = when (val img = userImg) {
             is String -> {
                 if (img.startsWith("/")) BASE_URL + img.substring(1) else img
             }
@@ -144,84 +143,6 @@ class ChatStoreActivity : AppCompatActivity() {
             .placeholder(R.drawable.placeholder_image)
             .into(binding.imgProfile)
 
-        ViewCompat.setOnApplyWindowInsetsListener(binding.layoutChatInput) { view, insets ->
-            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
-            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
-
-            val bottomPadding = max(imeInsets.bottom, navBarInsets.bottom)
-            view.setPadding(view.paddingLeft, view.paddingTop, view.paddingRight, bottomPadding)
-            insets
-        }
-
-// Handle top inset on toolbar (status bar height)
-        ViewCompat.setOnApplyWindowInsetsListener(binding.chatToolbar) { view, insets ->
-            val statusBarHeight = insets.getInsets(WindowInsetsCompat.Type.statusBars()).top
-            view.setPadding(view.paddingLeft, statusBarHeight, view.paddingRight, view.paddingBottom)
-            insets
-        }
-
-        ViewCompat.setOnApplyWindowInsetsListener(binding.recyclerChat) { view, insets ->
-            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
-            val bottomPadding = binding.layoutChatInput.height + navBarInsets.bottom
-
-            view.setPadding(
-                view.paddingLeft,
-                view.paddingTop,
-                view.paddingRight,
-                bottomPadding
-            )
-            insets
-        }
-
-// For RecyclerView, add bottom padding = chat input height + nav bar height (to avoid last message hidden)
-
-        ViewCompat.setWindowInsetsAnimationCallback(binding.root,
-            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
-
-                private var startPaddingBottom = 0
-                private var endPaddingBottom = 0
-
-                override fun onPrepare(animation: WindowInsetsAnimationCompat) {
-                    startPaddingBottom = binding.layoutChatInput.paddingBottom
-                }
-
-                override fun onStart(
-                    animation: WindowInsetsAnimationCompat,
-                    bounds: WindowInsetsAnimationCompat.BoundsCompat
-                ): WindowInsetsAnimationCompat.BoundsCompat {
-                    endPaddingBottom = binding.layoutChatInput.paddingBottom
-                    return bounds
-                }
-
-                override fun onProgress(
-                    insets: WindowInsetsCompat,
-                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
-                ): WindowInsetsCompat {
-                    val imeAnimation = runningAnimations.find {
-                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
-                    } ?: return insets
-
-                    val animatedBottomPadding = startPaddingBottom +
-                            (endPaddingBottom - startPaddingBottom) * imeAnimation.interpolatedFraction
-
-                    binding.layoutChatInput.setPadding(
-                        binding.layoutChatInput.paddingLeft,
-                        binding.layoutChatInput.paddingTop,
-                        binding.layoutChatInput.paddingRight,
-                        animatedBottomPadding.toInt()
-                    )
-
-                    binding.recyclerChat.setPadding(
-                        binding.recyclerChat.paddingLeft,
-                        binding.recyclerChat.paddingTop,
-                        binding.recyclerChat.paddingRight,
-                        animatedBottomPadding.toInt() + binding.layoutChatInput.height
-                    )
-
-                    return insets
-                }
-            })
-
                 // Set chat parameters to ViewModel
         viewModel.setChatParametersStore(
             storeId = storeId,
@@ -234,8 +155,10 @@ class ChatStoreActivity : AppCompatActivity() {
             storeName = storeName
         )
 
-        // Setup UI components
+
+        // Then setup other components
         setupRecyclerView()
+        setupWindowInsets()
         setupListeners()
         setupTypingIndicator()
         observeViewModel()
@@ -251,18 +174,140 @@ class ChatStoreActivity : AppCompatActivity() {
         chatAdapter = ChatAdapter()
         binding.recyclerChat.apply {
             adapter = chatAdapter
-            layoutManager = LinearLayoutManager(this@ChatStoreActivity).apply {
-                stackFromEnd = true
-            }
+            layoutManager = LinearLayoutManager(this@ChatStoreActivity)
+            // Use clipToPadding to allow content to scroll under padding
+            clipToPadding = false
+            // Set minimal padding - we'll handle spacing differently
+            setPadding(paddingLeft, paddingTop, paddingRight, 16)
         }
+    }
+
+    private fun setupWindowInsets() {
+        ViewCompat.setOnApplyWindowInsetsListener(binding.chatToolbar) { view, insets ->
+            val statusBarInsets = insets.getInsets(WindowInsetsCompat.Type.statusBars())
+            view.updatePadding(top = statusBarInsets.top)
+            insets
+        }
+
+        // Handle IME (keyboard) and navigation bar insets for the input layout only
+        ViewCompat.setOnApplyWindowInsetsListener(binding.layoutChatInput) { view, insets ->
+            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
+            val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+
+            Log.d(TAG, "Insets - IME: ${imeInsets.bottom}, NavBar: ${navBarInsets.bottom}")
+
+            val bottomInset = if (imeInsets.bottom > 0) {
+                imeInsets.bottom
+            } else {
+                navBarInsets.bottom
+            }
+
+            // Only apply padding to the input layout
+            view.updatePadding(bottom = bottomInset)
+
+            // When keyboard appears, scroll to bottom to keep last message visible
+            if (imeInsets.bottom > 0) {
+                // Keyboard is visible - scroll to bottom with delay to ensure layout is complete
+                binding.recyclerChat.postDelayed({
+                    scrollToBottomSmooth()
+                }, 100)
+            }
+
+            insets
+        }
+
+        // Smooth animation for keyboard transitions
+        ViewCompat.setWindowInsetsAnimationCallback(
+            binding.layoutChatInput,
+            object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_STOP) {
+
+                override fun onProgress(
+                    insets: WindowInsetsCompat,
+                    runningAnimations: MutableList<WindowInsetsAnimationCompat>
+                ): WindowInsetsCompat {
+                    val imeAnimation = runningAnimations.find {
+                        it.typeMask and WindowInsetsCompat.Type.ime() != 0
+                    }
+
+                    if (imeAnimation != null) {
+                        val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
+                        val navBarInsets = insets.getInsets(WindowInsetsCompat.Type.navigationBars())
+                        val targetBottomInset = if (imeInsets.bottom > 0) imeInsets.bottom else navBarInsets.bottom
+
+                        // Only animate input layout padding
+                        binding.layoutChatInput.updatePadding(bottom = targetBottomInset)
+                    }
+
+                    return insets
+                }
+
+                override fun onEnd(animation: WindowInsetsAnimationCompat) {
+                    super.onEnd(animation)
+                    // Smooth scroll to bottom after animation
+                    scrollToBottomSmooth()
+                }
+            }
+        )
+    }
+
+//    private fun updateRecyclerViewPadding(inputLayoutBottomPadding: Int) {
+//        // Calculate total bottom padding needed for RecyclerView
+//        // This ensures the last message is visible above the input layout
+//        val inputLayoutHeight = binding.layoutChatInput.height
+//        val totalBottomPadding = inputLayoutHeight + inputLayoutBottomPadding
+//
+//        binding.recyclerChat.setPadding(
+//            binding.recyclerChat.paddingLeft,
+//            binding.recyclerChat.paddingTop,
+//            binding.recyclerChat.paddingRight,
+//            totalBottomPadding
+//        )
+//
+//        // Scroll to bottom if there are messages
+//        val messageCount = chatAdapter.itemCount
+//        if (messageCount > 0) {
+//            binding.recyclerChat.post {
+//                binding.recyclerChat.scrollToPosition(messageCount - 1)
+//            }
+//        }
+//    }
+
 //        binding.recyclerChat.setPadding(
 //            binding.recyclerChat.paddingLeft,
 //            binding.recyclerChat.paddingTop,
 //            binding.recyclerChat.paddingRight,
 //            binding.layoutChatInput.height + binding.root.rootWindowInsets?.getInsets(WindowInsetsCompat.Type.navigationBars())?.bottom ?: 0
 //        )
+
+    private fun scrollToBottomSmooth() {
+        val messageCount = chatAdapter.itemCount
+        if (messageCount > 0) {
+            binding.recyclerChat.post {
+                // Use smooth scroll to bottom
+                binding.recyclerChat.smoothScrollToPosition(messageCount - 1)
+            }
+        }
     }
 
+    private fun scrollToBottomInstant() {
+        val messageCount = chatAdapter.itemCount
+        if (messageCount > 0) {
+            binding.recyclerChat.post {
+                // Instant scroll for new messages
+                binding.recyclerChat.scrollToPosition(messageCount - 1)
+            }
+        }
+    }
+
+    // Extension function to make padding updates cleaner
+    private fun View.updatePadding(
+        left: Int = paddingLeft,
+        top: Int = paddingTop,
+        right: Int = paddingRight,
+        bottom: Int = paddingBottom
+    ) {
+        setPadding(left, top, right, bottom)
+    }
 
     private fun setupListeners() {
         // Back button
@@ -282,6 +327,11 @@ class ChatStoreActivity : AppCompatActivity() {
             if (message.isNotEmpty() || (currentState != null && currentState.hasAttachment)) {
                 viewModel.sendMessageStore(message)
                 binding.editTextMessage.text.clear()
+
+                // Instantly scroll to show new message
+                binding.recyclerChat.postDelayed({
+                    scrollToBottomInstant()
+                }, 50)
             }
         }
 
@@ -306,33 +356,34 @@ class ChatStoreActivity : AppCompatActivity() {
             override fun afterTextChanged(s: Editable?) {}
         })
 
+        // Focus and show keyboard
         binding.editTextMessage.requestFocus()
-        val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
-        imm.showSoftInput(binding.editTextMessage, InputMethodManager.SHOW_IMPLICIT)
-
+        binding.editTextMessage.post {
+            val imm = getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
+            imm.showSoftInput(binding.editTextMessage, InputMethodManager.SHOW_IMPLICIT)
+        }
     }
 
     private fun observeViewModel() {
         viewModel.chatRoomId.observe(this, Observer { chatRoomId ->
             if (chatRoomId > 0) {
-                // Chat room has been created, now we can join the Socket.IO room
                 viewModel.joinSocketRoom(chatRoomId)
-
-                // Now we can also load chat history
                 viewModel.loadChatHistory(chatRoomId)
                 Log.d(TAG, "Chat Activity started - Chat Room: $chatRoomId")
-
             }
         })
 
-        // Observe state changes using LiveData
         viewModel.state.observe(this, Observer { state ->
-            // Update messages
-            chatAdapter.submitList(state.messages)
+            Log.d(TAG, "State updated - Messages: ${state.messages.size}")
 
-            // Scroll to bottom if new message
-            if (state.messages.isNotEmpty()) {
-                binding.recyclerChat.scrollToPosition(state.messages.size - 1)
+            // Update messages
+            val previousCount = chatAdapter.itemCount
+            chatAdapter.submitList(state.messages) {
+                Log.d(TAG, "Messages submitted to adapter")
+                // Only auto-scroll for new messages or initial load
+                if (previousCount == 0 || state.messages.size > previousCount) {
+                    scrollToBottomInstant()
+                }
             }
 
             // Update product info
@@ -342,7 +393,7 @@ class ChatStoreActivity : AppCompatActivity() {
                 binding.ratingBar.rating = state.productRating
                 binding.tvRating.text = state.productRating.toString()
                 binding.tvSellerName.text = state.storeName
-                binding.tvStoreName.text=state.storeName
+//                binding.tvStoreName.text = state.storeName
 
                 val fullImageUrl = when (val img = state.productImageUrl) {
                     is String -> {
@@ -351,7 +402,6 @@ class ChatStoreActivity : AppCompatActivity() {
                     else -> R.drawable.placeholder_image
                 }
 
-                // Load product image
                 if (!state.productImageUrl.isNullOrEmpty()) {
                     Glide.with(this@ChatStoreActivity)
                         .load(fullImageUrl)
@@ -361,14 +411,11 @@ class ChatStoreActivity : AppCompatActivity() {
                         .into(binding.imgProduct)
                 }
 
-                // Make sure the product section is visible
                 binding.productContainer.visibility = View.VISIBLE
             } else {
-                // Hide the product section if info is missing
                 binding.productContainer.visibility = View.GONE
             }
 
-
             // Update attachment hint
             if (state.hasAttachment) {
                 binding.editTextMessage.hint = getString(R.string.image_attached)
@@ -376,7 +423,6 @@ class ChatStoreActivity : AppCompatActivity() {
                 binding.editTextMessage.hint = getString(R.string.write_message)
             }
 
-
             // Show typing indicator
             binding.tvTypingIndicator.visibility =
                 if (state.isOtherUserTyping) View.VISIBLE else View.GONE
@@ -543,7 +589,9 @@ class ChatStoreActivity : AppCompatActivity() {
             storeName: String? = null,
             chatRoomId: Int = 0,
             storeImage: String? = null,
-            userId: Int
+            userId: Int,
+            userName: String,
+            userImg: String? = null
         ): Intent {
             return Intent(context, ChatStoreActivity::class.java).apply {
                 putExtra(Constants.EXTRA_STORE_ID, storeId)
@@ -553,6 +601,8 @@ class ChatStoreActivity : AppCompatActivity() {
                 putExtra(Constants.EXTRA_PRODUCT_IMAGE, productImage)
                 putExtra(Constants.EXTRA_STORE_IMAGE, storeImage)
                 putExtra(Constants.EXTRA_USER_ID, userId)
+                putExtra(Constants.EXTRA_USER_NAME,userName)
+                putExtra(Constants.EXTRA_USER_IMAGE, userImg)
 
                 // Convert productRating string to float if provided
                 if (productRating != null) {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt
new file mode 100644
index 0000000..8fcc2b9
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt
@@ -0,0 +1,152 @@
+package com.alya.ecommerce_serang.ui.profile.mystore.chat
+
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.recyclerview.widget.DiffUtil
+import androidx.recyclerview.widget.ListAdapter
+import androidx.recyclerview.widget.RecyclerView
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
+import com.alya.ecommerce_serang.R
+import com.alya.ecommerce_serang.databinding.ItemMessageReceivedBinding
+import com.alya.ecommerce_serang.databinding.ItemMessageSentBinding
+import com.alya.ecommerce_serang.ui.chat.ChatUiMessage
+import com.alya.ecommerce_serang.utils.Constants
+import com.bumptech.glide.Glide
+
+class ChatStoreAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMessageDiffCallback()) {
+
+    companion object {
+        private const val VIEW_TYPE_MESSAGE_SENT = 1
+        private const val VIEW_TYPE_MESSAGE_RECEIVED = 2
+    }
+
+    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
+        return if (viewType == VIEW_TYPE_MESSAGE_SENT) {
+            val binding = ItemMessageSentBinding.inflate(
+                LayoutInflater.from(parent.context),
+                parent,
+                false
+            )
+            SentMessageViewHolder(binding)
+        } else {
+            val binding = ItemMessageReceivedBinding.inflate(
+                LayoutInflater.from(parent.context),
+                parent,
+                false
+            )
+            ReceivedMessageViewHolder(binding)
+        }
+    }
+
+    override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
+        val message = getItem(position)
+
+        when (holder.itemViewType) {
+            VIEW_TYPE_MESSAGE_SENT -> (holder as SentMessageViewHolder).bind(message)
+            VIEW_TYPE_MESSAGE_RECEIVED -> (holder as ReceivedMessageViewHolder).bind(message)
+        }
+    }
+
+    override fun getItemViewType(position: Int): Int {
+        val message = getItem(position)
+        return if (message.isSentByMe) {
+            VIEW_TYPE_MESSAGE_SENT
+        } else {
+            VIEW_TYPE_MESSAGE_RECEIVED
+        }
+    }
+
+    /**
+     * ViewHolder for messages sent by the current user
+     */
+    inner class SentMessageViewHolder(private val binding: ItemMessageSentBinding) :
+        RecyclerView.ViewHolder(binding.root) {
+
+        fun bind(message: ChatUiMessage) {
+            binding.tvMessage.text = message.message
+            binding.tvTimestamp.text = message.time
+
+            // Show message status
+            val statusIcon = when (message.status) {
+                Constants.STATUS_SENT -> R.drawable.check_single_24
+                Constants.STATUS_DELIVERED -> R.drawable.check_double_24
+                Constants.STATUS_READ -> R.drawable.check_double_read_24
+                else -> R.drawable.check_single_24
+            }
+            binding.imgStatus.setImageResource(statusIcon)
+
+            // Handle attachment if exists
+            if (message.attachment?.isNotEmpty() == true) {
+                binding.imgAttachment.visibility = View.VISIBLE
+
+                val fullImageUrl = when (val img = message.attachment) {
+                    is String -> {
+                        if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                    }
+                    else -> R.drawable.placeholder_image
+                }
+
+                Glide.with(binding.root.context)
+                    .load(fullImageUrl)
+                    .centerCrop()
+                    .placeholder(R.drawable.placeholder_image)
+                    .error(R.drawable.placeholder_image)
+                    .into(binding.imgAttachment)
+            } else {
+                binding.imgAttachment.visibility = View.GONE
+            }
+        }
+    }
+
+    /**
+     * ViewHolder for messages received from other users
+     */
+    inner class ReceivedMessageViewHolder(private val binding: ItemMessageReceivedBinding) :
+        RecyclerView.ViewHolder(binding.root) {
+
+        fun bind(message: ChatUiMessage) {
+            binding.tvMessage.text = message.message
+            binding.tvTimestamp.text = message.time
+
+            // Handle attachment if exists
+            val fullImageUrl = when (val img = message.attachment) {
+                is String -> {
+                    if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                }
+                else -> R.drawable.placeholder_image
+            }
+
+            if (message.attachment?.isNotEmpty() == true) {
+                binding.imgAttachment.visibility = View.VISIBLE
+                Glide.with(binding.root.context)
+                    .load(fullImageUrl)
+                    .centerCrop()
+                    .placeholder(R.drawable.placeholder_image)
+                    .error(R.drawable.placeholder_image)
+                    .into(binding.imgAttachment)
+            } else {
+                binding.imgAttachment.visibility = View.GONE
+            }
+
+            // Load avatar image
+            Glide.with(binding.root.context)
+                .load(R.drawable.placeholder_image) // Replace with actual avatar URL if available
+                .circleCrop()
+                .into(binding.imgAvatar)
+        }
+    }
+}
+
+/**
+ * DiffUtil callback for optimizing RecyclerView updates
+ */
+class ChatMessageDiffCallback : DiffUtil.ItemCallback<ChatUiMessage>() {
+    override fun areItemsTheSame(oldItem: ChatUiMessage, newItem: ChatUiMessage): Boolean {
+        return oldItem.id == newItem.id
+    }
+
+    override fun areContentsTheSame(oldItem: ChatUiMessage, newItem: ChatUiMessage): Boolean {
+        return oldItem == newItem
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreListAdapter.kt
similarity index 92%
rename from app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt
rename to app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreListAdapter.kt
index dd42766..8d5f471 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreListAdapter.kt
@@ -13,20 +13,20 @@ import java.util.Date
 import java.util.Locale
 import java.util.TimeZone
 
-class ChatListAdapter(
+class ChatStoreListAdapter(
     private val chatList: List<ChatItemList>,
     private val onClick: (ChatItemList) -> Unit
-) : RecyclerView.Adapter<ChatListAdapter.ChatViewHolder>() {
+) : RecyclerView.Adapter<ChatStoreListAdapter.ChatViewHolder>() {
 
     inner class ChatViewHolder(private val binding: ItemChatBinding) :
         RecyclerView.ViewHolder(binding.root) {
         fun bind(chat: ChatItemList) {
-            binding.txtStoreName.text = chat.storeName
+            binding.txtStoreName.text = chat.userName
             binding.txtMessage.text = chat.message
             binding.txtTime.text = formatTime(chat.latestMessageTime)
 
             // Process image URL properly
-            val imageUrl = chat.storeImage?.let {
+            val imageUrl = chat.userImage?.let {
                 if (it.startsWith("/")) BASE_URL + it else it
             }
 
diff --git a/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt b/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt
index 4ec6689..13f2c58 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/utils/Constants.kt
@@ -22,6 +22,11 @@ object Constants {
     const val EXTRA_PRODUCT_RATING = "product_rating"
     const val EXTRA_STORE_IMAGE = "store_image"
     const val EXTRA_USER_ID = "user_id"
+    const val EXTRA_USER_NAME = "user_name"
+    const val EXTRA_USER_IMAGE = "user_image"
+    const val EXTRA_ATTACH_PRODUCT = "extra_attach_product"
+
+
 
     // Request codes
     const val REQUEST_IMAGE_PICK = 1001
diff --git a/app/src/main/res/drawable/bg_product_bubble.xml b/app/src/main/res/drawable/bg_product_bubble.xml
new file mode 100644
index 0000000..024858f
--- /dev/null
+++ b/app/src/main/res/drawable/bg_product_bubble.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="#F5F5F5" />
+    <corners android:radius="8dp" />
+    <stroke
+        android:width="1dp"
+        android:color="#E0E0E0" />
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/bg_product_normal.xml b/app/src/main/res/drawable/bg_product_normal.xml
new file mode 100644
index 0000000..ce46e64
--- /dev/null
+++ b/app/src/main/res/drawable/bg_product_normal.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="#FFFFFF" />
+    <corners android:radius="8dp" />
+    <stroke
+        android:width="1dp"
+        android:color="#E0E0E0" />
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/bg_product_selected.xml b/app/src/main/res/drawable/bg_product_selected.xml
new file mode 100644
index 0000000..907f113
--- /dev/null
+++ b/app/src/main/res/drawable/bg_product_selected.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="#E3F2FD" />
+    <corners android:radius="8dp" />
+    <stroke
+        android:width="2dp"
+        android:color="#2196F3" />
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/layout/item_message_product_received.xml b/app/src/main/res/layout/item_message_product_received.xml
new file mode 100644
index 0000000..8b6e8a8
--- /dev/null
+++ b/app/src/main/res/layout/item_message_product_received.xml
@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingStart="8dp"
+    android:paddingTop="4dp"
+    android:paddingEnd="60dp"
+    android:paddingBottom="4dp">
+
+    <!-- Product bubble only - no text message -->
+    <LinearLayout
+        android:id="@+id/layoutMessage"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="8dp"
+        android:background="@drawable/bg_message_received"
+        android:orientation="vertical"
+        android:maxWidth="280dp"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent">
+
+        <!-- Product card with horizontal layout -->
+        <LinearLayout
+            android:id="@+id/layoutProduct"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="horizontal"
+            android:padding="12dp"
+            android:background="@android:color/transparent">
+
+            <ImageView
+                android:id="@+id/imgProduct"
+                android:layout_width="60dp"
+                android:layout_height="60dp"
+                android:scaleType="centerCrop"
+                android:background="@drawable/bg_product_inactive"
+                android:src="@drawable/placeholder_image" />
+
+            <LinearLayout
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"
+                android:layout_marginStart="12dp"
+                android:orientation="vertical"
+                android:layout_gravity="center_vertical">
+
+                <TextView
+                    android:id="@+id/tvProductName"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:text="Claude AI Pro - Solusi AI Canggih 1 Bulan"
+                    android:textColor="@android:color/black"
+                    android:textSize="14sp"
+                    android:textStyle="bold"
+                    android:maxLines="2"
+                    android:ellipsize="end" />
+
+                <TextView
+                    android:id="@+id/tvProductPrice"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:text="Rp25.000"
+                    android:textColor="#E91E63"
+                    android:textSize="16sp"
+                    android:textStyle="bold"
+                    android:layout_marginTop="4dp" />
+
+            </LinearLayout>
+        </LinearLayout>
+
+    </LinearLayout>
+
+    <TextView
+        android:id="@+id/tvTimestamp"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="4dp"
+        android:layout_marginTop="2dp"
+        android:textColor="#888888"
+        android:textSize="10sp"
+        app:layout_constraintStart_toStartOf="@+id/layoutMessage"
+        app:layout_constraintTop_toBottomOf="@+id/layoutMessage"
+        tools:text="15:36" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/item_message_product_sent.xml b/app/src/main/res/layout/item_message_product_sent.xml
new file mode 100644
index 0000000..d6ad233
--- /dev/null
+++ b/app/src/main/res/layout/item_message_product_sent.xml
@@ -0,0 +1,95 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingStart="60dp"
+    android:paddingTop="4dp"
+    android:paddingEnd="8dp"
+    android:paddingBottom="4dp">
+
+    <!-- Product bubble only - no text message -->
+    <LinearLayout
+        android:id="@+id/layoutMessage"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:background="@drawable/bg_message_sent"
+        android:orientation="vertical"
+        android:maxWidth="280dp"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="parent">
+
+        <!-- Product card with horizontal layout -->
+        <LinearLayout
+            android:id="@+id/layoutProduct"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="horizontal"
+            android:padding="12dp"
+            android:background="@android:color/transparent">
+
+            <ImageView
+                android:id="@+id/imgProduct"
+                android:layout_width="60dp"
+                android:layout_height="60dp"
+                android:scaleType="centerCrop"
+                android:background="@drawable/bg_product_inactive"
+                android:src="@drawable/placeholder_image" />
+
+            <LinearLayout
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"
+                android:layout_marginStart="12dp"
+                android:orientation="vertical"
+                android:layout_gravity="center_vertical">
+
+                <TextView
+                    android:id="@+id/tvProductName"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:text="Claude AI Pro - Solusi AI Canggih 1 Bulan"
+                    android:textColor="@android:color/black"
+                    android:textSize="14sp"
+                    android:textStyle="bold"
+                    android:maxLines="2"
+                    android:ellipsize="end" />
+
+                <TextView
+                    android:id="@+id/tvProductPrice"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:text="Rp25.000"
+                    android:textColor="#E91E63"
+                    android:textSize="16sp"
+                    android:textStyle="bold"
+                    android:layout_marginTop="4dp" />
+
+            </LinearLayout>
+        </LinearLayout>
+
+    </LinearLayout>
+
+    <TextView
+        android:id="@+id/tvTimestamp"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="2dp"
+        android:layout_marginEnd="4dp"
+        android:textColor="#888888"
+        android:textSize="10sp"
+        app:layout_constraintEnd_toStartOf="@+id/imgStatus"
+        app:layout_constraintTop_toBottomOf="@+id/layoutMessage"
+        tools:text="15:35" />
+
+    <ImageView
+        android:id="@+id/imgStatus"
+        android:layout_width="16dp"
+        android:layout_height="16dp"
+        android:src="@drawable/check_double_24"
+        app:layout_constraintBottom_toBottomOf="@+id/tvTimestamp"
+        app:layout_constraintEnd_toEndOf="@+id/layoutMessage"
+        app:layout_constraintTop_toTopOf="@+id/tvTimestamp" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file

From b9f387a6267af2a9d95e6169341f3ec20765da59 Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Thu, 29 May 2025 02:49:02 +0700
Subject: [PATCH 07/10] delete chatliststore and chatstoreadapter

---
 .../mystore/chat/ChatListStoreFragment.kt     |  96 -----------
 .../profile/mystore/chat/ChatStoreAdapter.kt  | 152 ------------------
 2 files changed, 248 deletions(-)
 delete mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt
 delete mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt

diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt
deleted file mode 100644
index 3e8e0b6..0000000
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatListStoreFragment.kt
+++ /dev/null
@@ -1,96 +0,0 @@
-//package com.alya.ecommerce_serang.ui.profile.mystore.chat
-//
-//import android.os.Bundle
-//import android.view.LayoutInflater
-//import android.view.View
-//import android.view.ViewGroup
-//import android.widget.Toast
-//import androidx.fragment.app.Fragment
-//import androidx.fragment.app.viewModels
-//import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
-//import com.alya.ecommerce_serang.data.repository.ChatRepository
-//import com.alya.ecommerce_serang.data.repository.Result
-//import com.alya.ecommerce_serang.databinding.FragmentChatListBinding
-//import com.alya.ecommerce_serang.ui.chat.ChatViewModel
-//import com.alya.ecommerce_serang.ui.chat.SocketIOService
-//import com.alya.ecommerce_serang.utils.BaseViewModelFactory
-//import com.alya.ecommerce_serang.utils.SessionManager
-//
-//class ChatListStoreFragment : Fragment() {
-//
-//    private var _binding: FragmentChatListBinding? = null
-//
-//    private val  binding get() = _binding!!
-//    private lateinit var socketService: SocketIOService
-//    private lateinit var sessionManager: SessionManager
-//
-//    private val viewModel: com.alya.ecommerce_serang.ui.chat.ChatViewModel by viewModels {
-//        BaseViewModelFactory {
-//            val apiService = ApiConfig.getApiService(sessionManager)
-//            val chatRepository = ChatRepository(apiService)
-//            ChatViewModel(chatRepository, socketService, sessionManager)
-//        }
-//    }
-//    override fun onCreate(savedInstanceState: Bundle?) {
-//        super.onCreate(savedInstanceState)
-//        sessionManager = SessionManager(requireContext())
-//        socketService = SocketIOService(sessionManager)
-//
-//    }
-//
-//    override fun onCreateView(
-//        inflater: LayoutInflater, container: ViewGroup?,
-//        savedInstanceState: Bundle?
-//    ): View {
-//        _binding = FragmentChatListBinding.inflate(inflater, container, false)
-//        return _binding!!.root
-//    }
-//
-//    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
-//        super.onViewCreated(view, savedInstanceState)
-//
-//        viewModel.getChatListStore()
-//        observeChatList()
-//    }
-//
-//    private fun observeChatList() {
-//        viewModel.chatListStore.observe(viewLifecycleOwner) { result ->
-//            when (result) {
-//                is Result.Success -> {
-//                    val adapter = ChatListAdapter(result.data) { chatItem ->
-//                        // Use the ChatActivity.createIntent factory method for proper navigation
-//                        ChatStoreActivity.createIntent(
-//                            context = requireActivity(),
-//                            storeId = chatItem.storeId,
-//                            productId = 0, // Default value since we don't have it in ChatListItem
-//                            productName = null, // Null is acceptable as per ChatActivity
-//                            productPrice = "",
-//                            productImage = null,
-//                            productRating = null,
-//                            storeName = chatItem.storeName,
-//                            chatRoomId = chatItem.chatRoomId,
-//                            storeImage = chatItem.storeImage
-//                        )
-//                    }
-//                    binding.chatListRecyclerView.adapter = adapter
-//                }
-//                is Result.Error -> {
-//                    Toast.makeText(requireContext(), "Failed to load chats", Toast.LENGTH_SHORT).show()
-//                }
-//                Result.Loading -> {
-//                    // Optional: show progress bar
-//                }
-//            }
-//        }
-//    }
-//
-//
-//    override fun onDestroyView() {
-//        super.onDestroyView()
-//        _binding = null
-//    }
-//
-//    companion object{
-//
-//    }
-//}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt
deleted file mode 100644
index 8fcc2b9..0000000
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/chat/ChatStoreAdapter.kt
+++ /dev/null
@@ -1,152 +0,0 @@
-package com.alya.ecommerce_serang.ui.profile.mystore.chat
-
-import android.view.LayoutInflater
-import android.view.View
-import android.view.ViewGroup
-import androidx.recyclerview.widget.DiffUtil
-import androidx.recyclerview.widget.ListAdapter
-import androidx.recyclerview.widget.RecyclerView
-import com.alya.ecommerce_serang.BuildConfig.BASE_URL
-import com.alya.ecommerce_serang.R
-import com.alya.ecommerce_serang.databinding.ItemMessageReceivedBinding
-import com.alya.ecommerce_serang.databinding.ItemMessageSentBinding
-import com.alya.ecommerce_serang.ui.chat.ChatUiMessage
-import com.alya.ecommerce_serang.utils.Constants
-import com.bumptech.glide.Glide
-
-class ChatStoreAdapter : ListAdapter<ChatUiMessage, RecyclerView.ViewHolder>(ChatMessageDiffCallback()) {
-
-    companion object {
-        private const val VIEW_TYPE_MESSAGE_SENT = 1
-        private const val VIEW_TYPE_MESSAGE_RECEIVED = 2
-    }
-
-    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
-        return if (viewType == VIEW_TYPE_MESSAGE_SENT) {
-            val binding = ItemMessageSentBinding.inflate(
-                LayoutInflater.from(parent.context),
-                parent,
-                false
-            )
-            SentMessageViewHolder(binding)
-        } else {
-            val binding = ItemMessageReceivedBinding.inflate(
-                LayoutInflater.from(parent.context),
-                parent,
-                false
-            )
-            ReceivedMessageViewHolder(binding)
-        }
-    }
-
-    override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
-        val message = getItem(position)
-
-        when (holder.itemViewType) {
-            VIEW_TYPE_MESSAGE_SENT -> (holder as SentMessageViewHolder).bind(message)
-            VIEW_TYPE_MESSAGE_RECEIVED -> (holder as ReceivedMessageViewHolder).bind(message)
-        }
-    }
-
-    override fun getItemViewType(position: Int): Int {
-        val message = getItem(position)
-        return if (message.isSentByMe) {
-            VIEW_TYPE_MESSAGE_SENT
-        } else {
-            VIEW_TYPE_MESSAGE_RECEIVED
-        }
-    }
-
-    /**
-     * ViewHolder for messages sent by the current user
-     */
-    inner class SentMessageViewHolder(private val binding: ItemMessageSentBinding) :
-        RecyclerView.ViewHolder(binding.root) {
-
-        fun bind(message: ChatUiMessage) {
-            binding.tvMessage.text = message.message
-            binding.tvTimestamp.text = message.time
-
-            // Show message status
-            val statusIcon = when (message.status) {
-                Constants.STATUS_SENT -> R.drawable.check_single_24
-                Constants.STATUS_DELIVERED -> R.drawable.check_double_24
-                Constants.STATUS_READ -> R.drawable.check_double_read_24
-                else -> R.drawable.check_single_24
-            }
-            binding.imgStatus.setImageResource(statusIcon)
-
-            // Handle attachment if exists
-            if (message.attachment?.isNotEmpty() == true) {
-                binding.imgAttachment.visibility = View.VISIBLE
-
-                val fullImageUrl = when (val img = message.attachment) {
-                    is String -> {
-                        if (img.startsWith("/")) BASE_URL + img.substring(1) else img
-                    }
-                    else -> R.drawable.placeholder_image
-                }
-
-                Glide.with(binding.root.context)
-                    .load(fullImageUrl)
-                    .centerCrop()
-                    .placeholder(R.drawable.placeholder_image)
-                    .error(R.drawable.placeholder_image)
-                    .into(binding.imgAttachment)
-            } else {
-                binding.imgAttachment.visibility = View.GONE
-            }
-        }
-    }
-
-    /**
-     * ViewHolder for messages received from other users
-     */
-    inner class ReceivedMessageViewHolder(private val binding: ItemMessageReceivedBinding) :
-        RecyclerView.ViewHolder(binding.root) {
-
-        fun bind(message: ChatUiMessage) {
-            binding.tvMessage.text = message.message
-            binding.tvTimestamp.text = message.time
-
-            // Handle attachment if exists
-            val fullImageUrl = when (val img = message.attachment) {
-                is String -> {
-                    if (img.startsWith("/")) BASE_URL + img.substring(1) else img
-                }
-                else -> R.drawable.placeholder_image
-            }
-
-            if (message.attachment?.isNotEmpty() == true) {
-                binding.imgAttachment.visibility = View.VISIBLE
-                Glide.with(binding.root.context)
-                    .load(fullImageUrl)
-                    .centerCrop()
-                    .placeholder(R.drawable.placeholder_image)
-                    .error(R.drawable.placeholder_image)
-                    .into(binding.imgAttachment)
-            } else {
-                binding.imgAttachment.visibility = View.GONE
-            }
-
-            // Load avatar image
-            Glide.with(binding.root.context)
-                .load(R.drawable.placeholder_image) // Replace with actual avatar URL if available
-                .circleCrop()
-                .into(binding.imgAvatar)
-        }
-    }
-}
-
-/**
- * DiffUtil callback for optimizing RecyclerView updates
- */
-class ChatMessageDiffCallback : DiffUtil.ItemCallback<ChatUiMessage>() {
-    override fun areItemsTheSame(oldItem: ChatUiMessage, newItem: ChatUiMessage): Boolean {
-        return oldItem.id == newItem.id
-    }
-
-    override fun areContentsTheSame(oldItem: ChatUiMessage, newItem: ChatUiMessage): Boolean {
-        return oldItem == newItem
-    }
-}
\ No newline at end of file

From e2d909d21864eddb2095301ac07905a582fcf88f Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Thu, 29 May 2025 16:39:50 +0700
Subject: [PATCH 08/10] update payment and add evidence

---
 app/src/main/AndroidManifest.xml              |   5 +-
 .../data/repository/ProductRepository.kt      |  52 ++++
 .../ecommerce_serang/ui/home/HomeFragment.kt  |   6 +-
 .../ui/home/SearchResultAdapter.kt            |   8 +-
 .../detail/AddEvidencePaymentActivity.kt      | 239 ++++++++++++------
 .../ui/order/detail/PaymentActivity.kt        | 103 +++++---
 .../category/CategoryProductsActivity.kt      | 188 ++++++++++++++
 .../category/CategoryProductsViewModel.kt     |  49 ++++
 .../category/ProductsCategoryAdapter.kt       |  73 ++++++
 .../res/layout/activity_category_products.xml | 178 +++++++++++++
 app/src/main/res/layout/activity_payment.xml  |  15 +-
 app/src/main/res/layout/item_product_grid.xml | 115 +++++----
 app/src/main/res/values/colors.xml            |   2 +
 13 files changed, 862 insertions(+), 171 deletions(-)
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsActivity.kt
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsViewModel.kt
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/ui/product/category/ProductsCategoryAdapter.kt
 create mode 100644 app/src/main/res/layout/activity_category_products.xml

diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index ddbfa98..cedc9c4 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -29,6 +29,9 @@
         android:theme="@style/Theme.Ecommerce_serang"
         android:usesCleartextTraffic="true"
         tools:targetApi="31">
+        <activity
+            android:name=".ui.product.category.CategoryProductsActivity"
+            android:exported="false" />
         <activity
             android:name=".ui.profile.mystore.chat.ChatListStoreActivity"
             android:exported="false" />
@@ -76,11 +79,11 @@
             android:enabled="true"
             android:exported="false"
             android:foregroundServiceType="dataSync" />
+
         <activity
             android:name=".ui.profile.mystore.chat.ChatStoreActivity"
             android:exported="false"
             android:windowSoftInputMode="adjustResize" />
-
         <activity
             android:name=".ui.profile.mystore.profile.shipping_service.ShippingServiceActivity"
             android:exported="false" />
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ProductRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ProductRepository.kt
index 85aae9e..3c31d1a 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/ProductRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/ProductRepository.kt
@@ -286,6 +286,58 @@ class ProductRepository(private val apiService: ApiService) {
         }
     }
 
+    suspend fun getProductsByCategory(categoryId: Int): Result<List<ProductsItem>> =
+        withContext(Dispatchers.IO) {
+            try {
+                Log.d(TAG, "Attempting to fetch products for category: $categoryId")
+                val response = apiService.getAllProduct()
+
+                if (response.isSuccessful) {
+                    val allProducts = response.body()?.products ?: emptyList()
+
+                    // Filter products by category_id
+                    val filteredProducts = allProducts.filter { product ->
+                        product.categoryId == categoryId
+                    }
+
+                    Log.d(TAG, "Filtered products for category $categoryId: ${filteredProducts.size} products")
+
+                    Result.Success(filteredProducts)
+                } else {
+                    val errorBody = response.errorBody()?.string() ?: "Unknown error"
+                    Log.e(TAG, "Failed to fetch products. Code: ${response.code()}, Error: $errorBody")
+                    Result.Error(Exception("Failed to fetch products. Code: ${response.code()}"))
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception while fetching products by category", e)
+                Result.Error(e)
+            }
+        }
+
+    // Optional: Get category by ID if needed
+    suspend fun getCategoryById(categoryId: Int): Result<CategoryItem?> =
+        withContext(Dispatchers.IO) {
+            try {
+                Log.d(TAG, "Attempting to fetch category: $categoryId")
+                val response = apiService.allCategory()
+
+                if (response.isSuccessful) {
+                    val categories = response.body()?.category ?: emptyList()
+                    val category = categories.find { it.id == categoryId }
+
+                    Log.d(TAG, "Category found: ${category?.name}")
+                    Result.Success(category)
+                } else {
+                    val errorBody = response.errorBody()?.string() ?: "Unknown error"
+                    Log.e(TAG, "Failed to fetch category. Code: ${response.code()}, Error: $errorBody")
+                    Result.Error(Exception("Failed to fetch category. Code: ${response.code()}"))
+                }
+            } catch (e: Exception) {
+                Log.e(TAG, "Exception while fetching category by ID", e)
+                Result.Error(e)
+            }
+        }
+
     companion object {
         private const val TAG = "ProductRepository"
     }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt
index a902329..db00d1b 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt
@@ -24,6 +24,7 @@ import com.alya.ecommerce_serang.databinding.FragmentHomeBinding
 import com.alya.ecommerce_serang.ui.cart.CartActivity
 import com.alya.ecommerce_serang.ui.notif.NotificationActivity
 import com.alya.ecommerce_serang.ui.product.DetailProductActivity
+import com.alya.ecommerce_serang.ui.product.category.CategoryProductsActivity
 import com.alya.ecommerce_serang.utils.BaseViewModelFactory
 import com.alya.ecommerce_serang.utils.HorizontalMarginItemDecoration
 import com.alya.ecommerce_serang.utils.SessionManager
@@ -211,7 +212,10 @@ class HomeFragment : Fragment() {
     }
 
     private fun handleCategoryProduct(category: CategoryItem) {
-        // Your implementation
+        // Navigate to CategoryProductsActivity when category is clicked
+        val intent = Intent(requireContext(), CategoryProductsActivity::class.java)
+        intent.putExtra(CategoryProductsActivity.EXTRA_CATEGORY, category)
+        startActivity(intent)
     }
 
     override fun onDestroyView() {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/home/SearchResultAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/home/SearchResultAdapter.kt
index 7a95fdc..555976f 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/home/SearchResultAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/home/SearchResultAdapter.kt
@@ -42,19 +42,19 @@ class SearchResultsAdapter(
         }
 
         fun bind(product: ProductsItem) {
-            binding.productName.text = product.name
-            binding.productPrice.text = (product.price)
+            binding.tvProductName.text = product.name
+            binding.tvProductPrice.text = (product.price)
 
             // Load image with Glide
             Glide.with(binding.root.context)
                 .load(product.image)
                 .placeholder(R.drawable.placeholder_image)
 //                .error(R.drawable.error_image)
-                .into(binding.productImage)
+                .into(binding.ivProductImage)
 
             // Set store name if available
             product.storeId?.toString().let {
-                binding.storeName.text = it
+                binding.tvStoreName.text = it
             }
         }
     }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/AddEvidencePaymentActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/AddEvidencePaymentActivity.kt
index 77d4e91..fc37df7 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/AddEvidencePaymentActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/AddEvidencePaymentActivity.kt
@@ -2,11 +2,14 @@ package com.alya.ecommerce_serang.ui.order.detail
 
 import android.Manifest
 import android.R
+import android.app.Activity
 import android.app.DatePickerDialog
+import android.content.Intent
 import android.content.pm.PackageManager
 import android.graphics.BitmapFactory
 import android.net.Uri
 import android.os.Bundle
+import android.provider.MediaStore
 import android.util.Log
 import android.view.View
 import android.webkit.MimeTypeMap
@@ -46,6 +49,7 @@ class AddEvidencePaymentActivity : AppCompatActivity() {
     private lateinit var productPrice: String
     private var selectedImageUri: Uri? = null
 
+
     private val viewModel: PaymentViewModel by viewModels {
         BaseViewModelFactory {
             val apiService = ApiConfig.getApiService(sessionManager)
@@ -62,55 +66,65 @@ class AddEvidencePaymentActivity : AppCompatActivity() {
         "Cash on Delivery"
     )
 
-    private val getContent = registerForActivityResult(ActivityResultContracts.GetContent()) { uri: Uri? ->
-        uri?.let {
-            selectedImageUri = it
-            binding.ivUploadedImage.setImageURI(selectedImageUri)
-            binding.ivUploadedImage.visibility = View.VISIBLE
-            binding.layoutUploadPlaceholder.visibility = View.GONE
+//    private val getContent = registerForActivityResult(ActivityResultContracts.GetContent()) { uri: Uri? ->
+//        uri?.let {
+//            selectedImageUri = it
+//            binding.ivUploadedImage.setImageURI(selectedImageUri)
+//            binding.ivUploadedImage.visibility = View.VISIBLE
+//            binding.layoutUploadPlaceholder.visibility = View.GONE
+//        }
+//    }
+
+    private val pickImageLauncher = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result ->
+        if (result.resultCode == Activity.RESULT_OK) {
+            result.data?.data?.let { uri ->
+                handleSelectedImage(uri)
+            }
         }
     }
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
-        binding = ActivityAddEvidencePaymentBinding.inflate(layoutInflater)
-        setContentView(binding.root)
 
-        sessionManager = SessionManager(this)
+        try {
+            binding = ActivityAddEvidencePaymentBinding.inflate(layoutInflater)
+            setContentView(binding.root)
 
-        intent.extras?.let { bundle ->
-            orderId = bundle.getInt("ORDER_ID", 0)
-            paymentInfoId = bundle.getInt("PAYMENT_INFO_ID", 0)
-            productPrice = intent.getStringExtra("TOTAL_AMOUNT") ?: "Rp0"
+            sessionManager = SessionManager(this)
 
+            intent.extras?.let { bundle ->
+                orderId = bundle.getInt("ORDER_ID", 0)
+                paymentInfoId = bundle.getInt("PAYMENT_INFO_ID", 0)
+                productPrice = intent.getStringExtra("TOTAL_AMOUNT") ?: "Rp0"
+                Log.d(TAG, "Intent data: OrderID=$orderId, PaymentInfoId=$paymentInfoId, Price=$productPrice")
+            }
+
+            WindowCompat.setDecorFitsSystemWindows(window, false)
+            enableEdgeToEdge()
+
+            ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+                val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+                view.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
+                windowInsets
+            }
+
+            Log.d(TAG, "7. About to setup toolbar - COMMENTING OUT PROBLEMATIC LINE")
+            // COMMENT OUT THIS LINE TEMPORARILY:
+//             binding.toolbar.navigationIcon.apply { finish() }
+
+            setupUI()
+
+            viewModel.getOrderDetails(orderId)
+
+            setupListeners()
+            setupObservers()
+
+        } catch (e: Exception) {
+            Log.e(TAG, "ERROR in AddEvidencePaymentActivity onCreate: ${e.message}", e)
+            Toast.makeText(this, "Error: ${e.message}", Toast.LENGTH_LONG).show()
         }
-
-        WindowCompat.setDecorFitsSystemWindows(window, false)
-
-        enableEdgeToEdge()
-
-        // Apply insets to your root layout
-        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
-            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
-            view.setPadding(
-                systemBars.left,
-                systemBars.top,
-                systemBars.right,
-                systemBars.bottom
-            )
-            windowInsets
-        }
-
-        binding.toolbar.navigationIcon.apply {
-            onBackPressed()
-        }
-
-        setupUI()
-        viewModel.getOrderDetails(orderId)
-
-
-        setupListeners()
-        setupObservers()
     }
 
     private fun setupUI() {
@@ -126,11 +140,11 @@ class AddEvidencePaymentActivity : AppCompatActivity() {
 
         // Upload image button
         binding.tvAddPhoto.setOnClickListener {
-            checkPermissionAndPickImage()
+            checkPermissionsAndShowImagePicker()
         }
 
         binding.frameUploadImage.setOnClickListener {
-            checkPermissionAndPickImage()
+            checkPermissionsAndShowImagePicker()
         }
 
         // Date picker
@@ -158,6 +172,7 @@ class AddEvidencePaymentActivity : AppCompatActivity() {
         // Submit button
         binding.btnSubmit.setOnClickListener {
             validateAndUpload()
+            Log.d(TAG, "AddEvidencePaymentActivity onCreate completed")
         }
     }
 
@@ -182,6 +197,112 @@ class AddEvidencePaymentActivity : AppCompatActivity() {
         }
     }
 
+    private fun checkPermissionsAndShowImagePicker() {
+        if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.TIRAMISU) {
+            // For Android 13+ (API 33+), use READ_MEDIA_IMAGES
+            if (ContextCompat.checkSelfPermission(this, Manifest.permission.READ_MEDIA_IMAGES) != PackageManager.PERMISSION_GRANTED) {
+                ActivityCompat.requestPermissions(this, arrayOf(Manifest.permission.READ_MEDIA_IMAGES), REQUEST_CODE_STORAGE_PERMISSION)
+            } else {
+                showImagePickerOptions()
+            }
+        } else {
+            // For older versions, use READ_EXTERNAL_STORAGE
+            if (ContextCompat.checkSelfPermission(this, Manifest.permission.READ_EXTERNAL_STORAGE) != PackageManager.PERMISSION_GRANTED) {
+                ActivityCompat.requestPermissions(this, arrayOf(Manifest.permission.READ_EXTERNAL_STORAGE), REQUEST_CODE_STORAGE_PERMISSION)
+            } else {
+                showImagePickerOptions()
+            }
+        }
+    }
+
+    // Exact same approach as ChatActivity
+    private fun showImagePickerOptions() {
+        val options = arrayOf(
+            "Pilih dari Galeri",
+            "Batal"
+        )
+
+        androidx.appcompat.app.AlertDialog.Builder(this)
+            .setTitle("Pilih Bukti Pembayaran")
+            .setItems(options) { dialog, which ->
+                when (which) {
+                    0 -> openGallery() // Gallery
+                    1 -> dialog.dismiss() // Cancel
+                }
+            }
+            .show()
+    }
+
+    // Using the same gallery opening method as ChatActivity
+    private fun openGallery() {
+        try {
+            val intent = Intent(Intent.ACTION_PICK, MediaStore.Images.Media.EXTERNAL_CONTENT_URI)
+            pickImageLauncher.launch(intent)
+        } catch (e: Exception) {
+            Log.e(TAG, "Error opening gallery", e)
+            Toast.makeText(this, "Gagal membuka galeri", Toast.LENGTH_SHORT).show()
+        }
+    }
+
+    private fun handleSelectedImage(uri: Uri) {
+        try {
+            Log.d(TAG, "Processing selected image: $uri")
+
+            // Use the same copy-to-cache approach as ChatActivity
+            contentResolver.openInputStream(uri)?.use { inputStream ->
+                val fileName = "evidence_${System.currentTimeMillis()}.jpg"
+                val outputFile = File(cacheDir, fileName)
+
+                outputFile.outputStream().use { outputStream ->
+                    inputStream.copyTo(outputStream)
+                }
+
+                if (outputFile.exists() && outputFile.length() > 0) {
+                    // Check file size (max 5MB like ChatActivity)
+                    if (outputFile.length() > 5 * 1024 * 1024) {
+                        Log.e(TAG, "File too large: ${outputFile.length()} bytes")
+                        Toast.makeText(this, "Gambar terlalu besar (maksimal 5MB)", Toast.LENGTH_SHORT).show()
+                        outputFile.delete()
+                        return
+                    }
+
+                    // Success - update UI
+                    selectedImageUri = Uri.fromFile(outputFile)
+                    binding.ivUploadedImage.setImageURI(selectedImageUri)
+                    binding.ivUploadedImage.visibility = View.VISIBLE
+                    binding.layoutUploadPlaceholder.visibility = View.GONE
+
+                    Log.d(TAG, "Image processed successfully: ${outputFile.absolutePath}, size: ${outputFile.length()}")
+                    Toast.makeText(this, "Gambar berhasil dipilih", Toast.LENGTH_SHORT).show()
+                } else {
+                    Log.e(TAG, "Failed to create image file")
+                    Toast.makeText(this, "Gagal memproses gambar", Toast.LENGTH_SHORT).show()
+                }
+            } ?: run {
+                Log.e(TAG, "Could not open input stream for URI: $uri")
+                Toast.makeText(this, "Tidak dapat mengakses gambar", Toast.LENGTH_SHORT).show()
+            }
+        } catch (e: Exception) {
+            Log.e(TAG, "Error handling selected image", e)
+            Toast.makeText(this, "Error: ${e.message}", Toast.LENGTH_SHORT).show()
+        }
+    }
+
+    override fun onRequestPermissionsResult(
+        requestCode: Int,
+        permissions: Array<out String>,
+        grantResults: IntArray
+    ) {
+        super.onRequestPermissionsResult(requestCode, permissions, grantResults)
+        if (requestCode == REQUEST_CODE_STORAGE_PERMISSION) {
+            if (grantResults.isNotEmpty() && grantResults[0] == PackageManager.PERMISSION_GRANTED) {
+                showImagePickerOptions()
+            } else {
+                Toast.makeText(this, "Izin diperlukan untuk mengakses galeri", Toast.LENGTH_SHORT).show()
+            }
+        }
+    }
+
     private fun validateAndUpload() {
         // Validate all fields
         if (selectedImageUri == null) {
@@ -301,40 +422,6 @@ class AddEvidencePaymentActivity : AppCompatActivity() {
     }
 
 
-
-
-    private fun checkPermissionAndPickImage() {
-        val permission = if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.TIRAMISU) {
-            Manifest.permission.READ_MEDIA_IMAGES
-        } else {
-            Manifest.permission.READ_EXTERNAL_STORAGE
-        }
-
-        if (ContextCompat.checkSelfPermission(this, permission) != PackageManager.PERMISSION_GRANTED) {
-            ActivityCompat.requestPermissions(this, arrayOf(permission), REQUEST_CODE_STORAGE_PERMISSION)
-        } else {
-            pickImage()
-        }
-    }
-
-    override fun onRequestPermissionsResult(
-        requestCode: Int,
-        permissions: Array<out String>,
-        grantResults: IntArray
-    ) {
-        super.onRequestPermissionsResult(requestCode, permissions, grantResults)
-        if (requestCode == REQUEST_CODE_STORAGE_PERMISSION && grantResults.isNotEmpty() && grantResults[0] == PackageManager.PERMISSION_GRANTED) {
-            pickImage()
-        } else {
-            Toast.makeText(this, "Izin dibutuhkan untuk memilih gambar", Toast.LENGTH_SHORT).show()
-        }
-    }
-
-    private fun pickImage() {
-        getContent.launch("image/*")
-    }
-
-
     private fun showDatePicker() {
         val calendar = Calendar.getInstance()
         val year = calendar.get(Calendar.YEAR)
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/PaymentActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/PaymentActivity.kt
index 72f824e..d2c525a 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/PaymentActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/detail/PaymentActivity.kt
@@ -3,6 +3,7 @@ package com.alya.ecommerce_serang.ui.order.detail
 import android.content.Intent
 import android.os.Bundle
 import android.util.Log
+import android.view.View
 import android.widget.Toast
 import androidx.activity.enableEdgeToEdge
 import androidx.activity.viewModels
@@ -43,65 +44,88 @@ class PaymentActivity : AppCompatActivity() {
 
         sessionManager = SessionManager(this)
 
-        WindowCompat.setDecorFitsSystemWindows(window, false)
+        setupWindowInsets()
 
-        enableEdgeToEdge()
-
-        // Apply insets to your root layout
-        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
-            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
-            view.setPadding(
-                systemBars.left,
-                systemBars.top,
-                systemBars.right,
-                systemBars.bottom
-            )
-            windowInsets
-        }
-
-        // Mengambil data dari intent
+        // Get data from intent
         val orderId = intent.getIntExtra("ORDER_ID", 0)
         val paymentInfoId = intent.getIntExtra("ORDER_PAYMENT_ID", 0)
 
         if (orderId == 0) {
             Toast.makeText(this, "ID pesanan tidak valid", Toast.LENGTH_SHORT).show()
             finish()
+            return
         }
 
-        // Setup toolbar
+        // Setup observers FIRST
+        observeData()
+
+        // Setup UI
+        setupToolbar()
+        setupClickListeners(orderId, paymentInfoId)
+
+        // Load data LAST
+        Log.d(TAG, "Fetching order details for Order ID: $orderId")
+        viewModel.getOrderDetails(orderId)
+    }
+
+    private fun setupWindowInsets() {
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+        enableEdgeToEdge()
+
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
+            windowInsets
+        }
+    }
+
+    private fun setupToolbar() {
         binding.toolbar.setNavigationOnClickListener {
-            onBackPressedDispatcher
             finish()
         }
+    }
 
-        // Setup petunjuk transfer
+    private fun setupClickListeners(orderId: Int, paymentInfoId: Int) {
+        // Instructions clicks
         binding.layoutMBankingInstructions.setOnClickListener {
-            // Tampilkan instruksi mBanking
             showInstructions("mBanking")
         }
 
         binding.layoutATMInstructions.setOnClickListener {
-            // Tampilkan instruksi ATM
             showInstructions("ATM")
         }
 
-        // Setup button upload bukti bayar
-        binding.btnUploadPaymentProof.setOnClickListener {
-//             Intent ke activity upload bukti bayar
-            val intent = Intent(this, AddEvidencePaymentActivity::class.java)
-            intent.putExtra("ORDER_ID", orderId)
-            intent.putExtra("PAYMENT_INFO_ID", paymentInfoId)
-            intent.putExtra("TOTAL_AMOUNT", binding.tvTotalAmount.text.toString())
-            Log.d(TAG, "Received Order ID: $orderId, Payment Info ID: $paymentInfoId, Total Amount: ${binding.tvTotalAmount.text}")
+        // Upload button
+//        binding.btnUploadPaymentProof.setOnClickListener { view ->
+//            Log.d(TAG, "Button clicked - showing toast")
+//            Toast.makeText(this@PaymentActivity, "Button works! OrderID: $orderId", Toast.LENGTH_LONG).show()
+//        }
+        binding.btnUploadPaymentProof.apply {
+            isEnabled = true
+            isClickable = true
 
-            startActivity(intent)
+            setOnClickListener {
+                Log.d(TAG, "Button clicked!")
+
+                val intent = Intent(this@PaymentActivity, AddEvidencePaymentActivity::class.java).apply {
+                    putExtra("ORDER_ID", orderId)
+                    putExtra("PAYMENT_INFO_ID", paymentInfoId)
+                    putExtra("TOTAL_AMOUNT", binding.tvTotalAmount.text.toString())
+                }
+
+                Log.d(TAG, "Starting AddEvidencePaymentActivity with Order ID: $orderId, Payment Info ID: $paymentInfoId")
+                startActivity(intent)
+            }
+
+            // Debug touch events
+            setOnTouchListener { _, event ->
+                Log.d(TAG, "Button touched: ${event.action}")
+                false
+            }
         }
-        // Observe data
-        observeData()
 
-        // Load data
-        Log.d(TAG, "Fetching order details for Order ID: $orderId")
-        viewModel.getOrderDetails(orderId)
+        // Debug button state
+        Log.d(TAG, "Button setup - isEnabled: ${binding.btnUploadPaymentProof.isEnabled}, isClickable: ${binding.btnUploadPaymentProof.isClickable}")
     }
 
     private fun observeData() {
@@ -124,13 +148,14 @@ class PaymentActivity : AppCompatActivity() {
             setupPaymentDueDate(order.updatedAt)
         }
 
-        // Observe loading state
         viewModel.isLoading.observe(this) { isLoading ->
-            // Show loading indicator if needed
-            // binding.progressBar.visibility = if (isLoading) View.VISIBLE else View.GONE
+            Log.d(TAG, "Loading state changed: $isLoading")
+            // Fix this line:
+            binding.progressBar.visibility = if (isLoading) View.VISIBLE else View.GONE
+
+            Log.d(TAG, "Button enabled: ${binding.btnUploadPaymentProof.isEnabled}")
         }
 
-        // Observe error
         viewModel.error.observe(this) { error ->
             if (error.isNotEmpty()) {
                 Toast.makeText(this, error, Toast.LENGTH_SHORT).show()
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsActivity.kt
new file mode 100644
index 0000000..fb80bbb
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsActivity.kt
@@ -0,0 +1,188 @@
+package com.alya.ecommerce_serang.ui.product.category
+
+import android.content.Intent
+import android.os.Bundle
+import android.view.MenuItem
+import androidx.activity.enableEdgeToEdge
+import androidx.activity.viewModels
+import androidx.appcompat.app.AppCompatActivity
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsCompat
+import androidx.core.view.isVisible
+import androidx.lifecycle.Lifecycle
+import androidx.lifecycle.lifecycleScope
+import androidx.lifecycle.repeatOnLifecycle
+import androidx.recyclerview.widget.GridLayoutManager
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
+import com.alya.ecommerce_serang.R
+import com.alya.ecommerce_serang.data.api.dto.CategoryItem
+import com.alya.ecommerce_serang.data.api.dto.ProductsItem
+import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
+import com.alya.ecommerce_serang.data.repository.ProductRepository
+import com.alya.ecommerce_serang.databinding.ActivityCategoryProductsBinding
+import com.alya.ecommerce_serang.ui.product.DetailProductActivity
+import com.alya.ecommerce_serang.utils.BaseViewModelFactory
+import com.alya.ecommerce_serang.utils.SessionManager
+import com.bumptech.glide.Glide
+import kotlinx.coroutines.launch
+
+class CategoryProductsActivity : AppCompatActivity() {
+
+    private lateinit var binding: ActivityCategoryProductsBinding
+    private lateinit var sessionManager: SessionManager
+    private var productsAdapter: ProductsCategoryAdapter? = null
+
+    private val viewModel: CategoryProductsViewModel by viewModels {
+        BaseViewModelFactory {
+            val apiService = ApiConfig.getApiService(sessionManager)
+            val productRepository = ProductRepository(apiService)
+            CategoryProductsViewModel(productRepository)
+        }
+    }
+
+    companion object {
+        const val EXTRA_CATEGORY = "extra_category"
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        binding = ActivityCategoryProductsBinding.inflate(layoutInflater)
+        setContentView(binding.root)
+
+        sessionManager = SessionManager(this)
+
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+
+        enableEdgeToEdge()
+
+        // Apply insets to your root layout
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                systemBars.bottom
+            )
+            windowInsets
+        }
+
+        val category = intent.getParcelableExtra<CategoryItem>(EXTRA_CATEGORY)
+        if (category == null) {
+            finish()
+            return
+        }
+
+        setupUI(category)
+        setupRecyclerView()
+        observeViewModel()
+
+        // Load products for this category using category.id (not store_type_id)
+        viewModel.loadProductsByCategory(category.id)
+    }
+
+    private fun setupUI(category: CategoryItem) {
+        binding.apply {
+            // Setup toolbar
+            setSupportActionBar(toolbar)
+            supportActionBar?.apply {
+                setDisplayHomeAsUpEnabled(true)
+//                title = category.name
+            }
+
+            val fullImageUrl = if (category.image.startsWith("/")) {
+                BASE_URL + category.image.removePrefix("/") // Append base URL if the path starts with "/"
+            } else {
+                category.image // Use as is if it's already a full URL
+            }
+
+            // Load category image
+            Glide.with(this@CategoryProductsActivity)
+                .load(fullImageUrl)
+                .placeholder(R.drawable.placeholder_image)
+                .error(R.drawable.placeholder_image)
+                .into(ivCategoryHeader)
+
+            tvCategoryTitle.text = category.name
+        }
+    }
+
+    private fun setupRecyclerView() {
+        productsAdapter = ProductsCategoryAdapter(
+            products = emptyList(),
+            onClick = { product -> handleProductClick(product) }
+        )
+
+        binding.rvProducts.apply {
+            layoutManager = GridLayoutManager(this@CategoryProductsActivity, 2)
+            adapter = productsAdapter
+//            addItemDecoration(GridSpacingItemDecoration(2, 16, true))
+        }
+    }
+
+    private fun observeViewModel() {
+        lifecycleScope.launch {
+            lifecycle.repeatOnLifecycle(Lifecycle.State.STARTED) {
+                viewModel.uiState.collect { state ->
+                    when (state) {
+                        is CategoryProductsUiState.Loading -> {
+                            binding.progressBar.isVisible = true
+                            binding.rvProducts.isVisible = false
+                            binding.layoutError.isVisible = false
+                            binding.layoutEmpty.isVisible = false
+                        }
+                        is CategoryProductsUiState.Success -> {
+                            binding.progressBar.isVisible = false
+                            binding.layoutError.isVisible = false
+
+                            if (state.products.isEmpty()) {
+                                binding.rvProducts.isVisible = false
+                                binding.layoutEmpty.isVisible = true
+                            } else {
+                                binding.rvProducts.isVisible = true
+                                binding.layoutEmpty.isVisible = false
+                                productsAdapter?.updateProducts(state.products)
+                            }
+                        }
+                        is CategoryProductsUiState.Error -> {
+                            binding.progressBar.isVisible = false
+                            binding.rvProducts.isVisible = false
+                            binding.layoutEmpty.isVisible = false
+                            binding.layoutError.isVisible = true
+                            binding.tvErrorMessage.text = state.message
+
+                            binding.btnRetry.setOnClickListener {
+                                val category = intent.getParcelableExtra<CategoryItem>(
+                                    EXTRA_CATEGORY
+                                )
+                                category?.let { viewModel.loadProductsByCategory(it.id) }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    private fun handleProductClick(product: ProductsItem) {
+        val intent = Intent(this, DetailProductActivity::class.java)
+        intent.putExtra("PRODUCT_ID", product.id)
+        startActivity(intent)
+    }
+
+    override fun onOptionsItemSelected(item: MenuItem): Boolean {
+        return when (item.itemId) {
+            android.R.id.home -> {
+                onBackPressed()
+                true
+            }
+            else -> super.onOptionsItemSelected(item)
+        }
+    }
+
+    override fun onDestroy() {
+        super.onDestroy()
+        productsAdapter = null
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsViewModel.kt
new file mode 100644
index 0000000..91c78a8
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/CategoryProductsViewModel.kt
@@ -0,0 +1,49 @@
+package com.alya.ecommerce_serang.ui.product.category
+
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.viewModelScope
+import com.alya.ecommerce_serang.data.api.dto.ProductsItem
+import com.alya.ecommerce_serang.data.repository.ProductRepository
+import com.alya.ecommerce_serang.data.repository.Result
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.flow.asStateFlow
+import kotlinx.coroutines.launch
+
+class CategoryProductsViewModel(
+    private val productRepository: ProductRepository
+) : ViewModel() {
+
+    private val _uiState = MutableStateFlow<CategoryProductsUiState>(CategoryProductsUiState.Loading)
+    val uiState: StateFlow<CategoryProductsUiState> = _uiState.asStateFlow()
+
+    fun loadProductsByCategory(categoryId: Int) {
+        viewModelScope.launch {
+            _uiState.value = CategoryProductsUiState.Loading
+
+            when (val result = productRepository.getProductsByCategory(categoryId)) {
+                is com.alya.ecommerce_serang.data.repository.Result.Success -> {
+                    _uiState.value = CategoryProductsUiState.Success(result.data)
+                }
+                is com.alya.ecommerce_serang.data.repository.Result.Error -> {
+                    _uiState.value = CategoryProductsUiState.Error(
+                        result.exception.message ?: "Failed to load products"
+                    )
+                }
+                is Result.Loading -> {
+                    // Handle if needed
+                }
+            }
+        }
+    }
+
+    fun retry(categoryId: Int) {
+        loadProductsByCategory(categoryId)
+    }
+}
+
+sealed class CategoryProductsUiState {
+    object Loading : CategoryProductsUiState()
+    data class Success(val products: List<ProductsItem>) : CategoryProductsUiState()
+    data class Error(val message: String) : CategoryProductsUiState()
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/ProductsCategoryAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/ProductsCategoryAdapter.kt
new file mode 100644
index 0000000..7e82b2b
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/product/category/ProductsCategoryAdapter.kt
@@ -0,0 +1,73 @@
+package com.alya.ecommerce_serang.ui.product.category
+
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.core.content.ContextCompat
+import androidx.recyclerview.widget.RecyclerView
+import com.alya.ecommerce_serang.BuildConfig
+import com.alya.ecommerce_serang.R
+import com.alya.ecommerce_serang.data.api.dto.ProductsItem
+import com.alya.ecommerce_serang.databinding.ItemProductGridBinding
+import com.bumptech.glide.Glide
+import java.text.NumberFormat
+import java.util.Locale
+
+class ProductsCategoryAdapter(
+    private var products: List<ProductsItem>,
+    private val onClick: (ProductsItem) -> Unit
+) : RecyclerView.Adapter<ProductsCategoryAdapter.ProductViewHolder>() {
+
+    fun updateProducts(newProducts: List<ProductsItem>) {
+        products = newProducts
+        notifyDataSetChanged()
+    }
+
+    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ProductViewHolder {
+        val binding = ItemProductGridBinding.inflate(
+            LayoutInflater.from(parent.context),
+            parent,
+            false
+        )
+        return ProductViewHolder(binding)
+    }
+
+    override fun onBindViewHolder(holder: ProductViewHolder, position: Int) {
+        holder.bind(products[position])
+    }
+
+    override fun getItemCount(): Int = products.size
+
+    inner class ProductViewHolder(
+        private val binding: ItemProductGridBinding
+    ) : RecyclerView.ViewHolder(binding.root) {
+
+        fun bind(product: ProductsItem) {
+            binding.apply {
+                tvProductName.text = product.name
+                val priceValue = product.price.toDoubleOrNull() ?: 0.0
+                tvProductPrice.text = "Rp ${NumberFormat.getNumberInstance(Locale("id", "ID")).format(priceValue.toInt())}"
+                // Load product image
+                Glide.with(itemView.context)
+                    .load("${BuildConfig.BASE_URL}${product.image}")
+                    .placeholder(R.drawable.placeholder_image)
+                    .error(R.drawable.placeholder_image)
+                    .centerCrop()
+                    .into(ivProductImage)
+
+                // Set click listener
+                root.setOnClickListener {
+                    onClick(product)
+                }
+
+                // Optional: Show stock status
+                if (product.stock > 0) {
+                    tvStockStatus.text = "Stock: ${product.stock}"
+                    tvStockStatus.setTextColor(ContextCompat.getColor(itemView.context, R.color.green))
+                } else {
+                    tvStockStatus.text = "Out of Stock"
+                    tvStockStatus.setTextColor(ContextCompat.getColor(itemView.context, R.color.red))
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/res/layout/activity_category_products.xml b/app/src/main/res/layout/activity_category_products.xml
new file mode 100644
index 0000000..2c023dc
--- /dev/null
+++ b/app/src/main/res/layout/activity_category_products.xml
@@ -0,0 +1,178 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/main"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    tools:context=".ui.product.category.CategoryProductsActivity">
+
+    <com.google.android.material.appbar.AppBarLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
+
+        <com.google.android.material.appbar.CollapsingToolbarLayout
+            android:layout_width="match_parent"
+            android:layout_height="200dp"
+            app:layout_scrollFlags="scroll|exitUntilCollapsed"
+            app:contentScrim="?attr/colorPrimary"
+            app:expandedTitleMarginStart="48dp"
+            app:expandedTitleMarginEnd="64dp">
+
+            <ImageView
+                android:id="@+id/iv_category_header"
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:scaleType="centerCrop"
+                app:layout_collapseMode="parallax"
+                android:contentDescription="Category Header Image" />
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:background="@color/blue_50" />
+
+            <androidx.appcompat.widget.Toolbar
+                android:id="@+id/toolbar"
+                android:layout_width="match_parent"
+                android:layout_height="?attr/actionBarSize"
+                app:layout_collapseMode="pin"
+                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
+
+        </com.google.android.material.appbar.CollapsingToolbarLayout>
+
+    </com.google.android.material.appbar.AppBarLayout>
+
+    <androidx.core.widget.NestedScrollView
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        app:layout_behavior="@string/appbar_scrolling_view_behavior">
+
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="vertical">
+
+            <!-- Category Title Section -->
+            <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:orientation="vertical"
+                android:padding="16dp">
+
+                <TextView
+                    android:id="@+id/tv_category_title"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:text="Category Name"
+                    android:textSize="24sp"
+                    android:textStyle="bold"
+                    android:textColor="@color/black_500"
+                    android:gravity="center" />
+
+                <View
+                    android:layout_width="60dp"
+                    android:layout_height="3dp"
+                    android:layout_gravity="center"
+                    android:layout_marginTop="8dp"
+                    android:background="@color/blue_500" />
+
+            </LinearLayout>
+
+            <!-- Products Section -->
+            <FrameLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="8dp">
+
+                <!-- Loading State -->
+                <ProgressBar
+                    android:id="@+id/progress_bar"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:layout_marginTop="32dp"
+                    android:visibility="gone" />
+
+                <!-- Products RecyclerView -->
+                <androidx.recyclerview.widget.RecyclerView
+                    android:id="@+id/rv_products"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:padding="8dp"
+                    android:clipToPadding="false"
+                    tools:listitem="@layout/item_product_grid" />
+
+                <!-- Empty State -->
+                <LinearLayout
+                    android:id="@+id/layout_empty"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:orientation="vertical"
+                    android:padding="32dp"
+                    android:gravity="center"
+                    android:visibility="gone">
+
+                    <ImageView
+                        android:layout_width="120dp"
+                        android:layout_height="120dp"
+                        android:src="@drawable/baseline_search_24"
+                        android:layout_marginBottom="16dp"
+                        android:contentDescription="No Products" />
+
+                    <TextView
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="No products found in this category"
+                        android:textSize="16sp"
+                        android:textColor="@color/black_200"
+                        android:gravity="center" />
+
+                </LinearLayout>
+
+                <!-- Error State -->
+                <LinearLayout
+                    android:id="@+id/layout_error"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:orientation="vertical"
+                    android:padding="32dp"
+                    android:gravity="center"
+                    android:visibility="gone">
+
+                    <ImageView
+                        android:layout_width="120dp"
+                        android:layout_height="120dp"
+                        android:src="@drawable/baseline_alarm_24"
+                        android:layout_marginBottom="16dp"
+                        android:contentDescription="Error" />
+
+                    <TextView
+                        android:id="@+id/tv_error_message"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="Something went wrong"
+                        android:textSize="16sp"
+                        android:textColor="@color/black_200"
+                        android:gravity="center"
+                        android:layout_marginBottom="16dp" />
+
+                    <Button
+                        android:id="@+id/btn_retry"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="Retry"
+                        style="@style/Widget.MaterialComponents.Button.OutlinedButton" />
+
+                </LinearLayout>
+
+            </FrameLayout>
+
+        </LinearLayout>
+
+    </androidx.core.widget.NestedScrollView>
+
+</androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/activity_payment.xml b/app/src/main/res/layout/activity_payment.xml
index c8d993d..3bccbf4 100644
--- a/app/src/main/res/layout/activity_payment.xml
+++ b/app/src/main/res/layout/activity_payment.xml
@@ -230,7 +230,20 @@
             android:background="@drawable/bg_button_filled"
             android:text="Kirim Bukti Bayar"
             android:textAllCaps="false"
-            android:textColor="@android:color/white" />
+            android:textColor="@android:color/white"
+            android:enabled="true"
+            android:clickable="true"
+            android:focusable="true" />
     </LinearLayout>
 
+    <ProgressBar
+        android:id="@+id/progressBar"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:visibility="gone"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"/>
+
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/item_product_grid.xml b/app/src/main/res/layout/item_product_grid.xml
index cebc279..3d9c567 100644
--- a/app/src/main/res/layout/item_product_grid.xml
+++ b/app/src/main/res/layout/item_product_grid.xml
@@ -1,67 +1,84 @@
-<?xml version="1.0" encoding="utf-8"?>
-<com.google.android.material.card.MaterialCardView xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_margin="8dp"
-    app:cardCornerRadius="8dp"
-    app:cardElevation="2dp">
+    app:cardCornerRadius="12dp"
+    app:cardElevation="4dp"
+    android:foreground="?android:attr/selectableItemBackground">
 
-    <androidx.constraintlayout.widget.ConstraintLayout
+    <LinearLayout
         android:layout_width="match_parent"
-        android:layout_height="wrap_content">
+        android:layout_height="wrap_content"
+        android:orientation="vertical">
 
+        <!-- Product Image -->
         <ImageView
-            android:id="@+id/productImage"
+            android:id="@+id/iv_product_image"
             android:layout_width="match_parent"
-            android:layout_height="0dp"
+            android:layout_height="160dp"
             android:scaleType="centerCrop"
-            app:layout_constraintDimensionRatio="1:1"
-            app:layout_constraintTop_toTopOf="parent"
+            android:background="@color/light_gray"
+            android:contentDescription="Product Image"
             tools:src="@drawable/placeholder_image" />
 
-        <TextView
-            android:id="@+id/productName"
+        <!-- Product Info -->
+        <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginStart="8dp"
-            android:layout_marginTop="8dp"
-            android:layout_marginEnd="8dp"
-            android:ellipsize="end"
-            android:maxLines="2"
-            android:textSize="14sp"
-            app:layout_constraintTop_toBottomOf="@id/productImage"
-            tools:text="Product Name" />
+            android:orientation="vertical"
+            android:padding="12dp">
 
-        <TextView
-            android:id="@+id/storeName"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="8dp"
-            android:layout_marginTop="4dp"
-            android:layout_marginEnd="8dp"
-            android:ellipsize="end"
-            android:maxLines="1"
-            android:textSize="12sp"
-            android:fontFamily="@font/dmsans_medium"
-            app:layout_constraintTop_toBottomOf="@id/productName"
-            tools:text="Store Name" />
+            <!-- Product Name -->
+            <TextView
+                android:id="@+id/tv_product_name"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:text="Product Name"
+                android:textSize="14sp"
+                android:textStyle="bold"
+                android:textColor="@color/black_500"
+                android:maxLines="2"
+                android:ellipsize="end"
+                tools:text="Sample Product Name" />
 
-        <TextView
-            android:id="@+id/productPrice"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="8dp"
-            android:layout_marginTop="4dp"
-            android:layout_marginEnd="8dp"
-            android:layout_marginBottom="8dp"
-            android:textColor="@color/blue1"
-            android:textSize="16sp"
-            android:textStyle="bold"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/storeName"
-            tools:text="Rp 150.000" />
+            <!-- Product Price -->
+            <TextView
+                android:id="@+id/tv_product_price"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="4dp"
+                android:text="Rp 0"
+                android:textSize="16sp"
+                android:textStyle="bold"
+                android:textColor="@color/blue_500"
+                tools:text="Rp 25,000" />
 
-    </androidx.constraintlayout.widget.ConstraintLayout>
-</com.google.android.material.card.MaterialCardView>
\ No newline at end of file
+            <!-- Stock Status -->
+            <TextView
+                android:id="@+id/tv_stock_status"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="4dp"
+                android:text="Stock: 0"
+                android:textSize="12sp"
+                android:textColor="@color/black_200"
+                tools:text="Stock: 15" />
+
+            <TextView
+                android:id="@+id/tv_store_name"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="4dp"
+                android:text="Toko Jaya"
+                android:fontFamily="@font/dmsans_semibold"
+                android:textSize="14sp"
+                android:textColor="@color/black_200"
+                tools:text="Stock: 15" />
+
+        </LinearLayout>
+
+    </LinearLayout>
+
+</androidx.cardview.widget.CardView>
\ No newline at end of file
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index c41219f..d7c0068 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -42,6 +42,8 @@
     <color name="soft_gray">#7D8FAB</color>
     <color name="blue1">#489EC6</color>
     <color name="yellow">#faf069</color>
+    <color name="green">#A5C882</color>
+    <color name="red">#EC4E20</color>
 
     <color name="bottom_navigation_icon_color_active">#489EC6</color>
     <color name="bottom_navigation_icon_color_inactive">#8E8E8E</color>

From 0d2edb7ea225ce749ddcbfc11086020aa2a44bdd Mon Sep 17 00:00:00 2001
From: shaulascr <alya.roosyidah@gmail.com>
Date: Fri, 30 May 2025 05:19:11 +0700
Subject: [PATCH 09/10] fix sell order and confirm payment in detailpayment

---
 .../data/api/dto/PaymentConfirmRequest.kt     |  12 +
 .../store/orders/OrderListResponse.kt         |   4 +-
 .../orders/PaymentConfirmationResponse.kt     |   2 +-
 .../data/api/retrofit/ApiService.kt           |   7 +
 .../data/repository/SellsRepository.kt        |  26 +
 .../ui/order/history/HistoryActivity.kt       |   2 +-
 .../ui/order/history/OrderProductAdapter.kt   |  10 +-
 .../ui/profile/mystore/sells/SellsActivity.kt |  38 +-
 .../ui/profile/mystore/sells/SellsAdapter.kt  | 416 ++++----
 .../ui/profile/mystore/sells/SellsFragment.kt |  63 +-
 .../mystore/sells/SellsListFragment.kt        | 109 +-
 .../mystore/sells/SellsProductAdapter.kt      |  12 +-
 .../mystore/sells/SellsViewPagerAdapter.kt    |  34 +-
 .../sells/payment/DetailPaymentActivity.kt    | 139 ++-
 .../sells/shipment/DetailShipmentActivity.kt  |  12 +-
 .../utils/viewmodel/SellsViewModel.kt         | 139 ++-
 .../main/res/layout/dialog_image_viewer.xml   |  65 ++
 app/src/main/res/layout/fragment_sells.xml    |  14 +-
 .../main/res/layout/fragment_sells_list.xml   |  12 +-
 app/src/main/res/layout/item_sells.xml        | 964 +++---------------
 20 files changed, 900 insertions(+), 1180 deletions(-)
 create mode 100644 app/src/main/java/com/alya/ecommerce_serang/data/api/dto/PaymentConfirmRequest.kt
 create mode 100644 app/src/main/res/layout/dialog_image_viewer.xml

diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/PaymentConfirmRequest.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/PaymentConfirmRequest.kt
new file mode 100644
index 0000000..f529a31
--- /dev/null
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/PaymentConfirmRequest.kt
@@ -0,0 +1,12 @@
+package com.alya.ecommerce_serang.data.api.dto
+
+import com.google.gson.annotations.SerializedName
+
+data class PaymentConfirmRequest (
+    @SerializedName("order_id")
+    val orderId : Int,
+
+    @SerializedName("status")
+    val status: String
+
+)
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/OrderListResponse.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/OrderListResponse.kt
index 9d1698b..d981252 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/OrderListResponse.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/OrderListResponse.kt
@@ -77,7 +77,7 @@ data class OrdersItem(
 	val cancelDate: String? = null,
 
 	@field:SerializedName("payment_evidence")
-	val paymentEvidence: Any? = null,
+	val paymentEvidence: String,
 
 	@field:SerializedName("longitude")
 	val longitude: String? = null,
@@ -152,7 +152,7 @@ data class OrdersItem(
 	val postalCode: String? = null,
 
 	@field:SerializedName("order_id")
-	val orderId: Int? = null,
+	val orderId: Int,
 
 	@field:SerializedName("username")
 	val username: String? = null,
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/PaymentConfirmationResponse.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/PaymentConfirmationResponse.kt
index 498cb6f..8f9156a 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/PaymentConfirmationResponse.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/response/store/orders/PaymentConfirmationResponse.kt
@@ -5,5 +5,5 @@ import com.google.gson.annotations.SerializedName
 data class PaymentConfirmationResponse(
 
 	@field:SerializedName("message")
-	val message: String? = null
+	val message: String
 )
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
index 7763e6d..17784e6 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/retrofit/ApiService.kt
@@ -14,6 +14,7 @@ import com.alya.ecommerce_serang.data.api.dto.LoginRequest
 import com.alya.ecommerce_serang.data.api.dto.OrderRequest
 import com.alya.ecommerce_serang.data.api.dto.OrderRequestBuy
 import com.alya.ecommerce_serang.data.api.dto.OtpRequest
+import com.alya.ecommerce_serang.data.api.dto.PaymentConfirmRequest
 import com.alya.ecommerce_serang.data.api.dto.ProvinceResponse
 import com.alya.ecommerce_serang.data.api.dto.RegisterRequest
 import com.alya.ecommerce_serang.data.api.dto.ReviewProductItem
@@ -65,6 +66,7 @@ import com.alya.ecommerce_serang.data.api.response.order.ComplaintResponse
 import com.alya.ecommerce_serang.data.api.response.order.CompletedOrderResponse
 import com.alya.ecommerce_serang.data.api.response.product.CreateSearchResponse
 import com.alya.ecommerce_serang.data.api.response.product.SearchHistoryResponse
+import com.alya.ecommerce_serang.data.api.response.store.orders.PaymentConfirmationResponse
 import com.alya.ecommerce_serang.data.api.response.store.product.CreateProductResponse
 import com.alya.ecommerce_serang.data.api.response.store.product.DeleteProductResponse
 import com.alya.ecommerce_serang.data.api.response.store.product.UpdateProductResponse
@@ -366,6 +368,11 @@ interface ApiService {
         @Part("bank_num") bankNum: RequestBody
     ): Response<BalanceTopUpResponse>
 
+    @PUT("store/payment/update")
+    suspend fun paymentConfirmation(
+        @Body confirmPaymentReq : PaymentConfirmRequest
+    ): Response<PaymentConfirmationResponse>
+
     @Multipart
     @PUT("mystore/edit")
     suspend fun updateStoreProfileMultipart(
diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/repository/SellsRepository.kt b/app/src/main/java/com/alya/ecommerce_serang/data/repository/SellsRepository.kt
index f384565..3e991d5 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/repository/SellsRepository.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/repository/SellsRepository.kt
@@ -1,7 +1,9 @@
 package com.alya.ecommerce_serang.data.repository
 
 import android.util.Log
+import com.alya.ecommerce_serang.data.api.dto.PaymentConfirmRequest
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrderListResponse
+import com.alya.ecommerce_serang.data.api.response.store.orders.PaymentConfirmationResponse
 import com.alya.ecommerce_serang.data.api.retrofit.ApiService
 
 class SellsRepository(private val apiService: ApiService) {
@@ -42,4 +44,28 @@ class SellsRepository(private val apiService: ApiService) {
             Log.e("SellsRepository", "Exception updating order status", e)
         }
     }
+
+    suspend fun confirmPaymentStore(request: PaymentConfirmRequest): Result<PaymentConfirmationResponse> {
+        return try {
+            Log.d("SellsRepository", "Conforming order request completed: $request")
+            val response = apiService.paymentConfirmation(request)
+
+            if(response.isSuccessful) {
+                val paymentConfirmResponse = response.body()
+                if (paymentConfirmResponse != null) {
+                    Log.d("SellsRepository", "Order confirmed successfully: ${paymentConfirmResponse.message}")
+                    Result.Success(paymentConfirmResponse)
+                } else {
+                    Log.e("SellsRepository", "Response body was null")
+                    Result.Error(Exception("Empty response from server"))
+                }
+            } else {
+                val errorBody = response.errorBody()?.string() ?: "Unknown Error"
+                Log.e("SellsRepository", "Error confirming order: $errorBody")
+                Result.Error(Exception(errorBody))
+            }
+        } catch (e: Exception){
+            Result.Error(e)
+        }
+    }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryActivity.kt
index 139f894..7027991 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/HistoryActivity.kt
@@ -63,7 +63,7 @@ class HistoryActivity : AppCompatActivity() {
         supportActionBar?.setDisplayShowTitleEnabled(false)
 
         binding.btnBack.setOnClickListener {
-            onBackPressed()
+//            onBackPressed()
             finish()
         }
     }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderProductAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderProductAdapter.kt
index 2051c2c..da1a17c 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderProductAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/order/history/OrderProductAdapter.kt
@@ -6,10 +6,10 @@ import android.view.ViewGroup
 import android.widget.ImageView
 import android.widget.TextView
 import androidx.recyclerview.widget.RecyclerView
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
 import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.data.api.response.customer.order.OrderItemsItem
 import com.bumptech.glide.Glide
-import com.google.android.material.button.MaterialButton
 
 class OrderProductAdapter : RecyclerView.Adapter<OrderProductAdapter.ProductViewHolder>() {
 
@@ -48,9 +48,15 @@ class OrderProductAdapter : RecyclerView.Adapter<OrderProductAdapter.ProductView
             // Set price with currency format
             tvProductPrice.text = formatCurrency(product.price)
 
+            val fullImageUrl = when (val img = product.productImage) {
+                is String -> {
+                    if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                }
+                else -> R.drawable.placeholder_image // Default image for null
+            }
             // Load product image using Glide
             Glide.with(itemView.context)
-                .load(product.productImage)
+                .load(fullImageUrl)
                 .placeholder(R.drawable.placeholder_image)
 //                .error(R.drawable.error_image)
                 .into(ivProductImage)
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsActivity.kt
index da6bb16..13e470e 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsActivity.kt
@@ -1,8 +1,13 @@
 package com.alya.ecommerce_serang.ui.profile.mystore.sells
 
-import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
+import android.util.Log
+import androidx.activity.enableEdgeToEdge
 import androidx.activity.viewModels
+import androidx.appcompat.app.AppCompatActivity
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsCompat
 import androidx.fragment.app.commit
 import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
@@ -31,12 +36,28 @@ class SellsActivity : AppCompatActivity() {
 
         sessionManager = SessionManager(this)
 
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+
+        enableEdgeToEdge()
+
+        // Apply insets to your root layout
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                systemBars.bottom
+            )
+            windowInsets
+        }
+
+        Log.d("SellsActivity", "SellsActivity started")
+
         setupHeader()
 
         if (savedInstanceState == null) {
-            supportFragmentManager.commit {
-                replace(R.id.fragment_container_sells, SellsFragment())
-            }
+            showSellsFragment()
         }
     }
 
@@ -44,7 +65,14 @@ class SellsActivity : AppCompatActivity() {
         binding.header.headerTitle.text = "Penjualan Saya"
 
         binding.header.headerLeftIcon.setOnClickListener {
-            onBackPressedDispatcher.onBackPressed()
+            onBackPressed()
+            finish()
+        }
+    }
+
+    private fun showSellsFragment() {
+        supportFragmentManager.commit {
+            replace(R.id.fragment_container_sells, SellsFragment())
         }
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt
index 5e9794f..7dc5bf5 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt
@@ -5,16 +5,15 @@ import android.util.Log
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
-import android.widget.ImageView
 import android.widget.TextView
+import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
 import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrdersItem
 import com.alya.ecommerce_serang.ui.profile.mystore.sells.payment.DetailPaymentActivity
 import com.alya.ecommerce_serang.ui.profile.mystore.sells.shipment.DetailShipmentActivity
 import com.alya.ecommerce_serang.utils.viewmodel.SellsViewModel
-import com.bumptech.glide.Glide
+import com.google.android.material.button.MaterialButton
 import com.google.gson.Gson
 import java.text.SimpleDateFormat
 import java.util.Calendar
@@ -34,235 +33,310 @@ class SellsAdapter(
     }
 
     fun submitList(newSells: List<OrdersItem>) {
+        Log.d("SellsAdapter", "submitList called with ${newSells.size} items")
         sells.clear()
         sells.addAll(newSells)
         notifyDataSetChanged()
+        Log.d("SellsAdapter", "Adapter updated. Current size: ${sells.size}")
     }
 
     override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): SellsViewHolder {
+        Log.d("SellsAdapter", "onCreateViewHolder called")
         val view = LayoutInflater.from(parent.context).inflate(R.layout.item_sells, parent, false)
+        Log.d("SellsAdapter", "View inflated successfully")
         return SellsViewHolder(view)
     }
 
     override fun onBindViewHolder(holder: SellsViewHolder, position: Int) {
-        holder.bind(sells[position])
+        Log.d("SellsAdapter", "onBindViewHolder called for position: $position")
+        Log.d("SellsAdapter", "Total items in adapter: ${sells.size}")
+        if (position < sells.size) {
+            holder.bind(sells[position])
+        } else {
+            Log.e("SellsAdapter", "Position $position is out of bounds for size ${sells.size}")
+        }
     }
 
     override fun getItemCount(): Int = sells.size
 
     inner class SellsViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
-        private val layoutOrders: View = itemView.findViewById(R.id.layout_orders)
-        private val layoutPayments: View = itemView.findViewById(R.id.layout_payments)
-        private val layoutShipments: View = itemView.findViewById(R.id.layout_shipments)
+        private val tvStoreName: TextView = itemView.findViewById(R.id.tvUserName)
+        private val rvOrderItems: RecyclerView = itemView.findViewById(R.id.rvSellsItems)
+        private val tvShowMore: TextView = itemView.findViewById(R.id.tvShowMores)
+        private val tvTotalAmount: TextView = itemView.findViewById(R.id.tvTotalAmounts)
+        private val tvItemCountLabel: TextView = itemView.findViewById(R.id.tv_count_total_items)
 
-        private var tvSellsTitle: TextView = itemView.findViewById(R.id.tv_payment_title)
-        private var tvSellsNumber: TextView = itemView.findViewById(R.id.tv_payment_number)
-        private var tvSellsDueDesc: TextView = itemView.findViewById(R.id.tv_payment_due_desc)
-        private var tvSellsDue: TextView = itemView.findViewById(R.id.tv_payment_due)
-        private var tvSellsLocation: TextView = itemView.findViewById(R.id.tv_payment_location)
-        private var tvSellsCustomer: TextView = itemView.findViewById(R.id.tv_payment_customer)
-        private var ivSellsProduct: ImageView = itemView.findViewById(R.id.iv_payment_product)
-        private var tvSellsProductName: TextView = itemView.findViewById(R.id.tv_payment_product_name)
-        private var tvSellsProductQty: TextView = itemView.findViewById(R.id.tv_payment_product_qty)
-        private var tvSellsProductPrice: TextView = itemView.findViewById(R.id.tv_payment_product_price)
-        private var tvSeeMore: TextView = itemView.findViewById(R.id.tv_see_more_payment)
-        private var tvSellsQty: TextView = itemView.findViewById(R.id.tv_payment_qty)
-        private var tvSellsPrice: TextView = itemView.findViewById(R.id.tv_payment_price)
-        private val btnConfirmPayment: Button = itemView.findViewById(R.id.btn_confirm_payment)
-        private val btnConfirmShipment: Button = itemView.findViewById(R.id.btn_confirm_shipment)
+        fun bind(order: OrdersItem) {
+            Log.d("SellsAdapter", "=== ViewHolder.bind() called ===")
+            Log.d("SellsAdapter", "Binding order: ${order.orderId} with status: ${order.status}")
 
-        fun bind(sells: OrdersItem) {
+            // Show customer/buyer name (seller's perspective)
+            tvStoreName.text = order.username ?: "Unknown Customer"
+            Log.d("SellsAdapter", "Customer name set: ${order.username}")
 
-            tvSellsNumber.text = "No. Pesanan: ${sells.orderId}"
-            tvSellsLocation.text = sells.subdistrict
-            tvSellsCustomer.text = sells.username
+            // Set total amount
+            tvTotalAmount.text = "Rp${order.totalAmount}"
+            Log.d("SellsAdapter", "Total amount set: ${order.totalAmount}")
 
-            val product = sells.orderItems?.get(0)
-            product?.let {
-                tvSellsProductName.text = it.productName
-                tvSellsProductQty.text = "x${it.quantity}"
-                tvSellsProductPrice.text = "Rp${it.price}"
+            // Set item count
+            val itemCount = order.orderItems?.size ?: 0
+            tvItemCountLabel.text = itemView.context.getString(R.string.item_count_prod, itemCount)
+            Log.d("SellsAdapter", "Item count set: $itemCount")
 
-                Glide.with(itemView.context)
-                    .load(it.productImage)
-                    .placeholder(R.drawable.placeholder_image)
-                    .into(ivSellsProduct)
+            // Set up the order items RecyclerView
+            val productAdapter = SellsProductAdapter()
+            rvOrderItems.apply {
+                layoutManager = LinearLayoutManager(itemView.context)
+                adapter = productAdapter
             }
+            Log.d("SellsAdapter", "Product RecyclerView configured")
 
-            sells.orderItems?.size?.let {
-                if (it > 1) {
-                    tvSeeMore.visibility = View.VISIBLE
-                    tvSeeMore.text = "Lihat ${it.minus(1)} produk lainnya"
+            // Display only the first product and show "View more" for the rest
+            order.orderItems?.let { items ->
+                if (items.isNotEmpty()) {
+                    productAdapter.submitList(items.take(1))
+                    Log.d("SellsAdapter", "Product list submitted: ${items.size} items")
+
+                    // Show or hide the "View more" text based on number of items
+                    if (items.size > 1) {
+                        val itemString = items.size - 1
+                        tvShowMore.visibility = View.VISIBLE
+                        tvShowMore.text = itemView.context.getString(R.string.show_more_product, itemString)
+                        Log.d("SellsAdapter", "Show more visible: $itemString more items")
+                    } else {
+                        tvShowMore.visibility = View.GONE
+                        Log.d("SellsAdapter", "Show more hidden: only 1 item")
+                    }
                 } else {
-                    tvSeeMore.visibility = View.GONE
+                    tvShowMore.visibility = View.GONE
+                    Log.w("SellsAdapter", "Order has no items!")
                 }
+            } ?: run {
+                tvShowMore.visibility = View.GONE
+                Log.w("SellsAdapter", "Order items is null!")
             }
 
-            tvSellsQty.text = "${sells.orderItems?.size} produk"
-            tvSellsPrice.text = "Rp${sells.totalAmount}"
-//
-//            itemView.setOnClickListener {
-//                onOrderClickListener(sells)
-//            }
+            // Set click listener for the entire order item
+            itemView.setOnClickListener {
+                onOrderClickListener(order)
+            }
 
-            adjustDisplay(fragmentStatus, sells)
+            val actualStatus = if (fragmentStatus == "all") order.status ?: "" else fragmentStatus
+            Log.d("SellsAdapter", "Adjusting UI for status: '$actualStatus' (fragmentStatus: '$fragmentStatus')")
+            adjustButtonsAndText(actualStatus, order)
+
+            Log.d("SellsAdapter", "=== ViewHolder.bind() completed ===")
         }
 
-        private fun adjustDisplay(status: String, sells: OrdersItem) {
-            Log.d("SellsAdapter", "Adjusting display for status: $status")
+        private fun adjustButtonsAndText(status: String, order: OrdersItem) {
+            Log.d("SellsAdapter", "Adjusting buttons for status: $status")
+
+            // Get references to buttons and status views
+            val btnLeft = itemView.findViewById<MaterialButton>(R.id.btn_left)
+            val btnRight = itemView.findViewById<MaterialButton>(R.id.btn_right)
+            val statusOrder = itemView.findViewById<TextView>(R.id.tvOrderStatus)
+            val deadlineLabel = itemView.findViewById<TextView>(R.id.tvDeadlineLabel)
+            val deadlineDate = itemView.findViewById<TextView>(R.id.tvDeadlineDate)
+
+            // Reset visibility
+            btnLeft.visibility = View.GONE
+            btnRight.visibility = View.GONE
+            statusOrder.visibility = View.GONE
+            deadlineLabel.visibility = View.GONE
+            deadlineDate.visibility = View.GONE
 
             when (status) {
-                "pending", "unpaid" -> {
-                    layoutOrders.visibility = View.VISIBLE
-                    layoutPayments.visibility = View.GONE
-                    layoutShipments.visibility = View.GONE
-
-                    tvSellsTitle = itemView.findViewById(R.id.tv_order_title)
-                    tvSellsNumber = itemView.findViewById(R.id.tv_order_number)
-                    tvSellsDue = itemView.findViewById(R.id.tv_order_due)
-                    tvSellsCustomer = itemView.findViewById(R.id.tv_order_customer)
-                    tvSellsProductName = itemView.findViewById(R.id.tv_order_product_name)
-                    tvSellsProductQty = itemView.findViewById(R.id.tv_order_product_qty)
-                    tvSellsProductPrice = itemView.findViewById(R.id.tv_order_product_price)
-                    tvSeeMore = itemView.findViewById(R.id.tv_see_more_order)
-                    tvSellsQty = itemView.findViewById(R.id.tv_order_qty)
-                    tvSellsPrice = itemView.findViewById(R.id.tv_order_price)
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 1)
-
-                    val product = sells.orderItems?.get(0)
-                    product?.let {
-                        tvSellsProductName.text = it.productName
-                        tvSellsProductQty.text = "x${it.quantity}"
-                        tvSellsProductPrice.text = "Rp${it.price}"
-                        Glide.with(itemView.context)
-                            .load(it.productImage)
-                            .placeholder(R.drawable.placeholder_image)
-                            .into(ivSellsProduct)
+                "pending" -> {
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Menunggu Tagihan"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Batas waktu konfirmasi:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDate(order.createdAt ?: "")
+                    }
+                    btnLeft.apply {
+                        visibility = View.VISIBLE
+                        text = "Tolak Pesanan"
+                        setOnClickListener {
+                            // Handle reject order
+                            viewModel.updateOrderStatus(order.orderId, "canceled")
+                            viewModel.refreshOrders()
+                        }
+                    }
+                    btnRight.apply {
+                        visibility = View.VISIBLE
+                        text = "Terima Pesanan"
+                        setOnClickListener {
+                            // Handle accept order
+                            viewModel.updateOrderStatus(order.orderId, "unpaid")
+                            viewModel.refreshOrders()
+                        }
+                    }
+                }
+                "unpaid" -> {
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Konfirmasi Bayar"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Batas pembayaran:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDatePay(order.updatedAt ?: "")
+                    }
+                    btnLeft.apply {
+                        visibility = View.VISIBLE
+                        text = "Batalkan"
+                        setOnClickListener {
+                            viewModel.updateOrderStatus(order.orderId, "canceled")
+                            viewModel.refreshOrders()
+                        }
                     }
-
-                    tvSellsQty.text = "${sells.orderItems?.size} produk"
-                    tvSellsPrice.text = "Rp${sells.totalAmount}"
                 }
                 "paid" -> {
-                    layoutOrders.visibility = View.GONE
-                    layoutPayments.visibility = View.VISIBLE
-                    layoutShipments.visibility = View.GONE
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 2)
-                    btnConfirmPayment.setOnClickListener {
-
-                        val context = itemView.context
-                        val intent = Intent(context, DetailPaymentActivity::class.java)
-                        intent.putExtra("sells_data", Gson().toJson(sells))
-                        context.startActivity(intent)
-                        viewModel.refreshOrders()
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Sudah Dibayar"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Konfirmasi pembayaran sebelum:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDatePay(order.updatedAt ?: "")
+                    }
+                    btnRight.apply {
+                        visibility = View.VISIBLE
+                        text = "Konfirmasi Pembayaran"
+                        setOnClickListener {
+                            val context = itemView.context
+                            val intent = Intent(context, DetailPaymentActivity::class.java)
+                            intent.putExtra("sells_data", Gson().toJson(order))
+                            context.startActivity(intent)
+                        }
                     }
-
-                    tvSellsTitle.text = "Pesanan Telah Dibayar"
-                    tvSellsDueDesc.text = "Konfirmasi pembayaran sebelum:"
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 2)
-
                 }
                 "processed" -> {
-                    layoutOrders.visibility = View.GONE
-                    layoutPayments.visibility = View.GONE
-                    layoutShipments.visibility = View.VISIBLE
-
-                    tvSellsTitle = itemView.findViewById(R.id.tv_shipment_title)
-                    tvSellsNumber = itemView.findViewById(R.id.tv_shipment_number)
-                    tvSellsDue = itemView.findViewById(R.id.tv_shipment_due)
-                    tvSellsLocation = itemView.findViewById(R.id.tv_shipment_location)
-                    tvSellsCustomer = itemView.findViewById(R.id.tv_shipment_customer)
-                    tvSellsProductName = itemView.findViewById(R.id.tv_shipment_product_name)
-                    tvSellsProductQty = itemView.findViewById(R.id.tv_shipment_product_qty)
-                    tvSeeMore = itemView.findViewById(R.id.tv_see_more_shipment)
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 2)
-                    btnConfirmShipment.setOnClickListener {
-                        val context = itemView.context
-                        val intent = Intent(context, DetailShipmentActivity::class.java)
-                        intent.putExtra("sells_data", Gson().toJson(sells))
-                        context.startActivity(intent)
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Diproses"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Kirim sebelum:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDatePay(order.updatedAt ?: "")
+                    }
+                    btnRight.apply {
+                        visibility = View.VISIBLE
+                        text = "Kirim Pesanan"
+                        setOnClickListener {
+                            val context = itemView.context
+                            val intent = Intent(context, DetailShipmentActivity::class.java)
+                            intent.putExtra("sells_data", Gson().toJson(order))
+                            context.startActivity(intent)
+                        }
                     }
-
-                    tvSellsTitle.text = "Pesanan Perlu Dikirim"
-                    tvSellsNumber.text = "No. Pesanan: ${sells.orderId}"
-                    tvSellsLocation.text = sells.subdistrict
-                    tvSellsCustomer.text = sells.username
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 2)
                 }
                 "shipped" -> {
-                    layoutOrders.visibility = View.GONE
-                    layoutPayments.visibility = View.VISIBLE
-                    layoutShipments.visibility = View.GONE
-
-                    tvSellsTitle.text = "Pesanan Telah Dikirim"
-                    tvSellsDueDesc.text = "Dikirimkan pada"
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 0)
-                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
-                    btnConfirmPayment.visibility = View.GONE
-                }
-                "delivered" -> {
-                    layoutOrders.visibility = View.GONE
-                    layoutPayments.visibility = View.VISIBLE
-                    layoutShipments.visibility = View.GONE
-
-                    tvSellsTitle.text = "Pesanan Telah Dikirim"
-                    tvSellsDueDesc.text = "Dikirimkan pada"
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 0)
-                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
-                    btnConfirmPayment.visibility = View.GONE
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Dikirim"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Dikirimkan pada:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDate(order.updatedAt ?: "")
+                    }
                 }
                 "completed" -> {
-                    layoutOrders.visibility = View.GONE
-                    layoutPayments.visibility = View.VISIBLE
-                    layoutShipments.visibility = View.GONE
-
-                    tvSellsTitle.text = "Pesanan Selesai"
-                    tvSellsDueDesc.text = "Selesai pada"
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 0)
-                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
-                    btnConfirmPayment.visibility = View.GONE
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Selesai"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Selesai pada:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDate(order.updatedAt ?: "")
+                    }
                 }
                 "canceled" -> {
-                    layoutOrders.visibility = View.GONE
-                    layoutPayments.visibility = View.VISIBLE
-                    layoutShipments.visibility = View.GONE
-
-                    tvSellsTitle.text = "Pesanan Dibatalkan"
-                    tvSellsDueDesc.text = "Dibatalkan pada"
-
-                    tvSellsDue.text = formatDueDate(sells.updatedAt.toString(), 0)
-                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
-                    btnConfirmPayment.visibility = View.GONE
+                    statusOrder.apply {
+                        visibility = View.VISIBLE
+                        text = "Dibatalkan"
+                    }
+                    deadlineLabel.apply {
+                        visibility = View.VISIBLE
+                        text = "Dibatalkan pada:"
+                    }
+                    deadlineDate.apply {
+                        visibility = View.VISIBLE
+                        text = formatDate(order.cancelDate ?: "")
+                    }
                 }
             }
         }
 
-        private fun formatDueDate(date: String, dueDay: Int): String {
+        private fun formatDate(dateString: String): String {
             return try {
                 val inputFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
                 inputFormat.timeZone = TimeZone.getTimeZone("UTC")
 
-                val outputFormat = SimpleDateFormat("dd MM; HH.mm", Locale("id", "ID"))
+                val outputFormat = SimpleDateFormat("HH:mm dd MMMM yyyy", Locale("id", "ID"))
 
-                val date = inputFormat.parse(date)
+                val date = inputFormat.parse(dateString)
 
                 date?.let {
                     val calendar = Calendar.getInstance()
                     calendar.time = it
-                    calendar.add(Calendar.DATE, dueDay)
+                    calendar.set(Calendar.HOUR_OF_DAY, 23)
+                    calendar.set(Calendar.MINUTE, 59)
 
                     outputFormat.format(calendar.time)
-                } ?: date
+                } ?: dateString
             } catch (e: Exception) {
-                Log.e("DueDateFormatting", "Error formatting date: ${e.message}")
-                date
-            }.toString()
+                Log.e("DateFormatting", "Error formatting date: ${e.message}")
+                dateString
+            }
+        }
+
+        private fun formatDatePay(dateString: String): String {
+            return try {
+                // Parse the ISO 8601 date
+                val isoDateFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
+                isoDateFormat.timeZone = TimeZone.getTimeZone("UTC")
+
+                val createdDate = isoDateFormat.parse(dateString)
+
+                // Add 24 hours to get due date
+                val calendar = Calendar.getInstance()
+                calendar.time = createdDate
+                calendar.add(Calendar.HOUR, 24)
+
+                // Format due date for display
+                val dueDateFormat = SimpleDateFormat("dd MMM yyyy", Locale.getDefault())
+                dueDateFormat.format(calendar.time)
+
+            } catch (e: Exception) {
+                Log.e("DateFormatting", "Error formatting date: ${e.message}")
+                dateString
+            }
         }
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt
index 786c6e3..5074a2c 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt
@@ -1,12 +1,10 @@
 package com.alya.ecommerce_serang.ui.profile.mystore.sells
 
 import android.os.Bundle
-import android.util.Log
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import androidx.fragment.app.Fragment
-import androidx.viewpager2.widget.ViewPager2
 import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.databinding.FragmentSellsBinding
 import com.alya.ecommerce_serang.utils.SessionManager
@@ -21,9 +19,10 @@ class SellsFragment : Fragment() {
     private lateinit var viewPagerAdapter: SellsViewPagerAdapter
 
     override fun onCreateView(
-        inflater: LayoutInflater, container: ViewGroup?,
+        inflater: LayoutInflater,
+        container: ViewGroup?,
         savedInstanceState: Bundle?
-    ): View? {
+    ): View {
         _binding = FragmentSellsBinding.inflate(inflater, container, false)
         return binding.root
     }
@@ -36,58 +35,28 @@ class SellsFragment : Fragment() {
     }
 
     private fun setupViewPager() {
+        // Initialize the ViewPager adapter
         viewPagerAdapter = SellsViewPagerAdapter(requireActivity())
         binding.viewPagerSells.adapter = viewPagerAdapter
 
-        TabLayoutMediator(binding.tabLayoutSells, binding.viewPagerSells) {tab, position ->
-            tab.text = when(position){
-                0 -> getString(R.string.all_orders)
-                1 -> getString(R.string.pending_orders)
-                2 -> getString(R.string.unpaid_orders)
-                3 -> getString(R.string.processed_orders)
-                4 -> getString(R.string.paid_orders)
-                5 -> getString(R.string.shipped_orders)
-                6 -> getString(R.string.completed_orders)
-                7 -> getString(R.string.canceled_orders)
+        // Connect TabLayout with ViewPager2
+        TabLayoutMediator(binding.tabLayoutSells, binding.viewPagerSells) { tab, position ->
+            tab.text = when (position) {
+                0 -> getString(R.string.all_orders)           // "Semua Pesanan"
+                1 -> getString(R.string.pending_orders)       // "Menunggu Tagihan"
+                2 -> getString(R.string.unpaid_orders)        // "Konfirmasi Bayar"
+                3 -> getString(R.string.paid_orders)          // "Diproses"
+                4 -> getString(R.string.processed_orders)     // "Sudah Dibayar"
+                5 -> getString(R.string.shipped_orders)       // "Dikirim"
+                6 -> getString(R.string.completed_orders)     // "Selesai"
+                7 -> getString(R.string.canceled_orders)      // "Dibatalkan"
                 else -> "Tab $position"
             }
         }.attach()
-
-        binding.viewPagerSells.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
-            override fun onPageSelected(position: Int) {
-                super.onPageSelected(position)
-
-                val statusList = listOf("all", "pending", "unpaid", "processed", "paid", "shipped", "completed", "canceled")
-                val selectedStatus = statusList.getOrNull(position) ?: "unknown"
-                val tabText = when(position) {
-                    0 -> getString(R.string.all_orders)
-                    1 -> getString(R.string.pending_orders)
-                    2 -> getString(R.string.unpaid_orders)
-                    3 -> getString(R.string.processed_orders)
-                    4 -> getString(R.string.paid_orders)
-                    5 -> getString(R.string.shipped_orders)
-                    6 -> getString(R.string.completed_orders)
-                    7 -> getString(R.string.canceled_orders)
-                    else -> "Tab $position"
-                }
-
-                Log.d(TAG, "🔄 *** TAB SWITCHED ***")
-                Log.d(TAG, "Selected position: $position")
-                Log.d(TAG, "Tab text: '$tabText'")
-                Log.d(TAG, "Status for this tab: '$selectedStatus'")
-                Log.d(TAG, "*** This should trigger SellsListFragment for '$selectedStatus' ***")
-            }
-        })
-
     }
 
     override fun onDestroyView() {
         super.onDestroyView()
         _binding = null
     }
-
-    companion object {
-        private const val TAG = "SellsListFragment"
-
-    }
-}
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt
index 9770abc..ed01095 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt
@@ -11,6 +11,7 @@ import androidx.fragment.app.viewModels
 import androidx.recyclerview.widget.LinearLayoutManager
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrdersItem
 import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
+import com.alya.ecommerce_serang.data.repository.Result
 import com.alya.ecommerce_serang.data.repository.SellsRepository
 import com.alya.ecommerce_serang.databinding.FragmentSellsListBinding
 import com.alya.ecommerce_serang.ui.order.address.ViewState
@@ -22,7 +23,7 @@ class SellsListFragment : Fragment() {
 
     private var _binding: FragmentSellsListBinding? = null
     private val binding get() = _binding!!
-    private lateinit var  sessionManager: SessionManager
+    private lateinit var sessionManager: SessionManager
 
     private val viewModel: SellsViewModel by viewModels {
         BaseViewModelFactory {
@@ -31,39 +32,45 @@ class SellsListFragment : Fragment() {
             SellsViewModel(sellsRepository)
         }
     }
-
     private lateinit var sellsAdapter: SellsAdapter
+
     private var status: String = "all"
 
     companion object {
         private const val TAG = "SellsListFragment"
+
         private const val ARG_STATUS = "status"
 
         fun newInstance(status: String): SellsListFragment {
-            Log.d(TAG, "=== Creating new instance ===")
-            Log.d(TAG, "Status: '$status'")
+            Log.d(TAG, "Creating new instance with status: '$status'")
 
             return SellsListFragment().apply {
                 arguments = Bundle().apply {
                     putString(ARG_STATUS, status)
                 }
-                Log.d(TAG, "Fragment instance created with status: '$status'")
             }
         }
     }
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
+        Log.d(TAG, "onCreate called")
+
         sessionManager = SessionManager(requireContext())
         arguments?.let {
             status = it.getString(ARG_STATUS) ?: "all"
         }
+        Log.d(TAG, "Fragment status set to: '$status'")
+
     }
 
     override fun onCreateView(
-        inflater: LayoutInflater, container: ViewGroup?,
+        inflater: LayoutInflater,
+        container: ViewGroup?,
         savedInstanceState: Bundle?
-    ): View? {
+    ): View {
+        Log.d(TAG, "onCreateView called")
+
         _binding = FragmentSellsListBinding.inflate(inflater, container, false)
         return binding.root
     }
@@ -73,90 +80,104 @@ class SellsListFragment : Fragment() {
 
         setupRecyclerView()
         observeSellsList()
+        observePaymentConfirmation()
         loadSells()
     }
 
-    override fun onDestroyView() {
-        super.onDestroyView()
-        _binding = null
-    }
-
-
-
     private fun setupRecyclerView() {
+        Log.d(TAG, "Setting up RecyclerView")
         sellsAdapter = SellsAdapter(
-            onOrderClickListener = { sells ->
-                Log.d(TAG, "Order clicked: ${sells.orderId} in status '$status'")
-                navigateToSellsDetail(sells)
+            onOrderClickListener = { order ->
+                Log.d(TAG, "Order clicked: ${order.orderId}")
+                navigateToSellsDetail(order)
             },
             viewModel = viewModel
         )
 
-        Log.d(TAG, "Setting adapter fragment status to: '$status'")
         sellsAdapter.setFragmentStatus(status)
+        Log.d(TAG, "Adapter fragment status set to: '$status'")
 
         binding.rvSells.apply {
             layoutManager = LinearLayoutManager(requireContext())
             adapter = sellsAdapter
-            Log.d(TAG, "RecyclerView configured with LinearLayoutManager and adapter")
         }
-
-        // Log RecyclerView visibility and properties
-        Log.d(TAG, "RecyclerView visibility: ${binding.rvSells.visibility}")
-        Log.d(TAG, "RecyclerView parent: ${binding.rvSells.parent}")
+        Log.d(TAG, "RecyclerView configured")
     }
 
     private fun observeSellsList() {
+        Log.d(TAG, "Setting up sells list observer")
+
         viewModel.sells.observe(viewLifecycleOwner) { result ->
+            Log.d(TAG, "Sells list observer triggered with result: ${result.javaClass.simpleName}")
             when (result) {
                 is ViewState.Success -> {
                     binding.progressBar.visibility = View.GONE
+                    Log.d(TAG, "Data received: ${result.data?.size ?: 0} items")
 
                     if (result.data.isNullOrEmpty()) {
                         binding.tvEmptyState.visibility = View.VISIBLE
                         binding.rvSells.visibility = View.GONE
+                        Log.d(TAG, "Showing empty state")
+
                     } else {
+                        Log.d(TAG, "✅ Data is available: ${result.data.size} items")
                         binding.tvEmptyState.visibility = View.GONE
                         binding.rvSells.visibility = View.VISIBLE
-                        result.data.forEachIndexed { index, order ->
-                            Log.d(TAG, "Order $index:")
-                            Log.d(TAG, "  - ID: ${order.orderId}")
-                            Log.d(TAG, "  - Status: ${order.status}")
-                            Log.d(TAG, "  - Customer: ${order.username}")
-                            Log.d(TAG, "  - Total: ${order.totalAmount}")
-                            Log.d(TAG, "  - Items: ${order.orderItems?.size ?: 0}")
+// Log first few items for debugging
+                        result.data.take(3).forEachIndexed { index, order ->
+                            Log.d(TAG, "Order ${index + 1}: ID=${order.orderId}, Status=${order.status}, Customer=${order.username}")
                         }
-                        sellsAdapter.submitList(result.data)
 
-                        Log.d(TAG, "Final UI state:")
-                        Log.d(TAG, "  - ProgressBar visibility: ${binding.progressBar.visibility}")
-                        Log.d(TAG, "  - EmptyState visibility: ${binding.tvEmptyState.visibility}")
-                        Log.d(TAG, "  - RecyclerView visibility: ${binding.rvSells.visibility}")
-                        Log.d(TAG, "  - Adapter item count: ${sellsAdapter.itemCount}")
-                    }
+                        sellsAdapter.submitList(result.data)
+                        Log.d(TAG, "Data submitted to adapter")
+                        Log.d(TAG, "Adapter item count: ${sellsAdapter.itemCount}")                    }
                 }
                 is ViewState.Error -> {
+                    Log.e(TAG, "❌ ViewState.Error received: ${result.message}")
+
                     binding.progressBar.visibility = View.GONE
                     binding.tvEmptyState.visibility = View.VISIBLE
                     Toast.makeText(requireContext(), result.message, Toast.LENGTH_SHORT).show()
                 }
                 is ViewState.Loading -> {
                     binding.progressBar.visibility = View.VISIBLE
-                    binding.rvSells.visibility = View.GONE
-                    binding.tvEmptyState.visibility = View.GONE
+                }
+            }
+        }
+    }
+
+    private fun observePaymentConfirmation() {
+        viewModel.confirmPaymentStore.observe(viewLifecycleOwner) { result ->
+            when (result) {
+                is Result.Loading -> {
+                    // Handle loading state if needed
+                }
+                is Result.Success -> {
+                    Toast.makeText(requireContext(), "Payment confirmed successfully!", Toast.LENGTH_SHORT).show()
+                    loadSells()
+                }
+                is Result.Error -> {
+                    Toast.makeText(requireContext(), "Failed to payment confirm order: ${result.exception.message}", Toast.LENGTH_SHORT).show()
                 }
             }
         }
     }
 
     private fun loadSells() {
-        Log.d(TAG, "Calling viewModel.getSellList('$status')")
+        Log.d(TAG, "Loading sells with status: '$status'")
         viewModel.getSellList(status)
+        Log.d(TAG, "getSellList called")
     }
 
-    private fun navigateToSellsDetail(sells: OrdersItem) {
-        // In a real app, you would navigate to sells detail screen
-        // For example: findNavController().navigate(SellsListFragmentDirections.actionToSellsDetail(sells.orderId))
-        Toast.makeText(requireContext(), "Order ID: ${sells.orderId}", Toast.LENGTH_SHORT).show()
+    private fun navigateToSellsDetail(order: OrdersItem) {
+        Log.d(TAG, "Navigating to sells detail for order: ${order.orderId}")
+        // Navigate to order detail from seller's perspective
+        // Seller views customer's order details to manage fulfillment
+        Toast.makeText(requireContext(), "Customer Order ID: ${order.orderId}", Toast.LENGTH_SHORT).show()
+    }
+
+    override fun onDestroyView() {
+        super.onDestroyView()
+        _binding = null
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsProductAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsProductAdapter.kt
index 68a3cdf..2ece8da 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsProductAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsProductAdapter.kt
@@ -10,9 +10,15 @@ import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrderItemsItem
 import com.bumptech.glide.Glide
 
-class SellsProductAdapter(
-    private val items: List<OrderItemsItem?>
-) : RecyclerView.Adapter<SellsProductAdapter.ProductViewHolder>() {
+class SellsProductAdapter : RecyclerView.Adapter<SellsProductAdapter.ProductViewHolder>() {
+
+    private val items = mutableListOf<OrderItemsItem?>()
+
+    fun submitList(newItems: List<OrderItemsItem?>) {
+        items.clear()
+        items.addAll(newItems)
+        notifyDataSetChanged()
+    }
 
     inner class ProductViewHolder(view: View) : RecyclerView.ViewHolder(view) {
         val ivProduct: ImageView = view.findViewById(R.id.iv_order_product)
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt
index 37cd52b..85ead97 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt
@@ -1,14 +1,14 @@
 package com.alya.ecommerce_serang.ui.profile.mystore.sells
 
-import android.util.Log
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.FragmentActivity
 import androidx.viewpager2.adapter.FragmentStateAdapter
-import io.ktor.client.utils.EmptyContent.status
 
-class SellsViewPagerAdapter(fragmentActivity: FragmentActivity)
-    : FragmentStateAdapter(fragmentActivity) {
+class SellsViewPagerAdapter(
+    fragmentActivity: FragmentActivity
+) : FragmentStateAdapter(fragmentActivity) {
 
+    // Define all possible sells statuses - keeping your original list
     private val sellsStatuses = listOf(
         "all",          // Position 0: "Semua Pesanan"
         "pending",      // Position 1: "Menunggu Tagihan"
@@ -20,34 +20,10 @@ class SellsViewPagerAdapter(fragmentActivity: FragmentActivity)
         "canceled"      // Position 7: "Dibatalkan"
     )
 
-    init {
-        Log.d(TAG, "=== ViewPager Status Mapping ===")
-        sellsStatuses.forEachIndexed { index, status ->
-            val tabText = when(index) {
-                0 -> "Semua Pesanan"
-                1 -> "Menunggu Tagihan"
-                2 -> "Konfirmasi Bayar"
-                3 -> "Diproses"
-                4 -> "Sudah Dibayar"
-                5 -> "Dikirim"
-                6 -> "Selesai"
-                7 -> "Dibatalkan"
-                else -> "Tab $index"
-            }
-            Log.d(TAG, "Position $index: '$tabText' → Status: '$status'")
-        }
-        Log.d(TAG, "=== End Mapping ===")
-    }
-
-
     override fun getItemCount(): Int = sellsStatuses.size
 
     override fun createFragment(position: Int): Fragment {
-        Log.d(TAG, "Creating fragment for position $position with status: '$status'")
+        // Create a new instance of SellsListFragment with the appropriate status
         return SellsListFragment.newInstance(sellsStatuses[position])
     }
-
-    companion object {
-        private const val TAG = "SellsViewPagerAdapter"
-    }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/payment/DetailPaymentActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/payment/DetailPaymentActivity.kt
index 09e3fe8..7e9d252 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/payment/DetailPaymentActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/payment/DetailPaymentActivity.kt
@@ -1,11 +1,34 @@
 package com.alya.ecommerce_serang.ui.profile.mystore.sells.payment
 
+import android.app.Dialog
+import android.graphics.Color
+import android.graphics.drawable.ColorDrawable
+import android.graphics.drawable.Drawable
 import android.os.Bundle
+import android.view.View
+import android.view.ViewGroup
+import android.view.Window
+import android.widget.ImageButton
+import android.widget.ImageView
+import android.widget.ProgressBar
+import android.widget.TextView
+import android.widget.Toast
+import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
 import androidx.recyclerview.widget.LinearLayoutManager
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
+import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrdersItem
+import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
+import com.alya.ecommerce_serang.data.repository.SellsRepository
 import com.alya.ecommerce_serang.databinding.ActivityDetailPaymentBinding
 import com.alya.ecommerce_serang.ui.profile.mystore.sells.SellsProductAdapter
+import com.alya.ecommerce_serang.utils.BaseViewModelFactory
+import com.alya.ecommerce_serang.utils.SessionManager
+import com.alya.ecommerce_serang.utils.viewmodel.SellsViewModel
+import com.bumptech.glide.Glide
+import com.bumptech.glide.load.engine.DiskCacheStrategy
+import com.bumptech.glide.request.target.CustomTarget
 import com.google.gson.Gson
 import java.text.SimpleDateFormat
 import java.util.Locale
@@ -15,17 +38,37 @@ class DetailPaymentActivity : AppCompatActivity() {
 
     private lateinit var binding: ActivityDetailPaymentBinding
     private lateinit var sells: OrdersItem
+    private lateinit var productAdapter: SellsProductAdapter
+    private lateinit var sessionManager: SessionManager
+
+
+    private val viewModel: SellsViewModel by viewModels {
+        BaseViewModelFactory {
+            val apiService = ApiConfig.getApiService(sessionManager)
+            val sellsRepository = SellsRepository(apiService)
+            SellsViewModel(sellsRepository)
+        }
+    }
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         binding = ActivityDetailPaymentBinding.inflate(layoutInflater)
         setContentView(binding.root)
 
+        sessionManager = SessionManager(this)
+
         val orderJson = intent.getStringExtra("sells_data")
         sells = Gson().fromJson(orderJson, OrdersItem::class.java)
 
-        bindOrderDetails()
+        binding.header.headerLeftIcon.setOnClickListener {
+//            onBackPressed()
+            finish()
+        }
+
         setupRecyclerView()
+        bindOrderDetails()
+        setupPaymentEvidenceViewer()
+
     }
 
     private fun bindOrderDetails() = with(binding) {
@@ -42,15 +85,107 @@ class DetailPaymentActivity : AppCompatActivity() {
         tvOrderRecipient.text = sells.username
 //        tvOrderRecipientNum.text = sells.phone
         tvOrderRecipientAddress.text = sells.street
+//        sells.paymentEvidence
+
+        binding.btnConfirmPayment.setOnClickListener{
+            viewModel.confirmPayment(sells.orderId, "confirmed")
+            finish()
+        }
     }
 
     private fun setupRecyclerView() {
+        productAdapter = SellsProductAdapter()
+
         binding.rvProductItems.apply {
             layoutManager = LinearLayoutManager(this@DetailPaymentActivity)
-            adapter = SellsProductAdapter(sells.orderItems ?: emptyList())
+            adapter = productAdapter
+        }
+
+        // Submit the order items to the adapter
+        productAdapter.submitList(sells.orderItems ?: emptyList())
+    }
+
+    private fun setupPaymentEvidenceViewer() {
+        binding.tvPaymentDueDesc.setOnClickListener {
+            val paymentEvidence = sells.paymentEvidence
+            if (!paymentEvidence.isNullOrEmpty()) {
+                showPaymentEvidenceDialog(paymentEvidence)
+            } else {
+                Toast.makeText(this, "Bukti pembayaran tidak tersedia", Toast.LENGTH_SHORT).show()
+            }
         }
     }
 
+    private fun showPaymentEvidenceDialog(paymentEvidence: String) {
+        val dialog = Dialog(this)
+        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE)
+        dialog.setContentView(R.layout.dialog_image_viewer)
+        dialog.setCancelable(true)
+
+        // Set dialog to fullscreen
+        val window = dialog.window
+        window?.setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)
+        window?.setBackgroundDrawable(ColorDrawable(Color.BLACK))
+
+        // Get views from dialog
+        val imageView = dialog.findViewById<ImageView>(R.id.iv_payment_evidence)
+        val btnClose = dialog.findViewById<ImageButton>(R.id.btn_close)
+        val tvTitle = dialog.findViewById<TextView>(R.id.tv_title)
+        val progressBar = dialog.findViewById<ProgressBar>(R.id.progress_bar)
+
+        // Set title
+        tvTitle.text = "Bukti Pembayaran"
+
+        // Build image URL
+        val fullImageUrl = when (val img = paymentEvidence) {
+            is String -> {
+                if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+            }
+            else -> R.drawable.placeholder_image // Default image for null
+        }
+
+        // Show progress bar while loading
+        progressBar.visibility = View.VISIBLE
+
+        // Load image with Glide
+        Glide.with(this)
+            .load(fullImageUrl)
+            .placeholder(R.drawable.placeholder_image)
+            .error(R.drawable.placeholder_image)
+            .diskCacheStrategy(DiskCacheStrategy.ALL)
+            .into(object : CustomTarget<Drawable>() {
+                override fun onResourceReady(resource: Drawable, transition: com.bumptech.glide.request.transition.Transition<in Drawable>?) {
+                    progressBar.visibility = View.GONE
+                    imageView.setImageDrawable(resource)
+                }
+
+                override fun onLoadCleared(placeholder: Drawable?) {
+                    progressBar.visibility = View.GONE
+                    imageView.setImageDrawable(placeholder)
+                }
+
+                override fun onLoadFailed(errorDrawable: Drawable?) {
+                    progressBar.visibility = View.GONE
+                    imageView.setImageDrawable(errorDrawable)
+                    Toast.makeText(this@DetailPaymentActivity, "Gagal memuat gambar", Toast.LENGTH_SHORT).show()
+                }
+            })
+
+
+        // Close button click listener
+        btnClose.setOnClickListener {
+            dialog.dismiss()
+        }
+
+        // Click outside to close
+        imageView.setOnClickListener {
+            dialog.dismiss()
+        }
+
+        dialog.show()
+    }
+
+
     private fun formatDate(dateStr: String?): String {
         return try {
             val inputFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/shipment/DetailShipmentActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/shipment/DetailShipmentActivity.kt
index f52671c..e0b9969 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/shipment/DetailShipmentActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/shipment/DetailShipmentActivity.kt
@@ -15,17 +15,18 @@ class DetailShipmentActivity : AppCompatActivity() {
 
     private lateinit var binding: ActivityDetailShipmentBinding
     private lateinit var sells: OrdersItem
+    private lateinit var productAdapter: SellsProductAdapter
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         binding = ActivityDetailShipmentBinding.inflate(layoutInflater)
         setContentView(binding.root)
 
-        val orderJson = intent.getStringExtra("order_data")
+        val orderJson = intent.getStringExtra("sells_data")
         sells = Gson().fromJson(orderJson, OrdersItem::class.java)
 
-        bindOrderDetails()
         setupRecyclerView()
+        bindOrderDetails()
     }
 
     private fun bindOrderDetails() = with(binding) {
@@ -45,10 +46,15 @@ class DetailShipmentActivity : AppCompatActivity() {
     }
 
     private fun setupRecyclerView() {
+        productAdapter = SellsProductAdapter()
+
         binding.rvProductItems.apply {
             layoutManager = LinearLayoutManager(this@DetailShipmentActivity)
-            adapter = SellsProductAdapter(sells.orderItems ?: emptyList())
+            adapter = productAdapter
         }
+
+        // Submit the order items to the adapter
+        productAdapter.submitList(sells.orderItems ?: emptyList())
     }
 
     private fun formatDate(dateStr: String?): String {
diff --git a/app/src/main/java/com/alya/ecommerce_serang/utils/viewmodel/SellsViewModel.kt b/app/src/main/java/com/alya/ecommerce_serang/utils/viewmodel/SellsViewModel.kt
index 6fb5028..76cb4fe 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/utils/viewmodel/SellsViewModel.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/utils/viewmodel/SellsViewModel.kt
@@ -5,7 +5,9 @@ import androidx.lifecycle.LiveData
 import androidx.lifecycle.MutableLiveData
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
+import com.alya.ecommerce_serang.data.api.dto.PaymentConfirmRequest
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrdersItem
+import com.alya.ecommerce_serang.data.api.response.store.orders.PaymentConfirmationResponse
 import com.alya.ecommerce_serang.data.repository.Result
 import com.alya.ecommerce_serang.data.repository.SellsRepository
 import com.alya.ecommerce_serang.ui.order.address.ViewState
@@ -20,66 +22,159 @@ class SellsViewModel(private val repository: SellsRepository) : ViewModel() {
     private val _sells = MutableLiveData<ViewState<List<OrdersItem>>>()
     val sells: LiveData<ViewState<List<OrdersItem>>> = _sells
 
+    private val _confirmPaymentStore = MutableLiveData<Result<PaymentConfirmationResponse>>()
+    val confirmPaymentStore: LiveData<Result<PaymentConfirmationResponse>> = _confirmPaymentStore
+
     fun getSellList(status: String) {
+        Log.d(TAG, "========== Starting getSellList ==========")
         Log.d(TAG, "Requested status: '$status'")
+        Log.d(TAG, "Repository instance: ${repository.javaClass.simpleName}")
+
         _sells.value = ViewState.Loading
+        Log.d(TAG, "ViewState set to Loading")
 
         viewModelScope.launch {
-            _sells.value = ViewState.Loading
+            Log.d(TAG, "Coroutine launched successfully")
 
             try {
+                Log.d(TAG, "Calling repository.getSellList(status='$status')")
+                val startTime = System.currentTimeMillis()
+
                 when (val result = repository.getSellList(status)) {
                     is Result.Success -> {
+                        val endTime = System.currentTimeMillis()
+                        Log.d(TAG, "Repository call completed in ${endTime - startTime}ms")
+                        Log.d(TAG, "Result.Success received from repository")
+
+                        // Log the entire result data structure
+                        Log.d(TAG, "Raw result data: ${result.data}")
+                        Log.d(TAG, "Result data class: ${result.data?.javaClass?.simpleName}")
+
                         val orders = result.data.orders
-                        Log.d(TAG, "Orders list: $orders")
+                        Log.d(TAG, "Extracted orders list: $orders")
+                        Log.d(TAG, "Orders list class: ${orders?.javaClass?.simpleName}")
                         Log.d(TAG, "Orders count: ${orders?.size ?: 0}")
 
-                        // Log individual order details
-                        orders?.forEachIndexed { index, order ->
-                            Log.d(TAG, "Order $index:")
-                            Log.d(TAG, "  - ID: ${order.orderId}")
-                            Log.d(TAG, "  - Status: ${order.status}")
-                            Log.d(TAG, "  - Customer: ${order.username}")
-                            Log.d(TAG, "  - Total: ${order.totalAmount}")
-                            Log.d(TAG, "  - Items count: ${order.orderItems?.size ?: 0}")
-                            Log.d(TAG, "  - Updated at: ${order.updatedAt}")
+                        // Check if orders list is null or empty
+                        if (orders == null) {
+                            Log.w(TAG, "⚠️ Orders list is NULL")
+                        } else if (orders.isEmpty()) {
+                            Log.w(TAG, "⚠️ Orders list is EMPTY")
+                        } else {
+                            Log.d(TAG, "✅ Orders list contains ${orders.size} items")
+
+                            // Log individual order details with more comprehensive info
+                            orders.forEachIndexed { index, order ->
+                                Log.d(TAG, "--- Order ${index + 1}/${orders.size} ---")
+                                Log.d(TAG, "  Order object: $order")
+                                Log.d(TAG, "  Order class: ${order?.javaClass?.simpleName}")
+                                Log.d(TAG, "  - ID: ${order?.orderId}")
+                                Log.d(TAG, "  - Status: '${order?.status}'")
+                                Log.d(TAG, "  - Customer: '${order?.username}'")
+                                Log.d(TAG, "  - Total: ${order?.totalAmount}")
+                                Log.d(TAG, "  - Items count: ${order?.orderItems?.size ?: 0}")
+                                Log.d(TAG, "  - Created at: ${order?.createdAt}")
+                                Log.d(TAG, "  - Updated at: ${order?.updatedAt}")
+
+                                // Log order items if available
+                                order?.orderItems?.let { items ->
+                                    Log.d(TAG, "  Order items:")
+                                    items.forEachIndexed { itemIndex, item ->
+                                        Log.d(TAG, "    Item ${itemIndex + 1}: ${item?.productName} (Qty: ${item?.quantity})")
+                                    }
+                                }
+                            }
                         }
-                        _sells.value = ViewState.Success(result.data.orders)
-                        Log.d("SellsViewModel", "Sells loaded successfully: ${result.data.orders?.size} items")
+
+                        // Set the ViewState to Success
+                        _sells.value = ViewState.Success(orders ?: emptyList())
+                        Log.d(TAG, "✅ ViewState.Success set with ${orders?.size ?: 0} orders")
                     }
+
                     is Result.Error -> {
-                        _sells.value = ViewState.Error(result.exception.message ?: "Unknown error occurred")
-                        Log.e("SellsViewModel", "Error loading sells", result.exception)
+                        val endTime = System.currentTimeMillis()
+                        Log.e(TAG, "Repository call failed in ${endTime - startTime}ms")
+                        Log.e(TAG, "❌ Result.Error received from repository")
+                        Log.e(TAG, "Error message: ${result.exception.message}")
+                        Log.e(TAG, "Exception type: ${result.exception.javaClass.simpleName}")
+                        Log.e(TAG, "Exception stack trace:", result.exception)
+
+                        val errorMessage = result.exception.message ?: "Unknown error occurred"
+                        _sells.value = ViewState.Error(errorMessage)
+                        Log.d(TAG, "ViewState.Error set with message: '$errorMessage'")
                     }
+
                     is Result.Loading -> {
-                        null
+                        Log.d(TAG, "Result.Loading received from repository (this is unusual)")
+                        // Keep the current loading state
                     }
                 }
+
             } catch (e: Exception) {
-                _sells.value = ViewState.Error("An unexpected error occurred: ${e.message}")
-                Log.e("SellsViewModel", "Exception in getOrderList", e)
+                Log.e(TAG, "❌ Exception caught in getSellList")
+                Log.e(TAG, "Exception type: ${e.javaClass.simpleName}")
+                Log.e(TAG, "Exception message: ${e.message}")
+                Log.e(TAG, "Exception stack trace:", e)
+
+                val errorMessage = "An unexpected error occurred: ${e.message}"
+                _sells.value = ViewState.Error(errorMessage)
+                Log.d(TAG, "ViewState.Error set due to exception: '$errorMessage'")
             }
         }
+
+        Log.d(TAG, "========== getSellList method completed ==========")
     }
 
     fun updateOrderStatus(orderId: Int?, status: String) {
-        Log.d(TAG, "Updating order status: orderId=$orderId, status=$status")
+        Log.d(TAG, "========== Starting updateOrderStatus ==========")
+        Log.d(TAG, "Updating order status: orderId=$orderId, status='$status'")
+
         viewModelScope.launch {
             try {
+                Log.d(TAG, "Calling repository.updateOrderStatus")
+                val startTime = System.currentTimeMillis()
+
                 repository.updateOrderStatus(orderId, status)
-                Log.d(TAG, "Order status updated successfully: orderId=$orderId, status=$status")
+
+                val endTime = System.currentTimeMillis()
+                Log.d(TAG, "✅ Order status updated successfully in ${endTime - startTime}ms")
+                Log.d(TAG, "Updated orderId=$orderId to status='$status'")
+
             } catch (e: Exception) {
-                Log.e(TAG, "Error updating order status", e)
+                Log.e(TAG, "❌ Error updating order status")
+                Log.e(TAG, "Exception type: ${e.javaClass.simpleName}")
+                Log.e(TAG, "Exception message: ${e.message}")
+                Log.e(TAG, "Exception stack trace:", e)
             }
         }
+
+        Log.d(TAG, "========== updateOrderStatus method completed ==========")
+    }
+
+    fun confirmPayment(orderId: Int, status: String) {
+        Log.d(TAG, "Confirming order completed: orderId=$orderId, status=$status")
+        viewModelScope.launch {
+            _confirmPaymentStore.value = Result.Loading
+            val request = PaymentConfirmRequest(orderId, status)
+
+            Log.d(TAG, "Sending order completion request: $request")
+            val result = repository.confirmPaymentStore(request)
+            Log.d(TAG, "Order completion result: $result")
+            _confirmPaymentStore.value = result
+        }
     }
 
     fun refreshOrders(status: String = "all") {
-        Log.d(TAG, "Refreshing orders with status: $status")
+        Log.d(TAG, "========== Starting refreshOrders ==========")
+        Log.d(TAG, "Refreshing orders with status: '$status'")
+
         // Clear current orders before fetching new ones
         _sells.value = ViewState.Loading
+        Log.d(TAG, "ViewState set to Loading for refresh")
 
         // Re-fetch the orders with the current status
         getSellList(status)
+
+        Log.d(TAG, "========== refreshOrders method completed ==========")
     }
 }
\ No newline at end of file
diff --git a/app/src/main/res/layout/dialog_image_viewer.xml b/app/src/main/res/layout/dialog_image_viewer.xml
new file mode 100644
index 0000000..b7e6f66
--- /dev/null
+++ b/app/src/main/res/layout/dialog_image_viewer.xml
@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:background="@android:color/black">
+
+    <!-- Header with title and close button -->
+    <LinearLayout
+        android:id="@+id/header_layout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        android:padding="16dp"
+        android:gravity="center_vertical"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent">
+
+        <TextView
+            android:id="@+id/tv_title"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:text="Bukti Pembayaran"
+            android:textColor="@android:color/white"
+            android:textSize="18sp"
+            android:textStyle="bold" />
+
+        <ImageButton
+            android:id="@+id/btn_close"
+            android:layout_width="48dp"
+            android:layout_height="48dp"
+            android:background="?attr/selectableItemBackgroundBorderless"
+            android:src="@drawable/ic_close"
+            android:contentDescription="Close"
+            app:tint="@android:color/white" />
+
+    </LinearLayout>
+
+    <!-- Progress bar for loading -->
+    <ProgressBar
+        android:id="@+id/progress_bar"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:visibility="gone"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent" />
+
+    <!-- Main image view -->
+    <ImageView
+        android:id="@+id/iv_payment_evidence"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_margin="16dp"
+        android:scaleType="centerInside"
+        android:contentDescription="Payment Evidence"
+        app:layout_constraintTop_toBottomOf="@+id/header_layout"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_sells.xml b/app/src/main/res/layout/fragment_sells.xml
index 9992f7c..70e8e3f 100644
--- a/app/src/main/res/layout/fragment_sells.xml
+++ b/app/src/main/res/layout/fragment_sells.xml
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.coordinatorlayout.widget.CoordinatorLayout
+<androidx.constraintlayout.widget.ConstraintLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
@@ -9,7 +9,7 @@
     tools:context=".ui.profile.mystore.sells.SellsFragment">
 
     <com.google.android.material.tabs.TabLayout
-        android:id="@+id/tab_layout_sells"
+        android:id="@+id/tabLayoutSells"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         app:tabMode="scrollable"
@@ -19,12 +19,14 @@
         app:tabSelectedTextColor="@color/blue_500"
         app:tabTextColor="@color/black_300"
         app:tabBackground="@color/white"
-        app:tabPadding="13dp"/>
+        app:tabPadding="13dp"
+        app:layout_constraintTop_toTopOf="parent"/>
 
     <androidx.viewpager2.widget.ViewPager2
-        android:id="@+id/view_pager_sells"
+        android:id="@+id/viewPagerSells"
         android:layout_width="match_parent"
         android:layout_height="0dp"
-        android:layout_weight="1" />
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/tabLayoutSells"  />
 
-</androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_sells_list.xml b/app/src/main/res/layout/fragment_sells_list.xml
index 3f2c4db..c74d548 100644
--- a/app/src/main/res/layout/fragment_sells_list.xml
+++ b/app/src/main/res/layout/fragment_sells_list.xml
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
-<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
@@ -7,14 +7,16 @@
     tools:context=".ui.profile.mystore.sells.SellsListFragment">
 
     <androidx.recyclerview.widget.RecyclerView
-        android:id="@+id/rv_sells"
+        android:id="@+id/rvSells"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
+        android:clipToPadding="false"
+        android:padding="8dp"
         app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
         tools:listitem="@layout/item_sells" />
 
     <TextView
-        android:id="@+id/tv_empty_state"
+        android:id="@+id/tvEmptyState"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="TIdak ada penjualan"
@@ -26,7 +28,7 @@
         app:layout_constraintTop_toTopOf="parent" />
 
     <ProgressBar
-        android:id="@+id/progress_bar"
+        android:id="@+id/progressBar"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:visibility="gone"
@@ -35,4 +37,4 @@
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toTopOf="parent" />
 
-</FrameLayout>
\ No newline at end of file
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/item_sells.xml b/app/src/main/res/layout/item_sells.xml
index d7ae883..00cf599 100644
--- a/app/src/main/res/layout/item_sells.xml
+++ b/app/src/main/res/layout/item_sells.xml
@@ -1,873 +1,163 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:orientation="vertical">
+    android:layout_marginBottom="8dp"
+    app:cardCornerRadius="8dp"
+    app:cardElevation="2dp">
 
     <androidx.constraintlayout.widget.ConstraintLayout
-        android:id="@+id/layout_orders"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:background="@color/white"
-        android:paddingTop="16dp">
+        android:padding="16dp">
 
-        <!-- Order Header -->
-        <View
-            android:id="@+id/shape_order_title"
-            android:layout_width="4dp"
-            android:layout_height="48dp"
-            android:background="@drawable/shape_sells_title"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toTopOf="parent"/>
-
-        <LinearLayout
-            android:id="@+id/layout_order_header"
-            android:layout_width="220dp"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="12dp"
-            app:layout_constraintStart_toStartOf="@id/shape_order_title"
-            app:layout_constraintTop_toTopOf="parent"
-            android:orientation="vertical">
-
-            <TextView
-                android:id="@+id/tv_order_title"
-                style="@style/label_medium_prominent"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                android:text="Pesanan Belum Dibayar"/>
-
-            <TextView
-                android:id="@+id/tv_order_number"
-                style="@style/label_small"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                android:textColor="@color/black_300"
-                android:text="No. Pesanan: 123456789"/>
-
-            <LinearLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:orientation="horizontal">
-
-                <ImageView
-                    android:layout_width="16dp"
-                    android:layout_height="16dp"
-                    android:src="@drawable/ic_person"/>
-
-                <TextView
-                    android:id="@+id/tv_order_customer"
-                    style="@style/label_small"
-                    android:layout_width="match_parent"
-                    android:layout_height="wrap_content"
-                    android:maxLines="1"
-                    android:layout_marginStart="4dp"
-                    android:textColor="@color/black_300"
-                    android:text="Gracia Hotmauli"/>
-
-            </LinearLayout>
-
-        </LinearLayout>
-
-        <LinearLayout
+        <TextView
+            android:id="@+id/tvUserName"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
+            android:textColor="@android:color/black"
+            android:textSize="16sp"
+            android:textStyle="bold"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            tools:text="Customer Name" />
+
+        <TextView
+            android:id="@+id/tvOrderStatus"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:textColor="@color/blue_500"
+            android:textSize="14sp"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintTop_toTopOf="parent"
-            android:orientation="vertical"
-            android:layout_marginEnd="16dp"
-            android:gravity="end">
-
-            <TextView
-                android:layout_width="150dp"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                style="@style/label_small"
-                android:textAlignment="textEnd"
-                android:text="Batas waktu pembayaran:"
-                android:textColor="@color/black_300" />
-
-            <TextView
-                android:id="@+id/tv_order_due"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="25 Okt; 23.59"
-                style="@style/label_small"
-                android:paddingHorizontal="4dp"
-                android:textColor="@color/darkblue_500"
-                android:background="@drawable/bg_product_active" />
-
-        </LinearLayout>
-
-        <!-- Order Detail -->
-        <LinearLayout
-            android:id="@+id/layout_order_detail"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/layout_order_header"
-            android:paddingHorizontal="16dp"
-            android:layout_marginTop="8dp"
-            android:orientation="vertical">
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Product Detail -->
-            <androidx.constraintlayout.widget.ConstraintLayout
-                android:id="@+id/layout_order_product_detail"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:paddingVertical="12dp">
-
-                <com.google.android.material.imageview.ShapeableImageView
-                    android:id="@+id/iv_order_product"
-                    android:layout_width="95dp"
-                    android:layout_height="64dp"
-                    android:src="@drawable/placeholder_image"
-                    android:scaleType="centerCrop"
-                    android:contentDescription="Order Product Image"
-                    app:shapeAppearanceOverlay="@style/store_product_image"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintTop_toTopOf="parent"/>
-
-                <LinearLayout
-                    android:layout_width="0dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_marginStart="13dp"
-                    app:layout_constraintStart_toEndOf="@id/iv_order_product"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintTop_toTopOf="parent">
-
-                    <TextView
-                        android:id="@+id/tv_order_product_name"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="Jaket Pink Fuschia"
-                        style="@style/label_medium_prominent"/>
-
-    <!--                <TextView-->
-    <!--                    android:id="@+id/tv_order_product_variant"-->
-    <!--                    android:layout_width="match_parent"-->
-    <!--                    android:layout_height="wrap_content"-->
-    <!--                    android:maxLines="1"-->
-    <!--                    android:text="S"-->
-    <!--                    style="@style/label_medium"-->
-    <!--                    android:textColor="@color/black_300"/>-->
-
-                </LinearLayout>
-
-                <LinearLayout
-                    android:layout_width="0dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_marginStart="13dp"
-                    android:gravity="end"
-                    app:layout_constraintStart_toEndOf="@id/iv_order_product"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintBottom_toBottomOf="@id/iv_order_product">
-
-                    <TextView
-                        android:id="@+id/tv_order_product_qty"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="x2"
-                        style="@style/label_medium"
-                        android:textColor="@color/black_300"
-                        android:textAlignment="textEnd"/>
-
-                    <TextView
-                        android:id="@+id/tv_order_product_price"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="Rp150.000"
-                        style="@style/label_medium"
-                        android:textAlignment="textEnd"/>
-
-                </LinearLayout>
-
-                <TextView
-                    android:id="@+id/tv_see_more_order"
-                    android:layout_width="match_parent"
-                    android:layout_height="wrap_content"
-                    android:focusable="true"
-                    android:text="Lihat 3 produk lainnya"
-                    android:gravity="center"
-                    style="@style/label_small"
-                    android:fontFamily="@font/dmsans_italic"
-                    android:textColor="@color/black_300"
-                    app:layout_constraintTop_toBottomOf="@id/iv_order_product"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    android:layout_marginVertical="8dp"
-                    android:clickable="true"
-                    android:visibility="gone"/>
-
-            </androidx.constraintlayout.widget.ConstraintLayout>
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Total Price -->
-            <RelativeLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:paddingVertical="8dp">
-
-                <TextView
-                    android:id="@+id/tv_order_qty"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:text="2 produk"
-                    style="@style/label_large"
-                    android:layout_alignParentStart="true"/>
-
-                <LinearLayout
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:orientation="horizontal"
-                    android:layout_alignParentEnd="true">
-
-                    <TextView
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:text="Total:"
-                        style="@style/label_large_prominent"
-                        android:textAlignment="textEnd"/>
-
-                    <TextView
-                        android:id="@+id/tv_order_price"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:text="Rp300.000"
-                        style="@style/label_large_prominent"
-                        android:textColor="@color/blue_500"
-                        android:layout_marginStart="5dp"
-                        android:textAlignment="textEnd"/>
-
-                </LinearLayout>
-
-            </RelativeLayout>
-
-<!--            <View-->
-<!--                android:layout_width="match_parent"-->
-<!--                android:layout_height="1dp"-->
-<!--                android:background="@color/black_50"/>-->
-<!--    -->
-<!--            &lt;!&ndash; Action Buttons &ndash;&gt;-->
-<!--    -->
-<!--            <LinearLayout-->
-<!--                android:layout_width="match_parent"-->
-<!--                android:layout_height="wrap_content"-->
-<!--                android:layout_marginTop="13dp"-->
-<!--                android:orientation="horizontal">-->
-<!--    -->
-<!--                <Button-->
-<!--                    android:id="@+id/btn_edit_order"-->
-<!--                    style="@style/button.small.secondary.medium"-->
-<!--                    android:text="Ubah Tagihan"-->
-<!--                    android:layout_marginEnd="10dp"/>-->
-<!--    -->
-<!--                <Button-->
-<!--                    android:id="@+id/btn_confirm_order"-->
-<!--                    style="@style/button.small.active.medium"-->
-<!--                    android:text="Konfirmasi Tagihan" />-->
-<!--    -->
-<!--            </LinearLayout>-->
-
-        </LinearLayout>
+            android:visibility="gone"
+            tools:text="Menunggu Tagihan" />
 
         <View
+            android:id="@+id/divider"
             android:layout_width="match_parent"
-            android:layout_height="8dp"
-            android:background="@color/black_50"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/layout_order_detail"/>
+            android:layout_height="1dp"
+            android:layout_marginTop="8dp"
+            android:background="#E0E0E0"
+            app:layout_constraintTop_toBottomOf="@+id/tvUserName" />
 
-    </androidx.constraintlayout.widget.ConstraintLayout>
-
-    <androidx.constraintlayout.widget.ConstraintLayout
-        android:id="@+id/layout_payments"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:background="@color/white"
-        android:paddingTop="16dp">
-
-        <!-- Payment Header -->
-        <View
-            android:id="@+id/shape_payment_order_title"
-            android:layout_width="4dp"
-            android:layout_height="32dp"
-            android:background="@drawable/shape_sells_title"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toTopOf="parent"/>
-
-        <LinearLayout
-            android:id="@+id/layout_payment_order_header"
-            android:layout_width="220dp"
+        <androidx.recyclerview.widget.RecyclerView
+            android:id="@+id/rvSellsItems"
+            android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginStart="12dp"
-            app:layout_constraintStart_toStartOf="@id/shape_payment_order_title"
-            app:layout_constraintTop_toTopOf="parent"
-            android:orientation="vertical">
+            android:layout_marginTop="8dp"
+            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
+            app:layout_constraintTop_toBottomOf="@+id/divider"
+            tools:itemCount="1"
+            tools:listitem="@layout/item_order_product" />
 
-            <TextView
-                android:id="@+id/tv_payment_title"
-                style="@style/label_medium_prominent"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                android:text="Pesanan Telah Dibayar"/>
-
-            <TextView
-                android:id="@+id/tv_payment_number"
-                style="@style/label_small"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                android:textColor="@color/black_300"
-                android:text="No. Pesanan: 123456789"/>
-
-        </LinearLayout>
-
-        <LinearLayout
+        <TextView
+            android:id="@+id/tvShowMores"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
+            android:layout_marginTop="8dp"
+            android:gravity="center_vertical"
+            android:textColor="@android:color/darker_gray"
+            android:textSize="14sp"
+            android:visibility="gone"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/rvSellsItems"
             app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintTop_toTopOf="parent"
-            android:orientation="vertical"
-            android:layout_marginEnd="16dp"
-            android:gravity="end">
-
-            <TextView
-                android:id="@+id/tv_payment_due_desc"
-                android:layout_width="150dp"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                style="@style/label_small"
-                android:textAlignment="textEnd"
-                android:text="Konfirmasi pembayaran sebelum:"
-                android:textColor="@color/black_300" />
-
-            <TextView
-                android:id="@+id/tv_payment_due"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="25 Okt; 23.59"
-                style="@style/label_small"
-                android:paddingHorizontal="4dp"
-                android:textColor="@color/darkblue_500"
-                android:background="@drawable/bg_product_active" />
-
-        </LinearLayout>
-
-        <!-- Order Detail -->
-        <LinearLayout
-            android:id="@+id/layout_payment_detail"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/layout_payment_order_header"
-            android:paddingHorizontal="16dp"
-            android:layout_marginTop="8dp"
-            android:orientation="vertical">
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Product Detail -->
-            <androidx.constraintlayout.widget.ConstraintLayout
-                android:id="@+id/layout_payment_product_detail"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:paddingVertical="12dp">
-
-                <com.google.android.material.imageview.ShapeableImageView
-                    android:id="@+id/iv_payment_product"
-                    android:layout_width="95dp"
-                    android:layout_height="64dp"
-                    android:src="@drawable/placeholder_image"
-                    android:scaleType="centerCrop"
-                    android:contentDescription="Payment Product Image"
-                    app:shapeAppearanceOverlay="@style/store_product_image"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintTop_toTopOf="parent"/>
-
-                <LinearLayout
-                    android:layout_width="0dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_marginStart="13dp"
-                    app:layout_constraintStart_toEndOf="@id/iv_payment_product"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintTop_toTopOf="parent">
-
-                    <TextView
-                        android:id="@+id/tv_payment_product_name"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="Jaket Pink Fuschia"
-                        style="@style/label_medium_prominent"/>
-
-                    <!--                <TextView-->
-                    <!--                    android:id="@+id/tv_payment_product_variant"-->
-                    <!--                    android:layout_width="match_parent"-->
-                    <!--                    android:layout_height="wrap_content"-->
-                    <!--                    android:maxLines="1"-->
-                    <!--                    android:text="S"-->
-                    <!--                    style="@style/label_medium"-->
-                    <!--                    android:textColor="@color/black_300"/>-->
-
-                </LinearLayout>
-
-                <LinearLayout
-                    android:layout_width="0dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_marginStart="13dp"
-                    android:gravity="end"
-                    app:layout_constraintStart_toEndOf="@id/iv_payment_product"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintBottom_toBottomOf="@id/iv_payment_product">
-
-                    <TextView
-                        android:id="@+id/tv_payment_product_qty"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="x2"
-                        style="@style/label_medium"
-                        android:textColor="@color/black_300"
-                        android:textAlignment="textEnd"/>
-
-                    <TextView
-                        android:id="@+id/tv_payment_product_price"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="Rp150.000"
-                        style="@style/label_medium"
-                        android:textAlignment="textEnd"/>
-
-                </LinearLayout>
-
-                <TextView
-                    android:id="@+id/tv_see_more_payment"
-                    android:layout_width="match_parent"
-                    android:layout_height="wrap_content"
-                    android:focusable="true"
-                    android:text="Lihat 3 produk lainnya"
-                    android:gravity="center"
-                    style="@style/label_small"
-                    android:fontFamily="@font/dmsans_italic"
-                    android:textColor="@color/black_300"
-                    app:layout_constraintTop_toBottomOf="@id/iv_payment_product"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    android:layout_marginVertical="8dp"
-                    android:clickable="true"
-                    android:visibility="gone"/>
-
-            </androidx.constraintlayout.widget.ConstraintLayout>
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Total Price -->
-            <RelativeLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:paddingVertical="8dp">
-
-                <TextView
-                    android:id="@+id/tv_payment_qty"
-                    style="@style/label_large"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:layout_alignParentStart="true"
-                    android:text="2 produk" />
-
-                <LinearLayout
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:orientation="horizontal"
-                    android:layout_alignParentEnd="true">
-
-                    <TextView
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:text="Total:"
-                        style="@style/label_large_prominent"
-                        android:textAlignment="textEnd"/>
-
-                    <TextView
-                        android:id="@+id/tv_payment_price"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:text="Rp300.000"
-                        style="@style/label_large_prominent"
-                        android:textColor="@color/blue_500"
-                        android:layout_marginStart="5dp"
-                        android:textAlignment="textEnd"/>
-
-                </LinearLayout>
-
-            </RelativeLayout>
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Action Buttons -->
-
-            <RelativeLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="13dp"
-                android:gravity="center_vertical">
-
-                <LinearLayout
-                    android:layout_width="158dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_alignParentStart="true">
-
-                    <LinearLayout
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:orientation="horizontal">
-
-                        <ImageView
-                            android:layout_width="16dp"
-                            android:layout_height="16dp"
-                            android:src="@drawable/ic_person"
-                            app:tint="@color/black_500" />
-
-                        <TextView
-                            android:id="@+id/tv_payment_customer"
-                            style="@style/label_small"
-                            android:layout_width="match_parent"
-                            android:layout_height="wrap_content"
-                            android:maxLines="1"
-                            android:layout_marginStart="4dp"
-                            android:textColor="@color/black_500"
-                            android:text="Gracia Hotmauli"/>
-
-                    </LinearLayout>
-
-                    <LinearLayout
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:orientation="horizontal">
-
-                        <ImageView
-                            android:layout_width="16dp"
-                            android:layout_height="16dp"
-                            android:src="@drawable/ic_location" />
-
-                        <TextView
-                            android:id="@+id/tv_payment_location"
-                            style="@style/label_small"
-                            android:layout_width="match_parent"
-                            android:layout_height="wrap_content"
-                            android:maxLines="1"
-                            android:layout_marginStart="4dp"
-                            android:textColor="@color/black_500"
-                            android:text="Serang"/>
-
-                    </LinearLayout>
-
-                </LinearLayout>
-
-                <Button
-                    android:id="@+id/btn_confirm_payment"
-                    style="@style/button.small.active.medium"
-                    android:text="Konfirmasi Pembayaran"
-                    android:layout_alignParentEnd="true"/>
-
-            </RelativeLayout>
-
-        </LinearLayout>
+            tools:text="@string/show_more_product" />
 
         <View
+            android:id="@+id/divider2"
             android:layout_width="match_parent"
-            android:layout_height="8dp"
-            android:background="@color/black_50"
-            android:layout_marginTop="16dp"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/layout_payment_detail"/>
+            android:layout_height="1dp"
+            android:layout_marginTop="8dp"
+            android:background="#E0E0E0"
+            app:layout_constraintTop_toBottomOf="@+id/tvShowMores" />
 
-    </androidx.constraintlayout.widget.ConstraintLayout>
-
-    <androidx.constraintlayout.widget.ConstraintLayout
-        android:id="@+id/layout_shipments"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:background="@color/white"
-        android:paddingTop="16dp">
-
-        <!-- Shipment Header -->
-        <View
-            android:id="@+id/shape_shipment_order_title"
-            android:layout_width="4dp"
-            android:layout_height="32dp"
-            android:background="@drawable/shape_sells_title"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toTopOf="parent"/>
-
-        <LinearLayout
-            android:id="@+id/layout_shipment_order_header"
-            android:layout_width="220dp"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="12dp"
-            app:layout_constraintStart_toStartOf="@id/shape_shipment_order_title"
-            app:layout_constraintTop_toTopOf="parent"
-            android:orientation="vertical">
-
-            <TextView
-                android:id="@+id/tv_shipment_title"
-                style="@style/label_medium_prominent"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                android:text="Pesanan Perlu Dikirim"/>
-
-            <TextView
-                android:id="@+id/tv_shipment_number"
-                style="@style/label_small"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                android:textColor="@color/black_300"
-                android:text="No. Pesanan: 123456789"/>
-
-        </LinearLayout>
-
-        <LinearLayout
+        <TextView
+            android:id="@+id/tv_count_total_items"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
+            android:layout_marginTop="8dp"
+            android:text="@string/item_count_prod"
+            android:textSize="14sp"
+            android:fontFamily="@font/dmsans_bold"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/divider2" />
+
+        <TextView
+            android:id="@+id/tvTotalLabel"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="8dp"
+            android:text="@string/total_order"
+            android:textColor="@android:color/black"
+            android:textSize="14sp"
+            android:fontFamily="@font/dmsans_bold"
+            app:layout_constraintEnd_toStartOf="@+id/tvTotalAmounts"
+            app:layout_constraintTop_toBottomOf="@+id/divider2"/>
+
+        <TextView
+            android:id="@+id/tvTotalAmounts"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="8dp"
+            android:textColor="@android:color/black"
+            android:textSize="14sp"
+            android:fontFamily="@font/dmsans_semibold"
             app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintTop_toTopOf="parent"
-            android:orientation="vertical"
-            android:layout_marginEnd="16dp"
-            android:gravity="end">
+            app:layout_constraintTop_toBottomOf="@+id/divider2"
+            tools:text="Rp500.000" />
 
-            <TextView
-                android:layout_width="150dp"
-                android:layout_height="wrap_content"
-                android:maxLines="1"
-                style="@style/label_small"
-                android:textAlignment="textEnd"
-                android:text="Kirim sebelum:"
-                android:textColor="@color/black_300" />
-
-            <TextView
-                android:id="@+id/tv_shipment_due"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="25 Okt; 23.59"
-                style="@style/label_small"
-                android:paddingHorizontal="4dp"
-                android:textColor="@color/darkblue_500"
-                android:background="@drawable/bg_product_active" />
-
-        </LinearLayout>
-
-        <!-- Order Detail -->
-        <LinearLayout
-            android:id="@+id/layout_shipment_detail"
+        <TextView
+            android:id="@+id/tvDeadlineLabel"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/layout_shipment_order_header"
-            android:paddingHorizontal="16dp"
             android:layout_marginTop="8dp"
-            android:orientation="vertical">
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Product Detail -->
-            <androidx.constraintlayout.widget.ConstraintLayout
-                android:id="@+id/layout_shipment_product_detail"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:paddingVertical="12dp">
-
-                <com.google.android.material.imageview.ShapeableImageView
-                    android:id="@+id/iv_shipment_product"
-                    android:layout_width="95dp"
-                    android:layout_height="48dp"
-                    android:src="@drawable/placeholder_image"
-                    android:scaleType="centerCrop"
-                    android:contentDescription="Shipment Product Image"
-                    app:shapeAppearanceOverlay="@style/store_product_image"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintTop_toTopOf="parent"/>
-
-                <LinearLayout
-                    android:layout_width="0dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_marginStart="13dp"
-                    app:layout_constraintStart_toEndOf="@id/iv_shipment_product"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintTop_toTopOf="parent">
-
-                    <TextView
-                        android:id="@+id/tv_shipment_product_name"
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:maxLines="1"
-                        android:text="Jaket Pink Fuschia"
-                        style="@style/label_medium_prominent"/>
-
-                    <!--                <TextView-->
-                    <!--                    android:id="@+id/tv_shipment_product_variant"-->
-                    <!--                    android:layout_width="match_parent"-->
-                    <!--                    android:layout_height="wrap_content"-->
-                    <!--                    android:maxLines="1"-->
-                    <!--                    android:text="S"-->
-                    <!--                    style="@style/label_medium"-->
-                    <!--                    android:textColor="@color/black_300"/>-->
-
-                </LinearLayout>
-
-                <TextView
-                    android:id="@+id/tv_shipment_product_qty"
-                    android:layout_width="0dp"
-                    android:layout_height="wrap_content"
-                    android:maxLines="1"
-                    android:text="x2"
-                    style="@style/label_medium"
-                    android:layout_marginStart="13dp"
-                    android:gravity="end"
-                    android:textAlignment="textEnd"
-                    app:layout_constraintStart_toEndOf="@id/iv_shipment_product"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintBottom_toBottomOf="@id/iv_shipment_product"/>
-
-                <TextView
-                    android:id="@+id/tv_see_more_shipment"
-                    android:layout_width="match_parent"
-                    android:layout_height="wrap_content"
-                    android:focusable="true"
-                    android:text="Lihat 3 produk lainnya"
-                    android:gravity="center"
-                    style="@style/label_small"
-                    android:fontFamily="@font/dmsans_italic"
-                    android:textColor="@color/black_300"
-                    app:layout_constraintTop_toBottomOf="@id/iv_shipment_product"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintEnd_toEndOf="parent"
-                    android:layout_marginVertical="8dp"
-                    android:clickable="true"
-                    android:visibility="gone"/>
-
-            </androidx.constraintlayout.widget.ConstraintLayout>
-
-            <View
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:background="@color/black_50"/>
-
-            <!-- Action Buttons -->
-
-            <RelativeLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="13dp"
-                android:gravity="center_vertical">
-
-                <LinearLayout
-                    android:layout_width="158dp"
-                    android:layout_height="wrap_content"
-                    android:orientation="vertical"
-                    android:layout_alignParentStart="true">
-
-                    <LinearLayout
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:orientation="horizontal">
-
-                        <ImageView
-                            android:layout_width="16dp"
-                            android:layout_height="16dp"
-                            android:src="@drawable/ic_person"
-                            app:tint="@color/black_500" />
-
-                        <TextView
-                            android:id="@+id/tv_shipment_customer"
-                            style="@style/label_small"
-                            android:layout_width="match_parent"
-                            android:layout_height="wrap_content"
-                            android:maxLines="1"
-                            android:layout_marginStart="4dp"
-                            android:textColor="@color/black_500"
-                            android:text="Gracia Hotmauli"/>
-
-                    </LinearLayout>
-
-                    <LinearLayout
-                        android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:orientation="horizontal">
-
-                        <ImageView
-                            android:layout_width="16dp"
-                            android:layout_height="16dp"
-                            android:src="@drawable/ic_location" />
-
-                        <TextView
-                            android:id="@+id/tv_shipment_location"
-                            style="@style/label_small"
-                            android:layout_width="match_parent"
-                            android:layout_height="wrap_content"
-                            android:maxLines="1"
-                            android:layout_marginStart="4dp"
-                            android:textColor="@color/black_500"
-                            android:text="Serang"/>
-
-                    </LinearLayout>
-
-                </LinearLayout>
-
-                <Button
-                    android:id="@+id/btn_confirm_shipment"
-                    style="@style/button.small.active.medium"
-                    android:text="Kirim Pesanan"
-                    android:layout_alignParentEnd="true"/>
-
-            </RelativeLayout>
-
-        </LinearLayout>
-
-        <View
-            android:layout_width="match_parent"
-            android:layout_height="8dp"
-            android:background="@color/black_50"
-            android:layout_marginTop="16dp"
+            android:text="@string/batas_tagihan"
+            android:textSize="14sp"
+            android:visibility="gone"
             app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/layout_shipment_detail"/>
+            app:layout_constraintTop_toBottomOf="@+id/tv_count_total_items" />
+
+        <TextView
+            android:id="@+id/tvDeadlineDate"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="4dp"
+            android:layout_marginTop="8dp"
+            android:textColor="@android:color/black"
+            android:textSize="14sp"
+            android:visibility="gone"
+            app:layout_constraintStart_toEndOf="@+id/tvDeadlineLabel"
+            app:layout_constraintTop_toBottomOf="@+id/tv_count_total_items"
+            tools:text="28 Oktober 2024" />
+
+        <com.google.android.material.button.MaterialButton
+            android:id="@+id/btn_left"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@drawable/bg_button_outline"
+            android:backgroundTint="@color/white"
+            android:visibility="gone"
+            android:text="Tolak"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/tvDeadlineDate"
+            app:layout_constraintStart_toStartOf="parent"
+            android:layout_marginTop="8dp"/>
+
+        <com.google.android.material.button.MaterialButton
+            android:id="@+id/btn_right"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@drawable/bg_button_filled"
+            android:visibility="gone"
+            android:text="Terima"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/tvDeadlineDate"
+            app:layout_constraintEnd_toEndOf="parent"
+            android:layout_marginTop="8dp"/>
 
     </androidx.constraintlayout.widget.ConstraintLayout>
-    
-</LinearLayout>
\ No newline at end of file
+</androidx.cardview.widget.CardView>
\ No newline at end of file

From a3c3a9d4990fa77166d42e409ae69ad07c96735c Mon Sep 17 00:00:00 2001
From: Gracia Hotmauli <95269134+hotmauligracia@users.noreply.github.com>
Date: Mon, 2 Jun 2025 17:04:23 +0700
Subject: [PATCH 10/10] sells update

---
 .../ui/profile/mystore/sells/SellsAdapter.kt  | 384 ++++---
 .../ui/profile/mystore/sells/SellsFragment.kt |  16 +-
 .../mystore/sells/SellsListFragment.kt        |   4 +-
 .../mystore/sells/SellsViewPagerAdapter.kt    |  16 +-
 app/src/main/res/layout/item_sells.xml        | 994 +++++++++++++++---
 app/src/main/res/values/strings.xml           |  15 +-
 6 files changed, 1061 insertions(+), 368 deletions(-)

diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt
index 7dc5bf5..181f0e5 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsAdapter.kt
@@ -5,14 +5,17 @@ import android.util.Log
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import android.widget.Button
+import android.widget.ImageView
 import android.widget.TextView
-import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
+import com.alya.ecommerce_serang.BuildConfig.BASE_URL
 import com.alya.ecommerce_serang.R
 import com.alya.ecommerce_serang.data.api.response.store.orders.OrdersItem
 import com.alya.ecommerce_serang.ui.profile.mystore.sells.payment.DetailPaymentActivity
 import com.alya.ecommerce_serang.ui.profile.mystore.sells.shipment.DetailShipmentActivity
 import com.alya.ecommerce_serang.utils.viewmodel.SellsViewModel
+import com.bumptech.glide.Glide
 import com.google.android.material.button.MaterialButton
 import com.google.gson.Gson
 import java.text.SimpleDateFormat
@@ -60,59 +63,72 @@ class SellsAdapter(
     override fun getItemCount(): Int = sells.size
 
     inner class SellsViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
-        private val tvStoreName: TextView = itemView.findViewById(R.id.tvUserName)
-        private val rvOrderItems: RecyclerView = itemView.findViewById(R.id.rvSellsItems)
-        private val tvShowMore: TextView = itemView.findViewById(R.id.tvShowMores)
-        private val tvTotalAmount: TextView = itemView.findViewById(R.id.tvTotalAmounts)
-        private val tvItemCountLabel: TextView = itemView.findViewById(R.id.tv_count_total_items)
+        private val layoutOrders: View = itemView.findViewById(R.id.layout_orders)
+        private val layoutPayments: View = itemView.findViewById(R.id.layout_payments)
+        private val layoutShipments: View = itemView.findViewById(R.id.layout_shipments)
+
+        private var tvSellsTitle: TextView = itemView.findViewById(R.id.tv_payment_title)
+        private var tvSellsNumber: TextView = itemView.findViewById(R.id.tv_payment_number)
+        private var tvSellsDueDesc: TextView = itemView.findViewById(R.id.tv_payment_due_desc)
+        private var tvSellsDue: TextView = itemView.findViewById(R.id.tv_payment_due)
+        private var tvSellsLocation: TextView = itemView.findViewById(R.id.tv_payment_location)
+        private var tvSellsCustomer: TextView = itemView.findViewById(R.id.tv_payment_customer)
+        private var ivSellsProduct: ImageView = itemView.findViewById(R.id.iv_payment_product)
+        private var tvSellsProductName: TextView = itemView.findViewById(R.id.tv_payment_product_name)
+        private var tvSellsProductQty: TextView = itemView.findViewById(R.id.tv_payment_product_qty)
+        private var tvSellsProductPrice: TextView = itemView.findViewById(R.id.tv_payment_product_price)
+        private var tvSeeMore: TextView = itemView.findViewById(R.id.tv_see_more_payment)
+        private var tvSellsQty: TextView = itemView.findViewById(R.id.tv_payment_qty)
+        private var tvSellsPrice: TextView = itemView.findViewById(R.id.tv_payment_price)
+        private val btnConfirmPayment: Button = itemView.findViewById(R.id.btn_confirm_payment)
+        private val btnConfirmShipment: Button = itemView.findViewById(R.id.btn_confirm_shipment)
 
         fun bind(order: OrdersItem) {
             Log.d("SellsAdapter", "=== ViewHolder.bind() called ===")
             Log.d("SellsAdapter", "Binding order: ${order.orderId} with status: ${order.status}")
 
-            // Show customer/buyer name (seller's perspective)
-            tvStoreName.text = order.username ?: "Unknown Customer"
-            Log.d("SellsAdapter", "Customer name set: ${order.username}")
+            val actualStatus = if (fragmentStatus == "all") order.status ?: "" else fragmentStatus
+            adjustDisplay(actualStatus, order)
 
-            // Set total amount
-            tvTotalAmount.text = "Rp${order.totalAmount}"
-            Log.d("SellsAdapter", "Total amount set: ${order.totalAmount}")
+            tvSellsNumber.text = "No. Pesanan: ${order.orderId}"
+            tvSellsLocation.text = order.subdistrict
+            tvSellsCustomer.text = order.username
 
-            // Set item count
-            val itemCount = order.orderItems?.size ?: 0
-            tvItemCountLabel.text = itemView.context.getString(R.string.item_count_prod, itemCount)
-            Log.d("SellsAdapter", "Item count set: $itemCount")
+            val product = order.orderItems?.firstOrNull()
+            tvSellsProductName.text = product?.productName
+            tvSellsProductQty.text = "x${product?.quantity}"
+            tvSellsProductPrice.text = formatPrice(product?.price.toString())
 
-            // Set up the order items RecyclerView
-            val productAdapter = SellsProductAdapter()
-            rvOrderItems.apply {
-                layoutManager = LinearLayoutManager(itemView.context)
-                adapter = productAdapter
+            val fullImageUrl = when (val img = product?.productImage) {
+                is String -> {
+                    if (img.startsWith("/")) BASE_URL + img.substring(1) else img
+                }
+                else -> R.drawable.placeholder_image
             }
-            Log.d("SellsAdapter", "Product RecyclerView configured")
+            // Load product image using Glide
+            Glide.with(itemView.context)
+                .load(fullImageUrl)
+                .placeholder(R.drawable.placeholder_image)
+                .error(R.drawable.placeholder_image)
+                .into(ivSellsProduct)
 
             // Display only the first product and show "View more" for the rest
             order.orderItems?.let { items ->
                 if (items.isNotEmpty()) {
-                    productAdapter.submitList(items.take(1))
-                    Log.d("SellsAdapter", "Product list submitted: ${items.size} items")
-
                     // Show or hide the "View more" text based on number of items
                     if (items.size > 1) {
                         val itemString = items.size - 1
-                        tvShowMore.visibility = View.VISIBLE
-                        tvShowMore.text = itemView.context.getString(R.string.show_more_product, itemString)
-                        Log.d("SellsAdapter", "Show more visible: $itemString more items")
+                        tvSeeMore.visibility = View.VISIBLE
+                        tvSeeMore.text = itemView.context.getString(R.string.show_more_product, itemString)
                     } else {
-                        tvShowMore.visibility = View.GONE
-                        Log.d("SellsAdapter", "Show more hidden: only 1 item")
+                        tvSeeMore.visibility = View.GONE
                     }
                 } else {
-                    tvShowMore.visibility = View.GONE
+                    tvSeeMore.visibility = View.GONE
                     Log.w("SellsAdapter", "Order has no items!")
                 }
             } ?: run {
-                tvShowMore.visibility = View.GONE
+                tvSeeMore.visibility = View.GONE
                 Log.w("SellsAdapter", "Order items is null!")
             }
 
@@ -121,192 +137,169 @@ class SellsAdapter(
                 onOrderClickListener(order)
             }
 
-            val actualStatus = if (fragmentStatus == "all") order.status ?: "" else fragmentStatus
-            Log.d("SellsAdapter", "Adjusting UI for status: '$actualStatus' (fragmentStatus: '$fragmentStatus')")
-            adjustButtonsAndText(actualStatus, order)
-
             Log.d("SellsAdapter", "=== ViewHolder.bind() completed ===")
         }
 
-        private fun adjustButtonsAndText(status: String, order: OrdersItem) {
-            Log.d("SellsAdapter", "Adjusting buttons for status: $status")
-
-            // Get references to buttons and status views
-            val btnLeft = itemView.findViewById<MaterialButton>(R.id.btn_left)
-            val btnRight = itemView.findViewById<MaterialButton>(R.id.btn_right)
-            val statusOrder = itemView.findViewById<TextView>(R.id.tvOrderStatus)
-            val deadlineLabel = itemView.findViewById<TextView>(R.id.tvDeadlineLabel)
-            val deadlineDate = itemView.findViewById<TextView>(R.id.tvDeadlineDate)
+        private fun adjustDisplay(status: String, order: OrdersItem) {
+            Log.d("SellsAdapter", "Adjusting display for status: $status")
 
             // Reset visibility
-            btnLeft.visibility = View.GONE
-            btnRight.visibility = View.GONE
-            statusOrder.visibility = View.GONE
-            deadlineLabel.visibility = View.GONE
-            deadlineDate.visibility = View.GONE
+            layoutOrders.visibility = View.GONE
+            layoutPayments.visibility = View.VISIBLE
+            layoutShipments.visibility = View.GONE
 
             when (status) {
-                "pending" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Menunggu Tagihan"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Batas waktu konfirmasi:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDate(order.createdAt ?: "")
-                    }
-                    btnLeft.apply {
-                        visibility = View.VISIBLE
-                        text = "Tolak Pesanan"
-                        setOnClickListener {
-                            // Handle reject order
-                            viewModel.updateOrderStatus(order.orderId, "canceled")
-                            viewModel.refreshOrders()
-                        }
-                    }
-                    btnRight.apply {
-                        visibility = View.VISIBLE
-                        text = "Terima Pesanan"
-                        setOnClickListener {
-                            // Handle accept order
-                            viewModel.updateOrderStatus(order.orderId, "unpaid")
-                            viewModel.refreshOrders()
-                        }
-                    }
-                }
-                "unpaid" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Konfirmasi Bayar"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Batas pembayaran:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDatePay(order.updatedAt ?: "")
-                    }
-                    btnLeft.apply {
-                        visibility = View.VISIBLE
-                        text = "Batalkan"
-                        setOnClickListener {
-                            viewModel.updateOrderStatus(order.orderId, "canceled")
-                            viewModel.refreshOrders()
+                "pending", "unpaid" -> {
+                    layoutOrders.visibility = View.VISIBLE
+                    layoutPayments.visibility = View.GONE
+                    layoutShipments.visibility = View.GONE
+
+                    tvSellsTitle = itemView.findViewById(R.id.tv_order_title)
+                    tvSellsNumber = itemView.findViewById(R.id.tv_order_number)
+                    tvSellsDue = itemView.findViewById(R.id.tv_order_due)
+                    tvSellsCustomer = itemView.findViewById(R.id.tv_order_customer)
+                    tvSellsProductName = itemView.findViewById(R.id.tv_order_product_name)
+                    tvSellsProductQty = itemView.findViewById(R.id.tv_order_product_qty)
+                    tvSellsProductPrice = itemView.findViewById(R.id.tv_order_product_price)
+                    tvSeeMore = itemView.findViewById(R.id.tv_see_more_order)
+                    tvSellsQty = itemView.findViewById(R.id.tv_order_qty)
+                    tvSellsPrice = itemView.findViewById(R.id.tv_order_price)
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 1)
+
+                    val product = order.orderItems?.firstOrNull()
+                    tvSellsProductName.text = product?.productName
+                    tvSellsProductQty.text = "x${product?.quantity}"
+                    tvSellsProductPrice.text = formatPrice(product?.price.toString())
+
+                    val fullImageUrl = when (val img = product?.productImage) {
+                        is String -> {
+                            if (img.startsWith("/")) BASE_URL + img.substring(1) else img
                         }
+                        else -> R.drawable.placeholder_image
                     }
+                    // Load product image using Glide
+                    Glide.with(itemView.context)
+                        .load(fullImageUrl)
+                        .placeholder(R.drawable.placeholder_image)
+                        .error(R.drawable.placeholder_image)
+                        .into(ivSellsProduct)
+
+                    tvSellsQty.text = "${order.orderItems?.size} produk"
+                    tvSellsPrice.text = formatPrice(order.totalAmount.toString())
                 }
                 "paid" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Sudah Dibayar"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Konfirmasi pembayaran sebelum:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDatePay(order.updatedAt ?: "")
-                    }
-                    btnRight.apply {
-                        visibility = View.VISIBLE
-                        text = "Konfirmasi Pembayaran"
-                        setOnClickListener {
-                            val context = itemView.context
-                            val intent = Intent(context, DetailPaymentActivity::class.java)
-                            intent.putExtra("sells_data", Gson().toJson(order))
-                            context.startActivity(intent)
-                        }
+                    layoutOrders.visibility = View.GONE
+                    layoutPayments.visibility = View.VISIBLE
+                    layoutShipments.visibility = View.GONE
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 2)
+                    btnConfirmPayment.setOnClickListener {
+
+                        val context = itemView.context
+                        val intent = Intent(context, DetailPaymentActivity::class.java)
+                        intent.putExtra("sells_data", Gson().toJson(order))
+                        context.startActivity(intent)
+                        viewModel.refreshOrders()
                     }
+
+                    tvSellsTitle.text = "Pesanan Telah Dibayar"
+                    tvSellsDueDesc.text = "Konfirmasi pembayaran sebelum:"
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 2)
+
                 }
                 "processed" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Diproses"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Kirim sebelum:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDatePay(order.updatedAt ?: "")
-                    }
-                    btnRight.apply {
-                        visibility = View.VISIBLE
-                        text = "Kirim Pesanan"
-                        setOnClickListener {
-                            val context = itemView.context
-                            val intent = Intent(context, DetailShipmentActivity::class.java)
-                            intent.putExtra("sells_data", Gson().toJson(order))
-                            context.startActivity(intent)
-                        }
+                    layoutOrders.visibility = View.GONE
+                    layoutPayments.visibility = View.GONE
+                    layoutShipments.visibility = View.VISIBLE
+
+                    tvSellsTitle = itemView.findViewById(R.id.tv_shipment_title)
+                    tvSellsNumber = itemView.findViewById(R.id.tv_shipment_number)
+                    tvSellsDue = itemView.findViewById(R.id.tv_shipment_due)
+                    tvSellsLocation = itemView.findViewById(R.id.tv_shipment_location)
+                    tvSellsCustomer = itemView.findViewById(R.id.tv_shipment_customer)
+                    tvSellsProductName = itemView.findViewById(R.id.tv_shipment_product_name)
+                    tvSellsProductQty = itemView.findViewById(R.id.tv_shipment_product_qty)
+                    tvSeeMore = itemView.findViewById(R.id.tv_see_more_shipment)
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 2)
+                    btnConfirmShipment.setOnClickListener {
+                        val context = itemView.context
+                        val intent = Intent(context, DetailShipmentActivity::class.java)
+                        intent.putExtra("sells_data", Gson().toJson(order))
+                        context.startActivity(intent)
                     }
+
+                    tvSellsTitle.text = "Pesanan Perlu Dikirim"
+                    tvSellsNumber.text = "No. Pesanan: ${order.orderId}"
+                    tvSellsLocation.text = order.subdistrict
+                    tvSellsCustomer.text = order.username
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 2)
                 }
                 "shipped" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Dikirim"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Dikirimkan pada:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDate(order.updatedAt ?: "")
-                    }
+                    layoutOrders.visibility = View.GONE
+                    layoutPayments.visibility = View.VISIBLE
+                    layoutShipments.visibility = View.GONE
+
+                    tvSellsTitle.text = "Pesanan Telah Dikirim"
+                    tvSellsDueDesc.text = "Dikirimkan pada"
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 0)
+                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
+                    btnConfirmPayment.visibility = View.GONE
+                }
+                "delivered" -> {
+                    layoutOrders.visibility = View.GONE
+                    layoutPayments.visibility = View.VISIBLE
+                    layoutShipments.visibility = View.GONE
+
+                    tvSellsTitle.text = "Pesanan Telah Dikirim"
+                    tvSellsDueDesc.text = "Dikirimkan pada"
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 0)
+                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
+                    btnConfirmPayment.visibility = View.GONE
                 }
                 "completed" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Selesai"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Selesai pada:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDate(order.updatedAt ?: "")
-                    }
+                    layoutOrders.visibility = View.GONE
+                    layoutPayments.visibility = View.VISIBLE
+                    layoutShipments.visibility = View.GONE
+
+                    tvSellsTitle.text = "Pesanan Selesai"
+                    tvSellsDueDesc.text = "Selesai pada"
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 0)
+                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
+                    btnConfirmPayment.visibility = View.GONE
                 }
                 "canceled" -> {
-                    statusOrder.apply {
-                        visibility = View.VISIBLE
-                        text = "Dibatalkan"
-                    }
-                    deadlineLabel.apply {
-                        visibility = View.VISIBLE
-                        text = "Dibatalkan pada:"
-                    }
-                    deadlineDate.apply {
-                        visibility = View.VISIBLE
-                        text = formatDate(order.cancelDate ?: "")
-                    }
+                    layoutOrders.visibility = View.GONE
+                    layoutPayments.visibility = View.VISIBLE
+                    layoutShipments.visibility = View.GONE
+
+                    tvSellsTitle.text = "Pesanan Dibatalkan"
+                    tvSellsDueDesc.text = "Dibatalkan pada"
+
+                    tvSellsDue.text = formatDueDate(order.updatedAt.toString(), 0)
+                    tvSellsDue.background = itemView.context.getDrawable(R.drawable.bg_product_inactive)
+                    btnConfirmPayment.visibility = View.GONE
                 }
             }
         }
 
-        private fun formatDate(dateString: String): String {
+        private fun formatDueDate(dateString: String, dueDay: Int): String {
             return try {
                 val inputFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
                 inputFormat.timeZone = TimeZone.getTimeZone("UTC")
 
-                val outputFormat = SimpleDateFormat("HH:mm dd MMMM yyyy", Locale("id", "ID"))
+                val outputFormat = SimpleDateFormat("dd MMM; HH.mm", Locale("id", "ID"))
 
                 val date = inputFormat.parse(dateString)
 
                 date?.let {
                     val calendar = Calendar.getInstance()
                     calendar.time = it
-                    calendar.set(Calendar.HOUR_OF_DAY, 23)
-                    calendar.set(Calendar.MINUTE, 59)
+                    calendar.add(Calendar.DATE, dueDay)
 
                     outputFormat.format(calendar.time)
                 } ?: dateString
@@ -316,27 +309,10 @@ class SellsAdapter(
             }
         }
 
-        private fun formatDatePay(dateString: String): String {
-            return try {
-                // Parse the ISO 8601 date
-                val isoDateFormat = SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", Locale.getDefault())
-                isoDateFormat.timeZone = TimeZone.getTimeZone("UTC")
-
-                val createdDate = isoDateFormat.parse(dateString)
-
-                // Add 24 hours to get due date
-                val calendar = Calendar.getInstance()
-                calendar.time = createdDate
-                calendar.add(Calendar.HOUR, 24)
-
-                // Format due date for display
-                val dueDateFormat = SimpleDateFormat("dd MMM yyyy", Locale.getDefault())
-                dueDateFormat.format(calendar.time)
-
-            } catch (e: Exception) {
-                Log.e("DateFormatting", "Error formatting date: ${e.message}")
-                dateString
-            }
+        private fun formatPrice(price: String): String {
+            val priceDouble = price.toDoubleOrNull() ?: 0.0
+            val formattedPrice = String.format(Locale("id", "ID"), "Rp%,.0f", priceDouble)
+            return formattedPrice
         }
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt
index 5074a2c..2d5d2ac 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsFragment.kt
@@ -42,14 +42,14 @@ class SellsFragment : Fragment() {
         // Connect TabLayout with ViewPager2
         TabLayoutMediator(binding.tabLayoutSells, binding.viewPagerSells) { tab, position ->
             tab.text = when (position) {
-                0 -> getString(R.string.all_orders)           // "Semua Pesanan"
-                1 -> getString(R.string.pending_orders)       // "Menunggu Tagihan"
-                2 -> getString(R.string.unpaid_orders)        // "Konfirmasi Bayar"
-                3 -> getString(R.string.paid_orders)          // "Diproses"
-                4 -> getString(R.string.processed_orders)     // "Sudah Dibayar"
-                5 -> getString(R.string.shipped_orders)       // "Dikirim"
-                6 -> getString(R.string.completed_orders)     // "Selesai"
-                7 -> getString(R.string.canceled_orders)      // "Dibatalkan"
+                0 -> getString(R.string.all_sells)
+                1 -> getString(R.string.unpaid_sells)
+                2 -> getString(R.string.paid_sells)
+                3 -> getString(R.string.processed_sells)
+                4 -> getString(R.string.shipped_sells)
+                5 -> getString(R.string.delivered_sells)
+                6 -> getString(R.string.completed_sells)
+                7 -> getString(R.string.canceled_sells)
                 else -> "Tab $position"
             }
         }.attach()
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt
index ed01095..a2ae776 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsListFragment.kt
@@ -33,12 +33,10 @@ class SellsListFragment : Fragment() {
         }
     }
     private lateinit var sellsAdapter: SellsAdapter
-
     private var status: String = "all"
 
     companion object {
         private const val TAG = "SellsListFragment"
-
         private const val ARG_STATUS = "status"
 
         fun newInstance(status: String): SellsListFragment {
@@ -123,7 +121,7 @@ class SellsListFragment : Fragment() {
                         Log.d(TAG, "✅ Data is available: ${result.data.size} items")
                         binding.tvEmptyState.visibility = View.GONE
                         binding.rvSells.visibility = View.VISIBLE
-// Log first few items for debugging
+
                         result.data.take(3).forEachIndexed { index, order ->
                             Log.d(TAG, "Order ${index + 1}: ID=${order.orderId}, Status=${order.status}, Customer=${order.username}")
                         }
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt
index 85ead97..90ff3d3 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/mystore/sells/SellsViewPagerAdapter.kt
@@ -10,14 +10,14 @@ class SellsViewPagerAdapter(
 
     // Define all possible sells statuses - keeping your original list
     private val sellsStatuses = listOf(
-        "all",          // Position 0: "Semua Pesanan"
-        "pending",      // Position 1: "Menunggu Tagihan"
-        "unpaid",       // Position 2: "Konfirmasi Bayar"
-        "paid",         // Position 3: "Diproses"
-        "processed",    // Position 4: "Sudah Dibayar"
-        "shipped",      // Position 5: "Dikirim"
-        "completed",    // Position 6: "Selesai"
-        "canceled"      // Position 7: "Dibatalkan"
+        "all",
+        "unpaid",
+        "paid",
+        "processed",
+        "shipped",
+        "delivered",
+        "completed",
+        "canceled"
     )
 
     override fun getItemCount(): Int = sellsStatuses.size
diff --git a/app/src/main/res/layout/item_sells.xml b/app/src/main/res/layout/item_sells.xml
index 00cf599..08ca0f7 100644
--- a/app/src/main/res/layout/item_sells.xml
+++ b/app/src/main/res/layout/item_sells.xml
@@ -1,163 +1,873 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
-    xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:layout_marginBottom="8dp"
-    app:cardCornerRadius="8dp"
-    app:cardElevation="2dp">
+    android:orientation="vertical">
 
     <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/layout_orders"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:padding="16dp">
+        android:background="@color/white"
+        android:paddingTop="16dp">
 
-        <TextView
-            android:id="@+id/tvUserName"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:textColor="@android:color/black"
-            android:textSize="16sp"
-            android:textStyle="bold"
+        <!-- Order Header -->
+        <View
+            android:id="@+id/shape_order_title"
+            android:layout_width="4dp"
+            android:layout_height="48dp"
+            android:background="@drawable/shape_sells_title"
             app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toTopOf="parent"
-            tools:text="Customer Name" />
+            app:layout_constraintTop_toTopOf="parent"/>
 
-        <TextView
-            android:id="@+id/tvOrderStatus"
+        <LinearLayout
+            android:id="@+id/layout_order_header"
+            android:layout_width="220dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="12dp"
+            app:layout_constraintStart_toStartOf="@id/shape_order_title"
+            app:layout_constraintTop_toTopOf="parent"
+            android:orientation="vertical">
+
+            <TextView
+                android:id="@+id/tv_order_title"
+                style="@style/label_medium_prominent"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                android:text="Pesanan Belum Dibayar"/>
+
+            <TextView
+                android:id="@+id/tv_order_number"
+                style="@style/label_small"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                android:textColor="@color/black_300"
+                android:text="No. Pesanan: 123456789"/>
+
+            <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:orientation="horizontal">
+
+                <ImageView
+                    android:layout_width="16dp"
+                    android:layout_height="16dp"
+                    android:src="@drawable/ic_person"/>
+
+                <TextView
+                    android:id="@+id/tv_order_customer"
+                    style="@style/label_small"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:maxLines="1"
+                    android:layout_marginStart="4dp"
+                    android:textColor="@color/black_300"
+                    android:text="Gracia Hotmauli"/>
+
+            </LinearLayout>
+
+        </LinearLayout>
+
+        <LinearLayout
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:textColor="@color/blue_500"
-            android:textSize="14sp"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintTop_toTopOf="parent"
-            android:visibility="gone"
-            tools:text="Menunggu Tagihan" />
+            android:orientation="vertical"
+            android:layout_marginEnd="16dp"
+            android:gravity="end">
+
+            <TextView
+                android:layout_width="150dp"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                style="@style/label_small"
+                android:textAlignment="textEnd"
+                android:text="Batas waktu pembayaran:"
+                android:textColor="@color/black_300" />
+
+            <TextView
+                android:id="@+id/tv_order_due"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:text="25 Okt; 23.59"
+                style="@style/label_small"
+                android:paddingHorizontal="4dp"
+                android:textColor="@color/darkblue_500"
+                android:background="@drawable/bg_product_active" />
+
+        </LinearLayout>
+
+        <!-- Order Detail -->
+        <LinearLayout
+            android:id="@+id/layout_order_detail"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/layout_order_header"
+            android:paddingHorizontal="16dp"
+            android:layout_marginTop="8dp"
+            android:orientation="vertical">
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Product Detail -->
+            <androidx.constraintlayout.widget.ConstraintLayout
+                android:id="@+id/layout_order_product_detail"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:paddingVertical="12dp">
+
+                <com.google.android.material.imageview.ShapeableImageView
+                    android:id="@+id/iv_order_product"
+                    android:layout_width="95dp"
+                    android:layout_height="64dp"
+                    android:src="@drawable/placeholder_image"
+                    android:scaleType="centerCrop"
+                    android:contentDescription="Order Product Image"
+                    app:shapeAppearanceOverlay="@style/store_product_image"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintTop_toTopOf="parent"/>
+
+                <LinearLayout
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_marginStart="13dp"
+                    app:layout_constraintStart_toEndOf="@id/iv_order_product"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintTop_toTopOf="parent">
+
+                    <TextView
+                        android:id="@+id/tv_order_product_name"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="Jaket Pink Fuschia"
+                        style="@style/label_medium_prominent"/>
+
+                    <!--                <TextView-->
+                    <!--                    android:id="@+id/tv_order_product_variant"-->
+                    <!--                    android:layout_width="match_parent"-->
+                    <!--                    android:layout_height="wrap_content"-->
+                    <!--                    android:maxLines="1"-->
+                    <!--                    android:text="S"-->
+                    <!--                    style="@style/label_medium"-->
+                    <!--                    android:textColor="@color/black_300"/>-->
+
+                </LinearLayout>
+
+                <LinearLayout
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_marginStart="13dp"
+                    android:gravity="end"
+                    app:layout_constraintStart_toEndOf="@id/iv_order_product"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintBottom_toBottomOf="@id/iv_order_product">
+
+                    <TextView
+                        android:id="@+id/tv_order_product_qty"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="x2"
+                        style="@style/label_medium"
+                        android:textColor="@color/black_300"
+                        android:textAlignment="textEnd"/>
+
+                    <TextView
+                        android:id="@+id/tv_order_product_price"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="Rp150.000"
+                        style="@style/label_medium"
+                        android:textAlignment="textEnd"/>
+
+                </LinearLayout>
+
+                <TextView
+                    android:id="@+id/tv_see_more_order"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:focusable="true"
+                    android:text="Lihat 3 produk lainnya"
+                    android:gravity="center"
+                    style="@style/label_small"
+                    android:fontFamily="@font/dmsans_italic"
+                    android:textColor="@color/black_300"
+                    app:layout_constraintTop_toBottomOf="@id/iv_order_product"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    android:layout_marginVertical="8dp"
+                    android:clickable="true"
+                    android:visibility="gone"/>
+
+            </androidx.constraintlayout.widget.ConstraintLayout>
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Total Price -->
+            <RelativeLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:paddingVertical="8dp">
+
+                <TextView
+                    android:id="@+id/tv_order_qty"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:text="2 produk"
+                    style="@style/label_large"
+                    android:layout_alignParentStart="true"/>
+
+                <LinearLayout
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:orientation="horizontal"
+                    android:layout_alignParentEnd="true">
+
+                    <TextView
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="Total:"
+                        style="@style/label_large_prominent"
+                        android:textAlignment="textEnd"/>
+
+                    <TextView
+                        android:id="@+id/tv_order_price"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="Rp300.000"
+                        style="@style/label_large_prominent"
+                        android:textColor="@color/blue_500"
+                        android:layout_marginStart="5dp"
+                        android:textAlignment="textEnd"/>
+
+                </LinearLayout>
+
+            </RelativeLayout>
+
+            <!--            <View-->
+            <!--                android:layout_width="match_parent"-->
+            <!--                android:layout_height="1dp"-->
+            <!--                android:background="@color/black_50"/>-->
+            <!--    -->
+            <!--            &lt;!&ndash; Action Buttons &ndash;&gt;-->
+            <!--    -->
+            <!--            <LinearLayout-->
+            <!--                android:layout_width="match_parent"-->
+            <!--                android:layout_height="wrap_content"-->
+            <!--                android:layout_marginTop="13dp"-->
+            <!--                android:orientation="horizontal">-->
+            <!--    -->
+            <!--                <Button-->
+            <!--                    android:id="@+id/btn_edit_order"-->
+            <!--                    style="@style/button.small.secondary.medium"-->
+            <!--                    android:text="Ubah Tagihan"-->
+            <!--                    android:layout_marginEnd="10dp"/>-->
+            <!--    -->
+            <!--                <Button-->
+            <!--                    android:id="@+id/btn_confirm_order"-->
+            <!--                    style="@style/button.small.active.medium"-->
+            <!--                    android:text="Konfirmasi Tagihan" />-->
+            <!--    -->
+            <!--            </LinearLayout>-->
+
+        </LinearLayout>
 
         <View
-            android:id="@+id/divider"
             android:layout_width="match_parent"
-            android:layout_height="1dp"
-            android:layout_marginTop="8dp"
-            android:background="#E0E0E0"
-            app:layout_constraintTop_toBottomOf="@+id/tvUserName" />
-
-        <androidx.recyclerview.widget.RecyclerView
-            android:id="@+id/rvSellsItems"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
-            app:layout_constraintTop_toBottomOf="@+id/divider"
-            tools:itemCount="1"
-            tools:listitem="@layout/item_order_product" />
-
-        <TextView
-            android:id="@+id/tvShowMores"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:gravity="center_vertical"
-            android:textColor="@android:color/darker_gray"
-            android:textSize="14sp"
-            android:visibility="gone"
+            android:layout_height="8dp"
+            android:background="@color/black_50"
             app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/rvSellsItems"
-            app:layout_constraintEnd_toEndOf="parent"
-            tools:text="@string/show_more_product" />
-
-        <View
-            android:id="@+id/divider2"
-            android:layout_width="match_parent"
-            android:layout_height="1dp"
-            android:layout_marginTop="8dp"
-            android:background="#E0E0E0"
-            app:layout_constraintTop_toBottomOf="@+id/tvShowMores" />
-
-        <TextView
-            android:id="@+id/tv_count_total_items"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:text="@string/item_count_prod"
-            android:textSize="14sp"
-            android:fontFamily="@font/dmsans_bold"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/divider2" />
-
-        <TextView
-            android:id="@+id/tvTotalLabel"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:text="@string/total_order"
-            android:textColor="@android:color/black"
-            android:textSize="14sp"
-            android:fontFamily="@font/dmsans_bold"
-            app:layout_constraintEnd_toStartOf="@+id/tvTotalAmounts"
-            app:layout_constraintTop_toBottomOf="@+id/divider2"/>
-
-        <TextView
-            android:id="@+id/tvTotalAmounts"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:textColor="@android:color/black"
-            android:textSize="14sp"
-            android:fontFamily="@font/dmsans_semibold"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/divider2"
-            tools:text="Rp500.000" />
-
-        <TextView
-            android:id="@+id/tvDeadlineLabel"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:text="@string/batas_tagihan"
-            android:textSize="14sp"
-            android:visibility="gone"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/tv_count_total_items" />
-
-        <TextView
-            android:id="@+id/tvDeadlineDate"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="4dp"
-            android:layout_marginTop="8dp"
-            android:textColor="@android:color/black"
-            android:textSize="14sp"
-            android:visibility="gone"
-            app:layout_constraintStart_toEndOf="@+id/tvDeadlineLabel"
-            app:layout_constraintTop_toBottomOf="@+id/tv_count_total_items"
-            tools:text="28 Oktober 2024" />
-
-        <com.google.android.material.button.MaterialButton
-            android:id="@+id/btn_left"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:background="@drawable/bg_button_outline"
-            android:backgroundTint="@color/white"
-            android:visibility="gone"
-            android:text="Tolak"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/tvDeadlineDate"
-            app:layout_constraintStart_toStartOf="parent"
-            android:layout_marginTop="8dp"/>
-
-        <com.google.android.material.button.MaterialButton
-            android:id="@+id/btn_right"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:background="@drawable/bg_button_filled"
-            android:visibility="gone"
-            android:text="Terima"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/tvDeadlineDate"
-            app:layout_constraintEnd_toEndOf="parent"
-            android:layout_marginTop="8dp"/>
+            app:layout_constraintTop_toBottomOf="@id/layout_order_detail"/>
 
     </androidx.constraintlayout.widget.ConstraintLayout>
-</androidx.cardview.widget.CardView>
\ No newline at end of file
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/layout_payments"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@color/white"
+        android:paddingTop="16dp">
+
+        <!-- Payment Header -->
+        <View
+            android:id="@+id/shape_payment_order_title"
+            android:layout_width="4dp"
+            android:layout_height="32dp"
+            android:background="@drawable/shape_sells_title"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"/>
+
+        <LinearLayout
+            android:id="@+id/layout_payment_order_header"
+            android:layout_width="220dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="12dp"
+            app:layout_constraintStart_toStartOf="@id/shape_payment_order_title"
+            app:layout_constraintTop_toTopOf="parent"
+            android:orientation="vertical">
+
+            <TextView
+                android:id="@+id/tv_payment_title"
+                style="@style/label_medium_prominent"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                android:text="Pesanan Telah Dibayar"/>
+
+            <TextView
+                android:id="@+id/tv_payment_number"
+                style="@style/label_small"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                android:textColor="@color/black_300"
+                android:text="No. Pesanan: 123456789"/>
+
+        </LinearLayout>
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            android:orientation="vertical"
+            android:layout_marginEnd="16dp"
+            android:gravity="end">
+
+            <TextView
+                android:id="@+id/tv_payment_due_desc"
+                android:layout_width="150dp"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                style="@style/label_small"
+                android:textAlignment="textEnd"
+                android:text="Konfirmasi pembayaran sebelum:"
+                android:textColor="@color/black_300" />
+
+            <TextView
+                android:id="@+id/tv_payment_due"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:text="25 Okt; 23.59"
+                style="@style/label_small"
+                android:paddingHorizontal="4dp"
+                android:textColor="@color/darkblue_500"
+                android:background="@drawable/bg_product_active" />
+
+        </LinearLayout>
+
+        <!-- Order Detail -->
+        <LinearLayout
+            android:id="@+id/layout_payment_detail"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/layout_payment_order_header"
+            android:paddingHorizontal="16dp"
+            android:layout_marginTop="8dp"
+            android:orientation="vertical">
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Product Detail -->
+            <androidx.constraintlayout.widget.ConstraintLayout
+                android:id="@+id/layout_payment_product_detail"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:paddingVertical="12dp">
+
+                <com.google.android.material.imageview.ShapeableImageView
+                    android:id="@+id/iv_payment_product"
+                    android:layout_width="95dp"
+                    android:layout_height="64dp"
+                    android:src="@drawable/placeholder_image"
+                    android:scaleType="centerCrop"
+                    android:contentDescription="Payment Product Image"
+                    app:shapeAppearanceOverlay="@style/store_product_image"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintTop_toTopOf="parent"/>
+
+                <LinearLayout
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_marginStart="13dp"
+                    app:layout_constraintStart_toEndOf="@id/iv_payment_product"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintTop_toTopOf="parent">
+
+                    <TextView
+                        android:id="@+id/tv_payment_product_name"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="Jaket Pink Fuschia"
+                        style="@style/label_medium_prominent"/>
+
+                    <!--                <TextView-->
+                    <!--                    android:id="@+id/tv_payment_product_variant"-->
+                    <!--                    android:layout_width="match_parent"-->
+                    <!--                    android:layout_height="wrap_content"-->
+                    <!--                    android:maxLines="1"-->
+                    <!--                    android:text="S"-->
+                    <!--                    style="@style/label_medium"-->
+                    <!--                    android:textColor="@color/black_300"/>-->
+
+                </LinearLayout>
+
+                <LinearLayout
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_marginStart="13dp"
+                    android:gravity="end"
+                    app:layout_constraintStart_toEndOf="@id/iv_payment_product"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintBottom_toBottomOf="@id/iv_payment_product">
+
+                    <TextView
+                        android:id="@+id/tv_payment_product_qty"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="x2"
+                        style="@style/label_medium"
+                        android:textColor="@color/black_300"
+                        android:textAlignment="textEnd"/>
+
+                    <TextView
+                        android:id="@+id/tv_payment_product_price"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="Rp150.000"
+                        style="@style/label_medium"
+                        android:textAlignment="textEnd"/>
+
+                </LinearLayout>
+
+                <TextView
+                    android:id="@+id/tv_see_more_payment"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:focusable="true"
+                    android:text="Lihat 3 produk lainnya"
+                    android:gravity="center"
+                    style="@style/label_small"
+                    android:fontFamily="@font/dmsans_italic"
+                    android:textColor="@color/black_300"
+                    app:layout_constraintTop_toBottomOf="@id/iv_payment_product"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    android:layout_marginVertical="8dp"
+                    android:clickable="true"
+                    android:visibility="gone"/>
+
+            </androidx.constraintlayout.widget.ConstraintLayout>
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Total Price -->
+            <RelativeLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:paddingVertical="8dp">
+
+                <TextView
+                    android:id="@+id/tv_payment_qty"
+                    style="@style/label_large"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_alignParentStart="true"
+                    android:text="2 produk" />
+
+                <LinearLayout
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:orientation="horizontal"
+                    android:layout_alignParentEnd="true">
+
+                    <TextView
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="Total:"
+                        style="@style/label_large_prominent"
+                        android:textAlignment="textEnd"/>
+
+                    <TextView
+                        android:id="@+id/tv_payment_price"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:text="Rp300.000"
+                        style="@style/label_large_prominent"
+                        android:textColor="@color/blue_500"
+                        android:layout_marginStart="5dp"
+                        android:textAlignment="textEnd"/>
+
+                </LinearLayout>
+
+            </RelativeLayout>
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Action Buttons -->
+
+            <RelativeLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="13dp"
+                android:gravity="center_vertical">
+
+                <LinearLayout
+                    android:layout_width="158dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_alignParentStart="true">
+
+                    <LinearLayout
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:orientation="horizontal">
+
+                        <ImageView
+                            android:layout_width="16dp"
+                            android:layout_height="16dp"
+                            android:src="@drawable/ic_person"
+                            app:tint="@color/black_500" />
+
+                        <TextView
+                            android:id="@+id/tv_payment_customer"
+                            style="@style/label_small"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:maxLines="1"
+                            android:layout_marginStart="4dp"
+                            android:textColor="@color/black_500"
+                            android:text="Gracia Hotmauli"/>
+
+                    </LinearLayout>
+
+                    <LinearLayout
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:orientation="horizontal">
+
+                        <ImageView
+                            android:layout_width="16dp"
+                            android:layout_height="16dp"
+                            android:src="@drawable/ic_location" />
+
+                        <TextView
+                            android:id="@+id/tv_payment_location"
+                            style="@style/label_small"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:maxLines="1"
+                            android:layout_marginStart="4dp"
+                            android:textColor="@color/black_500"
+                            android:text="Serang"/>
+
+                    </LinearLayout>
+
+                </LinearLayout>
+
+                <Button
+                    android:id="@+id/btn_confirm_payment"
+                    style="@style/button.small.active.medium"
+                    android:text="Konfirmasi Pembayaran"
+                    android:layout_alignParentEnd="true"/>
+
+            </RelativeLayout>
+
+        </LinearLayout>
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_height="8dp"
+            android:background="@color/black_50"
+            android:layout_marginTop="16dp"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/layout_payment_detail"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/layout_shipments"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@color/white"
+        android:paddingTop="16dp">
+
+        <!-- Shipment Header -->
+        <View
+            android:id="@+id/shape_shipment_order_title"
+            android:layout_width="4dp"
+            android:layout_height="32dp"
+            android:background="@drawable/shape_sells_title"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"/>
+
+        <LinearLayout
+            android:id="@+id/layout_shipment_order_header"
+            android:layout_width="220dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="12dp"
+            app:layout_constraintStart_toStartOf="@id/shape_shipment_order_title"
+            app:layout_constraintTop_toTopOf="parent"
+            android:orientation="vertical">
+
+            <TextView
+                android:id="@+id/tv_shipment_title"
+                style="@style/label_medium_prominent"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                android:text="Pesanan Perlu Dikirim"/>
+
+            <TextView
+                android:id="@+id/tv_shipment_number"
+                style="@style/label_small"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                android:textColor="@color/black_300"
+                android:text="No. Pesanan: 123456789"/>
+
+        </LinearLayout>
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            android:orientation="vertical"
+            android:layout_marginEnd="16dp"
+            android:gravity="end">
+
+            <TextView
+                android:layout_width="150dp"
+                android:layout_height="wrap_content"
+                android:maxLines="1"
+                style="@style/label_small"
+                android:textAlignment="textEnd"
+                android:text="Kirim sebelum:"
+                android:textColor="@color/black_300" />
+
+            <TextView
+                android:id="@+id/tv_shipment_due"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:text="25 Okt; 23.59"
+                style="@style/label_small"
+                android:paddingHorizontal="4dp"
+                android:textColor="@color/darkblue_500"
+                android:background="@drawable/bg_product_active" />
+
+        </LinearLayout>
+
+        <!-- Order Detail -->
+        <LinearLayout
+            android:id="@+id/layout_shipment_detail"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/layout_shipment_order_header"
+            android:paddingHorizontal="16dp"
+            android:layout_marginTop="8dp"
+            android:orientation="vertical">
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Product Detail -->
+            <androidx.constraintlayout.widget.ConstraintLayout
+                android:id="@+id/layout_shipment_product_detail"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:paddingVertical="12dp">
+
+                <com.google.android.material.imageview.ShapeableImageView
+                    android:id="@+id/iv_shipment_product"
+                    android:layout_width="95dp"
+                    android:layout_height="48dp"
+                    android:src="@drawable/placeholder_image"
+                    android:scaleType="centerCrop"
+                    android:contentDescription="Shipment Product Image"
+                    app:shapeAppearanceOverlay="@style/store_product_image"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintTop_toTopOf="parent"/>
+
+                <LinearLayout
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_marginStart="13dp"
+                    app:layout_constraintStart_toEndOf="@id/iv_shipment_product"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintTop_toTopOf="parent">
+
+                    <TextView
+                        android:id="@+id/tv_shipment_product_name"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:maxLines="1"
+                        android:text="Jaket Pink Fuschia"
+                        style="@style/label_medium_prominent"/>
+
+                    <!--                <TextView-->
+                    <!--                    android:id="@+id/tv_shipment_product_variant"-->
+                    <!--                    android:layout_width="match_parent"-->
+                    <!--                    android:layout_height="wrap_content"-->
+                    <!--                    android:maxLines="1"-->
+                    <!--                    android:text="S"-->
+                    <!--                    style="@style/label_medium"-->
+                    <!--                    android:textColor="@color/black_300"/>-->
+
+                </LinearLayout>
+
+                <TextView
+                    android:id="@+id/tv_shipment_product_qty"
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:maxLines="1"
+                    android:text="x2"
+                    style="@style/label_medium"
+                    android:layout_marginStart="13dp"
+                    android:gravity="end"
+                    android:textAlignment="textEnd"
+                    app:layout_constraintStart_toEndOf="@id/iv_shipment_product"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintBottom_toBottomOf="@id/iv_shipment_product"/>
+
+                <TextView
+                    android:id="@+id/tv_see_more_shipment"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:focusable="true"
+                    android:text="Lihat 3 produk lainnya"
+                    android:gravity="center"
+                    style="@style/label_small"
+                    android:fontFamily="@font/dmsans_italic"
+                    android:textColor="@color/black_300"
+                    app:layout_constraintTop_toBottomOf="@id/iv_shipment_product"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    android:layout_marginVertical="8dp"
+                    android:clickable="true"
+                    android:visibility="gone"/>
+
+            </androidx.constraintlayout.widget.ConstraintLayout>
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="1dp"
+                android:background="@color/black_50"/>
+
+            <!-- Action Buttons -->
+
+            <RelativeLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="13dp"
+                android:gravity="center_vertical">
+
+                <LinearLayout
+                    android:layout_width="158dp"
+                    android:layout_height="wrap_content"
+                    android:orientation="vertical"
+                    android:layout_alignParentStart="true">
+
+                    <LinearLayout
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:orientation="horizontal">
+
+                        <ImageView
+                            android:layout_width="16dp"
+                            android:layout_height="16dp"
+                            android:src="@drawable/ic_person"
+                            app:tint="@color/black_500" />
+
+                        <TextView
+                            android:id="@+id/tv_shipment_customer"
+                            style="@style/label_small"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:maxLines="1"
+                            android:layout_marginStart="4dp"
+                            android:textColor="@color/black_500"
+                            android:text="Gracia Hotmauli"/>
+
+                    </LinearLayout>
+
+                    <LinearLayout
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:orientation="horizontal">
+
+                        <ImageView
+                            android:layout_width="16dp"
+                            android:layout_height="16dp"
+                            android:src="@drawable/ic_location" />
+
+                        <TextView
+                            android:id="@+id/tv_shipment_location"
+                            style="@style/label_small"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:maxLines="1"
+                            android:layout_marginStart="4dp"
+                            android:textColor="@color/black_500"
+                            android:text="Serang"/>
+
+                    </LinearLayout>
+
+                </LinearLayout>
+
+                <Button
+                    android:id="@+id/btn_confirm_shipment"
+                    style="@style/button.small.active.medium"
+                    android:text="Kirim Pesanan"
+                    android:layout_alignParentEnd="true"/>
+
+            </RelativeLayout>
+
+        </LinearLayout>
+
+        <View
+            android:layout_width="match_parent"
+            android:layout_height="8dp"
+            android:background="@color/black_50"
+            android:layout_marginTop="16dp"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/layout_shipment_detail"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 1623228..7cd1489 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -66,17 +66,26 @@
     <string name="dl_date_wait">23:59 15 April 2025</string>
     <string name="no_available_orders">Tidak ada order</string>
     <string name="item_count_prod">%d produk</string>
-    <string name="show_more_product">%d produk lainnya</string>
-    <!--    status order-->
+    <string name="show_more_product">Lihat %d produk lainnya</string>
+    <!--    status order -->
     <string name="all_orders">Semua Pesanan </string>
     <string name="pending_orders">Menunggu Tagihan</string>
-    <string name="unpaid_orders">Konfrimasi Bayar</string>
+    <string name="unpaid_orders">Perlu Dibayar</string>
     <string name="processed_orders">Diproses</string>
     <string name="paid_orders">Sudah Dibayar</string>
     <string name="delivered_orders">Pesanan Sampai</string>
     <string name="completed_orders">Selesai</string>
     <string name="shipped_orders">Dikirim</string>
     <string name="canceled_orders">Dibatalkan</string>
+    <!--    status penjualan -->
+    <string name="all_sells">Semua Penjualan</string>
+    <string name="unpaid_sells">Belum Dibayar</string>
+    <string name="paid_sells">Konfirmasi Pembayaran</string>
+    <string name="processed_sells">Perlu Dikirim</string>
+    <string name="shipped_sells">Dikirim</string>
+    <string name="delivered_sells">Pengiriman Sampai</string>
+    <string name="completed_sells">Selesai</string>
+    <string name="canceled_sells">Dibatalkan</string>
     <!--    deadline label -->
     <string name="dl_pending">Batas Tagihan</string>
     <string name="dl_unpaid">Batas Pembayaran</string>