1 files changed, 13 insertions, 3 deletions
diff --git a/FrontEnd/src/app/views/timeline-common/TimelineLine.tsx b/FrontEnd/src/app/views/timeline-common/TimelineLine.tsx
index fd7dde0a..593250bd 100644
--- a/FrontEnd/src/app/views/timeline-common/TimelineLine.tsx
+++ b/FrontEnd/src/app/views/timeline-common/TimelineLine.tsx
@@ -4,7 +4,7 @@ import React from "react";
 export interface TimelineLineProps {
   current?: boolean;
   startSegmentLength?: string | number;
-  center: "node" | null;
+  center: "node" | "loading" | "none";
   className?: string;
   style?: React.CSSProperties;
 }
@@ -19,12 +19,22 @@ const TimelineLine: React.FC<TimelineLineProps> = ({
   return (
     <div className={clsx("timeline-line", className)} style={style}>
       <div className="segment start" style={{ height: startSegmentLength }} />
-      {center == "node" ? (
+      {center !== "none" ? (
         <div className="node-container">
           <div className="node"></div>
+          {center === "loading" ? (
+            <svg className="node-loading-edge" viewBox="0 0 100 100">
+              <path
+                d="M 50,10 A 40 40 45 0 1 78.28,21.72"
+                stroke="currentcolor"
+                strokeLinecap="square"
+                strokeWidth="8"
+              />
+            </svg>
+          ) : null}
         </div>
       ) : null}
-      <div className="segment end"></div>
+      {center !== "loading" ? <div className="segment end"></div> : null}
       {current && <div className="segment current-end" />}
     </div>
   );