feat(login): finish login page

- button to redirect home
- component text input
- get email and password from text input

app/build.gradle.kts

@@ -58,6 +58,7 @@ dependencies {
     implementation("androidx.wear.compose:compose-foundation:1.1.2")
     implementation("androidx.activity:activity-compose:1.7.2")
     implementation("androidx.core:core-splashscreen:1.0.1")
+    implementation("androidx.wear:wear-input:1.1.0")
     testImplementation("org.testng:testng:6.9.6")
     androidTestImplementation(platform("androidx.compose:compose-bom:2023.08.00"))
     androidTestImplementation("androidx.compose.ui:ui-test-junit4")

app/src/main/java/com/eipsaferoad/owl/presentation/components/TextInput.kt

@@ -0,0 +1,86 @@
+package com.eipsaferoad.owl.presentation.components
+
+import android.app.RemoteInput
+import android.content.Intent
+import android.os.Bundle
+import androidx.activity.compose.rememberLauncherForActivityResult
+import androidx.activity.result.contract.ActivityResultContracts
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.text.ClickableText
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.Color
+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.wear.input.RemoteInputIntentHelper
+import com.eipsaferoad.owl.presentation.theme.OwlTheme
+
+@Composable
+fun TextInput(
+    placeholder: String,
+    value: String?,
+    onChange: (value: String) -> Unit,
+) {
+    val launcher =
+        rememberLauncherForActivityResult(ActivityResultContracts.StartActivityForResult()) {
+            it.data?.let { data ->
+                val results: Bundle = RemoteInput.getResultsFromIntent(data)
+                val newValue: CharSequence? = results.getCharSequence(placeholder)
+                onChange(newValue as String)
+            }
+        }
+    Column(
+        horizontalAlignment = Alignment.CenterHorizontally,
+        modifier = Modifier
+            .drawBehind {
+
+                val strokeWidth = 1 * density
+                val y = size.height - strokeWidth / 2
+
+                drawLine(
+                    Color.LightGray,
+                    Offset(0f, y),
+                    Offset(size.width, y),
+                    strokeWidth
+                )
+            }
+    ) {
+        ClickableText(
+            text = buildAnnotatedString {
+                withStyle(style = SpanStyle(color = Color.White)) {
+                    // Set the desired text color here
+                    append(if (value == null || value.isEmpty()) placeholder else value)
+                }
+            },
+            onClick = {
+                val intent: Intent = RemoteInputIntentHelper.createActionRemoteInputIntent();
+                val remoteInputs: List<RemoteInput> = listOf(
+                    RemoteInput.Builder(placeholder)
+                        .setLabel(placeholder)
+                        .build()
+                )
+
+                RemoteInputIntentHelper.putRemoteInputsExtra(intent, remoteInputs)
+
+                launcher.launch(intent)
+            }
+        )
+    }
+}
+
+@Composable
+@Preview
+fun PreviewTextInput() {
+    OwlTheme {
+        Box(
+        ) {
+            TextInput(placeholder = "placeholder", value = "", onChange = {})
+        }
+    }
+}

app/src/main/java/com/eipsaferoad/owl/presentation/login/Login.kt

@@ -1,55 +1,44 @@
 package com.eipsaferoad.owl.presentation.login
 
 import android.util.Log
-import android.widget.Toast
-import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.wear.compose.material.Button
-import androidx.wear.compose.material.MaterialTheme
 import androidx.wear.compose.material.Text
-import androidx.wear.compose.material.TimeText
-import com.eipsaferoad.owl.api.HeartRateDto
-import com.eipsaferoad.owl.api.LoginDto
-import com.eipsaferoad.owl.api.LoginSuccessResponse
 import com.eipsaferoad.owl.presentation.PagesEnum
+import com.eipsaferoad.owl.presentation.components.TextInput
 import com.eipsaferoad.owl.presentation.theme.OwlTheme
-import com.eipsaferoad.owl.api.RetrofitClient
-import retrofit2.Call
-import retrofit2.Callback
-import retrofit2.Response
 
 @Composable
 fun Login(changePage: (page: Int) -> Unit) {
+    val email = remember { mutableStateOf("") }
+    val password = remember { mutableStateOf("") }
 
     Column(
         horizontalAlignment = Alignment.CenterHorizontally,
         verticalArrangement = Arrangement.Center
     ) {
-        Text(
-            modifier = Modifier.fillMaxWidth(),
-            textAlign = TextAlign.Center,
-            color = MaterialTheme.colors.primary,
-            text = "Email"
-        )
-        Text(
-            modifier = Modifier.fillMaxWidth(),
-            textAlign = TextAlign.Center,
-            color = MaterialTheme.colors.primary,
-            text = "Password"
-        )
-        Button(onClick = { changePage(PagesEnum.HOME.value) }) {
+        TextInput(placeholder = "Email", value = email.value, onChange = { value -> email.value = value })
+        TextInput(placeholder = "Password", value = password.value, onChange = { value -> password.value = value })
+        Button(
+            modifier = Modifier
+                .width(100.dp)
+                .padding(top = 10.dp),
+            onClick = {
+                Log.d("Login", "email: ${email.value} password: ${password.value}")
+                changePage(PagesEnum.HOME.value)
+            }
+        ) {
             Text(text = "login")
         }
     }