agentreel 0.3.1 → 0.3.2

package/bin/agentreel.mjs

@@ -29,6 +29,7 @@ function parseArgs() {
     else if (arg === "--title" || arg === "-t") flags.title = args[++i];
     else if (arg === "--output" || arg === "-o") flags.output = args[++i];
     else if (arg === "--music") flags.music = args[++i];
+    else if (arg === "--auth" || arg === "-a") flags.auth = args[++i];
     else if (arg === "--no-share") flags.noShare = true;
   }
   return flags;
@@ -47,6 +48,7 @@ Flags:
   -p, --prompt <text>     description of what the tool does
   -t, --title <text>      video title
   -o, --output <file>     output file (default: agentreel.mp4)
+  -a, --auth <file>       Playwright storage state (cookies/auth) for browser demos
       --music <file>      path to background music mp3
       --no-share          skip the share prompt
   -h, --help              show help
@@ -128,13 +130,15 @@ function browserEnv() {
   return { ...process.env, PLAYWRIGHT_BROWSERS_PATH: browsersDir };
 }
 
-function recordBrowser(url, task) {
+function recordBrowser(url, task, authState) {
   const python = findPython();
   const script = join(ROOT, "scripts", "browser_demo.py");
   const outFile = join(tmpdir(), "agentreel-browser-demo.mp4");
 
   console.error(`Agent demoing browser app: ${url}`);
-  execFileSync(python, [script, url, outFile, task], {
+  const args = [script, url, outFile, task];
+  if (authState) args.push("--auth", authState);
+  execFileSync(python, args, {
     stdio: ["ignore", "inherit", "inherit"],
     env: browserEnv(),
     timeout: 300000,
@@ -428,7 +432,7 @@ async function main() {
 
     ensureBrowserDeps();
     console.error("Step 1/3: Recording browser demo...");
-    const videoPath = recordBrowser(demoURL, task);
+    const videoPath = recordBrowser(demoURL, task, flags.auth);
 
     // Copy video to Remotion public dir so it can be served
     const publicDir = join(ROOT, "public");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentreel",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "Turn your web apps and CLIs into viral clips",
   "bin": {
     "agentreel": "./bin/agentreel.mjs"

package/scripts/browser_demo.py

@@ -124,7 +124,7 @@ def extract_highlights(video_path, task):
     return highlights
 
 
-async def record_browser_demo(url, task, output_path):
+async def record_browser_demo(url, task, output_path, auth_state=None):
     """Generate and run a Playwright demo with video recording."""
     from playwright.async_api import async_playwright
 
@@ -137,11 +137,15 @@ async def record_browser_demo(url, task, output_path):
 
     async with async_playwright() as p:
         browser = await p.chromium.launch(headless=True)
-        context = await browser.new_context(
+        ctx_opts = dict(
             viewport={"width": 1280, "height": 800},
             record_video_dir=video_dir,
             record_video_size={"width": 1280, "height": 800},
         )
+        if auth_state and os.path.isfile(auth_state):
+            ctx_opts["storage_state"] = auth_state
+            print(f"Using auth state: {auth_state}", file=sys.stderr)
+        context = await browser.new_context(**ctx_opts)
 
         # Inject click tracker — persists across navigations
         click_tracker_js = (
@@ -262,5 +266,15 @@ if __name__ == "__main__":
     else:
         url = sys.argv[1]
         output = sys.argv[2]
-        task = sys.argv[3] if len(sys.argv) > 3 else "Explore the main features"
-        asyncio.run(record_browser_demo(url, task, output))
+        # Parse remaining args: [task] [--auth <state_file>]
+        task = "Explore the main features"
+        auth_state = None
+        i = 3
+        while i < len(sys.argv):
+            if sys.argv[i] == "--auth" and i + 1 < len(sys.argv):
+                auth_state = sys.argv[i + 1]
+                i += 2
+            else:
+                task = sys.argv[i]
+                i += 1
+        asyncio.run(record_browser_demo(url, task, output, auth_state=auth_state))

package/scripts/cli_demo.py

@@ -114,18 +114,23 @@ def record_demo(steps: list[dict], workdir: str, output_path: str):
                 write_event("o", f"\x1b[38;5;245m# {desc}\x1b[0m\r\n")
                 time.sleep(0.3)
 
-            # Type the command character by character
-            write_event("o", "\x1b[38;5;76m$\x1b[0m ")
+            # Type the command character by character (no $ prompt — the renderer adds one)
+            write_event("o", "")
             for char in cmd:
                 write_event("o", char)
                 time.sleep(0.04)
             write_event("o", "\r\n")
             time.sleep(0.2)
 
-            # Execute in PTY
+            # Execute in PTY with sanitized env (hide username/hostname)
             pid, fd = pty.fork()
             if pid == 0:
                 os.chdir(workdir)
+                os.environ["PS1"] = "$ "
+                os.environ["PROMPT_COMMAND"] = ""
+                os.environ.pop("BASH_COMMAND", None)
+                # Suppress terminal title sequences (user@host)
+                os.environ["TERM"] = "dumb"
                 os.execvp("/bin/sh", ["/bin/sh", "-c", cmd])
             else:
                 deadline = time.time() + 15

package/src/CastVideo.tsx

@@ -673,17 +673,7 @@ const HighlightClip: React.FC<{
                 backgroundColor: "#50fa7b",
               }}
             />
-            <div
-              style={{
-                flex: 1,
-                textAlign: "center",
-                fontFamily: MONO,
-                fontSize: 12,
-                color: "rgba(255,255,255,0.25)",
-              }}
-            >
-              Terminal
-            </div>
+            <div style={{ flex: 1 }} />
           </div>
 
           {/* Terminal body */}

package/src/types.ts

@@ -35,57 +35,53 @@ export interface CastProps {
   title: string; // big opening title
   subtitle?: string; // smaller text under title
   highlights: Highlight[];
-  endText?: string; // closing CTA command, e.g. "npm install itsovertime"
-  endUrl?: string; // URL shown under CTA, e.g. "github.com/islo-labs/overtime"
+  endText?: string; // closing CTA command, e.g. "npx agentreel"
+  endUrl?: string; // URL shown under CTA, e.g. "github.com/islo-labs/agentreel"
   gradient?: [string, string]; // background gradient colors
 }
 
 export const defaultProps: CastProps = {
-  title: "itsovertime",
-  subtitle: "Cron for AI agents",
+  title: "agentreel",
+  subtitle: "Turn your apps into viral clips",
   highlights: [
     {
-      label: "Initialize",
+      label: "Record",
       overlay: "One command.",
       lines: [
-        { text: "npx @islo-labs/overtime init", isPrompt: true },
+        { text: "npx agentreel --cmd 'my-cli-tool'", isPrompt: true },
         { text: "" },
-        { text: "  itsovertime  Cron for AI agents", bold: true, color: "#bd93f9" },
+        { text: "  agentreel  Turn your apps into viral clips", bold: true, color: "#bd93f9" },
         { text: "" },
-        { text: "  ✓ Created overtime.yml", color: "#50fa7b" },
+        { text: "  ✓ Recording CLI demo...", color: "#50fa7b" },
       ],
     },
     {
-      label: "Configure",
-      overlay: "Plain English schedules.",
+      label: "Highlight",
+      overlay: "AI picks the best moments.",
       lines: [
-        { text: "cat overtime.yml", isPrompt: true },
-        { text: "shifts:", dim: true },
-        { text: "  - name: pr-review", color: "#f8f8f2" },
-        { text: '    schedule: "every hour"', color: "#50fa7b" },
-        { text: '    task: "Review open PRs..."', color: "#50fa7b" },
-        { text: "    notify: slack", color: "#f8f8f2" },
+        { text: "Extracting highlights...", dim: true },
+        { text: "" },
+        { text: "  ✓ 4 highlights extracted", color: "#50fa7b" },
+        { text: '    "Initialize" — first run', color: "#f8f8f2" },
+        { text: '    "Configure" — setup step', color: "#f8f8f2" },
+        { text: '    "Run" — the wow moment', color: "#f1fa8c" },
       ],
-      zoomLine: 3,
+      zoomLine: 2,
     },
     {
-      label: "Run",
-      overlay: "Fully autonomous.",
+      label: "Share",
+      overlay: "Ready to post.",
       lines: [
-        { text: "npx @islo-labs/overtime", isPrompt: true },
+        { text: "Rendering video...", dim: true },
         { text: "" },
-        { text: "┌─ itsovertime ───────────────────────────┐", color: "#bd93f9" },
-        { text: "│ pr-review    every hour     ⟳ running   │", color: "#f1fa8c" },
-        { text: "│ dep-updates  Mon at 2am     idle        │", dim: true },
-        { text: "└──────────────────────────────────────────┘", color: "#bd93f9" },
+        { text: "  Done: agentreel.mp4 (2.4 MB)", color: "#50fa7b" },
         { text: "" },
-        { text: "  ✓ PR #42 reviewed — approved", color: "#50fa7b" },
-        { text: "  ✓ PR #43 reviewed — changes requested", color: "#f1fa8c" },
+        { text: "  Share to Twitter? [Y/n]", color: "#f8f8f2" },
       ],
-      zoomLine: 3,
+      zoomLine: 2,
     },
   ],
-  endText: "npx @islo-labs/overtime",
-  endUrl: "github.com/islo-labs/overtime",
+  endText: "npx agentreel",
+  endUrl: "github.com/islo-labs/agentreel",
   gradient: ["#0f0f1a", "#1a0f2e"],
 };