diff --git a/manage-view/src/api/apiLog.js b/manage-view/src/api/apiLog.js
index 056aefa..b6c4df7 100644
--- a/manage-view/src/api/apiLog.js
+++ b/manage-view/src/api/apiLog.js
@@ -3,4 +3,5 @@ const API = "https://logs.danielvu.com/api";
 export const getKeyValues = API + "/getKeyValue";
 export const deleteValue = API + "/deleteValue";
 export const addKeyValue = API + "/addValue";
-export const getLog = API + "/log/showLog";
\ No newline at end of file
+export const getLog = API + "/log/showLog";
+export const getListLog = API + "/getAllLogDetect";
\ No newline at end of file
diff --git a/manage-view/src/components/ListLog/ListLog.jsx b/manage-view/src/components/ListLog/ListLog.jsx
index a0c9c0e..34ec15f 100644
--- a/manage-view/src/components/ListLog/ListLog.jsx
+++ b/manage-view/src/components/ListLog/ListLog.jsx
@@ -1,9 +1,38 @@
-import React from 'react'
+import axios from "axios";
+import React, { useEffect, useState } from "react";
+import { Navigate, useParams } from "react-router-dom";
+import { getListLog } from "../../api/apiLog";
 
 const ListLog = () => {
-  return (
-    <div>ListLog</div>
-  )
-}
+  const [listFile, setListFile] = useState({});
+  const [status, setStatus] = useState();
+  const getListFile = async () => {
+    try {
+      const res = await axios.get(getListLog);
+      setListFile(res.data);
+      setStatus(res.status);
+    } catch (error) {
+      console.log(error);
+    }
+  };
 
-export default ListLog
\ No newline at end of file
+  if (status === 200) {
+    return (
+      <div>
+        {listFile?.map((file) => {
+          <span>{file}</span>;
+        })}
+      </div>
+    );
+  } else {
+    return (
+      <div>
+        <h1>
+          <i>No files</i>
+        </h1>
+      </div>
+    );
+  }
+};
+
+export default ListLog;
diff --git a/start/routes.ts b/start/routes.ts
index bba7a7b..b9c90b5 100644
--- a/start/routes.ts
+++ b/start/routes.ts
@@ -139,6 +139,21 @@ Route.get("/api/log/showLog/:name?", async ({ request, response }) => {
   }
 });
 
+Route.get("/api/getAllLogDetect", async ({ request, response }) => {
+  try {
+    // fghf
+    console.log(request.params().name);
+    let fileDetect = await LogDetectFile.all()
+    let listFiles = fileDetect.map(obj=>obj.file_name)
+    response
+      .status(200)
+      .send(listFiles);
+  } catch (error) {
+    response
+    .status(203)
+    .send("NO FILE");
+  }
+});
 //Key-Value
 
 Route.post("/api/getKeyValue", async ({ request, response }) => {