From 4b4f90837fdae74901edcd550ee22aeaef478b2a Mon Sep 17 00:00:00 2001
From: eric <ericchen87887@gmail.com>
Date: Sun, 12 Jul 2026 15:35:01 +0800
Subject: [PATCH] add search function in setting page v1

---
 .../home/setting/Setting_ViewModel.kt         | 11 ++---
 .../home/setting/Setting_list_Screen.kt       | 42 +++++++++++++++----
 2 files changed, 40 insertions(+), 13 deletions(-)

diff --git a/app/src/main/java/com/example/login_v3/home/setting/Setting_ViewModel.kt b/app/src/main/java/com/example/login_v3/home/setting/Setting_ViewModel.kt
index 92b9dfb..8f53788 100644
--- a/app/src/main/java/com/example/login_v3/home/setting/Setting_ViewModel.kt
+++ b/app/src/main/java/com/example/login_v3/home/setting/Setting_ViewModel.kt
@@ -16,7 +16,8 @@ data class SettingItem(
     val title: String,
     val description: String? = null,
     val setting_icon: ImageVector,
-    val iconKey: String
+    val iconKey: String,
+    val keywords: List<String> = emptyList()
 )
 
 
@@ -28,10 +29,10 @@ class SettingViewModel : ViewModel() {
 
     init {
         _settings.value = listOf(
-            SettingItem("profile", "Profile", "Manage your account", Icons.Filled.Person, "profile"),
-            SettingItem("theme", "Theme", "Customize app appearance", Icons.Filled.Palette, "theme"),
-            SettingItem("devices", "Devices", "Manage connected devices", Icons.Filled.Devices, "devices"),
-            SettingItem("subscription", "Subscription", "View or update your plan", Icons.Filled.Subscriptions, "subscribetion")
+            SettingItem("profile", "Profile", "Manage your account", Icons.Filled.Person, "profile", listOf("個人資料", "頭像", "名稱")),
+            SettingItem("theme", "Theme", "Customize app appearance", Icons.Filled.Palette, "theme", listOf("dark", "light", "wallpaper", "mode", "主題", "深色", "淺色", "背景")),
+            SettingItem("devices", "Devices", "Manage connected devices", Icons.Filled.Devices, "devices", listOf("裝置", "登入紀錄")),
+            SettingItem("subscription", "Subscription", "View or update your plan", Icons.Filled.Subscriptions, "subscribetion", listOf("訂閱", "方案"))
         )
     }
 }
diff --git a/app/src/main/java/com/example/login_v3/home/setting/Setting_list_Screen.kt b/app/src/main/java/com/example/login_v3/home/setting/Setting_list_Screen.kt
index 36dcb3b..f4a57b8 100644
--- a/app/src/main/java/com/example/login_v3/home/setting/Setting_list_Screen.kt
+++ b/app/src/main/java/com/example/login_v3/home/setting/Setting_list_Screen.kt
@@ -1,6 +1,5 @@
 package com.example.login_v3.home.setting
 
-import android.R
 import android.net.Uri
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.AnimatedVisibilityScope
@@ -26,6 +25,7 @@ import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
+import androidx.compose.material3.ListItem
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SearchBar
 import androidx.compose.material3.Text
@@ -59,32 +59,58 @@ fun SharedTransitionScope.setting_list_Screen(
     var query by remember { mutableStateOf("") }
     var active by remember { mutableStateOf(false) }
 
+    val settings by viewModel.settings.collectAsState()
 
+    // 搜尋過濾邏輯
+    val filteredSettings = remember(query, settings) {
+        if (query.isEmpty()) {
+            settings
+        } else {
+            settings.filter { item ->
+                item.title.contains(query, ignoreCase = true) ||
+                        (item.description?.contains(query, ignoreCase = true) ?: false) ||
+                        item.keywords.any { it.contains(query, ignoreCase = true) }
+            }
+        }
+    }
 
     Column(modifier = Modifier
         .fillMaxSize()
     ) {
 
-        val settings by viewModel.settings.collectAsState()
-
-
         Spacer(modifier = Modifier.height(46.dp))
 
         SearchBar(
             query = query,
             onQueryChange = { query = it },
-            onSearch = { /* 執行搜尋邏輯 */ },
+            onSearch = { active = false },
             active = active,
             shape = RoundedCornerShape(12.dp),
             onActiveChange = { active = it },
-            placeholder = { Text("搜尋設定") },
+            placeholder = { Text("搜尋設定 (例如: dark, profile...)") },
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(horizontal = 8.dp)
 
         ) {
             // 這裡是 SearchBar 展開後的內容
-            Text("搜尋結果: $query")
+            LazyColumn(
+                modifier = Modifier.fillMaxWidth(),
+                contentPadding = PaddingValues(16.dp),
+                verticalArrangement = Arrangement.spacedBy(8.dp)
+            ) {
+                itemsIndexed(filteredSettings) { index, item ->
+                    ListItem(
+                        headlineContent = { Text(item.title) },
+                        supportingContent = { item.description?.let { Text(it) } },
+                        leadingContent = { Icon(item.setting_icon, contentDescription = null) },
+                        modifier = Modifier.clickable {
+                            onItemClick(item.title, item.iconKey)
+                            active = false
+                        }
+                    )
+                }
+            }
         } // ← 注意這個大括號要結束 SearchBar
 
         Spacer(modifier = Modifier.height(14.dp))
@@ -95,7 +121,7 @@ fun SharedTransitionScope.setting_list_Screen(
             verticalArrangement = Arrangement.spacedBy(2.dp), // 每個 item 之間 8.dp
             contentPadding = PaddingValues(vertical = 2.dp)
         ) {
-            itemsIndexed(settings){ index, item ->
+            itemsIndexed(filteredSettings){ index, item ->
 
                 Box(
                     modifier = Modifier