[Woo POS][Local Catalog] Sync error dialog in Settings

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeChildToParentCommunication.kt

@@ -99,6 +99,10 @@ sealed class ChildToParentEvent {
             val discountAmount: BigDecimal,
         )
     }
+
+    sealed class SettingsEvent : ChildToParentEvent() {
+        data class ShowSyncErrorDialog(val errorMessage: String) : SettingsEvent()
+    }
 }
 
 interface WooPosChildrenToParentEventReceiver {

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeParentToChildCommunication.kt

@@ -90,6 +90,10 @@ sealed class ParentToChildrenEvent {
             val discountAmount: BigDecimal,
         )
     }
+
+    sealed class SettingsEvent : ParentToChildrenEvent() {
+        data object RetrySyncRequested : SettingsEvent()
+    }
 }
 
 interface WooPosParentToChildrenEventReceiver {

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeViewModel.kt

@@ -250,6 +250,8 @@ class WooPosHomeViewModel @Inject constructor(
                     ChildToParentEvent.RefreshProductList -> {
                         sendEventToChildren(ParentToChildrenEvent.RefreshProductList)
                     }
+
+                    is ChildToParentEvent.SettingsEvent -> Unit
                 }
             }
         }

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/cart/WooPosCartViewModel.kt

@@ -216,7 +216,8 @@ class WooPosCartViewModel @Inject constructor(
                     ParentToChildrenEvent.SearchEvent.Finished,
                     ParentToChildrenEvent.SearchEvent.Started,
                     ParentToChildrenEvent.RefreshProductList,
-                    is ParentToChildrenEvent.CouponsRemoved -> Unit
+                    is ParentToChildrenEvent.CouponsRemoved,
+                    is ParentToChildrenEvent.SettingsEvent -> Unit
 
                     is ParentToChildrenEvent.CouponsValidationFailed -> {
                         onCouponsValidationFails()

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/items/WooPosItemsSearchHelper.kt

@@ -68,6 +68,7 @@ class WooPosItemsSearchHelper @Inject constructor(
                     is ParentToChildrenEvent.RemoveCouponsClicked -> Unit
                     is ParentToChildrenEvent.CouponsValidationFailed -> Unit
                     is ParentToChildrenEvent.OrderSuccessfullyPaid -> Unit
+                    is ParentToChildrenEvent.SettingsEvent -> Unit
                 }
             }
         }

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/items/WooPosItemsViewModel.kt

@@ -117,7 +117,8 @@ class WooPosItemsViewModel @Inject constructor(
                     ParentToChildrenEvent.SearchEvent.Finished,
                     is ParentToChildrenEvent.SearchEvent.RecentSearchSelected,
                     ParentToChildrenEvent.SearchEvent.Started,
-                    is ParentToChildrenEvent.BarcodeEvent -> Unit
+                    is ParentToChildrenEvent.BarcodeEvent,
+                    is ParentToChildrenEvent.SettingsEvent -> Unit
 
                     is ParentToChildrenEvent.OrderSuccessfullyPaid -> _viewState.value = initialState()
 

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/items/products/WooPosProductsInDbDataSource.kt

@@ -9,6 +9,7 @@ import kotlinx.coroutines.flow.flow
 import kotlinx.coroutines.flow.flowOn
 import kotlinx.coroutines.flow.map
 import kotlinx.coroutines.withContext
+import org.wordpress.android.fluxc.model.LocalOrRemoteId
 import org.wordpress.android.fluxc.store.pos.localcatalog.WooPosLocalCatalogStore
 import javax.inject.Inject
 
@@ -20,7 +21,7 @@ class WooPosProductsInDbDataSource @Inject constructor(
 
     private fun getProductsFromDatabaseFlow(): Flow<List<WooPosProductModel>> {
         val siteModel = selectedSite.getOrNull() ?: return flow { emit(emptyList()) }
-        val siteId = org.wordpress.android.fluxc.model.LocalOrRemoteId.LocalId(siteModel.id)
+        val siteId = LocalOrRemoteId.LocalId(siteModel.id)
 
         return posLocalCatalogStore.observeProducts(siteId)
             .map { result ->

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/items/products/WooPosProductsViewModel.kt

@@ -91,7 +91,8 @@ class WooPosProductsViewModel @Inject constructor(
                     is ParentToChildrenEvent.SearchEvent.ChangedQuery,
                     ParentToChildrenEvent.SearchEvent.Finished,
                     is ParentToChildrenEvent.SearchEvent.RecentSearchSelected,
-                    ParentToChildrenEvent.SearchEvent.Started -> Unit
+                    ParentToChildrenEvent.SearchEvent.Started,
+                    is ParentToChildrenEvent.SettingsEvent -> Unit
                 }
             }
         }

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/items/search/WooPosItemsSearchViewModel.kt

@@ -193,6 +193,7 @@ class WooPosItemsSearchViewModel @Inject constructor(
                     is ParentToChildrenEvent.CouponsRemoved -> Unit
                     is ParentToChildrenEvent.RefreshProductList -> Unit
                     is ParentToChildrenEvent.CouponsValidationFailed -> Unit
+                    is ParentToChildrenEvent.SettingsEvent -> Unit
                     is ParentToChildrenEvent.ItemClickedInItemsList -> {
                         if (event.itemData is ItemClickedData.Product.Variation && searchHelper.isSearchOpen()) {
                             storeRecentSearch()

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/totals/WooPosTotalsViewModel.kt

@@ -325,7 +325,8 @@ class WooPosTotalsViewModel @Inject constructor(
                     ParentToChildrenEvent.RemoveCouponsClicked,
                     ParentToChildrenEvent.RefreshProductList,
                     ParentToChildrenEvent.CouponsValidationFailed,
-                    is ParentToChildrenEvent.BarcodeEvent -> Unit
+                    is ParentToChildrenEvent.BarcodeEvent,
+                    is ParentToChildrenEvent.SettingsEvent -> Unit
                 }
             }
         }

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/settings/WooPosSettingsScreen.kt

@@ -22,6 +22,7 @@ import com.woocommerce.android.ui.woopos.scanningsetup.WooPosScanningSetupDialog
 import com.woocommerce.android.ui.woopos.settings.categories.WooPosSettingsCategoriesPaneScreen
 import com.woocommerce.android.ui.woopos.settings.categories.WooPosSettingsCategory
 import com.woocommerce.android.ui.woopos.settings.details.WooPosSettingsDetailPaneScreen
+import com.woocommerce.android.ui.woopos.settings.details.localcatalog.WooPosSyncErrorDialog
 import com.woocommerce.android.ui.woopos.settings.productinfo.WooPosSettingsProductInfoDialog
 import com.woocommerce.android.ui.woopos.settings.productinfo.WooPosSettingsProductInfoDialogState
 
@@ -49,6 +50,7 @@ fun WooPosSettingsScreen(onNavigationEvent: (WooPosNavigationEvent) -> Unit) {
         onBack = containerViewModel::navigateBack,
         onShowProductInfoDialog = containerViewModel::showProductInfoDialog,
         onShowScanningSetupDialog = containerViewModel::showScanningSetupDialog,
+        onRetrySync = containerViewModel::onRetrySyncFromDialogClicked,
         onDismissDialog = containerViewModel::hideDialog
     )
 }
@@ -62,6 +64,7 @@ private fun WooPosSettingsContent(
     onBack: () -> Unit,
     onShowProductInfoDialog: () -> Unit,
     onShowScanningSetupDialog: () -> Unit,
+    onRetrySync: () -> Unit,
     onDismissDialog: () -> Unit
 ) {
     Row(
@@ -107,6 +110,12 @@ private fun WooPosSettingsContent(
         isVisible = dialogState is WooPosSettingsDialogState.ScanningSetupDialog,
         onDismissRequest = onDismissDialog
     )
+
+    WooPosSyncErrorDialog(
+        isVisible = dialogState is WooPosSettingsDialogState.SyncErrorDialog,
+        onRetry = onRetrySync,
+        onDismissRequest = onDismissDialog
+    )
 }
 
 @WooPosPreview

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/settings/WooPosSettingsState.kt

@@ -76,4 +76,7 @@ sealed class WooPosSettingsDialogState : Parcelable {
 
     @Parcelize
     data object ScanningSetupDialog : WooPosSettingsDialogState()
+
+    @Parcelize
+    data class SyncErrorDialog(val errorMessage: String) : WooPosSettingsDialogState()
 }

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/settings/WooPosSettingsViewModel.kt

@@ -2,6 +2,10 @@ package com.woocommerce.android.ui.woopos.settings
 
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
+import com.woocommerce.android.ui.woopos.home.ChildToParentEvent
+import com.woocommerce.android.ui.woopos.home.ParentToChildrenEvent
+import com.woocommerce.android.ui.woopos.home.WooPosChildrenToParentEventReceiver
+import com.woocommerce.android.ui.woopos.home.WooPosParentToChildrenEventSender
 import com.woocommerce.android.ui.woopos.settings.categories.WooPosSettingsCategory
 import com.woocommerce.android.ui.woopos.util.analytics.WooPosAnalyticsEvent
 import com.woocommerce.android.ui.woopos.util.analytics.WooPosAnalyticsEvent.Event.HardwareTapped
@@ -21,11 +25,37 @@ import javax.inject.Inject
 
 @HiltViewModel
 class WooPosSettingsViewModel @Inject constructor(
-    private val analyticsTracker: WooPosAnalyticsTracker
+    private val analyticsTracker: WooPosAnalyticsTracker,
+    private val childToParentEventReceiver: WooPosChildrenToParentEventReceiver,
+    private val parentToChildEventSender: WooPosParentToChildrenEventSender,
 ) : ViewModel() {
     private val _state = MutableStateFlow(WooPosSettingsState())
     val state: StateFlow<WooPosSettingsState> = _state.asStateFlow()
 
+    init {
+        listenToChildEvents()
+    }
+
+    private fun listenToChildEvents() {
+        viewModelScope.launch {
+            childToParentEventReceiver.events.collect { event ->
+                when (event) {
+                    is ChildToParentEvent.SettingsEvent.ShowSyncErrorDialog -> {
+                        showSyncErrorDialog(event.errorMessage)
+                    }
+                    else -> Unit
+                }
+            }
+        }
+    }
+
+    fun onRetrySyncFromDialogClicked() {
+        hideDialog()
+        viewModelScope.launch {
+            parentToChildEventSender.sendToChildren(ParentToChildrenEvent.SettingsEvent.RetrySyncRequested)
+        }
+    }
+
     fun onCategorySelected(category: WooPosSettingsCategory) {
         trackCategorySelection(category)
         _state.update { currentState ->
@@ -80,6 +110,12 @@ class WooPosSettingsViewModel @Inject constructor(
         }
     }
 
+    fun showSyncErrorDialog(errorMessage: String) {
+        _state.update { currentState ->
+            currentState.copy(dialogState = WooPosSettingsDialogState.SyncErrorDialog(errorMessage))
+        }
+    }
+
     fun hideDialog() {
         _state.update { currentState ->
             currentState.copy(dialogState = WooPosSettingsDialogState.Hidden)

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/settings/details/localcatalog/WooPosSettingsLocalCatalogScreen.kt

@@ -1,5 +1,6 @@
 package com.woocommerce.android.ui.woopos.settings.details.localcatalog
 
+import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -9,10 +10,15 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Switch
 import androidx.compose.material3.SwitchDefaults
@@ -30,12 +36,16 @@ import com.woocommerce.android.R
 import com.woocommerce.android.ui.woopos.common.composeui.WooPosPreview
 import com.woocommerce.android.ui.woopos.common.composeui.component.WooPosButton
 import com.woocommerce.android.ui.woopos.common.composeui.component.WooPosButtonState
+import com.woocommerce.android.ui.woopos.common.composeui.component.WooPosDialogWrapper
+import com.woocommerce.android.ui.woopos.common.composeui.component.WooPosOutlinedButton
 import com.woocommerce.android.ui.woopos.common.composeui.component.WooPosShimmerBox
 import com.woocommerce.android.ui.woopos.common.composeui.component.WooPosText
 import com.woocommerce.android.ui.woopos.common.composeui.designsystem.WooPosCornerRadius
+import com.woocommerce.android.ui.woopos.common.composeui.designsystem.WooPosIcons
 import com.woocommerce.android.ui.woopos.common.composeui.designsystem.WooPosSpacing
 import com.woocommerce.android.ui.woopos.common.composeui.designsystem.WooPosTheme
 import com.woocommerce.android.ui.woopos.common.composeui.designsystem.WooPosTypography
+import com.woocommerce.android.ui.woopos.common.composeui.designsystem.toAdaptivePadding
 
 @Composable
 fun WooPosSettingsLocalCatalogScreen(
@@ -54,10 +64,10 @@ fun WooPosSettingsLocalCatalogScreen(
 
 @Composable
 private fun WooPosSettingsLocalCatalogScreen(
+    modifier: Modifier = Modifier,
     state: WooPosSettingsLocalCatalogState,
     onToggleCellularData: (Boolean) -> Unit,
-    onRefreshCatalog: () -> Unit,
-    modifier: Modifier = Modifier
+    onRefreshCatalog: () -> Unit
 ) {
     Column(
         modifier = modifier
@@ -274,6 +284,95 @@ private fun SectionTitle(title: String) {
     )
 }
 
+@Composable
+fun WooPosSyncErrorDialog(
+    modifier: Modifier = Modifier,
+    isVisible: Boolean,
+    onRetry: () -> Unit,
+    onDismissRequest: () -> Unit
+) {
+    WooPosDialogWrapper(
+        modifier = modifier,
+        isVisible = isVisible,
+        dialogBackgroundContentDescription = stringResource(
+            id = R.string.woopos_settings_local_catalog_sync_error_dialog_background_content_description
+        ),
+        onDismissRequest = onDismissRequest
+    ) {
+        Column(
+            modifier = Modifier
+                .background(color = MaterialTheme.colorScheme.surfaceBright)
+                .padding(WooPosSpacing.XLarge.value.toAdaptivePadding())
+        ) {
+            Row {
+                Spacer(modifier = Modifier.weight(1f))
+                IconButton(
+                    onClick = onDismissRequest,
+                    modifier = Modifier
+                ) {
+                    Icon(
+                        Icons.Default.Close,
+                        contentDescription = stringResource(
+                            id = R.string.woopos_exit_dialog_confirmation_close_content_description
+                        ),
+                        modifier = Modifier.size(40.dp),
+                        tint = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f)
+                    )
+                }
+            }
+
+            Spacer(modifier = Modifier.size(WooPosSpacing.XLarge.value.toAdaptivePadding()))
+
+            Column(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .verticalScroll(rememberScrollState()),
+                horizontalAlignment = Alignment.CenterHorizontally
+            ) {
+                Image(
+                    imageVector = WooPosIcons.ErrorX,
+                    contentDescription = null,
+                    modifier = Modifier
+                        .padding(WooPosSpacing.Medium.value.toAdaptivePadding())
+                )
+
+                Spacer(modifier = Modifier.height(WooPosSpacing.Large.value.toAdaptivePadding()))
+
+                WooPosText(
+                    text = stringResource(R.string.woopos_settings_local_catalog_sync_error_dialog_title),
+                    style = WooPosTypography.Heading,
+                    fontWeight = FontWeight.Bold,
+                    color = MaterialTheme.colorScheme.onSurface
+                )
+
+                Spacer(modifier = Modifier.height(WooPosSpacing.Medium.value.toAdaptivePadding()))
+
+                WooPosText(
+                    text = stringResource(R.string.woopos_settings_local_catalog_sync_error_dialog_message),
+                    style = WooPosTypography.BodyLarge,
+                    color = MaterialTheme.colorScheme.onSurface
+                )
+
+                Spacer(modifier = Modifier.height(WooPosSpacing.XLarge.value.toAdaptivePadding()))
+
+                WooPosButton(
+                    modifier = Modifier.fillMaxWidth(),
+                    onClick = onRetry,
+                    text = stringResource(R.string.woopos_settings_local_catalog_sync_error_dialog_retry_button)
+                )
+
+                Spacer(modifier = Modifier.height(WooPosSpacing.Medium.value.toAdaptivePadding()))
+
+                WooPosOutlinedButton(
+                    modifier = Modifier.fillMaxWidth(),
+                    onClick = onDismissRequest,
+                    text = stringResource(R.string.woopos_settings_local_catalog_sync_error_dialog_cancel_button)
+                )
+            }
+        }
+    }
+}
+
 @WooPosPreview
 @Composable
 fun WooPosSettingsLocalCatalogScreenPreview() {
@@ -322,3 +421,15 @@ fun WooPosSettingsLocalCatalogRefreshingPreview() {
         )
     }
 }
+
+@WooPosPreview
+@Composable
+fun WooPosSyncErrorDialogPreview() {
+    WooPosTheme {
+        WooPosSyncErrorDialog(
+            isVisible = true,
+            onRetry = {},
+            onDismissRequest = {}
+        )
+    }
+}