Feat: Add Create Bottom Sheet and icons

- Implemented a new `CreateBottomSheet` Composable to provide users with options to create AI, Group Chat, or Moment.
- Added new drawable resources for the create options: `ic_create_ai.xml`, `ic_create_group_chat.xml`, `ic_create_monent.xml`, and `ic_create_close.xml`.
- Integrated the `CreateBottomSheet` into the `IndexScreen`. Clicking the "+" button now opens this bottom sheet instead of directly navigating to new post creation.
- Updated `IndexViewModel` to manage the visibility state of the `CreateBottomSheet`.
- Added string resources for the Create Bottom Sheet in English, Chinese, and Japanese.
- Ensured proper navigation and tourist mode checks for each create option.
- Implemented graceful dismissal of the bottom sheet with animations.

.idea/deploymentTargetSelector.xml

@@ -4,10 +4,10 @@
     <selectionStates>
       <SelectionState runConfigName="app">
         <option name="selectionMode" value="DROPDOWN" />
-        <DropdownSelection timestamp="2025-09-08T06:52:32.669239Z">
+        <DropdownSelection timestamp="2025-09-09T09:51:06.656104400Z">
           <Target type="DEFAULT_BOOT">
             <handle>
-              <DeviceId pluginId="LocalEmulator" identifier="path=/Users/liudikang/.android/avd/Pixel_8_API_30.avd" />
+              <DeviceId pluginId="Default" identifier="serial=192.168.0.227:45035;connection=094cb92e" />
             </handle>
           </Target>
         </DropdownSelection>

app/src/main/java/com/aiosman/ravenow/ui/index/CreateBottomSheet.kt

@@ -0,0 +1,150 @@
+package com.aiosman.ravenow.ui.index
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.BottomSheetDefaults
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.SheetState
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.compose.ui.res.stringResource
+import com.aiosman.ravenow.LocalAppTheme
+import com.aiosman.ravenow.R
+import com.aiosman.ravenow.ui.modifiers.noRippleClickable
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun CreateBottomSheet(
+    sheetState: SheetState,
+    onDismiss: () -> Unit,
+    onAiClick: () -> Unit,
+    onGroupChatClick: () -> Unit,
+    onMomentClick: () -> Unit
+) {
+    val appColors = LocalAppTheme.current
+    
+    ModalBottomSheet(
+        onDismissRequest = onDismiss,
+        sheetState = sheetState,
+        windowInsets = BottomSheetDefaults.windowInsets,
+        containerColor = appColors.background,
+        dragHandle = null,
+        shape = RoundedCornerShape(topStart = 20.dp, topEnd = 20.dp)
+    ) {
+        Column(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(top = 24.dp, bottom = 24.dp),
+            horizontalAlignment = Alignment.CenterHorizontally
+        ) {
+            // 标题
+            Text(
+                text = stringResource(R.string.create_title),
+                fontSize = 18.sp,
+                fontWeight = FontWeight.Bold,
+                color = appColors.text,
+                modifier = Modifier.padding(bottom = 32.dp)
+            )
+            
+            // 三个创建选项
+            Row(
+                modifier = Modifier.fillMaxWidth(),
+                horizontalArrangement = Arrangement.SpaceEvenly
+            ) {
+                // 群聊选项
+                CreateOption(
+                    icon = R.drawable.ic_create_group_chat,
+                    label = stringResource(R.string.create_group_chat_option),
+                    onClick = onGroupChatClick
+                )
+                // 动态选项
+                CreateOption(
+                    icon = R.drawable.ic_create_monent,
+                    label = stringResource(R.string.create_moment),
+                    onClick = onMomentClick
+                )
+                // AI选项
+                CreateOption(
+                    icon = R.drawable.ic_create_ai,
+                    label = stringResource(R.string.create_ai),
+                    onClick = onAiClick
+                )
+                
+
+                
+
+            }
+            
+            Spacer(modifier = Modifier.height(40.dp))
+            
+            // 关闭按钮
+            Box(
+                modifier = Modifier
+                    .size(32.dp)
+                    .clip(CircleShape)
+                    .noRippleClickable { onDismiss() },
+                contentAlignment = Alignment.Center
+            ) {
+                Image(
+                    painter = painterResource(R.drawable.ic_create_close),
+                    contentDescription = stringResource(R.string.create_close),
+                    modifier = Modifier.size(32.dp)
+                )
+            }
+            
+            Spacer(modifier = Modifier.height(16.dp))
+        }
+    }
+}
+
+@Composable
+private fun CreateOption(
+    icon: Int,
+    label: String,
+    onClick: () -> Unit
+) {
+    val appColors = LocalAppTheme.current
+    
+    Column(
+        horizontalAlignment = Alignment.CenterHorizontally,
+        modifier = Modifier.noRippleClickable { onClick() }
+    ) {
+        // 直接使用图标，不要背景
+        Image(
+            painter = painterResource(icon),
+            contentDescription = label,
+            modifier = Modifier.size(72.dp)
+        )
+        
+        Spacer(modifier = Modifier.height(12.dp))
+        
+        // 文字标签
+        Text(
+            text = label,
+            fontSize = 14.sp,
+            fontWeight = FontWeight.Medium,
+            color = appColors.text
+        )
+    }
+}

app/src/main/java/com/aiosman/ravenow/ui/index/Index.kt

@@ -25,6 +25,7 @@ import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.rememberPagerState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.DrawerValue
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.ModalNavigationDrawer
 import androidx.compose.material3.NavigationBar
@@ -34,6 +35,7 @@ import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Switch
 import androidx.compose.material3.SwitchDefaults
 import androidx.compose.material3.Text
+import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.material3.rememberDrawerState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
@@ -78,9 +80,10 @@ import com.aiosman.ravenow.ui.modifiers.noRippleClickable
 import com.aiosman.ravenow.ui.post.NewPostViewModel
 import com.aiosman.ravenow.utils.ResourceCleanupManager
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
+import kotlinx.coroutines.delay
 import kotlinx.coroutines.launch
 
-@OptIn(ExperimentalFoundationApi::class)
+@OptIn(ExperimentalFoundationApi::class, ExperimentalMaterial3Api::class)
 @Composable
 fun IndexScreen() {
     val AppColors = LocalAppTheme.current
@@ -101,6 +104,7 @@ fun IndexScreen() {
     val pagerState = rememberPagerState(pageCount = { item.size })
     val coroutineScope = rememberCoroutineScope()
     val drawerState = rememberDrawerState(DrawerValue.Closed)
+    val bottomSheetState = rememberModalBottomSheetState()
     val context = LocalContext.current
 
     // 注意：不要在离开 Index 路由时全量清理资源，以免返回后列表被重置
@@ -292,8 +296,8 @@ fun IndexScreen() {
                                                     navController.navigate(NavigationRoute.Login.route)
                                                     return@noRippleClickable
                                                 }
-                                                NewPostViewModel.asNewPost()
-                                                navController.navigate(NavigationRoute.NewPost.route)
+                                                // 显示创建底部弹窗
+                                                model.showCreateBottomSheet = true
                                                 return@noRippleClickable
                                             }
 
@@ -389,6 +393,56 @@ fun IndexScreen() {
                 }
             }
         }
+        
+        // 创建底部弹窗
+        if (model.showCreateBottomSheet) {
+            CreateBottomSheet(
+                sheetState = bottomSheetState,
+                onDismiss = {
+                    // 使用协程来优雅地关闭弹窗
+                    coroutineScope.launch {
+                        bottomSheetState.hide()
+                        model.showCreateBottomSheet = false
+                    }
+                },
+                onAiClick = {
+                    // 使用协程来优雅地关闭弹窗并导航
+                    coroutineScope.launch {
+                        bottomSheetState.hide() // 触发关闭动画
+                        model.showCreateBottomSheet = false
+                        // 检查游客模式，如果是游客则跳转登录
+                        if (GuestLoginCheckOut.needLogin(GuestLoginCheckOutScene.CREATE_AGENT)) {
+                            navController.navigate(NavigationRoute.Login.route)
+                        } else {
+                            navController.navigate(NavigationRoute.AddAgent.route)
+                        }
+                    }
+                },
+                onGroupChatClick = {
+                    // 使用协程来优雅地关闭弹窗并导航
+                    coroutineScope.launch {
+                        bottomSheetState.hide() // 触发关闭动画
+                        model.showCreateBottomSheet = false
+                        // 检查游客模式，如果是游客则跳转登录
+                        if (GuestLoginCheckOut.needLogin(GuestLoginCheckOutScene.JOIN_GROUP_CHAT)) {
+                            navController.navigate(NavigationRoute.Login.route)
+                        } else {
+                            navController.navigate(NavigationRoute.CreateGroupChat.route)
+                        }
+                    }
+                },
+                onMomentClick = {
+                    // 使用协程来优雅地关闭弹窗并导航
+                    coroutineScope.launch {
+                        bottomSheetState.hide() // 触发关闭动画
+                        model.showCreateBottomSheet = false
+                        // 导航到动态创建页面
+                        NewPostViewModel.asNewPost()
+                        navController.navigate(NavigationRoute.NewPost.route)
+                    }
+                }
+            )
+        }
     }
 
 }

app/src/main/java/com/aiosman/ravenow/ui/index/IndexViewModel.kt

@@ -9,9 +9,12 @@ object IndexViewModel:ViewModel() {
     var tabIndex by mutableStateOf(0)
 
     var openDrawer by mutableStateOf(false)
+    
+    var showCreateBottomSheet by mutableStateOf(false)
 
     fun ResetModel(){
         tabIndex = 0
+        showCreateBottomSheet = false
     }
 
 }

app/src/main/java/com/aiosman/ravenow/ui/index/tabs/ai/Agent.kt

@@ -16,6 +16,7 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.navigationBars
+import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.systemBars
@@ -67,6 +68,12 @@ import com.aiosman.ravenow.ui.index.tabs.moment.tabs.expolre.ExploreViewModel
 import com.aiosman.ravenow.utils.DebounceUtils
 import com.aiosman.ravenow.utils.ResourceCleanupManager
 import kotlinx.coroutines.launch
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.foundation.lazy.grid.GridCells
+import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.foundation.lazy.grid.items
 
 @OptIn( ExperimentalFoundationApi::class)
 @Composable
@@ -82,7 +89,8 @@ fun Agent() {
     var scope = rememberCoroutineScope()
 
     val viewModel: AgentViewModel = viewModel()
-    
+    val scrollState = rememberScrollState()
+
     // 确保推荐Agent数据已加载
     LaunchedEffect(Unit) {
         viewModel.ensureDataLoaded()
@@ -102,6 +110,7 @@ fun Agent() {
     Column(
         modifier = Modifier
             .fillMaxSize()
+            .verticalScroll(scrollState)
             .padding(
                 top = statusBarPaddingValues.calculateTopPadding(),
                 bottom = navigationBarPaddings,
@@ -196,7 +205,6 @@ fun Agent() {
             Column(
                 modifier = Modifier
                     .fillMaxWidth()
-                    .height(400.dp)
                     .padding(vertical = 8.dp)
 
             ) {
@@ -221,73 +229,95 @@ fun Agent() {
 //                    )
 //                }
 
+                var selectedTabIndex by remember { mutableStateOf(0) }
+
                 // 标签页
-                Row(
+                LazyRow(
                     modifier = Modifier
                         .fillMaxWidth()
                         .wrapContentHeight()
-                        .padding( bottom = 16.dp),
+                        .padding(bottom = 16.dp),
                     horizontalArrangement = Arrangement.Start,
-                    verticalAlignment = Alignment.Bottom
+                    verticalAlignment = Alignment.CenterVertically
                 ) {
-                    // 推荐标签（默认选中）
-                    CustomTabItem(
-                        text = stringResource(R.string.agent_recommend),
-                        isSelected = true,
-                        onClick = {
-                            // TODO: 实现点击切换逻辑
-                        }
-                    )
+                    item {
+                        CustomTabItem(
+                            text = stringResource(R.string.agent_recommend),
+                            isSelected = selectedTabIndex == 0,
+                            onClick = {
+                                selectedTabIndex = 0
+                            }
+                        )
+                    }
 
-                    TabSpacer()
+                    item {
+                        TabSpacer()
+                    }
 
-                    // Scenes标签
-                    CustomTabItem(
-                        text = "scenes",
-                        isSelected = false,
-                        onClick = {
-                            // TODO: 实现点击切换逻辑
-                        }
-                    )
+                    item {
+                        CustomTabItem(
+                            text = "scenes",
+                            isSelected = selectedTabIndex == 1,
+                            onClick = {
+                                selectedTabIndex = 1
+                            }
+                        )
+                    }
 
-                    TabSpacer()
+                    item {
+                        TabSpacer()
+                    }
 
-                    // Voices标签
-                    CustomTabItem(
-                        text = "voices",
-                        isSelected = false,
-                        onClick = {
-                            // TODO: 实现点击切换逻辑
-                        }
-                    )
+                    item {
+                        CustomTabItem(
+                            text = "voices",
+                            isSelected = selectedTabIndex == 2,
+                            onClick = {
+                                selectedTabIndex = 2
+                            }
+                        )
+                    }
 
-                    TabSpacer()
+                    item {
+                        TabSpacer()
+                    }
 
-                    // Anime标签
-                    CustomTabItem(
-                        text = "anime",
-                        isSelected = false,
-                        onClick = {
-                            // TODO: 实现点击切换逻辑
-                        }
-                    )
+                    item {
+                        CustomTabItem(
+                            text = "anime",
+                            isSelected = selectedTabIndex == 3,
+                            onClick = {
+                                selectedTabIndex = 3
+                            }
+                        )
+                    }
 
-//                    TabSpacer()
-//
-//                    // Assist标签
-//                    CustomTabItem(
-//                        text = "assist",
-//                        isSelected = false,
-//                        onClick = {
-//                            // TODO: 实现点击切换逻辑
-//                        }
-//                    )
+                    item {
+                        TabSpacer()
+                    }
+
+                    item {
+                        CustomTabItem(
+                            text = "assist",
+                            isSelected = selectedTabIndex == 4,
+                            onClick = {
+                                selectedTabIndex = 4
+                            }
+                        )
+                    }
+                }
+
+                when (selectedTabIndex) {
+                    0 -> {
+                        AgentViewPagerSection(agentItems = viewModel.agentItems.take(15), viewModel)
+                    }
+                    else -> {
+                        val shuffledAgents = viewModel.agentItems.shuffled().take(15)
+                        AgentViewPagerSection(agentItems = shuffledAgents, viewModel)
+                    }
                 }
-                // Agent ViewPager
-                AgentViewPagerSection(agentItems = viewModel.agentItems.take(15),viewModel)
             }
 
-        Spacer(modifier = Modifier.height(0.dp))
         Row(
             modifier = Modifier
                 .fillMaxWidth()
@@ -309,92 +339,150 @@ fun Agent() {
                 fontWeight = androidx.compose.ui.text.font.FontWeight.W600,
                 color = AppColors.text
             )
-            Spacer(modifier = Modifier.weight(1f))
-            
-            // 只有非游客用户才显示"我的Agent"tab
-            if (!AppStore.isGuest) {
-                TabItem(
-                    text = stringResource(R.string.agent_mine),
-                    isSelected = pagerState.currentPage == 0,
-                    onClick = {
-                        if (DebounceUtils.simpleDebounceClick(lastClickTime, 300L) {
-                            scope.launch {
-                                pagerState.animateScrollToPage(0)
-                            }
-                        }) {
-                            lastClickTime = System.currentTimeMillis()
-                        }
-                    }
-                )
-                TabSpacer()
-            }
-            
-            TabItem(
-                text = stringResource(R.string.agent_hot),
-                isSelected = if (AppStore.isGuest) pagerState.currentPage == 0 else pagerState.currentPage == 1,
-                onClick = {
-                    if (DebounceUtils.simpleDebounceClick(lastClickTime, 300L) {
-                        scope.launch {
-                            val targetPage = if (AppStore.isGuest) 0 else 1
-                            pagerState.animateScrollToPage(targetPage)
-                        }
-                    }) {
-                        lastClickTime = System.currentTimeMillis()
-                    }
-                }
-            )
-            /*TabSpacer()
-            TabItem(
-                text = stringResource(R.string.agent_recommend),
-                isSelected = pagerState.currentPage == 2,
-                onClick = {
-                    scope.launch {
-                        pagerState.animateScrollToPage(2)
-                    }
-                }
-            )
-            TabSpacer()
-            TabItem(
-                text = stringResource(R.string.agent_other),
-                isSelected = pagerState.currentPage == 3,
-                onClick = {
-                    scope.launch {
-                        pagerState.animateScrollToPage(3)
-                    }
-                }
-            )*/
+
         }
-        Spacer(modifier = Modifier.height(16.dp))
-        HorizontalPager(
-            state = pagerState,
+        Spacer(modifier = Modifier.height(50.dp))
+        Column(
             modifier = Modifier
                 .fillMaxWidth()
-                .weight(1f),
-            beyondBoundsPageCount = 1  // 预加载相邻页面，避免切换时重新加载
+                .weight(1f)
         ) {
-            if (AppStore.isGuest) {
-                // 游客模式下只显示热门Agent
-                when (it) {
-                    0 -> {
-                        HotAgent()
-                    }
-                }
-            } else {
-                // 正常用户显示我的Agent和热门Agent
-                when (it) {
-                    0 -> {
-                        MineAgent()
-                    }
-
-                    1 -> {
-                        HotAgent()
-                    }
+            val agentItems = viewModel.agentItems.take(15)
+            LazyVerticalGrid(
+                columns = GridCells.Fixed(2),
+                modifier = Modifier.fillMaxWidth(),
+                horizontalArrangement = Arrangement.spacedBy(16.dp),
+                verticalArrangement = Arrangement.spacedBy(50.dp)
+            ) {
+                items(agentItems) { agentItem ->
+                    AgentCardSquare(
+                        agentItem = agentItem,
+                        viewModel = viewModel,
+                        navController = LocalNavController.current
+                    )
                 }
             }
         }
     }
 }
+@SuppressLint("SuspiciousIndentation")
+@Composable
+fun AgentCardSquare(agentItem: AgentItem, viewModel: AgentViewModel, navController: NavHostController) {
+    val AppColors = LocalAppTheme.current
+    val cardHeight = 180.dp
+    val avatarSize = cardHeight / 3  // 头像大小为方块高度的三分之一
 
+    // 防抖状态
+    var lastClickTime by remember { mutableStateOf(0L) }
+
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .height(cardHeight)
+            .background(Color(0xFFE0E0E0), RoundedCornerShape(12.dp))  // 灰色背景
+            .clickable {
+                if (DebounceUtils.simpleDebounceClick(lastClickTime, 500L) {
+                        viewModel.goToProfile(agentItem.openId, navController)
+                    }) {
+                    lastClickTime = System.currentTimeMillis()
+                }
+            },
+        contentAlignment = Alignment.TopCenter
+    ) {
+        // 头像，位于方块上方居中，部分悬于方块外部
+        Box(
+            modifier = Modifier
+                .offset(y = -avatarSize / 2)
+                .size(avatarSize)
+                .background(Color.White, RoundedCornerShape(avatarSize / 2))
+                .clip(RoundedCornerShape(avatarSize / 2)),
+            contentAlignment = Alignment.Center
+        ) {
+            if (agentItem.avatar.isNotEmpty()) {
+                CustomAsyncImage(
+                    imageUrl = agentItem.avatar,
+                    contentDescription = "Agent头像",
+                    modifier = Modifier
+                        .size(avatarSize)
+                        .clip(RoundedCornerShape(avatarSize / 2)),
+                    contentScale = androidx.compose.ui.layout.ContentScale.Crop
+                )
+            } else {
+                Image(
+                    painter = painterResource(R.mipmap.rider_pro_agent),
+                    contentDescription = "默认头像",
+                    modifier = Modifier.size(avatarSize / 2),
+                    colorFilter = ColorFilter.tint(AppColors.secondaryText)
+                )
+            }
+        }
+
+        // 内容区域（名称和描述）
+        Column(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(top = avatarSize / 2 + 8.dp, start = 8.dp, end = 8.dp, bottom = 8.dp),
+            horizontalAlignment = Alignment.CenterHorizontally
+        ) {
+            androidx.compose.material3.Text(
+                text = agentItem.title,
+                fontSize = 16.sp,
+                fontWeight = androidx.compose.ui.text.font.FontWeight.W600,
+                color = AppColors.text,
+                maxLines = 1,
+                overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
+            )
+
+            Spacer(modifier = Modifier.height(8.dp))
+
+            androidx.compose.material3.Text(
+                text = agentItem.desc,
+                fontSize = 14.sp,
+                color = AppColors.secondaryText,
+                maxLines = 2,
+                overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis,
+                modifier = Modifier.weight(1f, fill = false)
+            )
+
+            Spacer(modifier = Modifier.height(8.dp))
+
+            // 聊天按钮，位于底部居中
+            Box(
+                modifier = Modifier
+                    .width(80.dp)
+                    .height(32.dp)
+                    .background(
+                        color = Color(0X147c7480),
+                        shape = RoundedCornerShape(8.dp)
+                    )
+                    .clickable {
+                        if (DebounceUtils.simpleDebounceClick(lastClickTime, 500L) {
+                                // 检查游客模式，如果是游客则跳转登录
+                                if (GuestLoginCheckOut.needLogin(GuestLoginCheckOutScene.CHAT_WITH_AGENT)) {
+                                    navController.navigate(NavigationRoute.Login.route)
+                                } else {
+                                    viewModel.createSingleChat(agentItem.openId)
+                                    viewModel.goToChatAi(
+                                        agentItem.openId,
+                                        navController = navController
+                                    )
+                                }
+                            }) {
+                            lastClickTime = System.currentTimeMillis()
+                        }
+                    },
+                contentAlignment = Alignment.Center
+            ) {
+                androidx.compose.material3.Text(
+                    text = stringResource(R.string.chat),
+                    fontSize = 12.sp,
+                    color = AppColors.text,
+                    fontWeight = androidx.compose.ui.text.font.FontWeight.W500
+                )
+            }
+        }
+    }
+}
 @OptIn(ExperimentalFoundationApi::class)
 @Composable
 fun AgentViewPagerSection(agentItems: List<AgentItem>,viewModel: AgentViewModel) {

app/src/main/res/drawable/ic_create_ai.xml

@@ -0,0 +1,19 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="72dp"
+    android:height="72dp"
+    android:viewportWidth="72"
+    android:viewportHeight="72">
+  <path
+      android:pathData="M36,36m-36,0a36,36 0,1 1,72 0a36,36 0,1 1,-72 0"
+      android:fillColor="#8FBFFA"
+      android:fillAlpha="0.08"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M36.804,31.654h-0.108c-2.5,0 -5.222,0 -7.559,0.409a4.115,4.115 0,0 0,-3.3 3.202c-0.337,1.56 -0.337,2.86 -0.337,5.224v0.175c0,2.365 0,3.665 0.338,5.225a4.115,4.115 0,0 0,3.3 3.2c2.336,0.411 5.058,0.411 7.558,0.411h0.108c2.5,0 5.222,0 7.559,-0.41a4.115,4.115 0,0 0,3.3 -3.2C48,44.328 48,43.03 48,40.663v-0.175c0,-2.364 0,-3.663 -0.338,-5.224a4.115,4.115 0,0 0,-3.3 -3.202c-2.336,-0.409 -5.058,-0.409 -7.558,-0.409z"
+      android:fillColor="#8FBFFA"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M36.75,22.5c-1.06,0 -2.031,0.302 -2.738,1.006 -0.704,0.704 -1.004,1.673 -1.004,2.735 0,1.058 0.302,2.028 1.006,2.732 0.35,0.35 0.765,0.601 1.228,0.764v1.921c0.49,-0.004 0.977,-0.004 1.454,-0.004h0.108c0.48,0 0.967,0 1.456,0.004v-1.92c0.461,-0.16 0.881,-0.421 1.228,-0.765 0.704,-0.704 1.006,-1.674 1.006,-2.734s-0.302,-2.03 -1.006,-2.733c-0.705,-0.704 -1.677,-1.006 -2.738,-1.006zM32.682,35.919c0.694,0 1.258,0.563 1.258,1.257v1.213a1.258,1.258 0,0 1,-2.516 0v-1.213c0,-0.694 0.564,-1.257 1.258,-1.257zM40.818,35.919c0.694,0 1.258,0.563 1.258,1.257v1.213a1.258,1.258 0,0 1,-2.516 0v-1.213c0,-0.694 0.564,-1.257 1.258,-1.257zM32.193,41.933a1.259,1.259 0,0 1,1.7 0.48l0.013,0.019c0.16,0.227 0.354,0.43 0.573,0.601 0.435,0.342 1.154,0.718 2.271,0.718 1.115,0 1.836,-0.378 2.273,-0.718a2.87,2.87 0,0 0,0.571 -0.603l0.012,-0.016A1.259,1.259 0,0 1,41.8 43.64l-1.1,-0.606 1.1,0.608v0.004l-0.004,0.006 -0.008,0.014 -0.022,0.036 -0.066,0.105a5.392,5.392 0,0 1,-1.128 1.202c-0.82,0.646 -2.077,1.256 -3.824,1.256 -1.743,0 -3,-0.61 -3.822,-1.256a5.392,5.392 0,0 1,-1.128 -1.202,2.99 2.99,0 0,1 -0.064,-0.105l-0.02,-0.036 -0.01,-0.014 -0.002,-0.006 -0.002,-0.002c0,-0.002 0,-0.004 1.1,-0.61l-1.102,0.608a1.256,1.256 0,0 1,0.495 -1.71z"
+      android:fillColor="#2859C5"
+      android:fillType="evenOdd"/>
+</vector>

app/src/main/res/drawable/ic_create_close.xml

@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="32dp"
+    android:height="33dp"
+    android:viewportWidth="32"
+    android:viewportHeight="33">
+  <path
+      android:pathData="M15.478,0.75L16.522,0.75A15.478,15.478 0,0 1,32 16.228L32,17.522A15.478,15.478 0,0 1,16.522 33L15.478,33A15.478,15.478 0,0 1,0 17.522L0,16.228A15.478,15.478 0,0 1,15.478 0.75z"
+      android:fillColor="#7C7480"
+      android:fillAlpha="0.08"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M20.782,12.155a1.29,1.29 0,0 1,0 1.824l-2.889,2.889 2.86,2.859a1.29,1.29 0,0 1,0 1.824l-0.077,0.076a1.29,1.29 0,0 1,-1.824 0l-2.859,-2.86 -2.889,2.89a1.29,1.29 0,0 1,-1.824 0l-0.062,-0.062a1.29,1.29 0,0 1,0 -1.824l2.89,-2.89 -2.86,-2.858a1.29,1.29 0,0 1,0 -1.824l0.076,-0.076a1.29,1.29 0,0 1,1.824 0l2.86,2.859 2.888,-2.889a1.29,1.29 0,0 1,1.824 0l0.062,0.062z"
+      android:fillColor="#918E93"
+      android:fillType="evenOdd"/>
+</vector>

app/src/main/res/drawable/ic_create_group_chat.xml

@@ -0,0 +1,28 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="72dp"
+    android:height="72dp"
+    android:viewportWidth="72"
+    android:viewportHeight="72">
+  <path
+      android:pathData="M36,36m-36,0a36,36 0,1 1,72 0a36,36 0,1 1,-72 0"
+      android:fillColor="#FC0"
+      android:fillAlpha="0.08"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M31.206,26.187c1.179,-1.192 2.856,-1.826 4.61,-1.57l8.182,1.196c3.012,0.44 5.11,3.336 4.687,6.468l-1.533,11.34 -1.75,-0.255"
+      android:strokeWidth="2.147"
+      android:fillColor="#00000000"
+      android:strokeColor="#FECE51"
+      android:fillType="evenOdd"
+      android:strokeLineCap="round"/>
+  <path
+      android:pathData="m28.156,30.17 l7.756,-1.134a5.726,5.726 0,0 1,6.502 4.899l0.766,5.662a5.726,5.726 0,0 1,-4.847 6.433L24.85,48l-1.54,-11.398a5.726,5.726 0,0 1,4.846 -6.433z"
+      android:strokeWidth="2.147"
+      android:fillColor="#FECE51"
+      android:strokeColor="#FECE51"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="m27.74,39.562 l11.024,-0.06 -0.015,2.861 -11.024,0.06z"
+      android:fillColor="#D86002"
+      android:fillType="evenOdd"/>
+</vector>

app/src/main/res/drawable/ic_create_monent.xml

@@ -0,0 +1,21 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="72dp"
+    android:height="72dp"
+    android:viewportWidth="72"
+    android:viewportHeight="72">
+  <path
+      android:pathData="M36,36m-36,0a36,36 0,1 1,72 0a36,36 0,1 1,-72 0"
+      android:fillColor="#3DC779"
+      android:fillAlpha="0.08"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M31.555,24.228a0.964,0.964 0,0 0,-0.845 0.498l-1.958,3.548 -0.636,0.054 -0.154,0.012a5,5 0,0 0,-4.504 4.233c-0.246,1.664 -0.476,3.433 -0.476,5.253 0,1.82 0.232,3.59 0.476,5.256a5,5 0,0 0,4.504 4.231c2.64,0.228 5.33,0.459 8.038,0.459s5.398,-0.231 8.038,-0.459a5,5 0,0 0,4.503 -4.231c0.247,-1.667 0.477,-3.433 0.477,-5.256 0,-1.82 -0.232,-3.587 -0.477,-5.253a5,5 0,0 0,-4.503 -4.233l-0.127,-0.01 -0.663,-0.058 -1.958,-3.546a0.964,0.964 0,0 0,-0.845 -0.498h-8.89z"
+      android:fillColor="#61CD8C"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M36,33.345c1.253,0 2.26,0.306 2.934,0.98 0.674,0.674 0.98,1.68 0.98,2.932 0,1.253 -0.306,2.26 -0.98,2.934 -0.674,0.674 -1.681,0.98 -2.935,0.98 -1.252,0.002 -2.26,-0.305 -2.933,-0.978 -0.674,-0.674 -0.98,-1.681 -0.98,-2.934 0,-1.253 0.306,-2.26 0.98,-2.934 0.674,-0.674 1.68,-0.98 2.934,-0.98z"
+      android:strokeWidth="2.25"
+      android:fillColor="#61CD8C"
+      android:fillType="nonZero"
+      android:strokeColor="#FFF"/>
+</vector>

app/src/main/res/values-ja/strings.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!-- Create Bottom Sheet -->
+    <string name="create_title">作成</string>
+    <string name="create_ai">AI</string>
+    <string name="create_group_chat_option">グループチャット</string>
+    <string name="create_moment">モーメント</string>
+    <string name="create_close">閉じる</string>
+</resources>

app/src/main/res/values-zh/strings.xml

@@ -190,5 +190,12 @@
     <string name="agent_createing">创建中...</string>
     <string name="agent_find">发现</string>
     <string name="text_error_password_too_long">密码不能超过 %1$d 个字符</string>
+    
+    <!-- Create Bottom Sheet -->
+    <string name="create_title">创建</string>
+    <string name="create_ai">AI</string>
+    <string name="create_group_chat_option">群聊</string>
+    <string name="create_moment">动态</string>
+    <string name="create_close">关闭</string>
 
 </resources>

app/src/main/res/values/strings.xml

@@ -186,5 +186,12 @@
     <string name="agent_createing">创建中...</string>
     <string name="agent_find">发现</string>
     <string name="text_error_password_too_long">Password cannot exceed %1$d characters</string>
+    
+    <!-- Create Bottom Sheet -->
+    <string name="create_title">Create</string>
+    <string name="create_ai">AI</string>
+    <string name="create_group_chat_option">Group Chat</string>
+    <string name="create_moment">Moment</string>
+    <string name="create_close">Close</string>
 
 </resources>