Fixed the password screen

openMF · Oct 9, 2024 · 121882e · 121882e
1 parent 26372be
commit 121882e
Showing 1 changed file with 64 additions and 30 deletions.
diff --git a/core/designsystem/src/main/kotlin/org/mifospay/core/designsystem/component/TextField.kt b/core/designsystem/src/main/kotlin/org/mifospay/core/designsystem/component/TextField.kt
@@ -98,6 +98,7 @@ fun MfOutlinedTextField(
     )
 }
 
+
 @Composable
 fun MfPasswordTextField(
     password: String,
@@ -109,41 +110,74 @@ fun MfPasswordTextField(
     modifier: Modifier = Modifier,
     errorMessage: String? = null,
 ) {
-    OutlinedTextField(
-        modifier = modifier,
+    var isFocused by rememberSaveable { mutableStateOf(false) }
+
+    BasicTextField(
         value = password,
         onValueChange = onPasswordChange,
-        label = {
-            Text(
-                label,
-                color = NewUi.primaryColor,
-                style = MaterialTheme.typography.labelLarge,
-            )
-        },
-        isError = isError,
-        visualTransformation = if (isPasswordVisible) {
-            VisualTransformation.None
-        } else {
-            PasswordVisualTransformation()
-        },
-        supportingText = {
-            errorMessage?.let { Text(text = it) }
-        },
-        trailingIcon = {
-            IconButton(onClick = onTogglePasswordVisibility) {
-                Icon(
-                    if (isPasswordVisible) Icons.Filled.Visibility else Icons.Filled.VisibilityOff,
-                    contentDescription = "Show password",
-                    tint = Color.Black,
+        textStyle = LocalTextStyle.current.copy(color = Color.Black),
+        modifier = modifier
+            .fillMaxWidth()
+            .padding(horizontal = 20.dp)
+            .padding(top = 10.dp)
+            .onFocusChanged { focusState -> isFocused = focusState.isFocused }
+            .semantics(mergeDescendants = true) {},
+        enabled = true,
+        readOnly = false,
+        visualTransformation = if (isPasswordVisible) VisualTransformation.None else PasswordVisualTransformation(),
+        keyboardOptions = KeyboardOptions(imeAction = ImeAction.Next),
+        keyboardActions = KeyboardActions.Default,
+        singleLine = true,
+        maxLines = 1,
+        minLines = 1,
+        cursorBrush = SolidColor(NewUi.primaryColor),
+        decorationBox = { innerTextField ->
+            Column {
+                Text(
+                    text = label,
+                    color = NewUi.primaryColor,
+                    style = MaterialTheme.typography.labelLarge,
+                    modifier = Modifier.align(alignment = Alignment.Start),
+                )
+
+                Spacer(modifier = Modifier.height(5.dp))
+
+                Box(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .background(Color.Transparent),
+                    contentAlignment = Alignment.CenterStart
+                ) {
+                    innerTextField()
+
+                    IconButton(
+                        onClick = onTogglePasswordVisibility,
+                        modifier = Modifier.align(Alignment.CenterEnd))
+                    {
+                        Icon(
+                            if (isPasswordVisible) Icons.Filled.Visibility else Icons.Filled.VisibilityOff,
+                            contentDescription = "Toggle password visibility",
+                            tint = Color.Black,
+                        )
+                    }
+                }
+
+                Spacer(modifier = Modifier.height(5.dp))
+                HorizontalDivider(
+                    thickness = 1.dp,
+                    color = if (isFocused) NewUi.secondaryColor else NewUi.onSurface.copy(alpha = 0.05f),
                 )
+
+                if (isError && errorMessage != null) {
+                    Text(
+                        text = errorMessage,
+                        color = MaterialTheme.colorScheme.error,
+                        style = MaterialTheme.typography.bodySmall,
+                        modifier = Modifier.padding(top = 4.dp)
+                    )
+                }
             }
         },
-        colors = OutlinedTextFieldDefaults.colors(
-            focusedBorderColor = Color.Transparent,
-            unfocusedBorderColor = Color.Transparent,
-            errorBorderColor = Color.Transparent,
-            disabledBorderColor = Color.Transparent,
-        ),
     )
 }