[Watch App] Introduce Order Details UI

WooCommerce-Wear/src/main/AndroidManifest.xml

@@ -55,6 +55,14 @@
                     android:pathPrefix="/orders-data"
                     android:scheme="wear" />
             </intent-filter>
+
+            <intent-filter>
+                <action android:name="com.google.android.gms.wearable.DATA_CHANGED" />
+                <data
+                    android:host="*"
+                    android:pathPrefix="/order-products-data"
+                    android:scheme="wear" />
+            </intent-filter>
         </service>
 
         <service

WooCommerce-Wear/src/main/java/com/woocommerce/android/extensions/FlowExt.kt

@@ -0,0 +1,18 @@
+package com.woocommerce.android.extensions
+
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.flow.Flow
+import kotlinx.coroutines.flow.combine
+import kotlinx.coroutines.flow.flow
+
+const val TIMEOUT_MILLIS = 20000L
+val timeoutFlow: Flow<Boolean>
+    get() = flow {
+        emit(false)
+        delay(TIMEOUT_MILLIS)
+        emit(true)
+    }
+
+fun <T, R> Flow<T>.combineWithTimeout(
+    transform: (data: T, isTimeout: Boolean) -> R
+) = combine(this, timeoutFlow, transform)

WooCommerce-Wear/src/main/java/com/woocommerce/android/phone/PhoneConnectionRepository.kt

@@ -9,6 +9,7 @@ import com.woocommerce.android.ui.login.LoginRepository
 import com.woocommerce.android.ui.orders.OrdersRepository
 import com.woocommerce.android.ui.stats.datasource.StatsRepository
 import com.woocommerce.commons.wear.DataPath.ORDERS_DATA
+import com.woocommerce.commons.wear.DataPath.ORDER_PRODUCTS_DATA
 import com.woocommerce.commons.wear.DataPath.SITE_DATA
 import com.woocommerce.commons.wear.DataPath.STATS_DATA
 import com.woocommerce.commons.wear.MessagePath
@@ -38,6 +39,7 @@ class PhoneConnectionRepository @Inject constructor(
                 SITE_DATA.value -> loginRepository.receiveStoreDataFromPhone(dataMap)
                 STATS_DATA.value -> statsRepository.receiveStatsDataFromPhone(dataMap)
                 ORDERS_DATA.value -> ordersRepository.receiveOrdersDataFromPhone(dataMap)
+                ORDER_PRODUCTS_DATA.value -> ordersRepository.receiveOrderProductsDataFromPhone(dataMap)
                 else -> Log.d(TAG, "Unknown path data received")
             }
         }

WooCommerce-Wear/src/main/java/com/woocommerce/android/ui/Navigation.kt

@@ -3,15 +3,21 @@ package com.woocommerce.android.ui
 import androidx.compose.runtime.Composable
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.navigation.NavHostController
+import androidx.navigation.NavType
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
+import androidx.navigation.navArgument
+import com.woocommerce.android.ui.NavArgs.ORDER_ID
 import com.woocommerce.android.ui.NavRoutes.LOGIN
 import com.woocommerce.android.ui.NavRoutes.MY_STORE
+import com.woocommerce.android.ui.NavRoutes.ORDER_DETAILS
 import com.woocommerce.android.ui.login.LoginScreen
 import com.woocommerce.android.ui.login.LoginViewModel
 import com.woocommerce.android.ui.mystore.MyStoreScreen
-import com.woocommerce.android.ui.orders.OrdersListViewModel
+import com.woocommerce.android.ui.orders.details.OrderDetailsScreen
+import com.woocommerce.android.ui.orders.details.OrderDetailsViewModel
+import com.woocommerce.android.ui.orders.list.OrdersListViewModel
 import com.woocommerce.android.ui.stats.StoreStatsViewModel
 
 @Composable
@@ -39,10 +45,30 @@ fun WooWearNavHost(
                 ordersListViewModel = ordersListViewModel
             )
         }
+        composable(
+            route = ORDER_DETAILS.withArgs(ORDER_ID),
+            arguments = listOf(navArgument(ORDER_ID.key) { type = NavType.LongType })
+        ) {
+            val viewModel: OrderDetailsViewModel = hiltViewModel()
+            OrderDetailsScreen(viewModel)
+        }
     }
 }
 
 enum class NavRoutes(val route: String) {
     LOGIN("login"),
-    MY_STORE("myStore")
+    MY_STORE("myStore"),
+    ORDER_DETAILS("orderDetails");
+
+    fun withArgs(args: Any): String {
+        return "$route/$args"
+    }
+
+    fun withArgs(navArgs: NavArgs): String {
+        return "$route/{${navArgs.key}}"
+    }
+}
+
+enum class NavArgs(val key: String) {
+    ORDER_ID("orderId")
 }

WooCommerce-Wear/src/main/java/com/woocommerce/android/ui/login/ObserveLoginRequest.kt

@@ -1,42 +1,26 @@
 package com.woocommerce.android.ui.login
 
+import com.woocommerce.android.extensions.combineWithTimeout
 import com.woocommerce.android.ui.login.ObserveLoginRequest.LoginRequestState.Logged
 import com.woocommerce.android.ui.login.ObserveLoginRequest.LoginRequestState.Timeout
 import com.woocommerce.android.ui.login.ObserveLoginRequest.LoginRequestState.Waiting
-import kotlinx.coroutines.delay
-import kotlinx.coroutines.flow.Flow
-import kotlinx.coroutines.flow.combine
-import kotlinx.coroutines.flow.flow
 import javax.inject.Inject
 
 class ObserveLoginRequest @Inject constructor(
     private val loginRepository: LoginRepository
 ) {
-    operator fun invoke() = combine(
-        loginRepository.isSiteAvailable,
-        timeoutFlow
-    ) { isSiteAvailable, isTimeout ->
-        when {
-            isSiteAvailable -> Logged
-            isTimeout.not() -> Waiting
-            else -> Timeout
-        }
-    }
-
-    private val timeoutFlow: Flow<Boolean>
-        get() = flow {
-            emit(false)
-            delay(TIMEOUT_MILLIS)
-            emit(true)
+    operator fun invoke() = loginRepository.isSiteAvailable
+        .combineWithTimeout { isSiteAvailable, isTimeout ->
+            when {
+                isSiteAvailable -> Logged
+                isTimeout.not() -> Waiting
+                else -> Timeout
+            }
         }
 
     enum class LoginRequestState {
         Logged,
         Waiting,
         Timeout
     }
-
-    companion object {
-        const val TIMEOUT_MILLIS = 20000L
-    }
 }

WooCommerce-Wear/src/main/java/com/woocommerce/android/ui/mystore/MyStoreScreen.kt

@@ -5,8 +5,8 @@ import androidx.compose.foundation.pager.rememberPagerState
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import com.google.android.horologist.compose.pager.PagerScreen
-import com.woocommerce.android.ui.orders.OrdersListScreen
-import com.woocommerce.android.ui.orders.OrdersListViewModel
+import com.woocommerce.android.ui.orders.list.OrdersListScreen
+import com.woocommerce.android.ui.orders.list.OrdersListViewModel
 import com.woocommerce.android.ui.stats.StoreStatsScreen
 import com.woocommerce.android.ui.stats.StoreStatsViewModel
 

WooCommerce-Wear/src/main/java/com/woocommerce/android/ui/orders/FormatOrderData.kt

@@ -0,0 +1,73 @@
+package com.woocommerce.android.ui.orders
+
+import android.content.Context
+import android.os.Parcelable
+import com.woocommerce.android.R
+import com.woocommerce.android.util.DateUtils
+import kotlinx.parcelize.Parcelize
+import org.wordpress.android.fluxc.model.OrderEntity
+import org.wordpress.android.fluxc.model.SiteModel
+import org.wordpress.android.fluxc.store.WooCommerceStore
+import java.util.Locale
+import javax.inject.Inject
+
+class FormatOrderData @Inject constructor(
+    private val context: Context,
+    private val wooCommerceStore: WooCommerceStore,
+    private val dateUtils: DateUtils,
+    private val locale: Locale,
+) {
+    operator fun invoke(
+        selectedSite: SiteModel,
+        order: OrderEntity
+    ) = order.toOrderItem(selectedSite)
+
+    operator fun invoke(
+        selectedSite: SiteModel,
+        orders: List<OrderEntity>
+    ) = orders.map { it.toOrderItem(selectedSite) }
+
+    private fun OrderEntity.toOrderItem(
+        selectedSite: SiteModel
+    ): OrderItem {
+        val formattedOrderTotals = wooCommerceStore.formatCurrencyForDisplay(
+            amount = total.toDoubleOrNull() ?: 0.0,
+            site = selectedSite,
+            currencyCode = null,
+            applyDecimalFormatting = true
+        )
+
+        val formattedCreationDate = dateUtils.getFormattedDateWithSiteTimeZone(
+            dateCreated
+        ) ?: dateCreated
+
+        val formattedBillingName = takeUnless {
+            billingFirstName.isEmpty() && billingLastName.isEmpty()
+        }?.let { "$billingFirstName $billingLastName" } ?: context.getString(R.string.orders_list_guest_customer)
+
+        val formattedStatus = status.replaceFirstChar {
+            if (it.isLowerCase()) it.titlecase(locale) else it.toString()
+        }
+
+        val formattedNumber = "#$number"
+
+        return OrderItem(
+            id = orderId,
+            date = formattedCreationDate,
+            number = formattedNumber,
+            customerName = formattedBillingName,
+            total = formattedOrderTotals,
+            status = formattedStatus
+        )
+    }
+
+    @Parcelize
+    data class OrderItem(
+        val id: Long,
+        val date: String,
+        val number: String,
+        val customerName: String,
+        val total: String,
+        val status: String
+    ) : Parcelable
+}