Correction TP 7 Auth Fragment

app/build.gradle.kts

@@ -49,6 +49,7 @@ dependencies {
     implementation(libs.androidx.ui.graphics)
     implementation(libs.androidx.ui.tooling.preview)
     implementation(libs.androidx.material3)
+    implementation(libs.androidx.navigation.compose)
     testImplementation(libs.junit)
     androidTestImplementation(libs.androidx.junit)
     androidTestImplementation(libs.androidx.espresso.core)

app/src/main/java/com/example/tpfilrouge/auth/AuthActivity.kt

@@ -0,0 +1,46 @@
+package com.example.tpfilrouge.auth
+
+import android.os.Bundle
+import androidx.activity.ComponentActivity
+import androidx.activity.compose.setContent
+import androidx.activity.enableEdgeToEdge
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.composable
+import androidx.navigation.compose.rememberNavController
+
+class AuthActivity : ComponentActivity() {
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        enableEdgeToEdge()
+        setContent {
+            AuthActivityPage()
+        }
+    }
+}
+
+@Composable
+fun AuthActivityPage() {
+    val navController = rememberNavController();
+
+    NavHost(
+        navController = navController,
+        startDestination = "login"
+    ){
+        composable("login") {  LoginFragmentPage(LoginViewModel(), navController) }
+        composable("sign_up") {  SignUpFragmentPage(SignUpViewModel()) }
+        composable("reset_password") {  ResetPasswordFragmentPage(ResetPasswordViewModel()) }
+    }
+}
+
+@Preview(
+    showBackground = true,
+    locale = "en"
+)
+@Composable
+fun AuthActivityPreview() {
+    AuthActivityPage()
+}

app/src/main/java/com/example/tpfilrouge/auth/LoginFragment.kt

@@ -1,10 +1,6 @@
 package com.example.tpfilrouge.auth
 
 import android.content.Intent
-import android.os.Bundle
-import androidx.activity.ComponentActivity
-import androidx.activity.compose.setContent
-import androidx.activity.enableEdgeToEdge
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
@@ -23,27 +19,15 @@ import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
 import com.example.tpfilrouge.R
 import com.example.tpfilrouge.article.ListArticleActivity
 import com.example.tpfilrouge.ui.theme.EniButton
 import com.example.tpfilrouge.ui.theme.EniPage
 import com.example.tpfilrouge.ui.theme.EniTextField
 
-class LoginActivity : ComponentActivity() {
-
-    var loginViewModel = LoginViewModel();
-
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        enableEdgeToEdge()
-        setContent {
-            LoginActivityPage(loginViewModel);
-        }
-    }
-}
-
 @Composable
-fun LoginActivityPage(loginViewModel: LoginViewModel) {
+fun LoginFragmentPage(loginViewModel: LoginViewModel, navController: NavController? = null) {
     // Ecouter les changements de l'email et mot de passe saisies
     val emailField by loginViewModel.email.collectAsState()
     val passwordField by loginViewModel.password.collectAsState()
@@ -66,18 +50,25 @@ fun LoginActivityPage(loginViewModel: LoginViewModel) {
                 textAlign = TextAlign.Center,
                 style = TextStyle(color = Color(0xCCFFFFFF))
             )
-            EniTextField(stringResource(R.string.email), value = emailField, onValueChange = { value -> loginViewModel.email.value = value; })
+            EniTextField(
-            EniTextField(stringResource(R.string.password), value = passwordField, onValueChange = { value -> loginViewModel.password.value = value; })
+                stringResource(R.string.email),
-            EniButton(stringResource(R.string.connection), onClick = { loginViewModel.callLoginApi(
+                value = emailField,
-                onSuccess = {
+                onValueChange = { value -> loginViewModel.email.value = value; })
-                    // je change de page (page article
+            EniTextField(
-                    context.startActivity(Intent(context, ListArticleActivity::class.java))
+                stringResource(R.string.password),
-                }
+                value = passwordField,
-            ) })
+                onValueChange = { value -> loginViewModel.password.value = value; })
+            EniButton(stringResource(R.string.connection), onClick = {
+                loginViewModel.callLoginApi(
+                    onSuccess = {
+                        // je change de page (page article
+                        context.startActivity(Intent(context, ListArticleActivity::class.java))
+                    }
+                )
+            })
             EniButton(stringResource(R.string.forget_password),
                 onClick = {
-                    // Changer de page (d'activity)
+                    navController!!.navigate("reset_password");
-                    context.startActivity(Intent(context, ResetPasswordActivity::class.java))
                 })
             Spacer(modifier = Modifier.weight(1f))
             Text(
@@ -88,8 +79,7 @@ fun LoginActivityPage(loginViewModel: LoginViewModel) {
             )
             EniButton(stringResource(R.string.register_now),
                 onClick = {
-                    // Changer de page (d'activity)
+                    navController!!.navigate("sign_up");
-                    context.startActivity(Intent(context, SignUpActivity::class.java))
                 })
         }
     }
@@ -101,6 +91,6 @@ fun LoginActivityPage(loginViewModel: LoginViewModel) {
     locale = "en"
 )
 @Composable
-fun LoginActivityPreview() {
+fun LoginFragmentPreview() {
-    LoginActivityPage(LoginViewModel())
+    LoginFragmentPage(LoginViewModel())
 }

app/src/main/java/com/example/tpfilrouge/auth/ResetPasswordFragment.kt

@@ -1,9 +1,5 @@
 package com.example.tpfilrouge.auth
 
-import android.os.Bundle
-import androidx.activity.ComponentActivity
-import androidx.activity.compose.setContent
-import androidx.activity.enableEdgeToEdge
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.padding
@@ -20,39 +16,33 @@ import com.example.tpfilrouge.ui.theme.EniButton
 import com.example.tpfilrouge.ui.theme.EniPage
 import com.example.tpfilrouge.ui.theme.EniTextField
 
-class ResetPasswordActivity : ComponentActivity() {
-
-    var resetPasswordViewModel = ResetPasswordViewModel();
-
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        enableEdgeToEdge()
-        setContent {
-            ResetPasswordActivityPage(resetPasswordViewModel)
-        }
-    }
-}
-
 @Composable
-fun ResetPasswordActivityPage(resetPasswordViewModel: ResetPasswordViewModel) {
+fun ResetPasswordFragmentPage(resetPasswordViewModel: ResetPasswordViewModel) {
     val emailField by resetPasswordViewModel.email.collectAsState();
 
     EniPage {
         Column(
             horizontalAlignment = Alignment.CenterHorizontally,
-            modifier = Modifier.padding(40.dp)) {
+            modifier = Modifier.padding(40.dp)
+        ) {
             Image(
                 painter = painterResource(id = R.drawable.reset_password_ic),
                 contentDescription = "Logo SignUp",
-                modifier = Modifier.padding(vertical = 40.dp))
+                modifier = Modifier.padding(vertical = 40.dp)
-            EniTextField("Email", value = emailField, onValueChange = { value -> resetPasswordViewModel.email.value = value})
+            )
-            EniButton("Envoyer le lien de récupération", onClick = { resetPasswordViewModel.callResetPasswordApi() })
+            EniTextField(
+                "Email",
+                value = emailField,
+                onValueChange = { value -> resetPasswordViewModel.email.value = value })
+            EniButton(
+                "Envoyer le lien de récupération",
+                onClick = { resetPasswordViewModel.callResetPasswordApi() })
         }
     }
 }
 
 @Preview(showBackground = true)
 @Composable
-fun ResetPasswordActivityPreview() {
+fun ResetPasswordFragmentPreview() {
-    ResetPasswordActivityPage(ResetPasswordViewModel())
+    ResetPasswordFragmentPage(ResetPasswordViewModel())
 }

app/src/main/java/com/example/tpfilrouge/auth/SignUpFragment.kt

@@ -1,9 +1,5 @@
 package com.example.tpfilrouge.auth
 
-import android.os.Bundle
-import androidx.activity.ComponentActivity
-import androidx.activity.compose.setContent
-import androidx.activity.enableEdgeToEdge
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.padding
@@ -20,21 +16,8 @@ import com.example.tpfilrouge.ui.theme.EniButton
 import com.example.tpfilrouge.ui.theme.EniPage
 import com.example.tpfilrouge.ui.theme.EniTextField
 
-class SignUpActivity : ComponentActivity() {
-
-    var signUpViewModel = SignUpViewModel();
-
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        enableEdgeToEdge()
-        setContent {
-            SignUpActivityPage(signUpViewModel)
-        }
-    }
-}
-
 @Composable
-fun SignUpActivityPage(signUpViewModel: SignUpViewModel) {
+fun SignUpFragmentPage(signUpViewModel: SignUpViewModel) {
     // Ecouter et synchronser les champs saisies
     val emailField by signUpViewModel.email.collectAsState()
     val pseudoField by signUpViewModel.pseudo.collectAsState()
@@ -47,18 +30,41 @@ fun SignUpActivityPage(signUpViewModel: SignUpViewModel) {
     EniPage {
         Column(
             horizontalAlignment = Alignment.CenterHorizontally,
-            modifier = Modifier.padding(40.dp)) {
+            modifier = Modifier.padding(40.dp)
+        ) {
             Image(
                 painter = painterResource(id = R.drawable.sign_up),
                 contentDescription = "Logo SignUp",
-                modifier = Modifier.padding(vertical = 10.dp))
+                modifier = Modifier.padding(vertical = 10.dp)
-            EniTextField("Pseudo", value = pseudoField, onValueChange = { value -> signUpViewModel.pseudo.value = value; })
+            )
-            EniTextField("Email", value = emailField, onValueChange = { value -> signUpViewModel.email.value = value; })
+            EniTextField(
-            EniTextField("Password", value = passwordField, onValueChange = { value -> signUpViewModel.password.value = value; })
+                "Pseudo",
-            EniTextField("Password Confirmation", value = passwordConfirmField, onValueChange = { value -> signUpViewModel.passwordConfirm.value = value; })
+                value = pseudoField,
-            EniTextField("City Code", value = cityCodeField, onValueChange = { value -> signUpViewModel.cityCode.value = value; })
+                onValueChange = { value -> signUpViewModel.pseudo.value = value; })
-            EniTextField("City", value = cityField, onValueChange = { value -> signUpViewModel.city.value = value; })
+            EniTextField(
-            EniTextField("Phone Number", value = phoneField, onValueChange = { value -> signUpViewModel.phone.value = value; })
+                "Email",
+                value = emailField,
+                onValueChange = { value -> signUpViewModel.email.value = value; })
+            EniTextField(
+                "Password",
+                value = passwordField,
+                onValueChange = { value -> signUpViewModel.password.value = value; })
+            EniTextField(
+                "Password Confirmation",
+                value = passwordConfirmField,
+                onValueChange = { value -> signUpViewModel.passwordConfirm.value = value; })
+            EniTextField(
+                "City Code",
+                value = cityCodeField,
+                onValueChange = { value -> signUpViewModel.cityCode.value = value; })
+            EniTextField(
+                "City",
+                value = cityField,
+                onValueChange = { value -> signUpViewModel.city.value = value; })
+            EniTextField(
+                "Phone Number",
+                value = phoneField,
+                onValueChange = { value -> signUpViewModel.phone.value = value; })
             EniButton("Sign Up", onClick = { signUpViewModel.callSignUpApi() })
         }
     }
@@ -66,6 +72,6 @@ fun SignUpActivityPage(signUpViewModel: SignUpViewModel) {
 
 @Preview(showBackground = true)
 @Composable
-fun SignUpActivityPreview() {
+fun SignUpFragmentPreview() {
-    SignUpActivityPage(SignUpViewModel())
+    SignUpFragmentPage(SignUpViewModel())
 }

gradle/libs.versions.toml

@@ -8,6 +8,7 @@ espressoCore = "3.5.1"
 lifecycleRuntimeKtx = "2.6.1"
 activityCompose = "1.8.0"
 composeBom = "2024.04.01"
+navigationCompose = "2.8.5"
 
 [libraries]
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
@@ -24,6 +25,7 @@ androidx-ui-tooling-preview = { group = "androidx.compose.ui", name = "ui-toolin
 androidx-ui-test-manifest = { group = "androidx.compose.ui", name = "ui-test-manifest" }
 androidx-ui-test-junit4 = { group = "androidx.compose.ui", name = "ui-test-junit4" }
 androidx-material3 = { group = "androidx.compose.material3", name = "material3" }
+androidx-navigation-compose = { group = "androidx.navigation", name = "navigation-compose", version.ref = "navigationCompose" }
 
 [plugins]
 android-application = { id = "com.android.application", version.ref = "agp" }