Refactor: Update Settings screen to select a LLM Clients. Added Gemini client.Improve architecture in Demo Compose App

Author: siarhei-luskanau

.github/workflows/demo-compose-app.yml

@@ -30,7 +30,7 @@ jobs:
         os: [ ubuntu-latest ]
         include:
           - gradle-tasks: ":commonApp:iosSimulatorArm64Binaries"
-            os: macos-latest-xlarge
+            os: macos-latest
 
     steps:
       - name: Configure Git

examples/demo-compose-app/.editorconfig

@@ -16,6 +16,7 @@ indent_size = 2
 
 [*.{kt,kts}]
 ij_kotlin_code_style_defaults = KOTLIN_OFFICIAL
+ktlint_function_naming_ignore_when_annotated_with = Composable
 
 #  Disable wildcard imports entirely
 ij_kotlin_name_count_to_use_star_import = 2147483647

examples/demo-compose-app/README.md

@@ -30,16 +30,15 @@ To build the application bundle:
 - find `.apk` file in `androidApp/build/outputs/apk/debug/app-debug.apk`
 
 ### Desktop
-Run the desktop application: `./gradlew :desktopApp:run`  
-Run the desktop **hot reload** application: `./gradlew :desktopApp:hotRun`
+Run the desktop application: `./gradlew :desktopApp:run`
 
 ### iOS
 To run the application on iPhone device/simulator:
 - Open `iosApp/iosApp.xcproject` in Xcode and run standard configuration
 - Or use [Kotlin Multiplatform Mobile plugin](https://plugins.jetbrains.com/plugin/14936-kotlin-multiplatform-mobile) for Android Studio
 
 ### Web Distribution
-Build web distribution: `./gradlew :webApp:composeCompatibilityBrowserDistribution`  
+Build web distribution: `./gradlew :webApp:composeCompatibilityBrowserDistribution`
 Deploy a dir `webApp/build/dist/composeWebCompatibility/productionExecutable` to a web server
 
 ### JS Browser

examples/demo-compose-app/build.gradle.kts

@@ -2,10 +2,13 @@ plugins {
     alias(libs.plugins.android.application).apply(false)
     alias(libs.plugins.android.kmp.library).apply(false)
     alias(libs.plugins.compose.compiler).apply(false)
-    alias(libs.plugins.compose.hot.reload).apply(false)
     alias(libs.plugins.compose.multiplatform).apply(false)
     alias(libs.plugins.kotlin.android).apply(false)
     alias(libs.plugins.kotlin.jvm).apply(false)
     alias(libs.plugins.kotlin.multiplatform).apply(false)
     alias(libs.plugins.ktlint)
 }
+
+subprojects {
+    apply(plugin = "org.jlleitschuh.gradle.ktlint")
+}

examples/demo-compose-app/commonApp/build.gradle.kts

@@ -1,7 +1,4 @@
-@file:OptIn(ExperimentalWasmDsl::class)
-
 import org.jetbrains.compose.reload.gradle.ComposeHotRun
-import org.jetbrains.kotlin.gradle.ExperimentalWasmDsl
 import org.jetbrains.kotlin.gradle.plugin.mpp.KotlinNativeTarget
 
 plugins {
@@ -15,11 +12,10 @@ plugins {
 kotlin {
     jvmToolchain(libs.versions.javaVersion.get().toInt())
 
-    android {
+    androidLibrary {
         namespace = "com.jetbrains.example.koog.share.ui"
         compileSdk = 36
         minSdk = 23
-        androidResources.enable = true
     }
 
     jvm()
@@ -32,33 +28,38 @@ kotlin {
 
     sourceSets {
         commonMain.dependencies {
-            implementation(compose.animation)
-            implementation(compose.animationGraphics)
-            implementation(compose.components.resources)
-            implementation(compose.components.uiToolingPreview)
-            implementation(compose.foundation)
-            implementation(compose.material3)
-            implementation(compose.materialIconsExtended)
-            implementation(compose.runtime)
-            implementation(compose.ui)
-            implementation(compose.uiUtil)
-            implementation(libs.jetbrains.lifecycle.viewmodel.compose)
-            implementation(libs.jetbrains.navigation.compose)
+            implementation(libs.jetbrains.compose.animation)
+            implementation(libs.jetbrains.compose.animation.graphics)
+            implementation(libs.jetbrains.compose.components.resources)
+            implementation(libs.jetbrains.compose.foundation)
+            implementation(libs.jetbrains.compose.material.icons.extended)
+            implementation(libs.jetbrains.compose.material3)
+            implementation(libs.jetbrains.compose.runtime)
+            implementation(libs.jetbrains.compose.ui)
+            implementation(libs.jetbrains.compose.ui.tooling.preview)
+            implementation(libs.jetbrains.compose.ui.util)
+            implementation(libs.jetbrains.lifecycle.viewmodel.navigation3)
+            implementation(libs.jetbrains.navigation3.ui)
             implementation(libs.koin.compose)
             implementation(libs.koog.agents.core)
             implementation(libs.koog.prompt.executor.llms.all)
             implementation(libs.kotlinx.coroutines.core)
             implementation(libs.kotlinx.datetime)
-            implementation(libs.markdown.renderer)
             implementation(libs.kotlinx.serialization.core)
             implementation(libs.kotlinx.serialization.json)
+            implementation(libs.markdown.renderer)
             implementation(project.dependencies.platform(libs.koin.bom))
             implementation(project.dependencies.platform(libs.ktor.bom))
         }
 
+        commonTest.dependencies {
+            implementation(kotlin("test"))
+            implementation(libs.jetbrains.compose.ui.test)
+        }
+
         androidMain.dependencies {
-            implementation(compose.uiTooling)
             implementation(libs.androidx.datastore.preferences)
+            implementation(libs.jetbrains.compose.ui.tooling)
             implementation(libs.kotlinx.coroutines.android)
             implementation(libs.ktor.client.okhttp)
         }

examples/demo-compose-app/commonApp/src/androidMain/kotlin/com/jetbrains/example/koog/compose/settings/DataStoreAppSettings.kt

@@ -14,6 +14,8 @@ internal class DataStoreAppSettings(prefPathProvider: PrefPathProvider) : AppSet
     companion object {
         val OPENAI_TOKEN_KEY = stringPreferencesKey("openai_token")
         val ANTHROPIC_TOKEN_KEY = stringPreferencesKey("anthropic_token")
+        val GEMINI_TOKEN_KEY = stringPreferencesKey("gemini_token")
+        val SELECTED_PROVIDER_KEY = stringPreferencesKey("selected_provider")
     }
 
     private val dataStore: DataStore<Preferences> by lazy {
@@ -25,14 +27,23 @@ internal class DataStoreAppSettings(prefPathProvider: PrefPathProvider) : AppSet
     override suspend fun getCurrentSettings(): AppSettingsData = dataStore.data.map { preferences ->
         AppSettingsData(
             openAiToken = preferences[OPENAI_TOKEN_KEY].orEmpty(),
-            anthropicToken = preferences[ANTHROPIC_TOKEN_KEY].orEmpty()
+            anthropicToken = preferences[ANTHROPIC_TOKEN_KEY].orEmpty(),
+            geminiToken = preferences[GEMINI_TOKEN_KEY].orEmpty(),
+            selectedOption = when (preferences[SELECTED_PROVIDER_KEY]) {
+                SelectedOption.OpenAI.title -> SelectedOption.OpenAI
+                SelectedOption.Anthropic.title -> SelectedOption.Anthropic
+                SelectedOption.Gemini.title -> SelectedOption.Gemini
+                else -> SelectedOption.OpenAI
+            }
         )
     }.first()
 
     override suspend fun setCurrentSettings(settings: AppSettingsData) {
         dataStore.edit { preferences ->
             preferences[OPENAI_TOKEN_KEY] = settings.openAiToken
             preferences[ANTHROPIC_TOKEN_KEY] = settings.anthropicToken
+            preferences[GEMINI_TOKEN_KEY] = settings.geminiToken
+            preferences[SELECTED_PROVIDER_KEY] = settings.selectedOption.title
         }
     }
 }

examples/demo-compose-app/commonApp/src/commonMain/kotlin/com/jetbrains/example/koog/compose/AppNavigation.kt

@@ -0,0 +1,24 @@
+package com.jetbrains.example.koog.compose
+
+import androidx.navigation3.runtime.NavKey
+import com.jetbrains.example.koog.compose.screens.agentdemo.AgentDemoNavigationCallback
+import com.jetbrains.example.koog.compose.screens.settings.SettingsNavigationCallback
+import com.jetbrains.example.koog.compose.screens.start.StartNavigationCallback
+
+internal class AppNavigation(private val backStack: MutableList<NavKey>) :
+    AgentDemoNavigationCallback,
+    SettingsNavigationCallback,
+    StartNavigationCallback {
+
+    override fun goBack() {
+        backStack.removeLastOrNull()
+    }
+
+    override fun goSettings() {
+        backStack.add(NavRoute.SettingsScreen)
+    }
+
+    override fun goAgentDemo(agentDemoRoute: NavRoute.AgentDemoRoute) {
+        backStack.add(agentDemoRoute)
+    }
+}

examples/demo-compose-app/commonApp/src/commonMain/kotlin/com/jetbrains/example/koog/compose/ComposeApp.kt

@@ -4,10 +4,11 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateListOf
 import androidx.compose.ui.Modifier
-import androidx.navigation.compose.NavHost
-import androidx.navigation.compose.composable
-import androidx.navigation.compose.rememberNavController
+import androidx.navigation3.runtime.NavKey
+import androidx.navigation3.runtime.entryProvider
+import androidx.navigation3.ui.NavDisplay
 import com.jetbrains.example.koog.compose.screens.agentdemo.AgentDemoScreen
 import com.jetbrains.example.koog.compose.screens.settings.SettingsScreen
 import com.jetbrains.example.koog.compose.screens.start.StartScreen
@@ -27,57 +28,55 @@ fun ComposeApp() = AppTheme {
         color = MaterialTheme.colorScheme.background
     ) {
         val koin = getKoin()
-        val navController = rememberNavController()
-        NavHost(
-            navController = navController,
-            startDestination = NavRoute.StartScreen,
-        ) {
-            composable<NavRoute.StartScreen> {
-                StartScreen(
-                    onNavigateToSettings = {
-                        navController.navigate(NavRoute.SettingsScreen)
-                    },
-                    onNavigateToAgentDemo = { demoRoute ->
-                        navController.navigate(demoRoute)
-                    },
-                    viewModel = koin.get()
-                )
-            }
+        val backStack = mutableStateListOf<NavKey>(NavRoute.StartScreen)
+        val appNavigation = AppNavigation(backStack = backStack)
+        NavDisplay(
+            backStack = backStack,
+            onBack = { backStack.removeLastOrNull() },
+            entryProvider = entryProvider {
+                entry<NavRoute.StartScreen> {
+                    StartScreen(
+                        viewModel = koin.get { parametersOf(appNavigation) }
+                    )
+                }
 
-            composable<NavRoute.SettingsScreen> {
-                SettingsScreen(
-                    onNavigateBack = {
-                        navController.popBackStack()
-                    },
-                    onSaveSettings = {
-                        navController.popBackStack()
-                    },
-                    viewModel = koin.get()
-                )
-            }
+                entry<NavRoute.SettingsScreen> {
+                    SettingsScreen(
+                        viewModel = koin.get { parametersOf(appNavigation) }
+                    )
+                }
 
-            composable<NavRoute.AgentDemoRoute.CalculatorScreen> {
-                AgentDemoScreen(
-                    onNavigateBack = { navController.popBackStack() },
-                    viewModel = koin.get { parametersOf("calculator") }
-                )
-            }
+                entry<NavRoute.AgentDemoRoute.CalculatorScreen> {
+                    AgentDemoScreen(
+                        viewModel = koin.get {
+                            parametersOf(
+                                appNavigation,
+                                "calculator",
+                            )
+                        }
+                    )
+                }
 
-            composable<NavRoute.AgentDemoRoute.WeatherScreen> {
-                AgentDemoScreen(
-                    onNavigateBack = { navController.popBackStack() },
-                    viewModel = koin.get { parametersOf("weather") }
-                )
+                entry<NavRoute.AgentDemoRoute.WeatherScreen> {
+                    AgentDemoScreen(
+                        viewModel = koin.get {
+                            parametersOf(
+                                appNavigation,
+                                "weather",
+                            )
+                        }
+                    )
+                }
             }
-        }
+        )
     }
 }
 
 /**
  * Navigation routes for the app
  */
 @Serializable
-sealed interface NavRoute {
+sealed interface NavRoute : NavKey {
     @Serializable
     data object StartScreen : NavRoute
 

examples/demo-compose-app/commonApp/src/commonMain/kotlin/com/jetbrains/example/koog/compose/KoinApp.kt

@@ -1,6 +1,10 @@
 package com.jetbrains.example.koog.compose
 
 import ai.koog.prompt.executor.clients.LLMClient
+import ai.koog.prompt.executor.clients.anthropic.AnthropicLLMClient
+import ai.koog.prompt.executor.clients.anthropic.AnthropicModels
+import ai.koog.prompt.executor.clients.google.GoogleLLMClient
+import ai.koog.prompt.executor.clients.google.GoogleModels
 import ai.koog.prompt.executor.clients.openai.OpenAILLMClient
 import ai.koog.prompt.executor.clients.openai.OpenAIModels
 import ai.koog.prompt.llm.LLModel
@@ -12,6 +16,7 @@ import com.jetbrains.example.koog.compose.screens.agentdemo.AgentDemoViewModel
 import com.jetbrains.example.koog.compose.screens.settings.SettingsViewModel
 import com.jetbrains.example.koog.compose.screens.start.StartViewModel
 import com.jetbrains.example.koog.compose.settings.AppSettings
+import com.jetbrains.example.koog.compose.settings.SelectedOption
 import org.koin.compose.KoinMultiplatformApplication
 import org.koin.core.annotation.KoinExperimentalAPI
 import org.koin.core.module.Module
@@ -29,19 +34,46 @@ fun KoinApp() = KoinMultiplatformApplication(
                 factory<suspend () -> Pair<LLMClient, LLModel>> {
                     {
                         val appSettings: AppSettings = get()
-                        val openAiToken = appSettings.getCurrentSettings().openAiToken
-                        require(openAiToken.isNotEmpty()) { "OpenAI token is not configured." }
-                        Pair(OpenAILLMClient(openAiToken), OpenAIModels.Chat.GPT4o)
+                        val currentSettings = appSettings.getCurrentSettings()
+                        when (currentSettings.selectedOption) {
+                            SelectedOption.OpenAI -> {
+                                val openAiToken = appSettings.getCurrentSettings().openAiToken
+                                require(openAiToken.isNotEmpty()) { "OpenAI token is not configured." }
+                                Pair(OpenAILLMClient(openAiToken), OpenAIModels.Chat.GPT4o)
+                            }
+                            SelectedOption.Anthropic -> {
+                                val anthropicToken = appSettings.getCurrentSettings().anthropicToken
+                                require(anthropicToken.isNotEmpty()) { "Anthropic token is not configured." }
+                                Pair(AnthropicLLMClient(anthropicToken), AnthropicModels.Sonnet_4)
+                            }
+                            SelectedOption.Gemini -> {
+                                val geminiToken = appSettings.getCurrentSettings().geminiToken
+                                require(geminiToken.isNotEmpty()) { "Gemini token is not configured." }
+                                Pair(GoogleLLMClient(geminiToken), GoogleModels.Gemini2_5Pro)
+                            }
+                        }
                     }
                 }
                 single<AgentProvider>(named("calculator")) { CalculatorAgentProvider(provideLLMClient = get()) }
                 single<AgentProvider>(named("weather")) { WeatherAgentProvider(provideLLMClient = get()) }
-                factory { SettingsViewModel(appSettings = get()) }
-                factory { StartViewModel() }
                 factory { params ->
-                    val agentProviderName: String = params.get()
+                    StartViewModel(
+                        navigationCallback = params[0],
+                    )
+                }
+                factory { params ->
+                    SettingsViewModel(
+                        navigationCallback = params[0],
+                        appSettings = get(),
+                    )
+                }
+                factory { params ->
+                    val agentProviderName: String = params[1]
                     val agentProvider: AgentProvider = koin.get(named(agentProviderName))
-                    AgentDemoViewModel(agentProvider = agentProvider)
+                    AgentDemoViewModel(
+                        navigationCallback = params[0],
+                        agentProvider = agentProvider
+                    )
                 }
             }
         )

examples/demo-compose-app/commonApp/src/commonMain/kotlin/com/jetbrains/example/koog/compose/screens/agentdemo/AgentDemoNavigationCallback.kt

@@ -0,0 +1,5 @@
+package com.jetbrains.example.koog.compose.screens.agentdemo
+
+interface AgentDemoNavigationCallback {
+    fun goBack()
+}