Feat: Add context node #9869 (#10266)

### What problem does this PR solve?

Feat: Add context node #9869
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/data-flow/log-sheet/dataflow-timeline.tsx

@@ -89,9 +89,16 @@ export function DataflowTimeline({ traceList }: DataflowTimelineProps) {
                         >
                           <span>{x.datetime}</span>
                           {item.component_id !== 'END' && (
-                            <span>{x.message}</span>
+                            <span
+                              className={cn({
+                                'text-state-error':
+                                  x.message.startsWith('[ERROR]'),
+                              })}
+                            >
+                              {x.message}
+                            </span>
                           )}
-                          <span>{x.elapsed_time.toString().slice(0, 6)}</span>
+                          <span>{x.elapsed_time.toString().slice(0, 6)}s</span>
                         </section>
                       ))}
                     </div>

web/src/pages/data-flow/log-sheet/index.tsx

@@ -40,7 +40,10 @@ export function LogSheet({
 
   return (
     <Sheet open onOpenChange={hideModal} modal={false}>
-      <SheetContent className={cn('top-20')}>
+      <SheetContent
+        className={cn('top-20')}
+        onInteractOutside={(e) => e.preventDefault()}
+      >
         <SheetHeader>
           <SheetTitle className="flex items-center gap-2.5">
             <Logs className="size-4" /> {t('flow.log')}