Upload current progress

obsidian_automator/components/terminal.py

@@ -0,0 +1,50 @@
+import reflex as rx
+
+def terminal_window(logs: list[str], title="System Output"):
+    return rx.card(
+        rx.vstack(
+            rx.hstack(
+                rx.icon("terminal", size=18, color="var(--gray-11)"),
+                rx.text(title, size="2", weight="bold", color="var(--gray-11)"),
+                rx.spacer(),
+                # Minimal header controls (visual only for now)
+                rx.box(width="10px", height="10px", bg="var(--red-9)", border_radius="50%"),
+                rx.box(width="10px", height="10px", bg="var(--yellow-9)", border_radius="50%"),
+                rx.box(width="10px", height="10px", bg="var(--green-9)", border_radius="50%"),
+                align_items="center",
+                width="100%",
+                padding_bottom="3",
+                border_bottom="1px solid var(--gray-4)"
+            ),
+            rx.scroll_area(
+                rx.vstack(
+                    rx.foreach(
+                        logs,
+                        lambda log: rx.box(
+                            rx.text(
+                                log, 
+                                font_family="JetBrains Mono, monospace", 
+                                font_size="13px", 
+                                color="var(--gray-12)",
+                                white_space="pre-wrap" # Handle multi-line logs
+                            ),
+                            padding_y="1"
+                        )
+                    ),
+                    align_items="start",
+                    spacing="0",
+                ),
+                height="400px", # Fixed height for scroll
+                type="always",
+                scrollbars="vertical",
+                bg="var(--gray-2)",
+                padding="4",
+                border_radius="0 0 8px 8px"
+            ),
+            spacing="0",
+            width="100%"
+        ),
+        padding="0",
+        variant="surface",
+        width="100%"
+    )