Refactoring Country Data (#32)

* Refactoring Country Data

* cleanups

* upgrade AGP

* improved color handling for clear icon, add label to demo

* upgrade compose, add missing hints

* detekt

* upgrade sonar

* optimizations

* use remember / derivedStateOf to minimize recomposition when searching

Author: hbmartin

.github/workflows/documentation.yml

@@ -2,7 +2,8 @@ name: Publish Dokka HTML to GitHub Pages
 
 on:
   push:
-    branches: [ master ]
+    tags:
+      - '*'
 
 jobs:
   build:

README.md

@@ -3,6 +3,7 @@
 [![Android CI](https://github.com/jump-sdk/jetpack_compose_country_code_picker_emoji/actions/workflows/android.yml/badge.svg)](https://github.com/jump-sdk/jetpack_compose_country_code_picker_emoji/actions/workflows/android.yml)
 [![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=jump-sdk_jetpack_compose_country_code_picker_emoji&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=jump-sdk_jetpack_compose_country_code_picker_emoji)
 [![Jitpack](https://jitpack.io/v/jump-sdk/jetpack_compose_country_code_picker_emoji.svg)](https://jitpack.io/#jump-sdk/jetpack_compose_country_code_picker_emoji)
+[![Documentation](https://img.shields.io/badge/Documentation-3d3d41?logo=kotlin)](https://jump-sdk.github.io/jetpack_compose_country_code_picker_emoji/)
 
 * 😍 Emoji flag icons - beautiful and minimizes library size
 * 🤔 Country numbers hints (option to disable)
@@ -28,6 +29,7 @@
 
 
 See [MainActivity in the sample app](https://github.com/jump-sdk/jetpack_compose_country_code_picker_emoji/blob/master/app/src/main/java/com/togitech/togii/MainActivity.kt) for a full example.
+Also check out the [ComposeCountryCodePicker documentation](https://jump-sdk.github.io/jetpack_compose_country_code_picker_emoji/) for all available composables and utilities.
 
 ```kotlin 
         TogiCountryCodePicker(
@@ -87,7 +89,7 @@ Step 2. Add the dependency
 
 ```kotlin 
 	dependencies {
-	    implementation("com.github.jump-sdk:jetpack_compose_country_code_picker_emoji:2.0.8")
+	    implementation("com.github.jump-sdk:jetpack_compose_country_code_picker_emoji:2.2.0")
 	}  
 ```
 

app/src/main/AndroidManifest.xml

@@ -7,7 +7,8 @@
         android:label="@string/app_name"
         android:roundIcon="@mipmap/ic_launcher_round"
         android:supportsRtl="true"
-        android:theme="@style/Theme.Togii">
+        android:theme="@style/Theme.Togii"
+        android:usesCleartextTraffic="false">
         <activity
             android:name=".MainActivity"
             android:exported="true"

app/src/main/java/com/togitech/togii/MainActivity.kt

@@ -8,7 +8,9 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.MaterialTheme
@@ -30,7 +32,6 @@ import com.togitech.ccp.component.TogiCountryCodePicker
 import com.togitech.togii.ui.theme.TogiiTheme
 
 class MainActivity : ComponentActivity() {
-
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContent {
@@ -74,12 +75,14 @@ fun CountryCodePick() {
         Spacer(modifier = Modifier.height(100.dp))
 
         TogiCountryCodePicker(
+            modifier = Modifier.fillMaxWidth().padding(horizontal = 10.dp),
             onValueChange = { (code, phone), isValid ->
                 Log.d("CCP", "onValueChange: $code $phone -> $isValid")
                 phoneNumber.value = phone
                 fullPhoneNumber.value = code + phone
                 isNumberValid = isValid
             },
+            label = { Text("Test Label") },
         )
         Spacer(modifier = Modifier.height(10.dp))
 

build.gradle.kts

@@ -3,7 +3,7 @@ plugins {
     id("com.android.library") version libs.versions.android.gradle.plugin apply false
     id("org.jetbrains.kotlin.android") version libs.versions.kotlin apply false
     id("org.jetbrains.dokka") version libs.versions.dokka
-    id("org.sonarqube") version "4.3.1.3277"
+    id("org.sonarqube") version "4.4.0.3356"
     alias(libs.plugins.gradleVersions)
 }
 
@@ -12,7 +12,7 @@ sonarqube {
         property("sonar.projectKey", "jump-sdk_jetpack_compose_country_code_picker_emoji")
         property("sonar.organization", "jump-sdk")
         property("sonar.host.url", "https://sonarcloud.io")
-        property("sonar.kotlin.source.version", "1.9.10")
+        property("sonar.kotlin.source.version", libs.versions.kotlin.get())
         property("sonar.pullrequest.github.summary_comment", "true")
     }
 }

ccp/build.gradle.kts

@@ -7,9 +7,6 @@ plugins {
     id("app.cash.paparazzi") version libs.versions.paparazzi.get()
 }
 
-group "com.togitech"
-version "2.0.5"
-
 kotlin {
     jvmToolchain(17)
 }
@@ -81,7 +78,7 @@ afterEvaluate {
                 from(components.getByName("release"))
                 groupId = "com.togisoft"
                 artifactId = "jetpack_country_code_picker"
-                version = "2.0.5"
+                version = "2.2.0"
             }
         }
     }

ccp/src/main/java/com/togitech/ccp/component/CountryDialog.kt

@@ -1,6 +1,5 @@
 package com.togitech.ccp.component
 
-import android.content.Context
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -26,8 +25,10 @@ import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Clear
 import androidx.compose.material.icons.filled.Search
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
@@ -47,31 +48,49 @@ import androidx.compose.ui.unit.sp
 import androidx.compose.ui.window.Dialog
 import com.togitech.ccp.R
 import com.togitech.ccp.data.CountryData
-import com.togitech.ccp.data.utils.countryCodeToEmojiFlag
 import com.togitech.ccp.data.utils.countryNames
-import com.togitech.ccp.data.utils.getLibCountries
-import com.togitech.ccp.utils.searchCountry
+import com.togitech.ccp.data.utils.emojiFlag
+import com.togitech.ccp.data.utils.searchCountry
 import kotlinx.collections.immutable.ImmutableList
 import kotlinx.collections.immutable.toImmutableList
 
-private val DEFAULT_ROUNDING = 10.dp
+internal val DEFAULT_ROUNDING = 10.dp
 private val DEFAULT_ROW_PADDING = 16.dp
 private const val ROW_PADDING_VERTICAL_SCALING = 1.1f
 private val DEFAULT_ROW_FONT_SIZE = 16.sp
 private val SEARCH_ICON_PADDING = 5.dp
 
-@Suppress("ModifierDefaultValue")
+/**
+ * @param onDismissRequest Executes when the user tries to dismiss the dialog.
+ * @param onSelect Executes when the user selects a country from the list.
+ * @param countryList The list of countries to display in the dialog.
+ * @param modifier The modifier to be applied to the dialog surface.
+ * @param rowPadding The padding to be applied to each row.
+ * @param rowFontSize The font size to be applied to each row.
+ */
 @Composable
-internal fun CountryDialog(
+fun CountryDialog(
     onDismissRequest: () -> Unit,
     onSelect: (item: CountryData) -> Unit,
-    filteredCountryList: ImmutableList<CountryData>,
-    context: Context,
-    modifier: Modifier = Modifier.fillMaxWidth().clip(RoundedCornerShape(DEFAULT_ROUNDING)),
+    countryList: ImmutableList<CountryData>,
+    modifier: Modifier = Modifier,
     rowPadding: Dp = DEFAULT_ROW_PADDING,
     rowFontSize: TextUnit = DEFAULT_ROW_FONT_SIZE,
 ) {
+    val context = LocalContext.current
     var searchValue by rememberSaveable { mutableStateOf("") }
+    val filteredCountries by remember(context, searchValue) {
+        derivedStateOf {
+            if (searchValue.isEmpty()) {
+                countryList
+            } else {
+                countryList.searchCountry(
+                    searchValue,
+                    context,
+                )
+            }
+        }
+    }
 
     Dialog(
         onDismissRequest = onDismissRequest,
@@ -101,16 +120,7 @@ internal fun CountryDialog(
                     Spacer(modifier = Modifier.height(DEFAULT_ROW_PADDING))
                     Divider()
                     LazyColumn {
-                        items(
-                            if (searchValue.isEmpty()) {
-                                filteredCountryList
-                            } else {
-                                filteredCountryList.searchCountry(
-                                    searchValue,
-                                    context,
-                                )
-                            },
-                        ) { countryItem ->
+                        items(filteredCountries, key = { it.countryIso }) { countryItem ->
                             CountryRowItem(
                                 rowPadding = rowPadding,
                                 onSelect = { onSelect(countryItem) },
@@ -167,10 +177,10 @@ private fun CountryRowItem(
         verticalAlignment = Alignment.CenterVertically,
     ) {
         Text(
-            text = countryCodeToEmojiFlag(countryItem.countryCode) + "  " +
+            text = countryItem.emojiFlag + "  " +
                 stringResource(
                     id = countryNames.getOrDefault(
-                        countryItem.countryCode.lowercase(),
+                        countryItem.countryIso,
                         R.string.unknown,
                     ),
                 ),
@@ -231,8 +241,8 @@ private fun SearchTextField(
 private fun CountryDialogPreview() {
     CountryDialog(
         onSelect = {},
-        context = LocalContext.current,
-        filteredCountryList = getLibCountries.toImmutableList(),
+        countryList = CountryData.entries.toImmutableList(),
         onDismissRequest = {},
+        modifier = Modifier.fillMaxWidth().clip(RoundedCornerShape(DEFAULT_ROUNDING)),
     )
 }