Tampilan ChatHistoryDrawer sudah disesuaikan

app/src/main/java/com/example/notesai/MainActivity.kt

@@ -155,8 +155,16 @@ fun NotesApp() {
     var fullScreenNote by remember { mutableStateOf<Note?>(null) }
     var isDarkTheme by remember { mutableStateOf(true) }
 
+    // STATE UNTUK AI
+    var showAIDrawer by remember { mutableStateOf(false) }
+    var aiSelectedCategory by remember { mutableStateOf<Category?>(null) }
+    var currentChatId by remember { mutableStateOf<String?>(null) }
+
     var isDataLoaded by remember { mutableStateOf(false) }
 
+    // Load chat histories dari DataStore
+    val chatHistories by dataStoreManager.chatHistoryFlow.collectAsState(initial = emptyList())
+
     fun sortCategories(categories: List<Category>): List<Category> {
         return categories
             .filter { !it.isDeleted }
@@ -232,6 +240,7 @@ fun NotesApp() {
     }
 
     Box(modifier = Modifier.fillMaxSize()) {
+        // LAYER 1: Main Content (Scaffold)
         Scaffold(
             containerColor = AppColors.Background,
             topBar = {
@@ -476,7 +485,8 @@ fun NotesApp() {
 
                             "ai" -> AIHelperScreen(
                                 categories = categories.filter { !it.isDeleted },
-                                notes = notes.filter { !it.isDeleted }
+                                notes = notes.filter { !it.isDeleted },
+                                onShowDrawer = { showAIDrawer = true }
                             )
                         }
                     }
@@ -541,15 +551,12 @@ fun NotesApp() {
             }
         }
 
+        // LAYER 2: Main Drawer (z-index 150)
         AnimatedVisibility(
             visible = drawerState,
-            enter = fadeIn() + slideInHorizontally(
+            enter = fadeIn() + slideInHorizontally(initialOffsetX = { -it }),
-                initialOffsetX = { -it }
+            exit = fadeOut() + slideOutHorizontally(targetOffsetX = { -it }),
-            ),
+            modifier = Modifier.zIndex(150f)
-            exit = fadeOut() + slideOutHorizontally(
-                targetOffsetX = { -it }
-            ),
-            modifier = Modifier.zIndex(100f)
         ) {
             DrawerMenu(
                 currentScreen = currentScreen,
@@ -571,5 +578,46 @@ fun NotesApp() {
                 }
             )
         }
+
+        // LAYER 3: AI History Drawer (z-index 200 - PALING ATAS)
+        AnimatedVisibility(
+            visible = showAIDrawer,
+            enter = fadeIn() + slideInHorizontally(initialOffsetX = { -it }),
+            exit = fadeOut() + slideOutHorizontally(targetOffsetX = { -it }),
+            modifier = Modifier.zIndex(200f)
+        ) {
+            com.example.notesai.presentation.screens.ai.components.ChatHistoryDrawer(
+                chatHistories = chatHistories, // GUNAKAN chatHistories dari collectAsState
+                categories = categories.filter { !it.isDeleted },
+                notes = notes.filter { !it.isDeleted },
+                selectedCategory = aiSelectedCategory,
+                onDismiss = { showAIDrawer = false },
+                onHistoryClick = { history ->
+                    // Load chat history
+                    aiSelectedCategory = categories.find { it.id == history.categoryId }
+                    currentChatId = history.id
+                    showAIDrawer = false
+                    // Anda perlu cara untuk pass data ini ke AIHelperScreen
+                },
+                onDeleteHistory = { historyId ->
+                    scope.launch {
+                        dataStoreManager.deleteChatHistory(historyId)
+                    }
+                },
+                onCategorySelected = { category ->
+                    aiSelectedCategory = category
+                },
+                onNewChat = {
+                    aiSelectedCategory = null
+                    currentChatId = null
+                    showAIDrawer = false
+                },
+                onEditHistoryTitle = { historyId, newTitle ->
+                    scope.launch {
+                        dataStoreManager.updateChatHistoryTitle(historyId, newTitle)
+                    }
+                }
+            )
+        }
     }
 }

app/src/main/java/com/example/notesai/presentation/screens/ai/AIHelperScreen.kt

@@ -52,7 +52,8 @@ private fun String.toSafeChatPreview(maxLength: Int = MAX_CHAT_TITLE_LENGTH): St
 @Composable
 fun AIHelperScreen(
     categories: List<Category>,
-    notes: List<Note>
+    notes: List<Note>,
+    onShowDrawer: () -> Unit = {}
 ) {
     val context = LocalContext.current
     val dataStoreManager = remember { DataStoreManager(context) }
@@ -171,7 +172,9 @@ fun AIHelperScreen(
                     ) {
                         // History Drawer Button
                         IconButton(
-                            onClick = { showHistoryDrawer = true },
+                            onClick = {
+                                onShowDrawer() // Panggil callback ke parent
+                            },
                             modifier = Modifier
                                 .size(40.dp)
                                 .background(
@@ -682,61 +685,5 @@ fun AIHelperScreen(
                 }
             }
         }
-
-        // DRAWER - Layer 3 (paling atas, di luar Column)
-        AnimatedVisibility(
-            visible = showHistoryDrawer,
-            enter = fadeIn() + slideInHorizontally(initialOffsetX = { -it }),
-            exit = fadeOut() + slideOutHorizontally(targetOffsetX = { -it }),
-            modifier = Modifier
-                .fillMaxSize()
-                .zIndex(10f) // Z-index lebih tinggi dari bottom bar
-        ) {
-            // Backdrop + Drawer
-            Box(
-                modifier = Modifier
-                    .fillMaxSize()
-                    .clickable(
-                        interactionSource = remember { MutableInteractionSource() },
-                        indication = null
-                    ) { showHistoryDrawer = false }
-                    .background(Color.Black.copy(alpha = 0.5f))
-            ) {
-                // Drawer Content
-                Box(
-                    modifier = Modifier
-                        .fillMaxHeight()
-                        .fillMaxWidth(0.85f) // 85% dari lebar layar
-                        .align(Alignment.CenterStart)
-                        .clickable(
-                            interactionSource = remember { MutableInteractionSource() },
-                            indication = null
-                        ) { /* Prevent backdrop click */ }
-                ) {
-                    ChatHistoryDrawer(
-                        chatHistories = chatHistories,
-                        categories = categories,
-                        notes = notes,
-                        selectedCategory = selectedCategory,
-                        onDismiss = { showHistoryDrawer = false },
-                        onHistoryClick = { loadChatHistory(it) },
-                        onDeleteHistory = { historyId ->
-                            scope.launch {
-                                dataStoreManager.deleteChatHistory(historyId)
-                            }
-                        },
-                        onCategorySelected = { category ->
-                            selectedCategory = category
-                        },
-                        onNewChat = { startNewChat() },
-                        onEditHistoryTitle = { historyId, newTitle ->
-                            scope.launch {
-                                dataStoreManager.updateChatHistoryTitle(historyId, newTitle)
-                            }
-                        }
-                    )
-                }
-            }
-        }
     }
 }