Skip to content

Commit

Permalink
UI: Add SavedTripCard component (#79)
Browse files Browse the repository at this point in the history
  • Loading branch information
ksharma-xyz authored Sep 28, 2024
1 parent 94343e0 commit 649e811
Show file tree
Hide file tree
Showing 3 changed files with 106 additions and 1 deletion.
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
package xyz.ksharma.krail.design.system.components

import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.semantics.Role
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.dp
import xyz.ksharma.krail.design.system.components.foundation.Text
import xyz.ksharma.krail.design.system.model.TransportModeType
import xyz.ksharma.krail.design.system.preview.ComponentPreviews
import xyz.ksharma.krail.design.system.theme.KrailTheme
import xyz.ksharma.krail.design.system.R as DSR

@Composable
fun SavedTripCard(
transportModeType: TransportModeType,
origin: String,
destination: String,
modifier: Modifier = Modifier,
onStarClick: () -> Unit = {},
onCardClick: () -> Unit = {},
) {
Row(
modifier = modifier
.clip(RoundedCornerShape(12.dp))
.background(color = KrailTheme.colors.secondaryContainer)
.clickable(role = Role.Button, onClickLabel = "Open Trip Details", onClick = onCardClick)
.padding(12.dp),
verticalAlignment = Alignment.CenterVertically,
) {

TransportModeIcon(
transportModeType = transportModeType,
)

Column(
modifier = Modifier
.padding(horizontal = 16.dp)
.weight(1f)
) {
Text(text = origin, style = KrailTheme.typography.bodyMedium)
Text(text = destination, style = KrailTheme.typography.bodyMedium)
}

Box(
modifier = Modifier
.size(32.dp)
.clip(CircleShape)
.clickable(
onClickLabel = "Remove Saved Trip",
role = Role.RadioButton,
onClick = onStarClick,
)
.semantics(mergeDescendants = true) {},
contentAlignment = Alignment.Center,
) {
Image(
imageVector = ImageVector.vectorResource(DSR.drawable.star),
contentDescription = "Save Trip",
colorFilter = ColorFilter.tint(KrailTheme.colors.secondary),
)
}
}
}

// region Previews

@ComponentPreviews
@Composable
private fun SavedTripCardPreview() {
KrailTheme {
SavedTripCard(
transportModeType = TransportModeType.Train,
origin = "Edmondson Park Station",
destination = "Harris Park Station",
)
}
}

// endregion
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
package xyz.ksharma.krail.design.system.preview

import androidx.compose.ui.tooling.preview.Devices
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.tooling.preview.PreviewLightDark

Expand All @@ -10,5 +11,5 @@ import androidx.compose.ui.tooling.preview.PreviewLightDark
@Retention(AnnotationRetention.BINARY)
@Target(AnnotationTarget.ANNOTATION_CLASS, AnnotationTarget.FUNCTION)
@PreviewLightDark
@Preview(name = "Large Font", fontScale = 2f)
@Preview(name = "Large Font", fontScale = 2f, device = Devices.PIXEL_5, widthDp = 420)
annotation class ComponentPreviews
9 changes: 9 additions & 0 deletions core/design-system/src/main/res/drawable/star.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="#FFFFFF"
android:pathData="M12,17.77L18.18,21.5L16.54,14.47L22,9.74L14.81,9.13L12,2.5L9.19,9.13L2,9.74L7.46,14.47L5.82,21.5L12,17.77Z" />
</vector>

0 comments on commit 649e811

Please sign in to comment.