[FEATURE] Modified TopAppBar (2)

app/src/main/java/com/eshc/goonersapp/navigation/GnrNavHost.kt

@@ -71,11 +71,13 @@ fun GnrNavHost(
         }
 
         playerDetailScreen(
+            onBackIconClick = { navController.popBackStack() },
             onShowSnackbar = onShowSnackbar
         )
 
         matchDetailScreen(
             onClickChat = { navController.navigateToChatRoom(it) },
+            onBackIconClick = { navController.popBackStack() },
             onShowSnackbar = onShowSnackbar
         )
 

app/src/main/java/com/eshc/goonersapp/ui/GnrApp.kt

@@ -30,7 +30,7 @@ import com.eshc.goonersapp.core.data.util.NetworkConnectivityManager
 import com.eshc.goonersapp.core.designsystem.IconPack
 import com.eshc.goonersapp.core.designsystem.component.GnrNavigationBar
 import com.eshc.goonersapp.core.designsystem.component.GnrNavigationBarItem
-import com.eshc.goonersapp.core.designsystem.component.TopLevelTopBar
+import com.eshc.goonersapp.core.designsystem.component.GnrTopLevelTopBar
 import com.eshc.goonersapp.core.designsystem.iconpack.IcInfo
 import com.eshc.goonersapp.core.designsystem.iconpack.IcNotification
 import com.eshc.goonersapp.core.designsystem.iconpack.IcPeople
@@ -131,7 +131,25 @@ fun GnrApp(
                                     )
                                 }
 
-                                else -> { /* TODO("Implement Nothing") */ }
+                                else -> {
+                                    Icon(
+                                        imageVector = IconPack.IcNotification,
+                                        contentDescription = null,
+                                        modifier = Modifier
+                                            .padding(horizontal = 8.dp)
+                                            .size(24.dp),
+                                        tint = ColorFF777777
+                                    )
+                                    Icon(
+                                        imageVector = IconPack.IcPeople,
+                                        contentDescription = null,
+                                        modifier = Modifier
+                                            .padding(horizontal = 8.dp)
+                                            .size(24.dp)
+                                            .clickable { navController.navigateToLogin() },
+                                        tint = ColorFF777777
+                                    )
+                                }
                             }
                         }
                     )
@@ -176,7 +194,7 @@ fun GnrTopLevelBar(
     topLevelDestination: TopLevelDestination,
     icons: @Composable () -> Unit
 ) {
-    TopLevelTopBar(
+    GnrTopLevelTopBar(
         modifier = Modifier.padding(horizontal = 8.dp),
         title = stringResource(id = topLevelDestination.titleTextId)
     ) {

core/designsystem/src/main/java/com/eshc/goonersapp/core/designsystem/component/TopBar.kt

@@ -16,11 +16,12 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import com.eshc.goonersapp.core.designsystem.IconPack
 import com.eshc.goonersapp.core.designsystem.iconpack.IcIosArrowBack
+import com.eshc.goonersapp.core.designsystem.theme.GnrTypography
 
 @Composable
-fun TopLevelTopBar(
-    modifier: Modifier = Modifier,
+fun GnrTopLevelTopBar(
     title : String,
+    modifier: Modifier = Modifier,
     content : @Composable () -> Unit
 ){
     Row(
@@ -30,19 +31,19 @@ fun TopLevelTopBar(
         Text(
             modifier = Modifier.padding(vertical = 8.dp).wrapContentHeight().weight(1f),
             text = title,
-            style = MaterialTheme.typography.headlineLarge,
+            style = GnrTypography.heading2SemiBold,
             color = Color.Black,
         )
         content()
     }
 }
 
 @Composable
-fun TopBar(
-    modifier: Modifier = Modifier,
+fun GnrTopBar(
     title : String,
-    content : @Composable () -> Unit = {},
-    onBackIconClick: () -> Unit
+    onBackIconClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    content : @Composable () -> Unit = {}
 ){
     Row(
         modifier = modifier.fillMaxWidth(),

core/designsystem/src/main/java/com/eshc/goonersapp/core/designsystem/theme/Color.kt

@@ -43,4 +43,10 @@ val BrushMainGradient = Brush.verticalGradient(
         ColorFF10358A,
         ColorFF072872
     )
-)
+)
+
+/**
+ * Player Detail Color
+ * */
+val ColorFFC10006 = Color(0xFFC10006)
+val ColorFF720509 = Color(0xFF720509)

feature/home/src/main/java/com/eshc/goonersapp/feature/home/HomeScreen.kt

@@ -41,12 +41,8 @@ fun HomeRoute(
     val recentlyResultUiState by viewModel.recentlyResultUiStateFlow.collectAsStateWithLifecycle()
 
     Scaffold(
-        topBar = {
-            topBar()
-        },
-        bottomBar = {
-            bottomBar()
-        }
+        topBar = { topBar() },
+        bottomBar = { bottomBar() }
     ) { padding ->
         HomeScreen(
             modifier = Modifier.padding(padding),

feature/login/src/main/java/com/eshc/goonersapp/feature/login/LoginScreen.kt

@@ -19,7 +19,7 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.eshc.goonersapp.core.designsystem.component.GnrTextFiled
-import com.eshc.goonersapp.core.designsystem.component.TopBar
+import com.eshc.goonersapp.core.designsystem.component.GnrTopBar
 
 @Composable
 fun LoginScreen(
@@ -30,7 +30,7 @@ fun LoginScreen(
     Column(
         modifier = Modifier.fillMaxSize()
     ) {
-        TopBar(
+        GnrTopBar(
             title = "LOGIN",
             onBackIconClick = onBackIconClick
         )

feature/login/src/main/java/com/eshc/goonersapp/feature/login/SignUpScreen.kt

@@ -24,7 +24,7 @@ import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.eshc.goonersapp.core.designsystem.component.GnrTextFiled
-import com.eshc.goonersapp.core.designsystem.component.TopBar
+import com.eshc.goonersapp.core.designsystem.component.GnrTopBar
 import com.eshc.goonersapp.core.designsystem.theme.pretendard
 
 @OptIn(ExperimentalFoundationApi::class)
@@ -42,7 +42,7 @@ fun SignUpScreen(
         Column(
             modifier = Modifier.fillMaxSize()
         ) {
-            TopBar(
+            GnrTopBar(
                 title = "SIGN UP",
                 onBackIconClick = onBackIconClick
             )

feature/match/src/main/java/com/eshc/goonersapp/feature/match/detail/MatchDetailScreen.kt

@@ -45,6 +45,7 @@ import com.eshc.goonersapp.core.common.state.UiState
 import com.eshc.goonersapp.core.common.util.DateUtil
 import com.eshc.goonersapp.core.designsystem.IconPack
 import com.eshc.goonersapp.core.designsystem.component.GnrTabItem
+import com.eshc.goonersapp.core.designsystem.component.GnrTopBar
 import com.eshc.goonersapp.core.designsystem.component.MatchLeagueInfo
 import com.eshc.goonersapp.core.designsystem.iconpack.IcTalk
 import com.eshc.goonersapp.core.designsystem.theme.ColorFF10358A
@@ -60,14 +61,21 @@ import com.eshc.goonersapp.feature.match.state.MatchDetailUiState
 
 @Composable
 fun MatchDetailRootScreen(
+    onBackIconClick: () -> Unit,
     onShowSnackbar: (String) -> Unit,
     onClickChat: (MatchUiModel) -> Unit,
     viewModel: MatchDetailViewModel = hiltViewModel(),
 ) {
     val matchData by viewModel.matchDetailUiState.collectAsStateWithLifecycle()
 
     Scaffold(
-        topBar = { /* TODO("Not yet implemented") */ }
+        topBar = {
+            GnrTopBar(
+                title = "",
+                onBackIconClick = onBackIconClick,
+                content = {  }
+            )
+        }
     ) { paddingValues ->
         MatchDetailScreen(
             matchDetailUiState = matchData,
@@ -88,6 +96,7 @@ fun MatchDetailScreen(
     var selectedTab by remember { mutableStateOf(DetailTab.SUMMARY) }
     val match = matchDetailUiState.match
     val matchDetail = matchDetailUiState.matchDetailState
+
     Box(
         modifier = modifier
             .fillMaxSize()
@@ -238,13 +247,8 @@ fun MatchDetailScreen(
 
             item {
                 when (selectedTab) {
-                    DetailTab.SUMMARY -> {
-                        SummaryScreen()
-                    }
-
-                    DetailTab.COMMENT -> {
-
-                    }
+                    DetailTab.SUMMARY -> { SummaryScreen() }
+                    DetailTab.COMMENT -> { /* TODO("Not yet implemented") */ }
                 }
             }
         }

feature/match/src/main/java/com/eshc/goonersapp/feature/match/navigation/MatchNavigation.kt

@@ -45,6 +45,7 @@ fun NavGraphBuilder.matchScreen(
 
 
 fun NavGraphBuilder.matchDetailScreen(
+    onBackIconClick: () -> Unit,
     onClickChat : (MatchUiModel) -> Unit,
     onShowSnackbar : (String) -> Unit
 ) {
@@ -54,6 +55,7 @@ fun NavGraphBuilder.matchDetailScreen(
     ) {
         MatchDetailRootScreen(
             onClickChat = onClickChat,
+            onBackIconClick = onBackIconClick,
             onShowSnackbar = onShowSnackbar
         )
     }

feature/match/src/main/res/values/strings.xml

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <string name="match">Matches</string>
+    <string name="match">Match</string>
 </resources>

feature/team/src/main/java/com/eshc/goonersapp/feature/team/club/ClubDetailScreen.kt

@@ -32,7 +32,7 @@ import androidx.compose.ui.unit.sp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import coil.compose.AsyncImage
-import com.eshc.goonersapp.core.designsystem.component.TopBar
+import com.eshc.goonersapp.core.designsystem.component.GnrTopBar
 import com.eshc.goonersapp.core.designsystem.theme.pretendard
 import com.eshc.goonersapp.core.domain.model.match.Match
 import com.eshc.goonersapp.feature.team.state.ClubDetailUiState
@@ -65,7 +65,7 @@ fun ClubDetailScreen(
     Column(
         modifier = Modifier.fillMaxSize()
     ) {
-        TopBar(
+        GnrTopBar(
             title = "CLUB",
             onBackIconClick = onBackIconClick
         )

feature/team/src/main/java/com/eshc/goonersapp/feature/team/detail/PlayerDetailScreen.kt

@@ -1,6 +1,8 @@
 package com.eshc.goonersapp.feature.team.detail
 
+import android.annotation.SuppressLint
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -19,9 +21,14 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.CircularProgressIndicator
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -38,33 +45,72 @@ import androidx.compose.ui.unit.sp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import coil.compose.AsyncImage
+import com.eshc.goonersapp.core.designsystem.IconPack
 import com.eshc.goonersapp.core.designsystem.component.GnrElevatedCard
 import com.eshc.goonersapp.core.designsystem.component.GnrTabItem
 import com.eshc.goonersapp.core.designsystem.ext.gnrElevatedCardBorder
+import com.eshc.goonersapp.core.designsystem.iconpack.IcIosArrowBack
+import com.eshc.goonersapp.core.designsystem.iconpack.IcNotification
 import com.eshc.goonersapp.core.designsystem.theme.ColorFF10358A
 import com.eshc.goonersapp.core.designsystem.theme.ColorFF181818
+import com.eshc.goonersapp.core.designsystem.theme.ColorFF720509
+import com.eshc.goonersapp.core.designsystem.theme.ColorFFC10006
 import com.eshc.goonersapp.core.designsystem.theme.ColorFFF5F5F5
 import com.eshc.goonersapp.core.designsystem.theme.ColorFFFFFFFF
 import com.eshc.goonersapp.core.designsystem.theme.GnrTypography
 import com.eshc.goonersapp.core.domain.model.player.Player
 import com.eshc.goonersapp.feature.team.state.PlayerDetailUiState
 
+@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun PlayerDetailRootScreen(
+    onBackIconClick: () -> Unit,
     onShowSnackbar: (String) -> Unit,
     viewModel : PlayerDetailViewModel = hiltViewModel()
 ) {
     val playerDetailUiState by viewModel.playerDetailUiState.collectAsStateWithLifecycle()
     var selectedTab by remember { mutableStateOf(DetailTab.PROFILE) }
 
-    PlayerDetailScreen(
-        playerDetailUiState = playerDetailUiState,
-        selectedTab = selectedTab,
-        onShowSnackbar =  onShowSnackbar,
-        onUpdateTab = {
-            selectedTab = it
+    Scaffold(
+        topBar = {
+            TopAppBar(
+                title = { /*TODO*/ },
+                modifier = Modifier.fillMaxWidth(),
+                navigationIcon = {
+                    Icon(
+                        imageVector = IconPack.IcIosArrowBack,
+                        contentDescription = null,
+                        modifier = Modifier
+                            .padding(horizontal = 8.dp)
+                            .size(24.dp)
+                            .clickable(onClick = onBackIconClick),
+                        tint = ColorFFFFFFFF
+                    )
+                },
+                actions = {
+                    Icon(
+                        imageVector = IconPack.IcNotification,
+                        contentDescription = null,
+                        modifier = Modifier
+                            .padding(horizontal = 8.dp)
+                            .size(24.dp)
+                            .clickable { /* TODO("Not yet implemented") */ },
+                        tint = ColorFFFFFFFF
+                    )
+                },
+                colors = TopAppBarDefaults.topAppBarColors(containerColor = Color.Transparent)
+            )
         }
-    )
+    ) { _ ->
+        PlayerDetailScreen(
+            playerDetailUiState = playerDetailUiState,
+            selectedTab = selectedTab,
+            onShowSnackbar =  onShowSnackbar,
+            onUpdateTab = { tab -> selectedTab = tab },
+            modifier = Modifier
+        )
+    }
 }
 
 
@@ -73,9 +119,11 @@ fun PlayerDetailScreen(
     playerDetailUiState : PlayerDetailUiState,
     selectedTab : DetailTab,
     onShowSnackbar: (String) -> Unit,
-    onUpdateTab : (DetailTab) -> Unit
+    onUpdateTab : (DetailTab) -> Unit,
+    modifier: Modifier = Modifier
 ) {
     Surface(
+        modifier = modifier,
         color = ColorFFFFFFFF
     ) {
         when (playerDetailUiState) {
@@ -183,8 +231,8 @@ fun PlayerDetailImage(
             .background(
                 Brush.verticalGradient(
                     listOf(
-                        Color(0xFFC10006),
-                        Color(0xFF720509)
+                        ColorFFC10006,
+                        ColorFF720509
                     )
                 )
             ),
@@ -218,7 +266,7 @@ fun PlayerDetailImage(
                 )
                 PlayerDetailBackNumberChip(
                     backNumber = player.backNumber,
-                    backgroundColor = Color(0xFFC10006),
+                    backgroundColor = ColorFFC10006
                 )
             }
             Text(