Implement navigation and past games screen UI/ViewModel/majority of networking

app/src/main/graphql/Games.graphql

@@ -10,5 +10,10 @@ query Games{
             color
         }
         gender
+        boxScore {
+            corScore
+            oppScore
+        }
+        result
     }
 }

app/src/main/java/com/cornellappdev/score/components/UpcomingGameCard.kt → app/src/main/java/com/cornellappdev/score/components/FeaturedGameCard.kt

@@ -10,6 +10,8 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.wrapContentWidth
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -21,21 +23,28 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
 import coil3.compose.AsyncImage
 import com.cornellappdev.score.R
 import com.cornellappdev.score.theme.CornellRed
 import com.cornellappdev.score.theme.PennBlue
+import com.cornellappdev.score.theme.Style.losingScoreText
 import com.cornellappdev.score.theme.Style.vsText
+import com.cornellappdev.score.theme.Style.winningScoreText
 
 @Composable
-fun UpcomingGameHeader(
+fun FeaturedGameHeader(
     leftTeamLogo: Painter,
     rightTeamLogo: String,
     gradientColor1: Color,
     gradientColor2: Color,
-    modifier: Modifier = Modifier
+    isPast: Boolean,
+    modifier: Modifier = Modifier,
+    leftScore: Int? = null,
+    rightScore: Int? = null
 ) {
     Box(
         modifier = modifier
@@ -49,7 +58,10 @@ fun UpcomingGameHeader(
     ) {
         Row(
             verticalAlignment = Alignment.CenterVertically,
-            horizontalArrangement = Arrangement.spacedBy(32.dp, Alignment.CenterHorizontally),
+            horizontalArrangement = if (isPast) Arrangement.spacedBy(
+                12.dp,
+                Alignment.CenterHorizontally
+            ) else Arrangement.spacedBy(32.dp, Alignment.CenterHorizontally),
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(vertical = 36.dp)
@@ -60,11 +72,33 @@ fun UpcomingGameHeader(
                 contentScale = ContentScale.FillBounds,
                 modifier = Modifier.size(60.dp)
             )
-
-            Text(
-                text = "VS",
-                style = vsText
-            )
+            if (leftScore != null && rightScore != null) {
+                Row(horizontalArrangement = Arrangement.spacedBy(4.dp)) {
+                    Text(
+                        text = leftScore.toString(),
+                        style = if (leftScore > rightScore) winningScoreText else losingScoreText,
+                        modifier = Modifier
+                            .width(52.dp)
+                            .wrapContentWidth(Alignment.CenterHorizontally)
+                    )
+                    Text(
+                        text = "-",
+                        style = vsText.copy(fontSize = 32.sp, fontStyle = FontStyle.Normal)
+                    )
+                    Text(
+                        text = rightScore.toString(),
+                        style = if (leftScore < rightScore) winningScoreText else losingScoreText,
+                        modifier = Modifier
+                            .width(52.dp)
+                            .wrapContentWidth(Alignment.CenterHorizontally)
+                    )
+                }
+            } else {
+                Text(
+                    text = "VS",
+                    style = vsText
+                )
+            }
             AsyncImage(
                 model = rightTeamLogo,
                 contentDescription = "Right Team Logo",
@@ -76,45 +110,52 @@ fun UpcomingGameHeader(
 
 @Preview
 @Composable
-private fun UpcomingGameHeaderPreview() {
-    UpcomingGameHeader(
+private fun FeaturedGameCardPreview() {
+    FeaturedGameHeader(
         leftTeamLogo = painterResource(R.drawable.cornell_logo),
         rightTeamLogo = "https://cornellbigred.com/images/logos/YALE_LOGO_2020.png?width=80&height=80&mode=max",
         gradientColor1 = CornellRed,
         gradientColor2 = PennBlue,
+        isPast = true,
         modifier = Modifier
     )
 }
 
 @Composable
-fun UpcomingGameCard(
+fun FeaturedGameCard(
     leftTeamLogo: Painter,
     rightTeamLogo: String,
     team: String,
     location: String,
     isLive: Boolean,
+    isPast: Boolean,
     genderIcon: Painter,
     sportIcon: Painter,
     date: String,
     gradientColor1: Color,
     gradientColor2: Color,
     modifier: Modifier = Modifier,
     headerModifier: Modifier = Modifier,
+    leftScore: Int? = null,
+    rightScore: Int? = null
 ) {
     Column(
         modifier = modifier
             .fillMaxWidth()
     ) {
 
-        UpcomingGameHeader(
+        FeaturedGameHeader(
             leftTeamLogo = leftTeamLogo,
             rightTeamLogo = rightTeamLogo,
+            leftScore = leftScore,
+            rightScore = rightScore,
             gradientColor1 = gradientColor1,
             gradientColor2 = gradientColor2,
+            isPast = isPast,
             modifier = headerModifier
         )
 
-        SportCard(
+        GameCard(
             teamLogo = rightTeamLogo,
             team = team,
             date = date,
@@ -139,13 +180,16 @@ fun UpcomingGameCard(
 @Preview(showBackground = true)
 @Composable
 private fun GameScheduleScreen() {
-    UpcomingGameCard(
+    FeaturedGameCard(
         leftTeamLogo = painterResource(R.drawable.cornell_logo),
         rightTeamLogo = "https://cornellbigred.com/images/logos/penn_200x200.png?width=80&height=80&mode=max",//painterResource(R.drawable.penn_logo),
+        leftScore = 32,
+        rightScore = 30,
         team = "Penn",
         location = "Philadelphia, NJ",
         date = "5/20/2024",
         isLive = true,
+        isPast = false,
         genderIcon = painterResource(id = R.drawable.ic_gender_men),
         sportIcon = painterResource(id = R.drawable.ic_baseball),
         modifier = Modifier,

app/src/main/java/com/cornellappdev/score/components/SportCard.kt → app/src/main/java/com/cornellappdev/score/components/GameCard.kt

@@ -8,6 +8,8 @@ import androidx.compose.animation.core.tween
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -34,6 +36,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import coil3.compose.AsyncImage
 import com.cornellappdev.score.R
+import com.cornellappdev.score.model.GameCardData
 import com.cornellappdev.score.theme.AmbientColor
 import com.cornellappdev.score.theme.GrayMedium
 import com.cornellappdev.score.theme.GrayPrimary
@@ -46,9 +49,11 @@ import com.cornellappdev.score.theme.Style.labelsNormal
 import com.cornellappdev.score.theme.Style.teamName
 import com.cornellappdev.score.theme.Style.universityText
 import com.cornellappdev.score.theme.saturatedGreen
+import java.util.Date
+import java.util.Locale
 
 @Composable
-fun SportCard(
+fun GameCard(
     teamLogo: String,
     team: String,
     date: String,
@@ -58,6 +63,7 @@ fun SportCard(
     sportIcon: Painter,
     topCornerRound: Boolean,
     modifier: Modifier = Modifier,
+    onClick: (Boolean) -> Unit = {}
 ) {
     val cardShape = if (topCornerRound) {
         RoundedCornerShape(16.dp) // Rounded all
@@ -88,7 +94,7 @@ fun SportCard(
                                 )
                         )
                 }
-            )
+            ).clickable { onClick(false) }
     ) {
         Column(
             modifier = Modifier
@@ -101,7 +107,7 @@ fun SportCard(
                 modifier = Modifier.fillMaxWidth()
             ) {
                 Row(
-                    verticalAlignment = Alignment.CenterVertically
+                    verticalAlignment = Alignment.CenterVertically, modifier = Modifier.widthIn(0.dp, 250.dp)
                 ) {
                     AsyncImage(
                         model = teamLogo,
@@ -205,9 +211,9 @@ fun SportCard(
 
 @Preview(showBackground = true)
 @Composable
-private fun SportCardPreview() {
+private fun GameCardPreview() {
     Column {
-        SportCard(
+        GameCard(
             teamLogo = "https://cornellbigred.com/images/logos/penn_200x200.png?width=80&height=80&mode=max", //painterResource(id = R.drawable.penn_logo),
             team = "Penn",
             date = "5/20/2024",

app/src/main/java/com/cornellappdev/score/components/UpcomingGamesCarousel.kt → app/src/main/java/com/cornellappdev/score/components/GamesCarousel.kt

@@ -21,12 +21,12 @@ import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import com.cornellappdev.score.R
 import com.cornellappdev.score.model.GameCardData
+import com.cornellappdev.score.model.GamesCarouselVariant
 import com.cornellappdev.score.theme.CornellRed
 import com.cornellappdev.score.theme.CrimsonPrimary
 import com.cornellappdev.score.theme.GrayLight
 import com.cornellappdev.score.theme.GrayPrimary
 import com.cornellappdev.score.theme.Style.heading1
-import com.cornellappdev.score.theme.Style.title
 import com.cornellappdev.score.util.gameList
 
 @Composable
@@ -56,7 +56,7 @@ fun DotIndicator(
 }
 
 @Composable
-fun UpcomingGamesCarousel(games: List<GameCardData>) {
+fun GamesCarousel(games: List<GameCardData>, variant: GamesCarouselVariant) {
     val pagerState = rememberPagerState(pageCount = { games.size })
     Column(
         modifier = Modifier
@@ -65,7 +65,7 @@ fun UpcomingGamesCarousel(games: List<GameCardData>) {
         verticalArrangement = Arrangement.spacedBy(16.dp, Alignment.Top),
     ) {
         Text(
-            text = "Upcoming",
+            text = if (variant == GamesCarouselVariant.UPCOMING_VARIANT) "Upcoming" else "Latest",
             style = heading1,
             color = GrayPrimary,
             modifier = Modifier.fillMaxWidth()
@@ -76,12 +76,13 @@ fun UpcomingGamesCarousel(games: List<GameCardData>) {
             modifier = Modifier.fillMaxWidth()
         ) { page ->
             val game = games[page]
-            UpcomingGameCard(
+            FeaturedGameCard(
                 leftTeamLogo = painterResource(R.drawable.cornell_logo),
                 rightTeamLogo = game.teamLogo,
                 team = game.team,
                 date = game.dateString,
                 isLive = game.isLive,
+                isPast = game.isPast,
                 genderIcon = painterResource(game.genderIcon),
                 sportIcon = painterResource(game.sportIcon),
                 location = game.location,
@@ -104,6 +105,6 @@ fun UpcomingGamesCarousel(games: List<GameCardData>) {
 
 @Preview(showBackground = true, widthDp = 360)
 @Composable
-private fun UpcomingGamesCarouselPreview() {
-    UpcomingGamesCarousel(gameList)
+private fun GamesCarouselPreview() {
+    GamesCarousel(gameList, GamesCarouselVariant.UPCOMING_VARIANT)
 }