Feature: new nfc look, network failure toast implemented

.gitignore

@@ -1,6 +1,7 @@
 # Project exclude paths
 .gradle/
 .idea/
+.DS_Store
 /build
 /local.properties
 /satodime-android

app/build.gradle

@@ -99,4 +99,11 @@ dependencies {
     androidTestImplementation "androidx.compose.ui:ui-test-junit4:$compose_ui_version"
     debugImplementation "androidx.compose.ui:ui-tooling:$compose_ui_version"
     debugImplementation "androidx.compose.ui:ui-test-manifest:$compose_ui_version"
+
+    //Material 3 compose
+    implementation 'androidx.compose.material3:material3:1.2.1'
+
+    //Compose coil image
+    implementation "io.coil-kt:coil-gif:2.0.0-rc02"
+    implementation 'io.coil-kt:coil-compose:2.0.0-rc02'
 }

app/src/main/AndroidManifest.xml

@@ -4,6 +4,7 @@
 
     <uses-permission android:name="android.permission.NFC" />
     <uses-permission android:name="android.permission.INTERNET" />
+    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
     <uses-feature android:name="android.hardware.nfc" android:required="true" />
 
     <application

app/src/main/java/org/satochip/satodimeapp/MainActivity.kt

@@ -3,16 +3,58 @@ package org.satochip.satodimeapp
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import org.satochip.satodimeapp.ui.components.shared.SatoToast
+import org.satochip.satodimeapp.ui.theme.SatoGreen
 import org.satochip.satodimeapp.ui.theme.SatodimeTheme
+import org.satochip.satodimeapp.util.internetconnection.ConnectionChecker
 
 class MainActivity : ComponentActivity() {
 
+    private lateinit var connectionChecker: ConnectionChecker
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
+        connectionChecker = ConnectionChecker(applicationContext)
 
         setContent {
             SatodimeTheme {
-                Navigation()
+                val status by connectionChecker.observe().collectAsState(
+                    initial = ConnectionChecker.InternetStatus.Available
+                )
+                var prevStatus by remember {
+                    mutableStateOf<ConnectionChecker.InternetStatus?>(null)
+                }
+
+                Box(
+                    modifier = Modifier.fillMaxSize()
+                ) {
+                    Navigation()
+                    if (prevStatus == ConnectionChecker.InternetStatus.Lost && status == ConnectionChecker.InternetStatus.Available) {
+                        SatoToast(
+                            title = R.string.networkConnected,
+                            text = R.string.networkConnectedMessage,
+                            icon = R.drawable.contactless_24px,
+                            iconColor = SatoGreen
+                        )
+                    }
+                    if (status == ConnectionChecker.InternetStatus.Lost ||
+                        status == ConnectionChecker.InternetStatus.Unavailable
+                    ) {
+                        SatoToast(
+                            title = R.string.networkError,
+                            text = R.string.networkErrorMessage,
+                            icon = R.drawable.error_cross
+                        )
+                        prevStatus = status
+                    }
+                }
             }
         }
     }

app/src/main/java/org/satochip/satodimeapp/ui/VaultsView.kt

@@ -49,6 +49,7 @@ import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.Close
 import androidx.compose.material.icons.filled.Loop
 import androidx.compose.material.icons.filled.MoreVert
+import androidx.compose.material.icons.outlined.ContentCopy
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
@@ -92,10 +93,14 @@ import org.satochip.satodimeapp.ui.components.NfcDialog
 import org.satochip.satodimeapp.ui.components.NftDialog
 import org.satochip.satodimeapp.ui.components.RedGradientBackground
 import org.satochip.satodimeapp.ui.components.VaultCard
+import org.satochip.satodimeapp.ui.components.shared.SatoButton
+import org.satochip.satodimeapp.ui.components.vaults.VaultDrawerScreen
+import org.satochip.satodimeapp.ui.components.vaults.VaultsBottomDrawer
 import org.satochip.satodimeapp.ui.theme.DarkRed
 import org.satochip.satodimeapp.ui.theme.LightBlue
 import org.satochip.satodimeapp.ui.theme.LightDarkBlue
 import org.satochip.satodimeapp.ui.theme.LightGreen
+import org.satochip.satodimeapp.ui.theme.SatoGreen
 import org.satochip.satodimeapp.ui.theme.SatodimeTheme
 import org.satochip.satodimeapp.util.SatodimeScreen
 import org.satochip.satodimeapp.util.formatBalance
@@ -112,6 +117,11 @@ fun VaultsView(navController: NavController, sharedViewModel: SharedViewModel) {
     val showNfcDialog = remember{ mutableStateOf(false) } // for NfcDialog
     val showNoCardScannedDialog = remember { mutableStateOf(false)}// for NoCardScannedDialog
 
+    // NfcDialog
+    if (showNfcDialog.value){
+        NfcDialog(openDialogCustom = showNfcDialog, resultCodeLive = sharedViewModel.resultCodeLive, isConnected = sharedViewModel.isCardConnected)
+    }
+
 //    val showOwnershipDialog = remember{ mutableStateOf(true) } // for OwnershipDialog
 //    val showAuthenticityDialog = remember{ mutableStateOf(true) } // for AuthenticityDialog
 
@@ -373,12 +383,6 @@ fun VaultsView(navController: NavController, sharedViewModel: SharedViewModel) {
                 uriHandler.openUri("https://satochip.io/satodime-ownership-explained/")
             },)
     }
-
-    // NfcDialog
-    if (showNfcDialog.value){
-        NfcDialog(openDialogCustom = showNfcDialog, resultCodeLive = sharedViewModel.resultCodeLive, isConnected = sharedViewModel.isCardConnected)
-    }
-
 }
 
 /// LIST VIEW
@@ -770,7 +774,7 @@ fun VaultsViewTokenRow(asset: Asset) {
             contentDescription = "link to explorer",
             modifier = Modifier
                 .width(30.dp)
-                .clickable{
+                .clickable {
                     uriHandler.openUri(asset.explorerLink ?: "")
                 },
             tint = MaterialTheme.colors.secondary, //Color.LightGray,
@@ -847,7 +851,7 @@ fun VaultsViewNftRow(asset: Asset) {
             contentDescription = "link to NFT explorer",
             modifier = Modifier
                 .width(30.dp)
-                .clickable{
+                .clickable {
                     uriHandler.openUri(asset.nftExplorerLink ?: asset.explorerLink ?: "")
                 },
             //.requiredWidth(30.dp)

app/src/main/java/org/satochip/satodimeapp/ui/components/NfcDialog.kt

@@ -30,6 +30,8 @@ import kotlinx.coroutines.delay
 import org.satochip.satodimeapp.R
 import org.satochip.satodimeapp.data.NfcResultCode
 import org.satochip.satodimeapp.services.SatoLog
+import org.satochip.satodimeapp.ui.components.vaults.VaultDrawerScreen
+import org.satochip.satodimeapp.ui.components.vaults.VaultsBottomDrawer
 import org.satochip.satodimeapp.ui.theme.LightBlue
 import org.satochip.satodimeapp.ui.theme.Orange
 import kotlin.time.Duration.Companion.seconds
@@ -39,24 +41,46 @@ private const val TAG = "NfcDialog"
 @Composable
 fun NfcDialog(openDialogCustom: MutableState<Boolean>, resultCodeLive: NfcResultCode, isConnected: Boolean) {
 
-    Dialog(onDismissRequest = {
-        openDialogCustom.value = false
-        // todo: disable NFC scan?
-    }) {
-        NfcDialogUI(openDialogCustom = openDialogCustom, resultCodeLive = resultCodeLive, isConnected = isConnected)
+    VaultsBottomDrawer(
+        showSheet = openDialogCustom
+    ) {
 
-        // auto-close alertDialog when action is done
         LaunchedEffect(resultCodeLive) {
             SatoLog.d(TAG, "LaunchedEffect START ${resultCodeLive}")
             while (resultCodeLive == NfcResultCode.Busy || resultCodeLive == NfcResultCode.None) {
                 SatoLog.d(TAG, "LaunchedEffect in while delay 2s ${resultCodeLive}")
                 delay(2.seconds)
             }
-            SatoLog.d(TAG, "LaunchedEffect after while delay 3s ${resultCodeLive}")
-            delay(3.seconds)
-            openDialogCustom.value = false
+            SatoLog.d(TAG, "LaunchedEffect after while delay ${resultCodeLive}")
         }
 
+        if (resultCodeLive == NfcResultCode.Busy){
+            VaultDrawerScreen(
+                closeSheet = {
+                    openDialogCustom.value = !openDialogCustom.value
+                },
+                closeDrawerButton = true,
+                title = R.string.readyToScan,
+                image = R.drawable.phone_icon,
+                message = R.string.nfcHoldSatodime
+            )
+        } else {
+            if (resultCodeLive == NfcResultCode.Ok){
+                VaultDrawerScreen(
+                    closeSheet = {
+                        openDialogCustom.value = !openDialogCustom.value
+                    },
+                    closeDrawerButton = true,
+                    title = R.string.readyToScan,
+                    image = R.drawable.icon_check_gif,
+                    message = R.string.nfcHoldSatodime
+                )
+                LaunchedEffect(Unit) {
+                    delay(0.5.seconds)
+                    openDialogCustom.value = false
+                }
+            }
+        }
     }
 }
 

app/src/main/java/org/satochip/satodimeapp/ui/components/shared/BottomSheet.kt

@@ -0,0 +1,44 @@
+package org.satochip.satodimeapp.ui.components.shared
+
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.rememberModalBottomSheetState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.MutableState
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun BottomSheet(
+    showSheet: MutableState<Boolean>,
+    modifier: Modifier,
+    content: @Composable () -> Unit,
+) {
+    val sheetState = rememberModalBottomSheetState(
+        skipPartiallyExpanded = false
+    )
+    if (!showSheet.value) {
+        return
+    } else {
+        BottomSheet(
+            modifier = modifier,
+            showSheet = showSheet,
+        ) {
+            content()
+        }
+        ModalBottomSheet(
+            modifier = modifier,
+            containerColor = Color.White,
+            sheetState = sheetState,
+            onDismissRequest = {
+                showSheet.value = !showSheet.value
+            },
+            shape = RoundedCornerShape(10.dp)
+        ) {
+            content()
+        }
+    }
+}

app/src/main/java/org/satochip/satodimeapp/ui/components/shared/GifImage.kt

@@ -0,0 +1,46 @@
+package org.satochip.satodimeapp.ui.components.shared
+
+import android.os.Build
+import androidx.annotation.DrawableRes
+import androidx.compose.foundation.Image
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.platform.LocalContext
+import coil.ImageLoader
+import coil.compose.rememberAsyncImagePainter
+import coil.decode.GifDecoder
+import coil.decode.ImageDecoderDecoder
+import coil.request.ImageRequest
+import coil.size.Size
+
+@Composable
+fun GifImage(
+    modifier: Modifier,
+    colorFilter: ColorFilter? = null,
+    @DrawableRes image: Int
+) {
+    val context = LocalContext.current
+    val imageLoader = ImageLoader.Builder(context)
+        .components {
+            if (Build.VERSION.SDK_INT >= 28) {
+                add(ImageDecoderDecoder.Factory())
+            } else {
+                add(GifDecoder.Factory())
+            }
+        }
+        .build()
+    val painter = rememberAsyncImagePainter(
+        ImageRequest.Builder(context).data(data = image)
+            .apply(block = {
+                size(Size.ORIGINAL)
+            }).build(), imageLoader = imageLoader
+    )
+    Image(
+        modifier = modifier,
+        painter = painter,
+        contentDescription = null,
+        colorFilter = colorFilter
+    )
+}

app/src/main/java/org/satochip/satodimeapp/ui/components/shared/SatoButton.kt

@@ -15,19 +15,21 @@ import androidx.compose.ui.unit.dp
 
 @Composable
 fun SatoButton(
+    modifier: Modifier = Modifier,
     onClick: () -> Unit,
     text: Int,
     buttonColor: Color = MaterialTheme.colors.primary,
-    textColor: Color = MaterialTheme.colors.secondary
+    textColor: Color = MaterialTheme.colors.secondary,
+    shape: RoundedCornerShape = RoundedCornerShape(50)
 ) {
     Button(
         onClick = {
             onClick()
         },
-        modifier = Modifier
+        modifier = modifier
             .padding(10.dp)
             .height(40.dp),
-        shape = RoundedCornerShape(50),
+        shape = shape,
         colors = ButtonDefaults.buttonColors(
             backgroundColor = buttonColor,
         )