added people field

Alfresco · Feb 5, 2024 · 0f5878c · 0f5878c
1 parent f391e30
commit 0f5878c
Show file tree

Hide file tree

Showing 5 changed files with 80 additions and 32 deletions.
diff --git a/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/ComposeTopBar.kt b/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/ComposeTopBar.kt
@@ -10,7 +10,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import com.alfresco.content.process.R
 import com.alfresco.content.process.ui.BackButton
-import com.alfresco.content.process.ui.theme.SeparateColorGray
+import com.alfresco.content.process.ui.theme.SeparateColorGrayLT
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
@@ -27,6 +27,6 @@ fun ComposeTopBar() {
                 BackButton(onClick = { (context as Activity).finish() })
             },
         )
-        Divider(color = SeparateColorGray, thickness = 1.dp)
+        Divider(color = SeparateColorGrayLT, thickness = 1.dp)
     }
 }
diff --git a/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/InputChip.kt b/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/InputChip.kt
@@ -16,16 +16,21 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.alfresco.content.data.UserGroupDetails
 import com.alfresco.content.getLocalizedName
-import com.alfresco.content.process.ui.theme.SeparateColorGray
-import com.alfresco.content.process.ui.theme.chipBackgroundColorGray
-import com.alfresco.content.process.ui.theme.chipColorGray
+import com.alfresco.content.process.ui.theme.SeparateColorGrayDT
+import com.alfresco.content.process.ui.theme.SeparateColorGrayLT
+import com.alfresco.content.process.ui.theme.chipBackgroundColorGrayDT
+import com.alfresco.content.process.ui.theme.chipBackgroundColorGrayLT
+import com.alfresco.content.process.ui.theme.chipColorGrayDT
+import com.alfresco.content.process.ui.theme.chipColorGrayLT
+import com.alfresco.content.process.ui.theme.isNightMode
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun InputChip(
     context: Context,
     userDetail: UserGroupDetails,
 ) {
+    val isNightMode = isNightMode()
     InputChip(
         modifier = Modifier.padding(vertical = 8.dp),
         onClick = {
@@ -37,20 +42,15 @@ fun InputChip(
             selectedBorderWidth = 0.dp,
 
         ),
-        colors = InputChipDefaults.inputChipColors(
-            labelColor = SeparateColorGray,
-            selectedLabelColor = SeparateColorGray,
-            selectedLeadingIconColor = SeparateColorGray,
-            selectedContainerColor = chipBackgroundColorGray,
-        ),
+        colors = getInputChipColors(),
         leadingIcon = {
             Text(
-                color = SeparateColorGray,
+                color = if (isNightMode) SeparateColorGrayDT else SeparateColorGrayLT,
                 modifier = Modifier
                     .padding(16.dp)
                     .drawBehind {
                         drawCircle(
-                            color = chipColorGray,
+                            color = if (isNightMode) chipColorGrayDT else chipColorGrayLT,
                             radius = this.size.maxDimension,
                         )
                     },
@@ -66,3 +66,20 @@ fun InputChip(
 fun InputChipPreview() {
     InputChip(LocalContext.current, UserGroupDetails())
 }
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun getInputChipColors() = if (isNightMode()) {
+    InputChipDefaults.inputChipColors(
+        labelColor = SeparateColorGrayDT,
+        selectedLabelColor = SeparateColorGrayDT,
+        selectedLeadingIconColor = SeparateColorGrayDT,
+        selectedContainerColor = chipBackgroundColorGrayDT,
+    )
+} else
+    InputChipDefaults.inputChipColors(
+        labelColor = SeparateColorGrayLT,
+        selectedLabelColor = SeparateColorGrayLT,
+        selectedLeadingIconColor = SeparateColorGrayLT,
+        selectedContainerColor = chipBackgroundColorGrayLT,
+    )
diff --git a/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/PeopleField.kt b/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/PeopleField.kt
@@ -1,13 +1,18 @@
 package com.alfresco.content.process.ui.components
 
-import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.SpanStyle
 import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.withStyle
@@ -17,6 +22,7 @@ import com.alfresco.content.component.searchusergroup.SearchUserGroupComponentBu
 import com.alfresco.content.data.ProcessEntry
 import com.alfresco.content.data.UserGroupDetails
 import com.alfresco.content.data.payloads.FieldsData
+import com.alfresco.content.process.R
 import com.alfresco.content.process.ui.theme.AlfrescoError
 
 @Composable
@@ -41,21 +47,32 @@ fun PeopleField(
             .fillMaxSize()
             .padding(all = 16.dp),
     ) {
-        Text(
-            text = labelWithAsterisk,
-            modifier = Modifier
-                .padding(end = 4.dp)
-                .clickable {
-                    SearchUserGroupComponentBuilder(context, processEntry)
-                        .onApply { userDetails ->
-                            onAssigneeSelected(userDetails)
-                        }
-                        .onCancel {
-                            onAssigneeSelected(null)
-                        }
-                        .show()
-                },
-        )
+        Row(
+            horizontalArrangement = Arrangement.SpaceBetween,
+            modifier = Modifier.fillMaxWidth(),
+        ) {
+            Text(
+                text = labelWithAsterisk,
+                modifier = Modifier
+                    .padding(end = 4.dp),
+            )
+
+            IconButton(onClick = {
+                SearchUserGroupComponentBuilder(context, processEntry)
+                    .onApply { userDetails ->
+                        onAssigneeSelected(userDetails)
+                    }
+                    .onCancel {
+                        onAssigneeSelected(null)
+                    }
+                    .show()
+            }) {
+                Icon(
+                    painterResource(R.drawable.ic_add),
+                    contentDescription = "",
+                )
+            }
+        }
         if (userDetail != null) {
             InputChip(context, userDetail)
         }

diff --git a/process-app/src/main/kotlin/com/alfresco/content/process/ui/theme/Color.kt b/process-app/src/main/kotlin/com/alfresco/content/process/ui/theme/Color.kt
@@ -24,6 +24,10 @@ val White = Color.White
 val White15 = Color(0x26FFFFFF)
 val White60 = Color(0x99FFFFFF)
 val ActionModeColor = AlfrescoBlue700 // Using AlfrescoBlue700 as action mode color
-val SeparateColorGray = Color(0xFF212121)
-val chipColorGray = Color(0x1F212121)
-val chipBackgroundColorGray = Color(0x0D212121)
+val SeparateColorGrayLT = Color(0xFF212121)
+val chipColorGrayLT = Color(0x1F212121)
+val chipBackgroundColorGrayLT = Color(0x0D212121)
+
+val SeparateColorGrayDT = Color(0xFFFFFFFF)
+val chipColorGrayDT = Color(0x1FFFFFFF)
+val chipBackgroundColorGrayDT = Color(0x0DFFFFFF)
diff --git a/process-app/src/main/res/drawable/ic_add.xml b/process-app/src/main/res/drawable/ic_add.xml
@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24"
+    android:tint="#7F7F7F">
+  <path
+      android:fillColor="#FF000000"
+      android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/>
+</vector>