diff --git a/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/ChatScreen.kt b/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/ChatScreen.kt index 5baf43f..ae22f7a 100644 --- a/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/ChatScreen.kt +++ b/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/ChatScreen.kt @@ -15,15 +15,7 @@ import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.items import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material3.ColorScheme -import androidx.compose.material3.Icon -import androidx.compose.material3.IconButton -import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Surface -import androidx.compose.material3.Text -import androidx.compose.material3.TextField -import androidx.compose.material3.TextFieldDefaults -import androidx.compose.material3.Typography +import androidx.compose.material3.* import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.collectAsState @@ -91,6 +83,7 @@ fun ChatScreen( } +@OptIn(ExperimentalMaterial3Api::class) @Composable private fun MainContent( uiState: ChatUiState, @@ -112,18 +105,31 @@ private fun MainContent( horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically ) { - ModelSelector( - selectedModel = uiState.selectedModel, - availableModels = uiState.availableModels, - onModelSelect = { onEvent(ChatEvent.UserEvent.SelectModel(it)) } - ) - - var isDark by LocalThemeIsDark.current - IconButton(onClick = { isDark = !isDark }) { - Icon( - if (isDark) FeatherIcons.Sun else FeatherIcons.Moon, - contentDescription = "Toggle theme" + TooltipBox( + positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(), + tooltip = { PlainTooltip { Text("Select AI Model") } }, + state = rememberTooltipState() + ) { + ModelSelector( + selectedModel = uiState.selectedModel, + availableModels = uiState.availableModels, + onModelSelect = { onEvent(ChatEvent.UserEvent.SelectModel(it)) } ) + + } + + TooltipBox( + positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(), + tooltip = { PlainTooltip { Text("Toggle theme") } }, + state = rememberTooltipState() + ) { + var isDark by LocalThemeIsDark.current + IconButton(onClick = { isDark = !isDark }) { + Icon( + if (isDark) FeatherIcons.Sun else FeatherIcons.Moon, + contentDescription = "Toggle theme" + ) + } } } } @@ -159,10 +165,14 @@ private fun MainContent( onSendMessage = { onEvent(ChatEvent.UserEvent.SendMessage(it)) }, enabled = !uiState.isLoading && uiState.thinkingMessage == null, modifier = Modifier.padding(16.dp) - ) + ) } - Text(text = "KOllama can make mistakes, so double check the generated contents.", fontSize = 12.sp, modifier = Modifier.padding(start = 10.dp, end = 10.dp, bottom = 10.dp)) + Text( + text = "KOllama can make mistakes, so double check the generated contents.", + fontSize = 12.sp, + modifier = Modifier.padding(start = 10.dp, end = 10.dp, bottom = 10.dp) + ) } } @@ -401,6 +411,7 @@ fun rememberMarkdownTypography( ) ) } + @Composable fun ButtonBackground( modifier: Modifier = Modifier, diff --git a/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/Sidebar.kt b/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/Sidebar.kt index 5d11c6a..ce4a9ab 100644 --- a/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/Sidebar.kt +++ b/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/Sidebar.kt @@ -17,10 +17,7 @@ import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.items import androidx.compose.foundation.shape.CircleShape import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material3.Icon -import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Surface -import androidx.compose.material3.Text +import androidx.compose.material3.* import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier @@ -35,6 +32,7 @@ import compose.icons.feathericons.Cpu import compose.icons.feathericons.MessageCircle import compose.icons.feathericons.Plus +@OptIn(ExperimentalMaterial3Api::class) @Composable internal fun ChatSidebar( uiState: ChatUiState, @@ -77,31 +75,36 @@ internal fun ChatSidebar( ) } - - Surface( - onClick = { onEvent(ChatEvent.UserEvent.CreateNewChat) }, - shape = RoundedCornerShape(12.dp), - color = MaterialTheme.colorScheme.primary.copy(alpha = 0.1f), - border = BorderStroke(1.dp, MaterialTheme.colorScheme.primary.copy(alpha = 0.2f)), - modifier = Modifier.fillMaxWidth() + TooltipBox( + positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(), + tooltip = { PlainTooltip { Text("New Chat") } }, + state = rememberTooltipState() ) { - Row( - modifier = Modifier.padding(16.dp), - horizontalArrangement = Arrangement.spacedBy( - 8.dp, - Alignment.CenterHorizontally - ), - verticalAlignment = Alignment.CenterVertically + Surface( + onClick = { onEvent(ChatEvent.UserEvent.CreateNewChat) }, + shape = RoundedCornerShape(12.dp), + color = MaterialTheme.colorScheme.primary.copy(alpha = 0.1f), + border = BorderStroke(1.dp, MaterialTheme.colorScheme.primary.copy(alpha = 0.2f)), + modifier = Modifier.fillMaxWidth() ) { - Icon( - FeatherIcons.Plus, - contentDescription = null, - tint = MaterialTheme.colorScheme.primary - ) - Text( - "New Chat", - color = MaterialTheme.colorScheme.primary - ) + Row( + modifier = Modifier.padding(16.dp), + horizontalArrangement = Arrangement.spacedBy( + 8.dp, + Alignment.CenterHorizontally + ), + verticalAlignment = Alignment.CenterVertically + ) { + Icon( + FeatherIcons.Plus, + contentDescription = null, + tint = MaterialTheme.colorScheme.primary + ) + Text( + "New Chat", + color = MaterialTheme.colorScheme.primary + ) + } } } diff --git a/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/WelcomeScreen.kt b/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/WelcomeScreen.kt index a08d7bb..5e24e53 100644 --- a/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/WelcomeScreen.kt +++ b/composeApp/src/jvmMain/kotlin/com/kashif/deepseek/presentation/components/WelcomeScreen.kt @@ -12,10 +12,7 @@ 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.material3.Icon -import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Surface -import androidx.compose.material3.Text +import androidx.compose.material3.* import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier @@ -28,6 +25,7 @@ import compose.icons.feathericons.MessageCircle import compose.icons.feathericons.Plus +@OptIn(ExperimentalMaterial3Api::class) @Composable fun WelcomeScreen(onEvent: (ChatEvent) -> Unit) { Box( @@ -83,20 +81,26 @@ fun WelcomeScreen(onEvent: (ChatEvent) -> Unit) { color = MaterialTheme.colorScheme.primary.copy(alpha = 0.1f), border = BorderStroke(1.dp, MaterialTheme.colorScheme.primary.copy(alpha = 0.2f)) ) { - Row( - modifier = Modifier.padding(16.dp), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterHorizontally) + TooltipBox( + positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(), + tooltip = { PlainTooltip { Text("New Chat") } }, + state = rememberTooltipState() ) { - Icon( - FeatherIcons.Plus, - contentDescription = null, - tint = MaterialTheme.colorScheme.primary - ) - Text( - "Start New Chat", - color = MaterialTheme.colorScheme.primary - ) + Row( + modifier = Modifier.padding(16.dp), + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterHorizontally) + ) { + Icon( + FeatherIcons.Plus, + contentDescription = null, + tint = MaterialTheme.colorScheme.primary + ) + Text( + "Start New Chat", + color = MaterialTheme.colorScheme.primary + ) + } } } }