add

frontend/src/components/shared/FloatingActionWidget.tsx

@@ -36,6 +36,7 @@ import { api } from "@/lib/api";
 
 // Disable jittery animations/motion for the floating widget in HF build
 const DISABLE_FLOATING_WIDGET_JITTER = true;
+const FLOATING_WIDGET_MINIMAL = true; // fixed bottom-right, no drag/tooltip; click opens splitter
 
 // Add custom glow animation styles
 const glowStyle = `
@@ -142,7 +143,7 @@ export function FloatingActionWidget() {
 
   const [isExpanded, setIsExpanded] = useState(false);
   const [isDragging, setIsDragging] = useState(false);
-  const [showTooltip, setShowTooltip] = useState(true);
+  const [showTooltip, setShowTooltip] = useState(!FLOATING_WIDGET_MINIMAL);
   const [hasMoved, setHasMoved] = useState(false);
   const [currentMood, setCurrentMood] = useState<PetMood>("curious");
   const [currentMessage, setCurrentMessage] = useState<PetMessage>({
@@ -327,10 +328,10 @@ export function FloatingActionWidget() {
   // Hide tooltip after 6 seconds or when expanded
   useEffect(() => {
     const timer = setTimeout(() => {
-      setShowTooltip(false);
+      if (!FLOATING_WIDGET_MINIMAL) setShowTooltip(false);
     }, 6000);
 
-    if (isExpanded) {
+    if (isExpanded && !FLOATING_WIDGET_MINIMAL) {
       setShowTooltip(false);
     }
 
@@ -457,6 +458,7 @@ export function FloatingActionWidget() {
 
   // Handle mouse down for dragging
   const handleMouseDown = (e: React.MouseEvent) => {
+    if (FLOATING_WIDGET_MINIMAL) return; // disable drag in minimal mode
     if (!widgetRef.current) return;
 
     e.preventDefault();
@@ -539,6 +541,12 @@ export function FloatingActionWidget() {
     // Prevent toggle during dragging or if widget was just moved
     if (isDragging || hasMoved) return;
 
+    if (FLOATING_WIDGET_MINIMAL) {
+      setIsSplitterModalOpen(true);
+      setLastInteraction(Date.now());
+      return;
+    }
+
     setIsExpanded(!isExpanded);
     setLastInteraction(Date.now()); // Update interaction time
   };
@@ -822,12 +830,11 @@ export function FloatingActionWidget() {
       {/* Collapsed Widget */}
       <div
         ref={widgetRef}
-        className={`fixed ${
-          isDragging ? "cursor-grabbing select-none" : "cursor-grab"
-        }`}
+        className={`fixed ${FLOATING_WIDGET_MINIMAL ? "cursor-pointer" : isDragging ? "cursor-grabbing select-none" : "cursor-grab"}`}
         style={{
-          left: `${position.x}px`,
-          top: `${position.y}px`,
+          ...(FLOATING_WIDGET_MINIMAL
+            ? { right: 20, bottom: 20 }
+            : { left: `${position.x}px`, top: `${position.y}px` }),
           zIndex: 9999,
           pointerEvents: "auto",
           transition: isDragging ? "none" : "all 0.1s ease",
@@ -836,18 +843,20 @@ export function FloatingActionWidget() {
         {/* Pet Widget - Always visible */}
         <div className="relative">
           <div
-            className={`w-14 h-14 bg-primary hover:bg-primary/90 rounded-full shadow-lg flex flex-col items-center justify-center cursor-pointer transition-all duration-200 hover:scale-110 relative ${
-              showTooltip ? "shadow-primary/50 shadow-2xl" : ""
-            } ${isDragging ? "scale-110 shadow-2xl opacity-90" : ""} ${
-              isExpanded ? "ring-2 ring-primary/50 ring-offset-2" : ""
+            className={`w-14 h-14 bg-primary hover:bg-primary/90 rounded-full shadow-lg flex flex-col items-center justify-center cursor-pointer transition-all duration-200 ${
+              FLOATING_WIDGET_MINIMAL ? "" : "hover:scale-110"
+            } relative ${
+              showTooltip && !FLOATING_WIDGET_MINIMAL ? "shadow-primary/50 shadow-2xl" : ""
+            } ${isDragging && !FLOATING_WIDGET_MINIMAL ? "scale-110 shadow-2xl opacity-90" : ""} ${
+              isExpanded && !FLOATING_WIDGET_MINIMAL ? "ring-2 ring-primary/50 ring-offset-2" : ""
             } ${
-              isAtChartCenter
+              isAtChartCenter && !FLOATING_WIDGET_MINIMAL
                 ? "ring-4 ring-blue-400/50 ring-offset-4 shadow-xl shadow-blue-500/30 scale-110"
                 : ""
             }`}
             onMouseDown={handleMouseDown}
-            onMouseEnter={handleMouseEnter}
-            onMouseLeave={handleMouseLeave}
+            onMouseEnter={FLOATING_WIDGET_MINIMAL ? undefined : handleMouseEnter}
+            onMouseLeave={FLOATING_WIDGET_MINIMAL ? undefined : handleMouseLeave}
             onClick={toggleExpanded}
             style={{
               // Disable glow animation to avoid jitter
@@ -864,7 +873,7 @@ export function FloatingActionWidget() {
           </div>
 
           {/* Pet tooltip with mood-based messages - only show when collapsed */}
-          {showTooltip && !isExpanded && (
+          {showTooltip && !isExpanded && !FLOATING_WIDGET_MINIMAL && (
             <div className="absolute -top-16 -right-4 w-48 bg-black/90 text-white text-xs px-3 py-2 rounded-lg shadow-lg z-10">
               <div className="text-center">{currentMessage.text}</div>
               <div className="absolute top-full right-6 w-0 h-0 border-l-4 border-r-4 border-t-4 border-transparent border-t-black/90"></div>
@@ -874,7 +883,7 @@ export function FloatingActionWidget() {
       </div>
 
       {/* Expanded Panel - Positioned Separately */}
-      {isExpanded && (
+      {isExpanded && !FLOATING_WIDGET_MINIMAL && (
         <div
           className="fixed"
           style={{

frontend/src/lib/cytoscape-graph-core.ts

@@ -297,7 +297,8 @@ export class CytoscapeGraphCore {
     const mainWorkflowTopGap = Math.min(175, nodeSpacing * 1.5);
     const mainWorkflowStartY = isolatedBottomY + mainWorkflowTopGap;
     const centerY = mainWorkflowStartY + this.config.height * 0.2;
-    const inputX = this.config.width * -0.02;
+    // Keep inputs within the visible canvas with a small left margin
+    const inputX = this.config.width * 0.04;
     const agentX = this.config.width * 0.14;
     const toolX = this.config.width * 0.3;
     const taskX = this.config.width * 0.5;

frontend/src/types/index.ts

@@ -439,6 +439,7 @@ export interface GraphComparisonResults {
       creation_timestamp?: string;
       trace_id?: string;
       trace_title?: string;
+      system_name?: string;
     };
     graph2: {
       id: number;
@@ -446,6 +447,7 @@ export interface GraphComparisonResults {
       creation_timestamp?: string;
       trace_id?: string;
       trace_title?: string;
+      system_name?: string;
     };
     comparison_timestamp?: string;
     similarity_threshold?: number;
@@ -463,6 +465,8 @@ export interface AvailableGraph {
   relation_count: number;
   status: string;
   trace_id: string;
+  system_name?: string;
+  system_summary?: string;
   window_index?: number;
   window_total?: number;
   processing_run_id?: string;