implemented searchBar on Any Specific list, completed..

app/src/main/java/com/vpn/fastestvpnservice/customItems/ServerItem.kt

@@ -574,6 +574,90 @@ fun ServerSearchItem(
     }
 }
 
+@Composable
+fun ServerSpecificItem(
+    server: Server,
+    navHostController: NavHostController,
+    onServerDisable: () -> Unit
+) {
+    val context = LocalContext.current
+    val scope = rememberCoroutineScope()
+    val basePreferenceHelper = BasePreferenceHelper(context)
+    val serverListViewModel: ServerListViewModel = viewModel {
+        ServerListViewModel(context = context)
+    }
+    val splashViewModel: SplashViewModel = viewModel{
+        SplashViewModel(context)
+    }
+    val searchListViewModel: SearchListViewModel = viewModel{
+        SearchListViewModel(context, serverListViewModel, splashViewModel)
+    }
+    val homeViewModel: HomeViewModel = viewModel{
+        HomeViewModel(context, scope)
+    }
+    var isSearchServerClicked by remember {
+        mutableStateOf(false)
+    }
+
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .background(color = MaterialTheme.colorScheme.background)
+            .padding(bottom = 1.dp)
+    ) {
+
+        Row(
+            verticalAlignment = Alignment.Top,
+            horizontalArrangement = Arrangement.Start,
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(start = 12.dp, end = 7.dp, top = 12.dp)
+                .clickable(
+                    indication = null,
+                    interactionSource = remember { MutableInteractionSource() }
+                ) {
+                    basePreferenceHelper.setServerObject(server)
+                    onServerDisable()
+                }
+        ) {
+            val icon = if (server.enable == 1) Utils.getDrawable(context, server.iso)
+            else Utils.getDrawableGray(context, server.iso)
+
+            Icon(
+                painter = painterResource(id = icon),
+                contentDescription = "Server Logo",
+                tint = Color.Unspecified,
+                modifier = Modifier
+                    .padding(bottom = 16.dp)
+                    .size(24.dp)
+                    .clip(CircleShape)
+                    .paint(
+                        painter = painterResource(id = icon),
+                        contentScale = ContentScale.FillHeight
+                    )
+            )
+            Text(text = server.server_name!!,
+                color = MaterialTheme.colorScheme.primary,
+                style = MaterialTheme.typography.labelMedium,
+                modifier = Modifier
+                    .padding(start = 16.dp, bottom = 18.dp)
+                    .align(Alignment.CenterVertically)
+            )
+        }
+
+        Surface(
+            modifier = Modifier
+                .padding(start = 0.dp, end = 0.dp)
+                .height(1.dp)
+                .fillMaxWidth()
+                .alpha(0.6F)
+                .align(Alignment.BottomCenter)
+            ,
+            color = colorResource(id = R.color.gray_icon)
+        ) {}
+    }
+}
+
 @Preview
 @Composable
 fun ServerItemPreview() {

app/src/main/java/com/vpn/fastestvpnservice/screens/bottomNavBarScreens/SettingsScreen.kt

@@ -50,23 +50,29 @@ import androidx.compose.material.icons.filled.SmartDisplay
 import androidx.compose.material.icons.filled.SwitchRight
 import androidx.compose.material.icons.outlined.Circle
 import androidx.compose.material.ripple.rememberRipple
+import androidx.compose.material3.DockedSearchBar
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ModalBottomSheet
 import androidx.compose.material3.RadioButton
 import androidx.compose.material3.RadioButtonDefaults
+import androidx.compose.material3.SearchBar
+import androidx.compose.material3.SearchBarDefaults
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Switch
 import androidx.compose.material3.SwitchColors
 import androidx.compose.material3.SwitchDefaults
 import androidx.compose.material3.Text
+import androidx.compose.material3.TextFieldDefaults
 import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
@@ -104,6 +110,7 @@ import com.vpn.fastestvpnservice.beans.themesList
 import com.vpn.fastestvpnservice.constants.AppEnum
 import com.vpn.fastestvpnservice.constants.smartConnect
 import com.vpn.fastestvpnservice.customItems.ServerSearchItem
+import com.vpn.fastestvpnservice.customItems.ServerSpecificItem
 import com.vpn.fastestvpnservice.helpers.BasePreferenceHelper
 import com.vpn.fastestvpnservice.navigation.navigationAnimation
 import com.vpn.fastestvpnservice.sealedClass.BottomBarScreen
@@ -783,6 +790,13 @@ fun ColumnScope.AddRowSettingsSmart(
     var selectedSmartConnect by remember {
         mutableStateOf(basePreferenceHelper.getSmartList()) }
 
+
+    val searchText = searchListViewModel.searchText.observeAsState().value
+    val isActive = searchListViewModel.isActive.observeAsState().value
+
+    var selectedFilterList by remember { mutableStateOf(basePreferenceHelper.getFilterList()) }
+    val scope = rememberCoroutineScope()
+
     if (isRowShown) {
         Row(
             modifier = Modifier
@@ -956,16 +970,67 @@ fun ColumnScope.AddRowSettingsSmart(
                     CompositionLocalProvider(
                         LocalOverscrollConfiguration provides null
                     ) {
+
+                        DockedSearchBar(
+                            query = searchText!!,
+                            onQueryChange = {
+                                scope.launch {
+                                    searchListViewModel.searchTextChange(it)
+                                }
+                            },
+                            onSearch = {
+                                scope.launch {
+                                    searchListViewModel.isActiveChange(false)
+                                }
+                            },
+                            active = isActive!!,
+                            onActiveChange = {
+                                scope.launch {
+                                    searchListViewModel.isActiveChange(it)
+                                }
+                            },
+                            placeholder = {
+                                Text(
+                                    text = "Search Location",
+                                    style = MaterialTheme.typography.displaySmall,
+                                    color = colorResource(id = R.color.dark_blue_gray_text)
+                                )
+                            },
+                            leadingIcon = {
+                                Icon(
+                                    painter = painterResource(id = R.drawable.search3x),
+                                    contentDescription = "Search Icon",
+
+                                    modifier = Modifier
+                                        .size(21.dp)
+                                )
+                            },
+                            colors = SearchBarDefaults.colors(
+                                containerColor = colorResource(id = R.color.white),
+                                dividerColor = Color.Transparent,
+                                inputFieldColors = TextFieldDefaults.colors(
+                                    focusedTextColor = colorResource(id = R.color.dark_blue_gray_text),
+                                    unfocusedTextColor = colorResource(id = R.color.dark_blue_gray_text),
+                                    unfocusedIndicatorColor = colorResource(id = R.color.dark_blue_gray_text),
+                                    focusedIndicatorColor = colorResource(id = R.color.dark_blue_gray_text),
+                                    disabledIndicatorColor = colorResource(id = R.color.dark_blue_gray_text),
+                                    cursorColor = colorResource(id = R.color.dark_blue_gray_text),
+                                )
+                            ),
+                            modifier = Modifier
+                                .fillMaxWidth()
+                                .height(50.dp)
+                                .padding(horizontal = 10.dp)
+                        ) {}
+
                         LazyColumn(
                             modifier = Modifier
-                                .padding(top = 0.dp, bottom = 0.dp),
+                                .padding(top = 20.dp, bottom = 0.dp),
                         ) {
                             val searchServersList = searchListViewModel.countriesList.value
                             items(items = searchServersList!!) { server ->
-                                ServerSearchItem(
+                                ServerSpecificItem(
                                     server, navHostController = navHostController,
-                                    MaterialTheme.colorScheme.background,
-                                    MaterialTheme.colorScheme.primary, false,
                                     onServerDisable = { isAnySpecificSheetOpen = false }
                                 )
                             }