diff --git a/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_falsedarkTheme_false.png b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_falsedarkTheme_false.png new file mode 100644 index 00000000..d8cfdddc Binary files /dev/null and b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_falsedarkTheme_false.png differ diff --git a/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_falsedarkTheme_true.png b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_falsedarkTheme_true.png new file mode 100644 index 00000000..b8893a82 Binary files /dev/null and b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_falsedarkTheme_true.png differ diff --git a/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_truedarkTheme_false.png b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_truedarkTheme_false.png new file mode 100644 index 00000000..df2aa8c2 Binary files /dev/null and b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_truedarkTheme_false.png differ diff --git a/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_truedarkTheme_true.png b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_truedarkTheme_true.png new file mode 100644 index 00000000..62878337 Binary files /dev/null and b/tarkaui/screenshots/debug/screenshots-default/com.tarkalabs.uicomponents.screenshots.TUIDraggableCardScreenshotTest_DraggableCard_switchState_truedarkTheme_true.png differ diff --git a/tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/TUIDraggableCardTest.kt b/tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/TUIDraggableCardTest.kt new file mode 100644 index 00000000..d047715c --- /dev/null +++ b/tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/TUIDraggableCardTest.kt @@ -0,0 +1,30 @@ +import androidx.compose.ui.Modifier +import androidx.compose.ui.test.assertIsDisplayed +import androidx.compose.ui.test.assertIsNotFocused +import androidx.compose.ui.test.assertIsToggleable +import androidx.compose.ui.test.junit4.createComposeRule +import androidx.compose.ui.test.onNodeWithTag +import androidx.compose.ui.test.onNodeWithText +import com.tarkalabs.uicomponents.components.TUIDraggableCard +import com.tarkalabs.uicomponents.components.TUIToggleSwitchTags +import org.junit.Rule +import org.junit.Test + +class TUIDraggableCardTest { + @get:Rule val composable = createComposeRule() + + @Test fun is_passed_things_shown() { + val testTitle = "test" + val initialSwitchState = false + composable.setContent { + TUIDraggableCard( + dragIconModifier = Modifier, + onSwitchCheckedChange = {}, + switchCheckedState = initialSwitchState, + title = testTitle + ) + } + composable.onNodeWithText(testTitle).assertExists().assertIsDisplayed() + composable.onNodeWithTag(TUIToggleSwitchTags().parentTag).assertIsToggleable().assertIsNotFocused() + } +} \ No newline at end of file diff --git a/tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/screenshots/TUIDraggableCardScreenshotTest.kt b/tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/screenshots/TUIDraggableCardScreenshotTest.kt new file mode 100644 index 00000000..039baf23 --- /dev/null +++ b/tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/screenshots/TUIDraggableCardScreenshotTest.kt @@ -0,0 +1,39 @@ +package com.tarkalabs.uicomponents.screenshots + +import androidx.compose.ui.Modifier +import com.tarkalabs.uicomponents.components.TUIDraggableCard +import org.junit.Test +import org.junit.runner.RunWith +import org.junit.runners.Parameterized + +@RunWith(Parameterized::class) +class TUIDraggableCardScreenshotTest( + private val testName: String, + private val switchState: Boolean, + private val darkTheme: Boolean, +) : ComposeScreenshotComparator() { + + companion object { + @JvmStatic + @Parameterized.Parameters + fun data(): Collection> { + return mutableListOf>().apply { + for (darkTheme in listOf(true, false)) { + for (switchState in listOf(true, false)) { + val testName = "switchState_${switchState}darkTheme_${darkTheme}" + add(arrayOf(testName, switchState, darkTheme)) + } + } + } + } + } + + @Test fun renderTUIDraggableCard() = + compareScreenshotFor(darkTheme, "DraggableCard_$testName") { + TUIDraggableCard( + dragIconModifier = Modifier, + switchCheckedState = switchState, + title = "Description 1", + onSwitchCheckedChange = {}) + } +} \ No newline at end of file diff --git a/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIDraggableCard.kt b/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIDraggableCard.kt new file mode 100644 index 00000000..442f40b1 --- /dev/null +++ b/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIDraggableCard.kt @@ -0,0 +1,114 @@ +package com.tarkalabs.uicomponents.components + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Icon +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.graphicsLayer +import androidx.compose.ui.platform.testTag +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import androidx.compose.ui.zIndex +import com.tarkalabs.tarkaicons.ReOrderDotsVertical24 +import com.tarkalabs.tarkaicons.TarkaIcons +import com.tarkalabs.uicomponents.theme.TUITheme + +/** + *This Component is used to show the list of Cards those can be dragged vertically & re-arranged by the users. + * + * @param modifier - used to modify the parent (Row) attributes + * @param dragIconModifier - a modifier with dragListener & used in trailingIcon which is used to consume drag events. + * @param title - title text of the card which usually contains tab Name in TabConfigure Screen in Technician Settings. + * @param switchCheckedState - initial checked status of the switch + * @param onSwitchCheckedChange - callback which invokes when switch state changes + * @param tags - tags used to pick the compose items while testing + */ +@Composable +fun TUIDraggableCard( + modifier: Modifier = Modifier, + dragIconModifier: Modifier, + title: String, + switchCheckedState: Boolean, + onSwitchCheckedChange: () -> Unit, + isDragging: Boolean = false, + tags: TUIDraggableCardTags = TUIDraggableCardTags(), +) { + Row( + modifier = modifier + .testTag(tags.parentTag) + .fillMaxWidth() + .background(color = TUITheme.colors.surface, shape = RoundedCornerShape(16.dp)) + .padding(top = 8.dp, bottom = 8.dp, start = 8.dp, end = 16.dp) + .zIndex(if (isDragging) 1f else 0f) + .graphicsLayer { + shadowElevation = if (isDragging) 8f else 0f + }, + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.SpaceAround + ) { + + Icon( + modifier = dragIconModifier + .testTag(tags.leadReOrderIconTag) + .size(48.dp) + .padding(12.dp), + painter = painterResource(id = TarkaIcons.Regular.ReOrderDotsVertical24.iconRes), + contentDescription = TarkaIcons.Regular.ReOrderDotsVertical24.contentDescription + ) + + Text( + modifier = Modifier + .weight(1f) + .padding(horizontal = 16.dp), + text = title, + color = TUITheme.colors.inputText, + style = TUITheme.typography.heading6, + ) + + TUIToggleSwitch(state = switchCheckedState, onToggleChange = onSwitchCheckedChange) + } +} + +data class TUIDraggableCardTags( + val parentTag: String = "TUIDraggableCard", + val leadReOrderIconTag: String = "TUIDraggableCard_DragIcon", +) + +@Preview +@Composable +fun TUIDraggableCardPreview() { + + Column(modifier = Modifier.background(color = TUITheme.colors.onSurface)) { + + VerticalSpacer(space = 5) + + TUIDraggableCard( + title = "Description 1", + switchCheckedState = true, + onSwitchCheckedChange = {}, + dragIconModifier = Modifier + ) + + VerticalSpacer(space = 5) + + TUIDraggableCard( + title = "Description 2", + switchCheckedState = false, + onSwitchCheckedChange = {}, + dragIconModifier = Modifier + ) + + VerticalSpacer(space = 5) + + } +} \ No newline at end of file diff --git a/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIToggleSwitch.kt b/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIToggleSwitch.kt index 50afb656..d4712f02 100644 --- a/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIToggleSwitch.kt +++ b/tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUIToggleSwitch.kt @@ -39,6 +39,7 @@ import com.tarkalabs.uicomponents.theme.TUITheme */ @Composable fun TUIToggleSwitch( + modifier: Modifier = Modifier, state: Boolean, enabled: Boolean = true, tags: TUIToggleSwitchTags = TUIToggleSwitchTags(), onToggleChange: () -> Unit @@ -46,7 +47,7 @@ import com.tarkalabs.uicomponents.theme.TUITheme var switchCheckedState by remember { mutableStateOf(state) } TUITheme { Switch( - modifier = Modifier.testTag(tags.parentTag), + modifier = modifier.testTag(tags.parentTag), checked = switchCheckedState, enabled = enabled, onCheckedChange = { switchCheckedState = it onToggleChange()