Merge pull request #112 from tarkalabs/mahi/component/TUICardHeader

TUICardHeader component Created

tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/TUICardHeaderTest.kt

@@ -0,0 +1,52 @@
+package com.tarkalabs.uicomponents
+
+import androidx.compose.ui.test.assertIsDisplayed
+import androidx.compose.ui.test.assertTextEquals
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.test.onNodeWithContentDescription
+import androidx.compose.ui.test.onNodeWithTag
+import androidx.compose.ui.test.onNodeWithText
+import androidx.compose.ui.test.performClick
+import com.tarkalabs.tarkaicons.MoreHorizontal24
+import com.tarkalabs.tarkaicons.TarkaIcons
+import com.tarkalabs.uicomponents.components.TUICardHeader
+import com.tarkalabs.uicomponents.components.TUICardHeaderTags
+import org.junit.Rule
+import org.junit.Test
+import org.mockito.kotlin.mock
+import org.mockito.kotlin.verify
+
+class TUICardHeaderTest {
+
+  @get:Rule
+  val composeTestRule = createComposeRule()
+
+  @Test
+  fun is_passed_things_shown() {
+
+    val onTrailIconClick: () -> Unit = mock()
+    val title = "Test Title"
+    val tagTitle = "Test Tag Title"
+    val trailingIcon = TarkaIcons.Regular.MoreHorizontal24
+
+    val testTags = TUICardHeaderTags()
+    composeTestRule.setContent {
+      TUICardHeader(
+        title = title,
+        tagTitle = tagTitle,
+        trailingIcon = trailingIcon,
+        onTrailingIconClick = onTrailIconClick,
+        tags = testTags
+      )
+    }
+
+    composeTestRule.onNodeWithText(title).assertExists()
+    composeTestRule.onNodeWithText(title).assertIsDisplayed()
+    composeTestRule.onNodeWithTag(testTags.tagTitleTag).assertTextEquals(tagTitle)
+
+    composeTestRule.onNodeWithContentDescription(trailingIcon.contentDescription).assertExists()
+
+    composeTestRule.onNodeWithTag(testTags.trailingIconTag).performClick()
+    verify(onTrailIconClick).invoke()
+  }
+}

tarkaui/src/androidTest/java/com/tarkalabs/uicomponents/screenshots/TUICardHeaderScreenShotTest.kt

@@ -0,0 +1,40 @@
+package com.tarkalabs.uicomponents.screenshots
+
+import com.tarkalabs.tarkaicons.MoreHorizontal24
+import com.tarkalabs.tarkaicons.TarkaIcon
+import com.tarkalabs.tarkaicons.TarkaIcons
+import com.tarkalabs.uicomponents.components.TUICardHeader
+import org.junit.Test
+import org.junit.runner.RunWith
+import org.junit.runners.Parameterized
+
+@RunWith(Parameterized::class)
+class TUICardHeaderScreenShotTest(
+  private val darkTheme: Boolean,
+  private val tagTitle: String?,
+  private val trailIcon: TarkaIcon?,
+  private val testName: String,
+) : ComposeScreenshotComparator() {
+
+  companion object {
+    @JvmStatic
+    @Parameterized.Parameters
+    fun data(): Collection<Array<Any?>> {
+      return mutableListOf<Array<Any?>>().apply {
+        for (darkTheme in listOf(true, false)) {
+          for (tagTitle in listOf(null, "Tag1")) {
+            for (trailIcon in listOf(TarkaIcons.Filled.MoreHorizontal24, null)) {
+              val testName =
+                "darkTheme_${darkTheme}_tagShown${if (tagTitle == null) "false" else "true"}_trailIcShown${if (trailIcon == null) "false" else "true"}"
+              add(arrayOf(darkTheme, tagTitle, trailIcon, testName))
+            }
+          }
+        }
+      }
+    }
+  }
+
+  @Test fun tui_card_header_test() = compareScreenshotFor(darkTheme, testName) {
+    TUICardHeader(title = "Pump Repair Pump", tagTitle = tagTitle, trailingIcon = trailIcon) {}
+  }
+}

tarkaui/src/main/java/com/tarkalabs/uicomponents/components/TUICardHeader.kt

@@ -0,0 +1,104 @@
+package com.tarkalabs.uicomponents.components
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.testTag
+import androidx.compose.ui.tooling.preview.Preview
+import com.tarkalabs.tarkaicons.MoreHorizontal24
+import com.tarkalabs.tarkaicons.TarkaIcon
+import com.tarkalabs.tarkaicons.TarkaIcons
+import com.tarkalabs.uicomponents.components.TagSize.S
+import com.tarkalabs.uicomponents.components.base.IconButtonStyle.GHOST
+import com.tarkalabs.uicomponents.components.base.TUIIconButton
+import com.tarkalabs.uicomponents.theme.TUITheme
+
+/**
+ * This Component is used as a Header part in the Card Typed Detail Views.
+ *
+ * @param title - Title of the Header.
+ * @param tagTitle - optional Title of the TUITag.
+ * @param trailingIcon - optional end Icon.
+ *
+ * TUICardHeader(
+ *     title = "Pump Repair Pump",
+ *     tagTitle = "Tag1",
+ *     trailingIcon = TarkaIcons.Filled.MoreHorizontal24.copy(tintColor = TUITheme.colors.secondary)
+ *   ) {}
+ *
+ * **/
+@Composable
+fun TUICardHeader(
+  modifier: Modifier = Modifier,
+  title: String,
+  tagTitle: String? = null,
+  trailingIcon: TarkaIcon? = null,
+  tags: TUICardHeaderTags = TUICardHeaderTags(),
+  onTrailingIconClick: () -> Unit,
+) {
+
+  Row(
+    modifier = modifier
+      .testTag(tags.parentTag)
+      .fillMaxWidth(),
+    verticalAlignment = Alignment.CenterVertically
+  ) {
+
+    HorizontalSpacer(space = 16)
+
+    Column {
+      tagTitle?.let {
+        TUITag(
+          modifier = Modifier.testTag(tags.tagTitleTag),
+          title = tagTitle,
+          tagSize = S,
+          tagType = TagType.LOW
+        ) {}
+        VerticalSpacer(space = 8)
+      }
+
+      Text(
+        text = title,
+        color = TUITheme.colors.onSurface,
+        style = TUITheme.typography.heading6
+      )
+    }
+
+    HorizontalSpacer(space = 8)
+
+    trailingIcon?.let {
+      Spacer(modifier = Modifier.weight(1f))
+      TUIIconButton(
+        modifier = Modifier
+          .testTag(tags.trailingIconTag),
+        icon = trailingIcon,
+        iconButtonStyle = GHOST,
+        onIconClick = { onTrailingIconClick.invoke() }
+      )
+    }
+
+    HorizontalSpacer(space = 16)
+
+  }
+}
+
+data class TUICardHeaderTags(
+  val parentTag: String = "TUICardHeader",
+  val tagTitleTag: String = "TUICardHeader_tagTitleTag",
+  val trailingIconTag: String = "TUICardHeader_trailingIconTag",
+)
+
+@Preview
+@Composable
+fun TUICardHeaderPreview() {
+  TUICardHeader(
+    title = "Pump Repair Pump",
+    tagTitle = "Tag1",
+    trailingIcon = TarkaIcons.Filled.MoreHorizontal24.copy(tintColor = TUITheme.colors.secondary)
+  ) {}
+}

tarkaui/src/main/java/com/tarkalabs/uicomponents/components/base/TUIIconButton.kt

@@ -79,6 +79,7 @@ enum class IconButtonStyle {
  *
  */
 @Composable fun TUIIconButton(
+  modifier: Modifier = Modifier,
   icon: TarkaIcon,
   buttonSize: IconButtonSize = L,
   iconButtonStyle: IconButtonStyle = IconButtonStyle.defaultStyle,
@@ -88,7 +89,7 @@ enum class IconButtonStyle {
 ) {
   var iconButtonColors: IconButtonColors = IconButtonDefaults.iconButtonColors()
 
-  var modifier = Modifier
+  var parentModifier = modifier
     .height(buttonSize.size)
     .width(buttonSize.size)
     .clip(CircleShape)
@@ -126,7 +127,7 @@ enum class IconButtonStyle {
         contentColor = contentColor,
         disabledContentColor = TUITheme.colors.onSurface.copy(alpha = 0.38f),
       )
-      modifier = Modifier
+      parentModifier = Modifier
         .border(
           width = 0.5.dp, color = TUITheme.colors.utilityOutline, shape = CircleShape
         )
@@ -136,7 +137,7 @@ enum class IconButtonStyle {
 
   IconButton(
     onClick = onIconClick,
-    modifier = modifier.testTag(tags.parentTag),
+    modifier = parentModifier.testTag(tags.parentTag),
     colors = iconButtonColors,
     enabled = enabled
   ) {