Introduce cfp card on event details screen (#1438)

Co-authored-by: Ashley Davies <[email protected]>
ashdavies · Jan 13, 2025 · ac081a9 · ac081a9
1 parent c0ba21a
commit ac081a9
Show file tree

Hide file tree

Showing 11 changed files with 198 additions and 148 deletions.
diff --git a/conferences-app/src/commonMain/composeResources/values/strings.xml b/conferences-app/src/commonMain/composeResources/values/strings.xml
@@ -4,7 +4,8 @@
     <string name="upcoming_events">Upcoming Events</string>
     <string name="past_events">Past Events</string>
 
-    <string name="call_for_papers_open">Call for Papers (%1$s days left)</string>
+    <string name="call_for_papers_open">CfP Open</string>
+    <string name="call_for_papers_days_remaining">Call for Papers (%1$s days remaining)</string>
     <string name="call_for_papers_closed">Call for Papers (Closed)</string>
 
     <string name="online_only">Online Only</string>

diff --git a/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventCfp.kt b/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventCfp.kt
@@ -0,0 +1,15 @@
+package io.ashdavies.party.events
+
+import kotlinx.datetime.Clock
+import kotlinx.datetime.LocalDate
+import kotlinx.datetime.TimeZone
+import kotlinx.datetime.daysUntil
+import kotlinx.datetime.toLocalDateTime
+
+private val Today = Clock.System.now()
+    .toLocalDateTime(TimeZone.currentSystemDefault())
+    .date
+
+internal fun daysUntilCfpEnd(cfpEnd: LocalDate): Int {
+    return Today.daysUntil(cfpEnd)
+}
diff --git a/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventDateLabel.kt b/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventDateLabel.kt
@@ -1,5 +1,6 @@
 package io.ashdavies.party.events
 
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.material3.MaterialTheme
@@ -31,6 +32,7 @@ internal fun EventDateLabel(
     ) {
         Column(
             modifier = Modifier.padding(MaterialTheme.spacing.small),
+            verticalArrangement = Arrangement.aligned(Alignment.CenterVertically),
             horizontalAlignment = Alignment.CenterHorizontally,
         ) {
             val startMonth = dateStart.format(LocalDate.Format { monthName(MonthNames.ENGLISH_ABBREVIATED) })

diff --git a/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventsDetailPane.kt b/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventsDetailPane.kt
@@ -8,6 +8,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material.icons.filled.Warning
 import androidx.compose.material.icons.outlined.MyLocation
 import androidx.compose.material3.Card
@@ -16,22 +17,32 @@ import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
+import androidx.compose.material3.windowsizeclass.WindowSizeClass
+import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalUriHandler
 import androidx.compose.ui.unit.dp
 import coil3.compose.AsyncImage
+import io.ashdavies.party.material.LocalWindowSizeClass
 import io.ashdavies.party.material.padding
 import io.ashdavies.party.material.spacing
 import kotlinx.datetime.LocalDate
 import okio.ByteString.Companion.encode
+import org.jetbrains.compose.resources.stringResource
+import playground.conferences_app.generated.resources.Res
+import playground.conferences_app.generated.resources.call_for_papers_closed
+import playground.conferences_app.generated.resources.call_for_papers_days_remaining
 
 @Composable
 internal fun EventsDetailPane(
     event: Event,
+    onBackClick: () -> Unit,
     modifier: Modifier = Modifier,
+    windowSizeClass: WindowSizeClass = LocalWindowSizeClass.current,
 ) {
     Scaffold(
         modifier = modifier,
@@ -43,6 +54,16 @@ internal fun EventsDetailPane(
                         Icon(Icons.Default.Warning, contentDescription = null)
                     }
                 },
+                navigationIcon = {
+                    if (windowSizeClass.widthSizeClass == WindowWidthSizeClass.Compact) {
+                        IconButton(onClick = onBackClick) {
+                            Icon(
+                                imageVector = Icons.AutoMirrored.Filled.ArrowBack,
+                                contentDescription = null,
+                            )
+                        }
+                    }
+                },
             )
         },
     ) { contentPadding ->
@@ -64,13 +85,14 @@ internal fun EventsDetailPane(
                 }
             }
 
-            Card(
-                modifier = Modifier
-                    .padding(MaterialTheme.spacing.large)
-                    .fillMaxWidth(),
-            ) {
-                EventsDetailLocation(
-                    location = event.location,
+            EventsDetailLocation(
+                location = event.location,
+            )
+
+            if (event.cfpEnd != null) {
+                EventsDetailCfp(
+                    cfpEnd = event.cfpEnd,
+                    cfpSite = event.cfpSite,
                 )
             }
         }
@@ -99,18 +121,55 @@ private fun EventsDetailLocation(
     location: String,
     modifier: Modifier = Modifier,
 ) {
-    Row(
-        modifier = modifier,
-        verticalAlignment = Alignment.CenterVertically,
+    Card(
+        modifier = modifier
+            .padding(MaterialTheme.spacing.large)
+            .fillMaxWidth(),
     ) {
-        Icon(
-            imageVector = Icons.Outlined.MyLocation,
-            contentDescription = null,
-            modifier = Modifier.padding(16.dp),
-        )
+        Row(
+            verticalAlignment = Alignment.CenterVertically,
+        ) {
+            Icon(
+                imageVector = Icons.Outlined.MyLocation,
+                contentDescription = null,
+                modifier = Modifier.padding(16.dp),
+            )
+
+            Column {
+                Text(location)
+            }
+        }
+    }
+}
+
+@Composable
+private fun EventsDetailCfp(
+    cfpSite: String?,
+    cfpEnd: String,
+    modifier: Modifier = Modifier,
+) {
+    val daysUntilCfpEnd = daysUntilCfpEnd(LocalDate.parse(cfpEnd))
+    val uriHandler = LocalUriHandler.current
+    val newModifier = modifier
+        .padding(MaterialTheme.spacing.large)
+        .fillMaxWidth()
 
-        Column {
-            Text(location)
+    when {
+        daysUntilCfpEnd > 0 && cfpSite != null -> Card(
+            onClick = { uriHandler.openUri(cfpSite) },
+            modifier = newModifier,
+        ) {
+            Text(
+                text = stringResource(Res.string.call_for_papers_days_remaining, daysUntilCfpEnd),
+                modifier = Modifier.padding(16.dp),
+            )
+        }
+
+        else -> Card(newModifier) {
+            Text(
+                text = stringResource(Res.string.call_for_papers_closed),
+                modifier = Modifier.padding(16.dp),
+            )
         }
     }
 }

diff --git a/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventsTopBar.kt b/conferences-app/src/commonMain/kotlin/io/ashdavies/party/events/EventsTopBar.kt
@@ -14,6 +14,7 @@ import androidx.compose.ui.Modifier
 internal fun EventsTopBar(
     title: String,
     modifier: Modifier = Modifier,
+    navigationIcon: @Composable () -> Unit = { },
     actions: @Composable RowScope.() -> Unit = { },
 ) {
     CenterAlignedTopAppBar(
@@ -25,6 +26,7 @@ internal fun EventsTopBar(
             )
         },
         modifier = modifier,
+        navigationIcon = navigationIcon,
         colors = TopAppBarDefaults.centerAlignedTopAppBarColors(
             containerColor = MaterialTheme.colorScheme.background,
         ),