thepopebot 1.1.2 → 1.2.3

package/templates/app/components/setup-form.jsx

@@ -0,0 +1,82 @@
+'use client';
+
+import { useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { Button } from './ui/button';
+import { Input } from './ui/input';
+import { Label } from './ui/label';
+import { Card, CardHeader, CardTitle, CardDescription, CardContent } from './ui/card';
+import { setupAdmin } from 'thepopebot/auth/actions';
+
+export function SetupForm() {
+  const router = useRouter();
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+  const [loading, setLoading] = useState(false);
+
+  async function handleSubmit(e) {
+    e.preventDefault();
+    setError('');
+    setLoading(true);
+
+    try {
+      const result = await setupAdmin(email, password);
+
+      if (result.error) {
+        setError(result.error);
+        setLoading(false);
+        return;
+      }
+
+      // Redirect to login — admin must authenticate through the normal flow
+      router.push('/login');
+    } catch {
+      setError('Something went wrong. Please try again.');
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  return (
+    <Card className="w-full max-w-sm">
+      <CardHeader>
+        <CardTitle>Create Admin Account</CardTitle>
+        <CardDescription>Set up your first admin account to get started.</CardDescription>
+      </CardHeader>
+      <CardContent>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <div className="space-y-2">
+            <Label htmlFor="email">Email</Label>
+            <Input
+              id="email"
+              type="email"
+              placeholder="admin@example.com"
+              value={email}
+              onChange={(e) => setEmail(e.target.value)}
+              required
+            />
+          </div>
+          <div className="space-y-2">
+            <Label htmlFor="password">Password</Label>
+            <Input
+              id="password"
+              type="password"
+              placeholder="Min 8 characters"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
+              required
+              minLength={8}
+            />
+          </div>
+          {error && (
+            <p className="text-sm text-destructive">{error}</p>
+          )}
+          <Button type="submit" className="w-full" disabled={loading}>
+            {loading ? 'Creating...' : 'Create Account'}
+          </Button>
+        </form>
+      </CardContent>
+    </Card>
+  );
+}

package/templates/app/components/theme-provider.jsx

@@ -0,0 +1,11 @@
+'use client';
+
+import { ThemeProvider as NextThemesProvider } from 'next-themes';
+
+export function ThemeProvider({ children }) {
+  return (
+    <NextThemesProvider attribute="class" defaultTheme="system" enableSystem>
+      {children}
+    </NextThemesProvider>
+  );
+}

package/templates/app/components/theme-toggle.jsx

@@ -0,0 +1,38 @@
+'use client';
+
+import { useTheme } from 'next-themes';
+import { useEffect, useState } from 'react';
+
+export function ThemeToggle() {
+  const { theme, setTheme } = useTheme();
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => setMounted(true), []);
+
+  if (!mounted) return <div className="h-[34px] w-[106px]" />;
+
+  const options = [
+    { value: 'light', label: '☀️' },
+    { value: 'dark', label: '🌙' },
+    { value: 'system', label: '💻' },
+  ];
+
+  return (
+    <div className="flex items-center gap-1 rounded-md border border-border bg-muted p-1">
+      {options.map((opt) => (
+        <button
+          key={opt.value}
+          onClick={() => setTheme(opt.value)}
+          className={`rounded px-2 py-1 text-sm transition-colors ${
+            theme === opt.value
+              ? 'bg-background text-foreground shadow-sm'
+              : 'text-muted-foreground hover:text-foreground'
+          }`}
+          title={opt.value.charAt(0).toUpperCase() + opt.value.slice(1)}
+        >
+          {opt.label}
+        </button>
+      ))}
+    </div>
+  );
+}

package/templates/app/components/ui/button.jsx

@@ -0,0 +1,21 @@
+'use client';
+
+export function Button({ children, variant = 'default', className = '', disabled, ...props }) {
+  const base = 'inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 px-4 py-2';
+
+  const variants = {
+    default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+    outline: 'border border-border bg-transparent text-foreground hover:bg-muted',
+    ghost: 'text-foreground hover:bg-muted',
+  };
+
+  return (
+    <button
+      className={`${base} ${variants[variant] || variants.default} ${className}`}
+      disabled={disabled}
+      {...props}
+    >
+      {children}
+    </button>
+  );
+}

package/templates/app/components/ui/card.jsx

@@ -0,0 +1,23 @@
+export function Card({ children, className = '' }) {
+  return (
+    <div className={`rounded-lg border border-border bg-muted p-6 ${className}`}>
+      {children}
+    </div>
+  );
+}
+
+export function CardHeader({ children, className = '' }) {
+  return <div className={`mb-4 ${className}`}>{children}</div>;
+}
+
+export function CardTitle({ children, className = '' }) {
+  return <h2 className={`text-lg font-semibold text-foreground ${className}`}>{children}</h2>;
+}
+
+export function CardDescription({ children, className = '' }) {
+  return <p className={`text-sm text-muted-foreground ${className}`}>{children}</p>;
+}
+
+export function CardContent({ children, className = '' }) {
+  return <div className={className}>{children}</div>;
+}

package/templates/app/components/ui/input.jsx

@@ -0,0 +1,10 @@
+'use client';
+
+export function Input({ className = '', ...props }) {
+  return (
+    <input
+      className={`flex h-10 w-full rounded-md border border-border bg-input px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${className}`}
+      {...props}
+    />
+  );
+}

package/templates/app/components/ui/label.jsx

@@ -0,0 +1,10 @@
+export function Label({ children, className = '', ...props }) {
+  return (
+    <label
+      className={`text-sm font-medium text-foreground ${className}`}
+      {...props}
+    >
+      {children}
+    </label>
+  );
+}

package/templates/app/crons/page.js

@@ -0,0 +1,7 @@
+import { auth } from 'thepopebot/auth';
+import { CronsPage } from 'thepopebot/chat';
+
+export default async function CronsRoute() {
+  const session = await auth();
+  return <CronsPage session={session} />;
+}

package/templates/app/globals.css

@@ -0,0 +1,66 @@
+@import "tailwindcss";
+@import "streamdown/styles.css";
+@source "../node_modules/thepopebot/lib/**/*.{js,jsx}";
+
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+  --primary: #171717;
+  --primary-foreground: #ffffff;
+  --muted: #f5f5f5;
+  --muted-foreground: #737373;
+  --border: #e5e5e5;
+  --input: #f5f5f5;
+  --ring: #171717;
+  --destructive: #dc2626;
+}
+
+.dark {
+  --background: #0a0a0a;
+  --foreground: #ededed;
+  --primary: #ededed;
+  --primary-foreground: #0a0a0a;
+  --muted: #171717;
+  --muted-foreground: #a3a3a3;
+  --border: #262626;
+  --input: #171717;
+  --ring: #ededed;
+  --destructive: #ef4444;
+}
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-destructive: var(--destructive);
+  --font-sans: system-ui, -apple-system, sans-serif;
+  --font-mono: ui-monospace, 'Cascadia Code', 'Source Code Pro', monospace;
+  --radius-sm: 0.375rem;
+  --radius-md: 0.5rem;
+  --radius-lg: 0.75rem;
+}
+
+/* Scrollbar styling */
+.scrollbar-thin {
+  scrollbar-width: thin;
+  scrollbar-color: var(--border) transparent;
+}
+
+.scrollbar-thin::-webkit-scrollbar {
+  width: 6px;
+}
+
+.scrollbar-thin::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.scrollbar-thin::-webkit-scrollbar-thumb {
+  background-color: var(--border);
+  border-radius: 3px;
+}

package/templates/app/layout.js

@@ -1,3 +1,6 @@
+import './globals.css';
+import { ThemeProvider } from './components/theme-provider';
+
 export const metadata = {
   title: 'thepopebot',
   description: 'AI Agent',
@@ -5,8 +8,12 @@ export const metadata = {
 
 export default function RootLayout({ children }) {
   return (
-    <html lang="en">
-      <body style={{ margin: 0, overflow: 'hidden' }}>{children}</body>
+    <html lang="en" suppressHydrationWarning>
+      <body className="min-h-screen bg-background text-foreground antialiased">
+        <ThemeProvider>
+          {children}
+        </ThemeProvider>
+      </body>
     </html>
   );
 }

package/templates/app/login/page.js

@@ -0,0 +1,15 @@
+import { getPageAuthState } from 'thepopebot/auth';
+import { AsciiLogo } from '../components/ascii-logo';
+import { SetupForm } from '../components/setup-form';
+import { LoginForm } from '../components/login-form';
+
+export default async function LoginPage() {
+  const { needsSetup } = await getPageAuthState();
+
+  return (
+    <main className="min-h-screen flex flex-col items-center justify-center p-8">
+      <AsciiLogo />
+      {needsSetup ? <SetupForm /> : <LoginForm />}
+    </main>
+  );
+}

package/templates/app/notifications/page.js

@@ -0,0 +1,7 @@
+import { auth } from 'thepopebot/auth';
+import { NotificationsPage } from 'thepopebot/chat';
+
+export default async function NotificationsRoute() {
+  const session = await auth();
+  return <NotificationsPage session={session} />;
+}

package/templates/app/page.js

@@ -1,31 +1,7 @@
-export default function Home() {
-  return (
-    <main style={{
-      minHeight: '100vh',
-      backgroundColor: '#0a0a0a',
-      color: '#e0e0e0',
-      display: 'flex',
-      flexDirection: 'column',
-      alignItems: 'center',
-      justifyContent: 'center',
-      fontFamily: 'system-ui, sans-serif',
-      padding: '2rem',
-    }}>
-      <pre style={{
-        color: '#00e5ff',
-        fontSize: 'clamp(0.45rem, 1.5vw, 0.85rem)',
-        lineHeight: 1.3,
-        textAlign: 'left',
-        marginBottom: '2rem',
-      }}>{` _____ _          ____                  ____        _
-|_   _| |__   ___|  _ \\ ___  _ __   ___| __ )  ___ | |_
-  | | | '_ \\ / _ \\ |_) / _ \\| '_ \\ / _ \\  _ \\ / _ \\| __|
-  | | | | | |  __/  __/ (_) | |_) |  __/ |_) | (_) | |_
-  |_| |_| |_|\\___|_|   \\___/| .__/ \\___|____/ \\___/ \\__|
-                            |_|`}</pre>
-      <p style={{ color: '#888', fontSize: '1rem' }}>
-        Your AI agent is running.
-      </p>
-    </main>
-  );
+import { auth } from 'thepopebot/auth';
+import { ChatPage } from 'thepopebot/chat';
+
+export default async function Home() {
+  const session = await auth();
+  return <ChatPage session={session} needsSetup={false} />;
 }

package/templates/app/settings/layout.js

@@ -0,0 +1,7 @@
+import { auth } from 'thepopebot/auth';
+import { SettingsLayout } from 'thepopebot/chat';
+
+export default async function Layout({ children }) {
+  const session = await auth();
+  return <SettingsLayout session={session}>{children}</SettingsLayout>;
+}

package/templates/app/settings/page.js

@@ -0,0 +1,5 @@
+import { redirect } from 'next/navigation';
+
+export default function SettingsRoot() {
+  redirect('/settings/secrets');
+}

package/templates/app/settings/secrets/page.js

@@ -0,0 +1,5 @@
+import { SettingsSecretsPage } from 'thepopebot/chat';
+
+export default function SecretsRoute() {
+  return <SettingsSecretsPage />;
+}

package/templates/app/swarm/page.js

@@ -0,0 +1,7 @@
+import { auth } from 'thepopebot/auth';
+import { SwarmPage } from 'thepopebot/chat';
+
+export default async function SwarmRoute() {
+  const session = await auth();
+  return <SwarmPage session={session} />;
+}

package/templates/app/triggers/page.js

@@ -0,0 +1,7 @@
+import { auth } from 'thepopebot/auth';
+import { TriggersPage } from 'thepopebot/chat';
+
+export default async function TriggersRoute() {
+  const session = await auth();
+  return <TriggersPage session={session} />;
+}

package/templates/config/CRONS.json

@@ -30,7 +30,7 @@
   {
     "name": "ping-status",
     "schedule": "*/5 * * * *",
-    "type": "http",
+    "type": "webhook",
     "url": "https://example.com/status",
     "method": "POST",
     "vars": { "source": "heartbeat" },
@@ -39,7 +39,7 @@
   {
     "name": "health-check",
     "schedule": "*/10 * * * *",
-    "type": "http",
+    "type": "webhook",
     "url": "https://example.com/health",
     "method": "GET",
     "enabled": false

package/templates/config/TRIGGERS.json

@@ -35,7 +35,7 @@
     "name": "forward-github",
     "watch_path": "/github/webhook",
     "actions": [
-      { "type": "http", "url": "https://example.com/hook", "method": "POST", "vars": { "source": "github" } }
+      { "type": "webhook", "url": "https://example.com/hook", "method": "POST", "vars": { "source": "github" } }
     ],
     "enabled": false
   },
@@ -43,7 +43,7 @@
     "name": "forward-webhook",
     "watch_path": "/webhook",
     "actions": [
-      { "type": "http", "url": "https://example.com/hook", "method": "POST", "vars": { "source": "webhook" } }
+      { "type": "webhook", "url": "https://example.com/hook", "method": "POST", "vars": { "source": "webhook" } }
     ],
     "enabled": false
   }

package/templates/docker/event_handler/Dockerfile

@@ -0,0 +1,19 @@
+FROM node:22-bookworm-slim
+
+RUN apt-get update && apt-get install -y \
+    curl \
+    && rm -rf /var/lib/apt/lists/*
+
+WORKDIR /app
+
+COPY package.json package-lock.json* ./
+
+RUN npm install --omit=dev
+
+COPY . .
+
+RUN npm run build
+
+EXPOSE 80
+
+CMD ["npx", "next", "start", "-p", "80"]

package/templates/docker/{entrypoint.sh → job/entrypoint.sh}

@@ -73,11 +73,11 @@ PROMPT="
 
 $(cat /job/logs/${JOB_ID}/job.md)"
 
-PROVIDER="${PROVIDER:-anthropic}"
+LLM_PROVIDER="${LLM_PROVIDER:-anthropic}"
 
-MODEL_FLAGS="--provider $PROVIDER"
-if [ -n "$MODEL" ]; then
-    MODEL_FLAGS="$MODEL_FLAGS --model $MODEL"
+MODEL_FLAGS="--provider $LLM_PROVIDER"
+if [ -n "$LLM_MODEL" ]; then
+    MODEL_FLAGS="$MODEL_FLAGS --model $LLM_MODEL"
 fi
 
 # Copy custom models.json to PI's global config if present in repo

package/templates/docker/runner/Dockerfile

@@ -0,0 +1,38 @@
+FROM ubuntu:24.04
+
+ARG RUNNER_VERSION=2.321.0
+ARG RUNNER_ARCH=x64
+
+RUN apt-get update && apt-get install -y \
+    curl \
+    jq \
+    git \
+    ca-certificates \
+    gnupg \
+    && rm -rf /var/lib/apt/lists/*
+
+# Install Docker CLI (talks to host daemon via socket)
+RUN install -m 0755 -d /etc/apt/keyrings \
+    && curl -fsSL https://download.docker.com/linux/ubuntu/gpg | gpg --dearmor -o /etc/apt/keyrings/docker.gpg \
+    && chmod a+r /etc/apt/keyrings/docker.gpg \
+    && echo "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu noble stable" > /etc/apt/sources.list.d/docker.list \
+    && apt-get update && apt-get install -y docker-ce-cli \
+    && rm -rf /var/lib/apt/lists/*
+
+# Create non-root runner user
+RUN useradd -m -s /bin/bash runner \
+    && usermod -aG root runner
+
+# Download and extract GitHub Actions runner
+WORKDIR /home/runner
+RUN curl -fsSL "https://github.com/actions/runner/releases/download/v${RUNNER_VERSION}/actions-runner-linux-${RUNNER_ARCH}-${RUNNER_VERSION}.tar.gz" \
+    | tar xz \
+    && ./bin/installdependencies.sh \
+    && chown -R runner:runner /home/runner
+
+COPY entrypoint.sh /entrypoint.sh
+RUN chmod +x /entrypoint.sh
+
+USER runner
+
+ENTRYPOINT ["/entrypoint.sh"]

package/templates/docker/runner/entrypoint.sh

@@ -0,0 +1,41 @@
+#!/bin/bash
+set -e
+
+# Required environment variables
+: "${REPO_URL:?REPO_URL is required}"
+: "${ACCESS_TOKEN:?ACCESS_TOKEN is required}"
+
+RUNNER_NAME="${RUNNER_NAME:-thepopebot-runner}"
+LABELS="${LABELS:-self-hosted,thepopebot}"
+
+# Generate a registration token from the PAT
+REG_TOKEN=$(curl -s -X POST \
+  -H "Authorization: token ${ACCESS_TOKEN}" \
+  -H "Accept: application/vnd.github.v3+json" \
+  "${REPO_URL/github.com/api.github.com/repos}/actions/runners/registration-token" \
+  | jq -r '.token')
+
+if [ "$REG_TOKEN" = "null" ] || [ -z "$REG_TOKEN" ]; then
+  echo "Failed to get registration token. Check ACCESS_TOKEN permissions."
+  exit 1
+fi
+
+# Configure the runner
+./config.sh \
+  --url "$REPO_URL" \
+  --token "$REG_TOKEN" \
+  --name "$RUNNER_NAME" \
+  --labels "$LABELS" \
+  --unattended \
+  --replace
+
+# Deregister on shutdown
+cleanup() {
+  echo "Removing runner..."
+  ./config.sh remove --token "$REG_TOKEN" 2>/dev/null || true
+}
+trap cleanup SIGTERM SIGINT
+
+# Start the runner (blocks until stopped)
+./run.sh &
+wait $!

package/templates/docker-compose.yml

@@ -0,0 +1,52 @@
+services:
+  traefik:
+    image: traefik:v3
+    command:
+      - --providers.docker=true
+      - --providers.docker.exposedByDefault=false
+      - --entrypoints.web.address=:80
+      - --entrypoints.websecure.address=:443
+      - --entrypoints.web.http.redirections.entrypoint.to=websecure
+      - --entrypoints.web.http.redirections.entrypoint.scheme=https
+      - --certificatesresolvers.letsencrypt.acme.email=${LETSENCRYPT_EMAIL:-}
+      - --certificatesresolvers.letsencrypt.acme.storage=/letsencrypt/acme.json
+      - --certificatesresolvers.letsencrypt.acme.httpchallenge.entrypoint=web
+    ports:
+      - "80:80"
+      - "443:443"
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock:ro
+      - traefik_certs:/letsencrypt
+    restart: unless-stopped
+
+  event_handler:
+    image: ${EVENT_HANDLER_IMAGE_URL:-stephengpope/thepopebot-event-handler:latest}
+    volumes:
+      - ./.env:/app/.env
+      - ./config:/app/config
+      - ./data:/app/data
+      - ./cron:/app/cron
+      - ./triggers:/app/triggers
+      - ./logs:/app/logs
+    labels:
+      - traefik.enable=true
+      # Set APP_HOSTNAME in .env to the domain from APP_URL (e.g., mybot.example.com)
+      - traefik.http.routers.event_handler.rule=Host(`${APP_HOSTNAME}`)
+      - traefik.http.routers.event_handler.entrypoints=websecure
+      - traefik.http.routers.event_handler.tls.certresolver=letsencrypt
+      - traefik.http.services.event_handler.loadbalancer.server.port=80
+    restart: unless-stopped
+
+  runner:
+    image: ${RUNNER_IMAGE_URL:-stephengpope/thepopebot-runner:latest}
+    environment:
+      REPO_URL: https://github.com/${GH_OWNER}/${GH_REPO}
+      ACCESS_TOKEN: ${GH_TOKEN}
+      RUNNER_SCOPE: repo
+      LABELS: self-hosted,thepopebot
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+    restart: unless-stopped
+
+volumes:
+  traefik_certs:

package/templates/instrumentation.js

@@ -1 +1,6 @@
-export { register } from 'thepopebot/instrumentation';
+export async function register() {
+  if (process.env.NEXT_RUNTIME === 'nodejs') {
+    const { register } = await import('thepopebot/instrumentation');
+    await register();
+  }
+}

package/templates/middleware.js

@@ -0,0 +1 @@
+export { middleware, config } from 'thepopebot/middleware';

package/templates/postcss.config.mjs

@@ -0,0 +1,5 @@
+export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};