Flocon

https://openflocon.github.io/Flocon/
Admin
Flocon is a lightweight debugging and inspection tool built with Kotlin Multiplatform and Compose...
Tokens:14,610
Snippets:183
Trust Score:9.7
Update:1 month ago
Show doc for...
Tokens:
Raw
### Configure Coil 3 ImageLoader with OkHttp network fetcher

Source: https://openflocon.github.io/Flocon/image

Configure a SingletonImageLoader using Coil 3 with a Flocon-enabled OkHttp client. This setup is needed when using Coil to display downloaded images.

```kotlin
SingletonImageLoader.setSafe {
    ImageLoader.Builder(context = context)
        .components {
            add(
                coil3.network.okhttp.OkHttpNetworkFetcherFactory(
                    callFactory = { okHttpClient }, // okHttpClient configured with FloconOkhttpInterceptor
                )
            )
        }
        .build()
}

```

--------------------------------

### Setup OkHttp client with FloconOkhttpInterceptor

Source: https://openflocon.github.io/Flocon/graphql

Attach FloconOkhttpInterceptor to the OkHttpClient to intercept GraphQL network calls. The client is then passed to ApolloClient.Builder for use.

```kotlin
val okHttpClient = OkHttpClient.Builder()
    .addInterceptor(FloconOkhttpInterceptor())
    .build()

val apolloClient = ApolloClient.Builder()
    .serverUrl("https://your-api.com/graphql")
    .okHttpClient(okHttpClient)
    .build()

```

--------------------------------

### Kotlin/JVM desktop database registration using absolutePath

Source: https://openflocon.github.io/Flocon/database

Registers a database file on the JVM desktop by providing an absolute path. Example uses java.io.tmpdir for a temp file and calls floconRegisterDatabase with absolutePath.

```kotlin
val dbFile = File(System.getProperty("java.io.tmpdir"), "app_database.db")

floconRegisterDatabase(
    displayName = "App DB",
    absolutePath = dbFile.absolutePath,
)
```

--------------------------------

### Configure Ktor with FloconKtorPlugin

Source: https://openflocon.github.io/Flocon/bad-quality?q=

Install the FloconKtorPlugin into your Ktor HttpClient to enable network simulation for Kotlin Multiplatform applications.

```kotlin
val httpClient = HttpClient {
    install(FloconKtorPlugin)
}
```

--------------------------------

### Implement custom FloconPreference for proprietary storage

Source: https://openflocon.github.io/Flocon/sharedpref

Shows how to implement the FloconPreference interface to expose custom key-value storage like EncryptedSharedPreferences. Override columns(), get(), and set() to integrate with Flocon, then register the instance.

```kotlin
class MyCustomPreference : FloconPreference {
    override val name: String = "Encrypted Vault"

    override suspend fun columns(): List<String> = listOf("token", "is_authenticated")

    override suspend fun get(columnName: String): FloconPreferenceValue? {
        return FloconPreferenceValue(stringValue = readSecureKey(columnName))
    }

    override suspend fun set(columnName: String, value: FloconPreferenceValue) {
        writeSecureKey(columnName, value.stringValue)
    }
}

floconRegisterPreference(MyCustomPreference())
```

--------------------------------

### Log events with floconAnalytics

Source: https://openflocon.github.io/Flocon/analytics

Logs individual or batched events by stream name using the floconAnalytics API. The example shows an AnalyticsEvent with event name and properties.

```kotlin
floconAnalytics("firebase").logEvents(
    AnalyticsEvent(
        eventName = "button_clicked",
        "button_id" analyticsProperty "checkout_pay",
        "cart_total" analyticsProperty "49.99",
        "currency" analyticsProperty "EUR"
    )
)

```

--------------------------------

### Initialize Flocon on Desktop

Source: https://openflocon.github.io/Flocon/setup

Initializes Flocon for a Compose Desktop application in the main function.

```kotlin
fun main() {
    // Initialize Flocon for Desktop
    Flocon.initialize()

    // Launch your Compose Desktop application
}

```

--------------------------------

### Configure Full Protobuf dependencies

Source: https://openflocon.github.io/Flocon/grpc

Use this configuration if your project requires the full Protobuf implementation instead of the lite variant.

```gradle
dependencies {
    implementation("com.google.protobuf:protobuf-kotlin:$PROTOBUF_VERSION")

    debugImplementation("io.github.openflocon:flocon-grpc-interceptor:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-grpc-interceptor-no-op:LAST_VERSION")
}
```

--------------------------------

### KMP iOS registration with document directory path

Source: https://openflocon.github.io/Flocon/database

Registers a database on iOS Kotlin Multiplatform using an absolute path constructed from the document directory.

```kotlin
val dbPath = "${documentDirectory()}/app_database.db"

floconRegisterDatabase(
    displayName = "App DB",
    absolutePath = dbPath
)
```

--------------------------------

### Initialize Flocon on iOS

Source: https://openflocon.github.io/Flocon/setup

Initializes Flocon for an iOS Simulator in a Kotlin Multiplatform context.

```kotlin
fun initFlocon() {
    // Initialize Flocon for iOS Simulator
    Flocon.initialize()
}

```

--------------------------------

### Register Jetpack DataStore with Flocon

Source: https://openflocon.github.io/Flocon/sharedpref

Creates a DataStore instance and registers it with Flocon using floconRegisterPreference and FloconDatastorePreference. The preferencesDataStore delegate is used to create the DataStore.

```kotlin
val Context.dataStore by preferencesDataStore(name = "settings")

// Register with Flocon
floconRegisterPreference(FloconDatastorePreference(name = "App Settings", context.dataStore))
```

--------------------------------

### Add OkHttp dependencies in build.gradle.kts

Source: https://openflocon.github.io/Flocon/network

Apply the interceptor for debug builds and the no-op version for release builds.

```kotlin
dependencies {
    debugImplementation("io.github.openflocon:flocon-okhttp-interceptor:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-okhttp-interceptor-no-op:LAST_VERSION")
}
```

--------------------------------

### Add Flocon DataStore dependencies

Source: https://openflocon.github.io/Flocon/sharedpref

Adds the Flocon DataStore libraries to your version catalog and build.gradle.kts. Use debugImplementation for the main library and releaseImplementation for the no-op variant to avoid overhead in release builds.

```toml
[libraries]
flocon-datastores = { module = "io.github.openflocon:flocon-datastores", version.ref = "flocon" }
flocon-datastores-no-op = { module = "io.github.openflocon:flocon-datastores-no-op", version.ref = "flocon" }
```

```kotlin
dependencies {
    debugImplementation("io.github.openflocon:flocon-datastores:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-datastores-no-op:LAST_VERSION")
}
```

--------------------------------

### Define a static dashboard with floconDashboard

Source: https://openflocon.github.io/Flocon/dashboard?q=

Creates a static dashboard with a section containing text, label, and button components. The button triggers a callback to clear the image cache.

```kotlin
floconDashboard(id = "main") {
    section(name = "App Status") {
        text(label = "Environment", value = "Staging")
        label(label = "Build: #142")
        button(
            text = "Clear Image Cache",
            onClick = { clearImageCache() }
        )
    }
}
```

--------------------------------

### Configure OkHttp with FloconInterceptor

Source: https://openflocon.github.io/Flocon/bad-quality?q=

Add the FloconOkhttpInterceptor to your OkHttpClient builder to enable network simulation for Android applications using OkHttp.

```kotlin
val okHttpClient = OkHttpClient.Builder()
    .addInterceptor(FloconOkhttpInterceptor())
    .build()
```

--------------------------------

### Configure Protobuf Lite dependencies

Source: https://openflocon.github.io/Flocon/grpc

Recommended for Android projects, this configuration uses the lite variant of Protobuf and the corresponding Flocon interceptor.

```gradle
dependencies {
    implementation("com.google.protobuf:protobuf-kotlin-lite:$PROTOBUF_VERSION")

    debugImplementation("io.github.openflocon:flocon-grpc-interceptor-lite:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-grpc-interceptor-lite-no-op:LAST_VERSION")
}
```

--------------------------------

### Initialize Flocon on Android

Source: https://openflocon.github.io/Flocon/setup

Initializes Flocon in an Android Application class, passing the Android Context. Call this as early as possible in the application lifecycle.

```kotlin
class MyApp : Application() {
    override fun onCreate() {
        super.onCreate()

        // Initializes Flocon with Android Context
        Flocon.initialize(this)
    }
}

```

--------------------------------

### Add Flocon dependencies in KMP build.gradle.kts

Source: https://openflocon.github.io/Flocon/setup?q=

Configure dependencies for a Kotlin Multiplatform project in the commonMain source set.

```kotlin
kotlin {
    sourceSets {
        commonMain.dependencies {
            implementation("io.github.openflocon:flocon:LAST_VERSION")
        }
    }
}
```

--------------------------------

### Manual database query logging

Source: https://openflocon.github.io/Flocon/database

Logs a single query manually via floconLogDatabaseQuery, passing the database name, SQL string, and a list of bind arguments (here an integer).

```kotlin
floconLogDatabaseQuery(
    dbName = "my_custom_db",
    sqlQuery = "SELECT * FROM users WHERE id = ?",
    bindArgs = listOf(42)
)
```

--------------------------------

### Add Flocon dependencies with version catalog

Source: https://openflocon.github.io/Flocon/setup

Adds Flocon dependencies via version catalog (libs.versions.toml) and applies them in the module's build.gradle.kts. The debugImplementation uses the active SDK while releaseImplementation uses the no-op placeholder.

```toml
[versions]
flocon = "LAST_VERSION" # Replace with latest release

[libraries]
flocon = { module = "io.github.openflocon:flocon", version.ref = "flocon" }
flocon-no-op = { module = "io.github.openflocon:flocon-no-op", version.ref = "flocon" }

```

```kotlin
dependencies {
    debugImplementation(libs.flocon)
    releaseImplementation(libs.flocon.no.op)
}

```

--------------------------------

### Log incoming WebSocket frames with OkHttp listenWithFlocon

Source: https://openflocon.github.io/Flocon/websocket

Wraps a WebSocketListener to record all incoming frames in Flocon. The id parameter should identify the WebSocket endpoint.

```kotlin
val request = Request.Builder()
    .url("wss://your-websocket-endpoint.com")
    .build()

val myListener = object : WebSocketListener() {
    override fun onMessage(webSocket: WebSocket, text: String) {
        // Your handler
    }
}

// Wraps the listener to record all incoming frames in Flocon
val webSocket = client.newWebSocket(
    request,
    myListener.listenWithFlocon(id = "wss://your-websocket-endpoint.com")
)
```

--------------------------------

### Create a multi-input form with floconDashboard

Source: https://openflocon.github.io/Flocon/dashboard?q=

Groups textField and checkBox inputs into a form with a single submission action. The onSubmitted callback retrieves values by ID and applies the new configuration.

```kotlin
floconDashboard(id = "settings") {
    form(
        name = "Server Configuration",
        submitText = "Apply Settings",
        onSubmitted = { values ->
            val host = values["host_input"]
            val mockMode = values["mock_mode"]
            applyNewConfig(host, mockMode)
        }
    ) {
        textField(id = "host_input", label = "API Host", value = "https://staging.api.com")
        checkBox(id = "mock_mode", label = "Enable Mock Mode", value = false)
    }
}
```

--------------------------------

### Room setQueryCallback to log database queries

Source: https://openflocon.github.io/Flocon/database

Integrates Flocon logging into Room using setQueryCallback so every executed query is sent to floconLogDatabaseQuery, using a single-thread executor for the callback.

```kotlin
val dbName = "dogs_database"
val database = Room.databaseBuilder(
    context.applicationContext,
    DogDatabase::class.java,
    dbName
).setQueryCallback({ sqlQuery, bindArgs -> 
    floconLogDatabaseQuery(
        dbName = dbName, 
        sqlQuery = sqlQuery, 
        bindArgs = bindArgs
    ) 
}, Executors.newSingleThreadExecutor())
.build()
```

--------------------------------

### Add Flocon dependencies in libs.versions.toml

Source: https://openflocon.github.io/Flocon/setup?q=

Define the Flocon version and library modules in your version catalog.

```toml
[versions]
flocon = "LAST_VERSION" # Replace with latest release

[libraries]
flocon = { module = "io.github.openflocon:flocon", version.ref = "flocon" }
flocon-no-op = { module = "io.github.openflocon:flocon-no-op", version.ref = "flocon" }
```

--------------------------------

### Add Flocon dependencies in Android build.gradle.kts

Source: https://openflocon.github.io/Flocon/setup?q=

Configure dependencies in your module build file using the version catalog.

```kotlin
dependencies {
    debugImplementation(libs.flocon)
    releaseImplementation(libs.flocon.no.op)
}
```

--------------------------------

### adb devices: Verify ADB connectivity

Source: https://openflocon.github.io/Flocon/troubleshooting?q=

Lists connected devices. If a device shows 'unauthorized', check the phone screen for the USB debugging authorization prompt.

```bash
adb devices

```

--------------------------------

### Verify ADB Device Connectivity

Source: https://openflocon.github.io/Flocon/troubleshooting

Run this command to check if your Android device is detected by ADB. If the status is unauthorized, check the device screen for an authorization prompt.

```bash
adb devices
```

--------------------------------

### OkHttp: Add Flocon dependencies in libs.versions.toml

Source: https://openflocon.github.io/Flocon/network?q=

Declares the Flocon OkHttp interceptor and its no-op variant in the version catalog. Use the no-op for release builds to avoid overhead.

```toml
[libraries]
flocon-okhttp = { module = "io.github.openflocon:flocon-okhttp-interceptor", version.ref = "flocon" }
flocon-okhttp-no-op = { module = "io.github.openflocon:flocon-okhttp-interceptor-no-op", version.ref = "flocon" }

```

--------------------------------

### Ktor: Add Flocon dependencies in libs.versions.toml

Source: https://openflocon.github.io/Flocon/network?q=

Declares the Flocon Ktor interceptor and its no-op variant in the version catalog.

```toml
[libraries]
flocon-ktor = { module = "io.github.openflocon:flocon-ktor-interceptor", version.ref = "flocon" }
flocon-ktor-no-op = { module = "io.github.openflocon:flocon-ktor-interceptor-no-op", version.ref = "flocon" }

```

--------------------------------

### OkHttp: Add Flocon dependencies in build.gradle.kts

Source: https://openflocon.github.io/Flocon/network?q=

Adds the Flocon OkHttp interceptor for debug builds and the no-op variant for release builds. Replace LAST_VERSION with the actual version.

```kotlin
dependencies {
    debugImplementation("io.github.openflocon:flocon-okhttp-interceptor:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-okhttp-interceptor-no-op:LAST_VERSION")
}

```

--------------------------------

### network_security_config.xml: Allow cleartext to localhost

Source: https://openflocon.github.io/Flocon/troubleshooting?q=

Permits cleartext traffic to localhost and 127.0.0.1. Required for Flocon Desktop to intercept network traffic from the app.

```xml
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
        <domain includeSubdomains="true">127.0.0.1</domain>
    </domain-config>
</network-security-config>

```

--------------------------------

### Add Full Protobuf dependencies for gRPC Inspector

Source: https://openflocon.github.io/Flocon/grpc?q=

Use this Gradle configuration for Android projects using protobuf-kotlin. It adds the full interceptor for debug builds and a no-op variant for release builds.

```groovy
dependencies {
    implementation("com.google.protobuf:protobuf-kotlin:$PROTOBUF_VERSION")

    debugImplementation("io.github.openflocon:flocon-grpc-interceptor:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-grpc-interceptor-no-op:LAST_VERSION")
}

```

--------------------------------

### Flocon Architecture Sequence Diagram

Source: https://openflocon.github.io/Flocon

A Mermaid sequence diagram illustrating the communication flow between the developer, the KMP application, the Flocon SDK, the bridge, and the desktop UI.

```mermaid
sequenceDiagram
    autonumber
    actor Dev as Developer
    participant App as Mobile / KMP App
    participant SDK as Flocon SDK (~140KB)
    participant Bridge as ADB / Localhost Bridge
    participant Desktop as Flocon Desktop UI

    Dev->>App: Interacts with App
    App->>SDK: Network Request / DB Query / Event
    SDK->>Bridge: Stream telemetry over Socket
    Bridge->>Desktop: Live visual update
    Dev->>Desktop: Edits Prefs / Mocks Network / Triggers Deeplink
    Desktop->>Bridge: Send Command
    Bridge->>SDK: Execute in App runtime
    SDK-->>App: Mutates state / Injects response
```

--------------------------------

### Track real-time user actions with floconTable

Source: https://openflocon.github.io/Flocon/table

Use floconTable("user_actions") inside a function to log user actions with timestamp, user name, and action. Each .log() invocation appends a row with real-time updates.

```kotlin
fun onUserAction(user: User, action: String) {
    floconTable("user_actions").log(
        "timestamp" toParam System.currentTimeMillis().toString(),
        "user" toParam user.name,
        "action" toParam action
    )
}
```

--------------------------------

### Log a row into a named table with floconTable

Source: https://openflocon.github.io/Flocon/table

Call floconTable("active_sessions") and pass columns using the toParam DSL. Each .log() invocation appends a row with real-time updates.

```kotlin
floconTable("active_sessions").log(
    "user_id" toParam "1024",
    "name" toParam "Raphael",
    "status" toParam "Active",
    "last_seen" toParam "2026-08-14 17:30"
)
```

--------------------------------

### Kotlin code for in-memory Room database registration

Source: https://openflocon.github.io/Flocon/database

Registers in-memory Room database (DogDatabase) with a custom display name 

```kotlin
val dogDatabase = Room.inMemoryDatabaseBuilder(context, DogDatabase::class.java).build()

floconRegisterDatabase(
    displayName = "In-Memory Dogs",
    openHelper = dogDatabase.openHelper
)
```

--------------------------------

### Add Protobuf Lite dependencies for gRPC Inspector

Source: https://openflocon.github.io/Flocon/grpc?q=

Use this Gradle configuration for Android projects using protobuf-kotlin-lite. It adds the lite interceptor for debug builds and a no-op variant for release builds.

```groovy
dependencies {
    implementation("com.google.protobuf:protobuf-kotlin-lite:$PROTOBUF_VERSION")

    debugImplementation("io.github.openflocon:flocon-grpc-interceptor-lite:LAST_VERSION")
    releaseImplementation("io.github.openflocon:flocon-grpc-interceptor-lite-no-op:LAST_VERSION")
}

```

--------------------------------

### Register custom SharedPreferences with Flocon

Source: https://openflocon.github.io/Flocon/sharedpref

Registers a custom SharedPreferences file with a display name using floconRegisterPreference and FloconSharedPreference. The context.getSharedPreferences call creates or retrieves the 'user_pref' file.

```kotlin
val userPrefs = context.getSharedPreferences("user_pref", Context.MODE_PRIVATE)
floconRegisterPreference(FloconSharedPreference(name = "User Settings", userPrefs))
```

--------------------------------

### gRPC (Android) - Add FloconGrpcInterceptor

Source: https://openflocon.github.io/Flocon/bad-quality

Adds the Flocon gRPC interceptor to a ManagedChannel for Android to enable bad network simulation.

```kotlin
val channel = ManagedChannelBuilder.forAddress(host, port)
    .intercept(FloconGrpcInterceptor())
    .build()

```

--------------------------------

### Forward app tracking calls to Flocon and Firebase with AnalyticsTracker

Source: https://openflocon.github.io/Flocon/analytics?q=

Wraps FirebaseAnalytics so every track call is forwarded to Flocon Desktop via floconAnalytics("app_telemetry").logEvents and to Firebase via firebaseAnalytics.logEvent. Parameters are converted to strings for both destinations.

```kotlin
class AnalyticsTracker(private val firebaseAnalytics: FirebaseAnalytics) {

    fun track(event: String, parameters: Map<String, Any> = emptyMap()) {
        // 1. Forward to Flocon Desktop
        floconAnalytics("app_telemetry").logEvents(
            AnalyticsEvent(
                eventName = event,
                parameters.map { it.key analyticsProperty it.value.toString() }
            )
        )

        // 2. Forward to Firebase
        val bundle = Bundle().apply {
            parameters.forEach { (k, v) -> putString(k, v.toString()) }
        }
        firebaseAnalytics.logEvent(event, bundle)
    }
}


```

--------------------------------

### AndroidManifest.xml: Enable network security config

Source: https://openflocon.github.io/Flocon/troubleshooting?q=

Declares the network security configuration in the Android manifest. Required when using a custom networkSecurityConfig to allow cleartext traffic to localhost.

```xml
<application
    android:name=".MyApp"
    android:networkSecurityConfig="@xml/network_security_config"
    ... >
</application>

```

--------------------------------

### Add Flocon dependencies for Android

Source: https://openflocon.github.io/Flocon/setup

Adds Flocon dependencies directly in build.gradle.kts for Android-only projects. Uses debugImplementation for the active SDK and releaseImplementation for the no-op placeholder.

```kotlin
dependencies {
    // Active in debug builds
    debugImplementation("io.github.openflocon:flocon:LAST_VERSION")

    // No-op placeholder in release builds
    releaseImplementation("io.github.openflocon:flocon-no-op:LAST_VERSION")
}

```

--------------------------------

### Attach FloconGrpcInterceptor to ManagedChannelBuilder

Source: https://openflocon.github.io/Flocon/grpc

Register the Flocon interceptor to the ManagedChannelBuilder to enable gRPC inspection.

```kotlin
val channel = ManagedChannelBuilder.forAddress(host, port)
    .intercept(FloconGrpcInterceptor())
    .build()
```

--------------------------------

### Log outgoing WebSocket message with OkHttp sendWithFlocon

Source: https://openflocon.github.io/Flocon/websocket

Use this snippet to send a WebSocket message and simultaneously log it to Flocon. The message payload is wrapped in escaped quotes as shown.

```kotlin
// Sends the message and simultaneously logs it to Flocon
webSocket.sendWithFlocon("\"$messagePayload\"")
```

--------------------------------

### Ktor: Add Flocon dependency in build.gradle.kts

Source: https://openflocon.github.io/Flocon/network?q=

Adds the Flocon Ktor interceptor to the commonMain source set. Replace LAST_VERSION with the actual version.

```kotlin
kotlin {
    sourceSets {
        commonMain.dependencies {
            implementation("io.github.openflocon:flocon-ktor-interceptor:LAST_VERSION")
        }
    }
}

```

--------------------------------

### Configure Android Network Security for Flocon

Source: https://openflocon.github.io/Flocon/troubleshooting

Update AndroidManifest.xml and network_security_config.xml to permit cleartext traffic to localhost, enabling Flocon to intercept app traffic.

```xml
<application
    android:name=".MyApp"
    android:networkSecurityConfig="@xml/network_security_config"
    ... >
</application>
```

```xml
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">localhost</domain>
        <domain includeSubdomains="true">127.0.0.1</domain>
    </domain-config>
</network-security-config>
```

--------------------------------

### Forward analytics events to Flocon and Firebase

Source: https://openflocon.github.io/Flocon/analytics

Shows a generic AnalyticsTracker class that forwards tracking calls to Flocon Desktop and Firebase. It uses floconAnalytics to log events and FirebaseAnalytics.logEvent for Firebase.

```kotlin
class AnalyticsTracker(private val firebaseAnalytics: FirebaseAnalytics) {

    fun track(event: String, parameters: Map<String, Any> = emptyMap()) {
        // 1. Forward to Flocon Desktop
        floconAnalytics("app_telemetry").logEvents(
            AnalyticsEvent(
                eventName = event,
                parameters.map { it.key analyticsProperty it.value.toString() }
            )
        )

        // 2. Forward to Firebase
        val bundle = Bundle().apply {
            parameters.forEach { (k, v) -> putString(k, v.toString()) }
        }
        firebaseAnalytics.logEvent(event, bundle)
    }
}

```

--------------------------------

### Defining Deeplinks in Kotlin

Source: https://openflocon.github.io/Flocon/deeplink?q=

Use the Flocon.deeplinks block to define routes, variables, and autocomplete suggestions for your Android application's deeplinks.

```kotlin
Flocon.deeplinks {
    variable("host") {
        description = "Host scheme/domain"
        autoComplete(listOf("flocon", "myapp"))
    }

    variable("sample_comment")

    deeplink("[host]://home") {
        "host" withVariable "host"
    }

    deeplink("[host]://user/[userId]") {
        label = "User Profile"
        "userId" withAutoComplete listOf("101", "202", "303")
        "host" withVariable "host"
    }

    deeplink("[host]://post/[postId]?comment=[commentText]") {
        label = "Post Detail"
        description = "Opens a post and pre-fills comment text"
        "postId" withAutoComplete listOf("1", "2", "3")
        "commentText" withVariable "sample_comment"
        "host" withVariable "host"
    }
}
```

--------------------------------

### Log incoming WebSocket frame manually with floconLogWebSocketEvent

Source: https://openflocon.github.io/Flocon/websocket

Use this snippet to manually log an incoming WebSocket frame when using custom or multiplatform WebSocket implementations. The event type is ReceiveMessage.

```kotlin
floconLogWebSocketEvent(
    FloconWebSocketEvent(
        websocketUrl = "wss://api.example.com/ws",
        event = FloconWebSocketEvent.Event.ReceiveMessage,
        message = incomingText,
    )
)
```

--------------------------------

### Add Flocon dependency for Kotlin Multiplatform

Source: https://openflocon.github.io/Flocon/setup

Adds the Flocon dependency to the commonMain source set for Kotlin Multiplatform projects.

```kotlin
kotlin {
    sourceSets {
        commonMain.dependencies {
            implementation("io.github.openflocon:flocon:LAST_VERSION")
        }
    }
}

```

--------------------------------

### Log analytics events by stream name with floconAnalytics("firebase").logEvents

Source: https://openflocon.github.io/Flocon/analytics?q=

Logs a single AnalyticsEvent with an eventName and key-value properties using the analyticsProperty infix. Use this to verify tracking payloads in Flocon Desktop; events can be logged individually or batched by stream name.

```kotlin
floconAnalytics("firebase").logEvents(
    AnalyticsEvent(
        eventName = "button_clicked",
        "button_id" analyticsProperty "checkout_pay",
        "cart_total" analyticsProperty "49.99",
        "currency" analyticsProperty "EUR"
    )
)


```

--------------------------------

### Remove quarantine flag with xattr

Source: https://openflocon.github.io/Flocon/macos-install

Run this command in Terminal to remove the quarantine attribute from Flocon.app, bypassing Gatekeeper's security prompt.

```bash
xattr -cr /Applications/Flocon.app

```

--------------------------------

### Log outgoing WebSocket frame manually with floconLogWebSocketEvent

Source: https://openflocon.github.io/Flocon/websocket

Use this snippet to manually log an outgoing WebSocket frame when using custom or multiplatform WebSocket implementations. The event type is SendMessage.

```kotlin
floconLogWebSocketEvent(
    FloconWebSocketEvent(
        websocketUrl = "wss://api.example.com/ws",
        event = FloconWebSocketEvent.Event.SendMessage,
        message = outgoingText,
    )
)
```

--------------------------------

### Define a reactive dashboard bound to a Flow

Source: https://openflocon.github.io/Flocon/dashboard?q=

Binds a dashboard section to a Kotlin Flow or StateFlow. The UI updates automatically when new data is emitted. Includes text, textField, and checkBox components that interact with a userViewModel.

```kotlin
floconDashboard(id = "user_dashboard") {
    section(name = "Active User", userFlow) { user ->
        text(label = "User ID", value = user.id)
        text(label = "Email", value = user.email)

        textField(
            label = "Display Name",
            value = user.displayName,
            onSubmitted = { newName ->
                userViewModel.updateName(newName)
            }
        )

        checkBox(
            label = "Beta Features Enabled",
            value = user.isBeta,
            onUpdated = { isEnabled ->
                userViewModel.setBeta(isEnabled)
            }
        )
    }
}
```
Tokens:
Raw