diff --git a/app/src/components/ui/log/LoggerContext.tsx b/app/src/components/ui/log/LoggerContext.tsx
index 71bd467..f011609 100644
--- a/app/src/components/ui/log/LoggerContext.tsx
+++ b/app/src/components/ui/log/LoggerContext.tsx
@@ -1,4 +1,5 @@
 import React, { createContext, useContext, useState, useCallback, useMemo } from "react";
+import { MathUtils } from "three";
 
 export type LogType = "log" | "info" | "warning" | "error" | "success";
 
@@ -30,22 +31,17 @@ export const LoggerProvider: React.FC<{ children: React.ReactNode }> = ({
   const [logs, setLogs] = useState<LogEntry[]>([]);
   const [isLogListVisible, setIsLogListVisible] = useState<boolean>(false);
 
-  const generateId = useCallback(
-    () => Math.random().toString(36).substring(2, 9),
-    []
-  );
-
   const addLog = useCallback(
     (type: LogType, message: string) => {
       const newLog: LogEntry = {
-        id: generateId(),
+        id: MathUtils.generateUUID(),
         type,
         message,
         timestamp: new Date(),
       };
       setLogs((prevLogs) => [...prevLogs, newLog]);
     },
-    [generateId]
+    []
   );
 
   const loggerMethods: LoggerContextValue = useMemo(() => ({