Merge pull request #75 from PetJournal/refactor/change-to-the-new-nam…

…e-and-gender-screen-design Refactor/change to the new name and gender screen design
PetJournal · Nov 11, 2024 · 73952d4 · 73952d4
2 parents 9b0eb34 + f2eaf53
commit 73952d4
Show file tree

Hide file tree

Showing 19 changed files with 359 additions and 215 deletions.
diff --git a/...src/androidTest/java/com/soujunior/petjournal/login/LoginAccountConfirmationDialogTest.kt b/...src/androidTest/java/com/soujunior/petjournal/login/LoginAccountConfirmationDialogTest.kt
@@ -0,0 +1,43 @@
+package com.soujunior.petjournal.login
+
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.test.onAllNodesWithText
+import androidx.compose.ui.test.onNodeWithText
+import androidx.compose.ui.test.performClick
+import androidx.test.ext.junit.runners.AndroidJUnit4
+import com.soujunior.petjournal.ui.screens_app.account_manager.loginScreen.components.AccountConfirmationDialog
+import org.junit.Rule
+import org.junit.Test
+import org.junit.runner.RunWith
+
+@RunWith(AndroidJUnit4::class)
+class LoginAccountConfirmationDialogTest {
+    @get:Rule
+    val composeTestRule = createComposeRule()
+
+    @Test
+    fun whenAccountNotConfirmed_shouldShowConfirmationDialog() {
+        composeTestRule.setContent {
+            val showDialog = remember { mutableStateOf(true) }
+
+            if (showDialog.value) {
+                AccountConfirmationDialog(
+                    onDismiss = { showDialog.value = false }
+                )
+            }
+        }
+
+        composeTestRule.onNodeWithText("Confirmação do E-mail").assertExists()
+
+        composeTestRule.onNodeWithText("Entendi").performClick()
+
+        composeTestRule.waitUntil(timeoutMillis = 5_000) {
+            composeTestRule.onAllNodesWithText("Confirmação do E-mail").fetchSemanticsNodes()
+                .isEmpty()
+        }
+
+        composeTestRule.onNodeWithText("Confirmação do E-mail").assertDoesNotExist()
+    }
+}
diff --git a/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/AlertText.kt b/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/AlertText.kt
@@ -1,15 +1,19 @@
 package com.soujunior.petjournal.ui.components
 
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.size
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import ir.kaaveh.sdpcompose.sdp
+import ir.kaaveh.sdpcompose.ssp
 
 @Composable
 fun AlertText(modifier: Modifier = Modifier.fillMaxWidth(), textMessage: String?) {
     if (textMessage != null)
         Text(
+            fontSize = 12.ssp,
             text = textMessage,
             modifier = modifier,
             color = MaterialTheme.colorScheme.error

diff --git a/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/Breadcrumb.kt b/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/Breadcrumb.kt
@@ -20,9 +20,9 @@ import androidx.compose.ui.text.SpanStyle
 import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.withStyle
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.soujunior.petjournal.R
+import ir.kaaveh.sdpcompose.sdp
+import ir.kaaveh.sdpcompose.ssp
 
 /**
  * Este metodo é responsável por exibir um pequeno "roadmap" de qual tela o usuário se encontra
@@ -56,14 +56,14 @@ fun Breadcrumb(index: Int){
     Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically){
         Column(
             horizontalAlignment = Alignment.Start,
-            modifier = Modifier.padding(2.dp)
+            modifier = Modifier.padding(2.sdp)
         ){
             Icon(
                 painter = painterResource(id = R.drawable.home),
                 contentDescription = "Home Icon",
                 tint = MaterialTheme.colorScheme.primary)
         }
-        Column(modifier = Modifier.padding(2.dp)) {
+        Column(modifier = Modifier.padding(2.sdp)) {
             Text(
                 modifier = Modifier.fillMaxWidth(),
                 text = text,
@@ -80,7 +80,7 @@ private fun buildString(screens: List<String>, index: Int): AnnotatedString{
             val isLast = index == screenText.size-1
             withStyle(
                 style = SpanStyle(
-                    fontSize = 10.sp,
+                    fontSize = 10.ssp,
                     fontFamily = MaterialTheme.typography.headlineMedium.fontFamily,
                     letterSpacing = MaterialTheme.typography.headlineMedium.letterSpacing,
                     color =
@@ -91,7 +91,7 @@ private fun buildString(screens: List<String>, index: Int): AnnotatedString{
             }
             if(!isLast) {
                 withStyle(style = SpanStyle(
-                    fontSize = 10.sp,
+                    fontSize = 10.ssp,
                     fontFamily = MaterialTheme.typography.headlineMedium.fontFamily,
                     letterSpacing = MaterialTheme.typography.headlineMedium.letterSpacing,
                     color = MaterialTheme.colorScheme.onBackground

diff --git a/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/Checkbox.kt b/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/Checkbox.kt
@@ -21,6 +21,8 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import ir.kaaveh.sdpcompose.sdp
+import ir.kaaveh.sdpcompose.ssp
 
 @Composable
 fun Checkbox(
@@ -36,14 +38,14 @@ fun Checkbox(
         ) {
             Box(
                 modifier = Modifier
-                    .padding(end = 6.dp)
-                    .size(22.dp)
-                    .clip(RoundedCornerShape(8.dp))
+                    .padding(end = 6.sdp)
+                    .size(22.sdp)
+                    .clip(RoundedCornerShape(8.sdp))
                     .background(Color.White)
                     .border(
                         1.2.dp,
                         if (radioButtonSelected) MaterialTheme.colorScheme.primary else MaterialTheme.colorScheme.outline,
-                        RoundedCornerShape(8.dp)
+                        RoundedCornerShape(8.sdp)
                     ),
                 contentAlignment = Alignment.Center
             ) {
@@ -55,12 +57,13 @@ fun Checkbox(
                         uncheckedColor = Color.Transparent,
                         checkmarkColor = if (isSystemInDarkTheme()) MaterialTheme.colorScheme.background else MaterialTheme.colorScheme.primary
                     ),
-                    modifier = Modifier.size(10.dp)
+                    modifier = Modifier.size(10.sdp)
                 )
             }
 
             Text(
                 text = text,
+                fontSize = 11.ssp,
                 style = styleText,
                 color = if (isDarkMode) MaterialTheme.colorScheme.primary else Color.Unspecified
             )

diff --git a/...urnal/app/src/main/java/com/soujunior/petjournal/ui/components/CreateTitleAndImageLogo.kt b/...urnal/app/src/main/java/com/soujunior/petjournal/ui/components/CreateTitleAndImageLogo.kt
@@ -2,7 +2,6 @@ package com.soujunior.petjournal.ui.components
 
 import android.os.Build
 import androidx.compose.foundation.background
-import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxWithConstraints
@@ -20,7 +19,6 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.res.stringResource
@@ -38,10 +36,14 @@ import ir.kaaveh.sdpcompose.ssp
 
 @Composable
 fun CreateTitleAndImageLogo(
-    title: String,
-    modifierImage: Modifier = Modifier ,
+    title: String? = "",
+    titleSecundary: String,
+    breadcrumbEnable: Boolean? = false,
+    breadcrumbIndex: Int? = 0,
+    modifierImage: Modifier = Modifier,
     modifierTextTitle: Modifier = Modifier.padding(start = 8.sdp),
     styleTitle: TextStyle = MaterialTheme.typography.displayMedium,
+    spaceBetweenbreadcrumbAndTitle: Dp = 0.sdp,
     spaceBetween: Dp = 0.sdp,
     textAlign: TextAlign? = null
 ) {
@@ -62,7 +64,8 @@ fun CreateTitleAndImageLogo(
     ) {
         Column(
             modifier = Modifier
-                .fillMaxWidth().background(MaterialTheme.colorScheme.background)
+                .fillMaxWidth()
+                .background(MaterialTheme.colorScheme.background)
         ) {
             Box(
                 modifier = Modifier
@@ -84,6 +87,38 @@ fun CreateTitleAndImageLogo(
                     ImageLogo(modifier = modifierImage)
                 }
             }
+            if (breadcrumbEnable == true) {
+                Spacer(modifier = Modifier.height(4.sdp))
+                Row(
+                    verticalAlignment = Alignment.CenterVertically,
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(start = 10.sdp, end = 10.sdp),
+                ) {
+                    if (breadcrumbIndex != null) {
+                        Breadcrumb(index = breadcrumbIndex)
+                    }
+                }
+            }
+            if (!title.isNullOrEmpty()) {
+                Spacer(modifier = Modifier.height(spaceBetweenbreadcrumbAndTitle))
+                Row(
+                    verticalAlignment = Alignment.CenterVertically,
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(start = 10.sdp, end = 10.sdp),
+                ) {
+                    Text(
+                        text = title,
+                        style = MaterialTheme.typography.titleMedium,
+                        modifier = modifierTextTitle,
+                        color = MaterialTheme.colorScheme.primary,
+                        textAlign = textAlign,
+                        fontWeight = FontWeight(10),
+                        fontSize = 16.ssp
+                    )
+                }
+            }
             Spacer(modifier = Modifier.height(spaceBetween))
             Row(
                 verticalAlignment = Alignment.CenterVertically,
@@ -92,7 +127,7 @@ fun CreateTitleAndImageLogo(
                     .padding(start = 10.sdp, end = 10.sdp),
             ) {
                 Text(
-                    text = title,
+                    text = titleSecundary,
                     style = styleTitle,
                     modifier = modifierTextTitle,
                     color = MaterialTheme.colorScheme.primary,
@@ -110,7 +145,12 @@ fun CreateTitleAndImageLogo(
 fun TesteImage() {
     PetJournalTheme {
         CreateTitleAndImageLogo(
-            title = stringResource(id = R.string.access_account),
+            title = "Uau",
+            titleSecundary = stringResource(id = R.string.access_account),
+            breadcrumbEnable = true,
+            breadcrumbIndex = 0,
+            spaceBetweenbreadcrumbAndTitle = 20.sdp,
+            spaceBetween = 15.sdp,
             styleTitle = MaterialTheme.typography.displayLarge,
             modifierImage = Modifier
                 .size(width = 200.dp, height = 200.dp)

diff --git a/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/DashedInputText.kt b/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/DashedInputText.kt
@@ -3,6 +3,7 @@ package com.soujunior.petjournal.ui.components
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -66,7 +67,7 @@ fun DashedInputText(
                 textAlign = TextAlign.Start,
                 color = MaterialTheme.colorScheme.onBackground,
                 style = MaterialTheme.typography.bodyMedium,
-                fontSize = 15.ssp,
+                fontSize = 12.ssp,
                 modifier = Modifier
                     .fillMaxWidth()
                     .padding(start = 10.sdp, bottom = 5.sdp, top = 15.sdp)
@@ -164,21 +165,29 @@ fun DashedInputText(
             )
         }
     }
-    if (textError != null) {
-        textError.forEach {
+    Row(
+        Modifier
+            .fillMaxWidth()
+            .background(MaterialTheme.colorScheme.background),
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.Start,
+    ) {
+        if (textError != null) {
+            textError.forEach {
 
-            AlertText(
-                textMessage = it,
-                modifier = Modifier.padding(top = 6.sdp, bottom = 6.sdp, start = 10.sdp)
+                AlertText(
+                    textMessage = it,
+                    modifier = Modifier.padding(top = 6.sdp, bottom = 6.sdp, start = 10.sdp)
+                )
+            }
+        } else {
+            Text(
+                "*Campo Obrigatório.",
+                color = MaterialTheme.colorScheme.outline,
+                modifier = Modifier.padding(10.sdp),
+                fontSize = 11.ssp
             )
         }
-    } else {
-        Text(
-            "*Campo Obrigatório.",
-            color = MaterialTheme.colorScheme.outline,
-            modifier = Modifier.padding(10.sdp),
-            fontSize = 11.ssp
-        )
     }
 
 }
diff --git a/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/RoundedSquare.kt b/petJournal/app/src/main/java/com/soujunior/petjournal/ui/components/RoundedSquare.kt
@@ -30,6 +30,7 @@ import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.soujunior.petjournal.R
+import ir.kaaveh.sdpcompose.ssp
 
 @Composable
 fun RoundedSquare(
@@ -160,7 +161,7 @@ fun RoundedSquare(
             ) {
                 Text(
                     text = text,
-                    fontSize = 15.sp,
+                    fontSize = 11.ssp,
                     modifier = Modifier
                         .fillMaxWidth(),
                     color = colorText,

diff --git a/.../com/soujunior/petjournal/ui/screens_app/account_manager/loginScreen/components/Footer.kt b/.../com/soujunior/petjournal/ui/screens_app/account_manager/loginScreen/components/Footer.kt
@@ -30,6 +30,7 @@ import com.soujunior.petjournal.ui.screens_app.account_manager.loginScreen.Login
 import com.soujunior.petjournal.ui.screens_app.account_manager.loginScreen.LoginViewModel
 import com.soujunior.petjournal.ui.states.TaskState
 import ir.kaaveh.sdpcompose.sdp
+import ir.kaaveh.sdpcompose.ssp
 
 @Composable
 fun Footer(
@@ -57,6 +58,7 @@ fun Footer(
             Text(
                 text = annotatedText,
                 style = MaterialTheme.typography.bodyLarge,
+                fontSize = 12.ssp,
                 modifier = Modifier
                     .clickable(onClick = { navController.navigate("register") })
                     .align(CenterVertically)

diff --git a/...soujunior/petjournal/ui/screens_app/account_manager/loginScreen/components/LoginHeader.kt b/...soujunior/petjournal/ui/screens_app/account_manager/loginScreen/components/LoginHeader.kt
@@ -12,7 +12,7 @@ import ir.kaaveh.sdpcompose.sdp
 fun LoginHeader() {
     CreateTitleAndImageLogo(
         spaceBetween = 40.sdp,
-        title = stringResource(id = R.string.access_account),
+        titleSecundary = stringResource(id = R.string.access_account),
         styleTitle = MaterialTheme.typography.displayMedium,
 
     )

diff --git a/...ui/screens_app/account_manager/loginScreen/components/RememberPasswordAndForgotSection.kt b/...ui/screens_app/account_manager/loginScreen/components/RememberPasswordAndForgotSection.kt
@@ -21,6 +21,7 @@ import com.soujunior.petjournal.ui.components.Checkbox
 import com.soujunior.petjournal.ui.screens_app.account_manager.loginScreen.LoginFormEvent
 import com.soujunior.petjournal.ui.screens_app.account_manager.loginScreen.LoginViewModel
 import ir.kaaveh.sdpcompose.sdp
+import ir.kaaveh.sdpcompose.ssp
 
 @Composable
 fun RememberPasswordAndForgotSection(navController: NavController, viewModel: LoginViewModel) {
@@ -53,6 +54,7 @@ fun RememberPasswordAndForgotSection(navController: NavController, viewModel: Lo
                         textDecoration = TextDecoration.Underline
                     ),
                     textAlign = TextAlign.End,
+                    fontSize = 11.ssp,
                     modifier = Modifier
                         .clickable(
                             onClick = {

diff --git a/...m/soujunior/petjournal/ui/screens_app/account_manager/registerScreen/components/Screen.kt b/...m/soujunior/petjournal/ui/screens_app/account_manager/registerScreen/components/Screen.kt
@@ -59,7 +59,7 @@ fun Screen(navController: NavController, viewModel: RegisterViewModel) {
         ) {
 
             CreateTitleAndImageLogo(
-                title = stringResource(id = R.string.sign_up),
+                titleSecundary = stringResource(id = R.string.sign_up),
                 spaceBetween = 40.sdp,
                 styleTitle = MaterialTheme.typography.displayMedium
             )