package com.aistudio.bonjuteri.jwlry.ui.components import androidx.compose.foundation.Image import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box 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.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.statusBarsPadding import androidx.compose.foundation.layout.width import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.text.KeyboardActions import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Close import androidx.compose.material.icons.filled.Search import androidx.compose.material.icons.filled.ShoppingCart import androidx.compose.material.icons.outlined.Diamond import androidx.compose.material3.BadgedBox import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.ui.draw.clip import androidx.compose.ui.res.painterResource import com.aistudio.bonjuteri.jwlry.R import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme import androidx.compose.material3.OutlinedTextField import androidx.compose.material3.Text import androidx.compose.material3.TextFieldDefaults import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.platform.testTag import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.input.ImeAction import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.aistudio.bonjuteri.jwlry.ui.theme.GoldDark import com.aistudio.bonjuteri.jwlry.ui.theme.GoldPrimary import com.aistudio.bonjuteri.jwlry.ui.theme.LightSurface import com.aistudio.bonjuteri.jwlry.ui.theme.MutedGrey import com.aistudio.bonjuteri.jwlry.ui.theme.PrimaryBlack import com.aistudio.bonjuteri.jwlry.ui.theme.PureWhite import com.aistudio.bonjuteri.jwlry.ui.theme.SurfaceBorder @OptIn(ExperimentalMaterial3Api::class) @Composable fun BonjuteriTopBar( searchQuery: String, onSearchQueryChange: (String) -> Unit, cartItemCount: Int, onCartClicked: () -> Unit, modifier: Modifier = Modifier, showSearch: Boolean = true ) { Column( modifier = modifier .fillMaxWidth() .background(PureWhite) .statusBarsPadding() .padding(horizontal = 16.dp, vertical = 8.dp) ) { Row( modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically ) { // Brand Logo & Name Row( verticalAlignment = Alignment.CenterVertically, modifier = Modifier.weight(1f) ) { Image( painter = painterResource(id = R.drawable.img_app_icon_3d), contentDescription = "BONJUTERİ Logo", modifier = Modifier .size(38.dp) .clip(CircleShape) ) Spacer(modifier = Modifier.width(10.dp)) Column { Text( text = "BONJUTERİ", style = MaterialTheme.typography.titleLarge.copy( fontWeight = FontWeight.Black, letterSpacing = 1.8.sp, color = PrimaryBlack ) ) Text( text = "ÖZEL TASARIM & MÜCEVHER", style = MaterialTheme.typography.labelSmall.copy( fontSize = 8.sp, fontWeight = FontWeight.Bold, letterSpacing = 1.2.sp, color = GoldDark ) ) } } // Cart Icon with Badge IconButton( onClick = onCartClicked, modifier = Modifier.testTag("topbar_cart_button") ) { BadgedBox( badge = { if (cartItemCount > 0) { Box( modifier = Modifier .background(GoldPrimary, CircleShape) .padding(horizontal = 5.dp, vertical = 2.dp) ) { Text( text = if (cartItemCount > 99) "99+" else cartItemCount.toString(), color = PureWhite, fontSize = 10.sp, fontWeight = FontWeight.Bold ) } } } ) { Icon( imageVector = Icons.Filled.ShoppingCart, contentDescription = "Sepetim", tint = PrimaryBlack ) } } } if (showSearch) { Spacer(modifier = Modifier.height(8.dp)) OutlinedTextField( value = searchQuery, onValueChange = onSearchQueryChange, modifier = Modifier .fillMaxWidth() .testTag("topbar_search_input"), placeholder = { Text( text = "Ürün, kategori veya taş ara...", style = MaterialTheme.typography.bodyMedium, color = MutedGrey ) }, leadingIcon = { Icon( imageVector = Icons.Filled.Search, contentDescription = "Ara", tint = MutedGrey, modifier = Modifier.size(20.dp) ) }, trailingIcon = { if (searchQuery.isNotBlank()) { IconButton(onClick = { onSearchQueryChange("") }) { Icon( imageVector = Icons.Filled.Close, contentDescription = "Temizle", tint = MutedGrey, modifier = Modifier.size(18.dp) ) } } }, singleLine = true, shape = RoundedCornerShape(12.dp), colors = TextFieldDefaults.colors( focusedContainerColor = LightSurface, unfocusedContainerColor = LightSurface, focusedIndicatorColor = GoldPrimary, unfocusedIndicatorColor = SurfaceBorder, cursorColor = GoldPrimary ), keyboardOptions = KeyboardOptions(imeAction = ImeAction.Search) ) } } }