diff --git a/src/main/kotlin/main/Glossary.kt b/src/main/kotlin/main/Glossary.kt
index 4f4c6c9..dc7b86f 100644
--- a/src/main/kotlin/main/Glossary.kt
+++ b/src/main/kotlin/main/Glossary.kt
@@ -1,7 +1,14 @@
 package main
 
+import androidx.compose.foundation.VerticalScrollbar
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.foundation.rememberScrollbarAdapter
 import androidx.compose.material.*
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Delete
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.mutableStateOf
@@ -28,6 +35,121 @@ data class Glossary(val name: String, val jsonFilePath: String)
 
 val frame = Frame()
 
+@Composable
+fun glossariesPage(
+    currentPage: MutableState<String>
+) {
+    var selectedGlossary by remember { mutableStateOf<Glossary?>(null) }
+    var glossaries by remember { mutableStateOf(emptyList<Glossary>()) }
+
+    Column(
+        modifier = Modifier.fillMaxSize(),
+        verticalArrangement = Arrangement.Center,
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        Text("Sélectionnez un glossaire", style = MaterialTheme.typography.h5)
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        Box(
+            modifier = Modifier
+                .height(300.dp)
+                .width(250.dp)
+                .padding(10.dp)
+        ) {
+            val scrollState = rememberLazyListState()
+            glossaries = loadGlossaries(appState.selectedProject!!)
+            if (glossaries.isEmpty()) {
+                Text("Aucun glossaire n'a été créé pour ce projet")
+            } else {
+                LazyColumn(
+                    state = scrollState,
+                    modifier = Modifier.padding(10.dp),
+                    verticalArrangement = Arrangement.spacedBy(10.dp)
+                ) {
+                    println(glossaries)
+                    items(glossaries) { glossary ->
+                        Row(
+                            modifier = Modifier.width(200.dp).fillMaxWidth(),
+                            horizontalArrangement = Arrangement.SpaceBetween
+                        ) {
+                            Button(
+                                onClick = {
+                                    selectedGlossary = glossary
+                                    currentPage.value = "glossaireDetail"
+                                },
+                                modifier = Modifier
+                                    .width(150.dp),
+                                colors = ButtonDefaults.buttonColors(
+                                    backgroundColor = customRedColor,
+                                    contentColor = Color.White
+                                )
+                            ) {
+                                Text(glossary.name)
+                            }
+
+                            IconButton(
+                                onClick = {
+                                    // Handle delete glossary action
+                                    glossaries = glossaries.filterNot { it == glossary }
+                                    val file =
+                                        File(glossaryPath + (appState.selectedProject?.name) + "/" + glossary.jsonFilePath)
+                                    file.delete()
+                                }
+                            ) {
+                                Icon(
+                                    imageVector = Icons.Default.Delete,
+                                    contentDescription = "Delete Glossary"
+                                )
+                            }
+                        }
+                    }
+                }
+            }
+            VerticalScrollbar(
+                modifier = Modifier.align(Alignment.CenterEnd).fillMaxHeight(),
+                adapter = rememberScrollbarAdapter(scrollState)
+            )
+        }
+
+        Spacer(modifier = Modifier.height(16.dp))
+        // mettre un texte "ou"
+        Text("ou", style = MaterialTheme.typography.h5)
+        Spacer(modifier = Modifier.height(16.dp))
+
+
+        Button(
+            onClick = {
+                currentPage.value = "nouveauGlossaire"
+            },
+            modifier = Modifier
+                .width(300.dp),
+            colors = ButtonDefaults.buttonColors(
+                backgroundColor = customRedColor,
+                contentColor = Color.White
+            )
+        ) {
+            Text("Créer un nouveau glossaire")
+        }
+
+        Spacer(modifier = Modifier.height(6.dp))
+
+        Button(
+            onClick = {
+                currentPage.value = "accueil"
+            },
+            modifier = Modifier
+                .width(250.dp),
+            colors = ButtonDefaults.buttonColors(
+                backgroundColor = customRedColor,
+                contentColor = Color.White
+            )
+        ) {
+            Text("Retour")
+        }
+    }
+}
+
 @OptIn(ExperimentalStdlibApi::class, ExperimentalComposeUiApi::class)
 @Composable
 fun newGlossary(
@@ -38,9 +160,8 @@ fun newGlossary(
     val glossaryAlreadyExistsSnackbarVisibleState = remember { mutableStateOf(false) }
     val invalidCharacterSnackbarVisibleState = remember { mutableStateOf(false) }
 
-    var glossaries by remember { mutableStateOf(emptyList<Glossary>()) }
-
     var nouveauGlossaireName by remember { mutableStateOf("") }
+    var glossaries by remember { mutableStateOf(emptyList<Glossary>()) }
 
     Column(
         modifier = Modifier.fillMaxSize(),
diff --git a/src/main/kotlin/main/Main.kt b/src/main/kotlin/main/Main.kt
index 51b4e5c..a41ee2d 100644
--- a/src/main/kotlin/main/Main.kt
+++ b/src/main/kotlin/main/Main.kt
@@ -1,21 +1,13 @@
 package main
 
 import androidx.compose.desktop.ui.tooling.preview.Preview
-import androidx.compose.foundation.VerticalScrollbar
-import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.foundation.lazy.items
-import androidx.compose.foundation.lazy.rememberLazyListState
-import androidx.compose.foundation.rememberScrollbarAdapter
+import androidx.compose.foundation.layout.padding
 import androidx.compose.material.*
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Delete
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.input.key.*
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.*
@@ -44,11 +36,7 @@ fun app() {
         val glossaryDetail: List<Word> by remember { mutableStateOf(emptyList()) }
         var isJavaScriptFileSelected by remember { mutableStateOf(false) }
 
-        var glossaries by remember { mutableStateOf(emptyList<Glossary>()) }
-
-        var selectedGlossary by remember { mutableStateOf<Glossary?>(null) }
-
-        val appState = AppState
+        val selectedGlossary by remember { mutableStateOf<Glossary?>(null) }
 
         val isEmptySnackbarVisibleState = remember { mutableStateOf(false) }
         val containsSpaceSnackbarVisibleState = remember { mutableStateOf(false) }
@@ -66,112 +54,9 @@ fun app() {
             }
 
             "glossaires" -> {
-                Column(
-                    modifier = Modifier.fillMaxSize(),
-                    verticalArrangement = Arrangement.Center,
-                    horizontalAlignment = Alignment.CenterHorizontally
-                ) {
-                    Text("Sélectionnez un glossaire", style = MaterialTheme.typography.h5)
-
-                    Spacer(modifier = Modifier.height(16.dp))
-
-                    Box(
-                        modifier = Modifier
-                            .height(300.dp)
-                            .width(250.dp)
-                            .padding(10.dp)
-                    ) {
-                        val scrollState = rememberLazyListState()
-                        glossaries = loadGlossaries(appState.selectedProject!!)
-                        if (glossaries.isEmpty()) {
-                            Text("Aucun glossaire n'a été créé pour ce projet")
-                        } else {
-                            LazyColumn(
-                                state = scrollState,
-                                modifier = Modifier.padding(10.dp),
-                                verticalArrangement = Arrangement.spacedBy(10.dp)
-                            ) {
-                                println(glossaries)
-                                items(glossaries) { glossary ->
-                                    Row(
-                                        modifier = Modifier.width(200.dp).fillMaxWidth(),
-                                        horizontalArrangement = Arrangement.SpaceBetween
-                                    ) {
-                                        Button(
-                                            onClick = {
-                                                selectedGlossary = glossary
-                                                currentPage.value = "glossaireDetail"
-                                            },
-                                            modifier = Modifier
-                                                .width(150.dp),
-                                            colors = ButtonDefaults.buttonColors(
-                                                backgroundColor = customRedColor,
-                                                contentColor = Color.White
-                                            )
-                                        ) {
-                                            Text(glossary.name)
-                                        }
-
-                                        IconButton(
-                                            onClick = {
-                                                // Handle delete glossary action
-                                                glossaries = glossaries.filterNot { it == glossary }
-                                                val file =
-                                                    File(glossaryPath + (appState.selectedProject?.name) + "/" + glossary.jsonFilePath)
-                                                file.delete()
-                                            }
-                                        ) {
-                                            Icon(
-                                                imageVector = Icons.Default.Delete,
-                                                contentDescription = "Delete Glossary"
-                                            )
-                                        }
-                                    }
-                                }
-                            }
-                        }
-                        VerticalScrollbar(
-                            modifier = Modifier.align(Alignment.CenterEnd).fillMaxHeight(),
-                            adapter = rememberScrollbarAdapter(scrollState)
-                        )
-                    }
-
-                    Spacer(modifier = Modifier.height(16.dp))
-                    // mettre un texte "ou"
-                    Text("ou", style = MaterialTheme.typography.h5)
-                    Spacer(modifier = Modifier.height(16.dp))
-
-
-                    Button(
-                        onClick = {
-                            currentPage.value = "nouveauGlossaire"
-                        },
-                        modifier = Modifier
-                            .width(300.dp),
-                        colors = ButtonDefaults.buttonColors(
-                            backgroundColor = customRedColor,
-                            contentColor = Color.White
-                        )
-                    ) {
-                        Text("Créer un nouveau glossaire")
-                    }
-
-                    Spacer(modifier = Modifier.height(6.dp))
-
-                    Button(
-                        onClick = {
-                            currentPage.value = "accueil"
-                        },
-                        modifier = Modifier
-                            .width(250.dp),
-                        colors = ButtonDefaults.buttonColors(
-                            backgroundColor = customRedColor,
-                            contentColor = Color.White
-                        )
-                    ) {
-                        Text("Retour")
-                    }
-                }
+                glossariesPage(
+                    currentPage = currentPage,
+                )
             }