added logs list

app/src/components/ui/simulation/simulationPlayer.tsx

@@ -16,6 +16,7 @@ import {
   SpeedIcon,
   StartIcon,
 } from "../../icons/ExportCommonIcons";
+import { getAvatarColor } from "../../../modules/collaboration/functions/getAvatarColor";
 
 const SimulationPlayer: React.FC = () => {
   const { speed, setSpeed } = useAnimationPlaySpeed();
@@ -110,15 +111,6 @@ const SimulationPlayer: React.FC = () => {
     return color;
   };
 
-  // Store colors for each process item
-  const [processColors, setProcessColors] = useState<string[]>([]);
-
-  // Generate colors on mount or when process changes
-  useEffect(() => {
-    const generatedColors = process.map(() => getRandomColor());
-    setProcessColors(generatedColors);
-  }, []);
-
   const intervals = [10, 20, 30, 40, 50, 60]; // in minutes
   const totalSegments = intervals.length;
   const progress = 20; // percent (example)
@@ -328,6 +320,8 @@ const SimulationPlayer: React.FC = () => {
           </div>
         </div>
         <div className="processDisplayer">
+          <div className="start-displayer timmer">00:00</div>
+          <div className="end-displayer timmer">24:00</div>
           <div
             className="process-player"
             style={{ left: playerPosition, position: "absolute" }}
@@ -343,7 +337,7 @@ const SimulationPlayer: React.FC = () => {
                 className="process"
                 style={{
                   width: `${item.completed}%`,
-                  backgroundColor: processColors[index],
+                  backgroundColor: getAvatarColor(index),
                 }}
               ></div>
             ))}