crca 1.4.0__py3-none-any.whl

tools/bolt.diy/app/components/workflow/WorkflowTimeline.tsx

@@ -0,0 +1,150 @@
+/**
+ * Workflow Timeline Component.
+ * 
+ * Visual timeline showing all phases of the workflow from proposal to deployment.
+ */
+
+import { useState } from 'react';
+import { WorkflowPhase } from './WorkflowPhase';
+import type { WorkflowStatus as WorkflowStatusType } from '~/routes/api.workflow-status.$proposalId';
+import { classNames } from '~/utils/classNames';
+
+interface WorkflowTimelineProps {
+  workflowStatus: WorkflowStatusType;
+}
+
+export function WorkflowTimeline({ workflowStatus }: WorkflowTimelineProps) {
+  const [expandedPhase, setExpandedPhase] = useState<string | null>(null);
+
+  const statusColors = {
+    pending: "text-bolt-elements-textTertiary",
+    running: "text-blue-500",
+    success: "text-green-500",
+    failed: "text-red-500",
+    skipped: "text-yellow-500"
+  };
+
+  const statusIcons = {
+    pending: "○",
+    running: "⟳",
+    success: "✓",
+    failed: "✗",
+    skipped: "⊘"
+  };
+
+  return (
+    <div className="space-y-6">
+      {/* Overall Status */}
+      <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-6">
+        <div className="flex items-center justify-between mb-4">
+          <div>
+            <h2 className="text-xl font-semibold text-bolt-elements-textPrimary">
+              Overall Status
+            </h2>
+            <p className="text-sm text-bolt-elements-textSecondary mt-1">
+              {workflowStatus.phases.length} phases • Current: {workflowStatus.current_phase}
+            </p>
+          </div>
+          <div className={classNames(
+            "px-4 py-2 rounded-lg font-medium",
+            statusColors[workflowStatus.overall_status] || statusColors.pending,
+            "bg-bolt-elements-background-depth-1"
+          )}>
+            {statusIcons[workflowStatus.overall_status] || "○"} {workflowStatus.overall_status.toUpperCase()}
+          </div>
+        </div>
+
+        {workflowStatus.deployment_url && (
+          <div className="mt-4 p-3 bg-green-500/10 border border-green-500/20 rounded-lg">
+            <p className="text-sm text-green-500 font-medium mb-1">Deployment URL</p>
+            <a 
+              href={workflowStatus.deployment_url} 
+              target="_blank" 
+              rel="noopener noreferrer"
+              className="text-sm text-green-400 hover:text-green-300 underline"
+            >
+              {workflowStatus.deployment_url}
+            </a>
+          </div>
+        )}
+
+        {workflowStatus.test_results && (
+          <div className="mt-4 p-3 bg-blue-500/10 border border-blue-500/20 rounded-lg">
+            <p className="text-sm text-blue-500 font-medium mb-1">Test Results</p>
+            <div className="text-sm text-bolt-elements-textSecondary">
+              Status: {workflowStatus.test_results.status} • 
+              {workflowStatus.test_results.tests_passed ? " ✓ Passed" : " ✗ Failed"} • 
+              Coverage: {workflowStatus.test_results.coverage ? `${(workflowStatus.test_results.coverage * 100).toFixed(1)}%` : "N/A"}
+            </div>
+          </div>
+        )}
+      </div>
+
+      {/* Timeline */}
+      <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-6">
+        <h3 className="text-lg font-semibold text-bolt-elements-textPrimary mb-6">
+          Workflow Phases
+        </h3>
+        
+        <div className="space-y-4">
+          {workflowStatus.phases.map((phase, index) => (
+            <div key={phase.id} className="relative">
+              {/* Timeline connector */}
+              {index < workflowStatus.phases.length - 1 && (
+                <div className="absolute left-6 top-12 w-0.5 h-full bg-bolt-elements-borderColor" />
+              )}
+              
+              <div className="flex items-start gap-4">
+                {/* Status indicator */}
+                <div className={classNames(
+                  "flex-shrink-0 w-12 h-12 rounded-full flex items-center justify-center font-bold text-lg",
+                  phase.status === "success" ? "bg-green-500/20 text-green-500" :
+                  phase.status === "failed" ? "bg-red-500/20 text-red-500" :
+                  phase.status === "running" ? "bg-blue-500/20 text-blue-500 animate-pulse" :
+                  "bg-bolt-elements-background-depth-1 text-bolt-elements-textTertiary"
+                )}>
+                  {statusIcons[phase.status] || "○"}
+                </div>
+
+                {/* Phase content */}
+                <div className="flex-1">
+                  <WorkflowPhase
+                    phase={phase}
+                    isExpanded={expandedPhase === phase.id}
+                    onToggle={() => setExpandedPhase(expandedPhase === phase.id ? null : phase.id)}
+                  />
+                </div>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+
+      {/* Quick Stats */}
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-4">
+          <p className="text-sm text-bolt-elements-textSecondary mb-1">Total Phases</p>
+          <p className="text-2xl font-bold text-bolt-elements-textPrimary">
+            {workflowStatus.phases.length}
+          </p>
+        </div>
+        <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-4">
+          <p className="text-sm text-bolt-elements-textSecondary mb-1">Completed</p>
+          <p className="text-2xl font-bold text-green-500">
+            {workflowStatus.phases.filter(p => p.status === "success").length}
+          </p>
+        </div>
+        <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-4">
+          <p className="text-sm text-bolt-elements-textSecondary mb-1">Duration</p>
+          <p className="text-2xl font-bold text-bolt-elements-textPrimary">
+            {workflowStatus.phases.length > 0 && workflowStatus.phases[0].timestamp && 
+             workflowStatus.phases[workflowStatus.phases.length - 1].timestamp
+              ? `${Math.round((workflowStatus.phases[workflowStatus.phases.length - 1].timestamp! - workflowStatus.phases[0].timestamp!) / 60)}m`
+              : "N/A"}
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}
+

tools/bolt.diy/app/entry.client.tsx

@@ -0,0 +1,7 @@
+import { RemixBrowser } from '@remix-run/react';
+import { startTransition } from 'react';
+import { hydrateRoot } from 'react-dom/client';
+
+startTransition(() => {
+  hydrateRoot(document.getElementById('root')!, <RemixBrowser />);
+});

tools/bolt.diy/app/entry.server.tsx

@@ -0,0 +1,80 @@
+import type { AppLoadContext } from '@remix-run/cloudflare';
+import { RemixServer } from '@remix-run/react';
+import { isbot } from 'isbot';
+import { renderToReadableStream } from 'react-dom/server';
+import { renderHeadToString } from 'remix-island';
+import { Head } from '~/root';
+import { themeStore } from '~/lib/stores/theme';
+
+export default async function handleRequest(
+  request: Request,
+  responseStatusCode: number,
+  responseHeaders: Headers,
+  remixContext: any,
+  _loadContext: AppLoadContext,
+) {
+  // await initializeModelList({});
+
+  const readable = await renderToReadableStream(<RemixServer context={remixContext} url={request.url} />, {
+    signal: request.signal,
+    onError(error: unknown) {
+      console.error(error);
+      responseStatusCode = 500;
+    },
+  });
+
+  const body = new ReadableStream({
+    start(controller) {
+      const head = renderHeadToString({ request, remixContext, Head });
+
+      controller.enqueue(
+        new Uint8Array(
+          new TextEncoder().encode(
+            `<!DOCTYPE html><html lang="en" data-theme="${themeStore.value}"><head>${head}</head><body><div id="root" class="w-full h-full">`,
+          ),
+        ),
+      );
+
+      const reader = readable.getReader();
+
+      function read() {
+        reader
+          .read()
+          .then(({ done, value }) => {
+            if (done) {
+              controller.enqueue(new Uint8Array(new TextEncoder().encode('</div></body></html>')));
+              controller.close();
+
+              return;
+            }
+
+            controller.enqueue(value);
+            read();
+          })
+          .catch((error) => {
+            controller.error(error);
+            readable.cancel();
+          });
+      }
+      read();
+    },
+
+    cancel() {
+      readable.cancel();
+    },
+  });
+
+  if (isbot(request.headers.get('user-agent') || '')) {
+    await readable.allReady;
+  }
+
+  responseHeaders.set('Content-Type', 'text/html');
+
+  responseHeaders.set('Cross-Origin-Embedder-Policy', 'require-corp');
+  responseHeaders.set('Cross-Origin-Opener-Policy', 'same-origin');
+
+  return new Response(body, {
+    headers: responseHeaders,
+    status: responseStatusCode,
+  });
+}

tools/bolt.diy/app/root.tsx

@@ -0,0 +1,156 @@
+import { useStore } from '@nanostores/react';
+import type { LinksFunction } from '@remix-run/cloudflare';
+import { Links, Meta, Outlet, Scripts, ScrollRestoration } from '@remix-run/react';
+import tailwindReset from '@unocss/reset/tailwind-compat.css?url';
+import { themeStore } from '~/lib/stores/theme';
+import { stripIndents } from '~/utils/stripIndent';
+import { createHead } from 'remix-island';
+import { useEffect } from 'react';
+import { DndProvider } from 'react-dnd';
+import { HTML5Backend } from 'react-dnd-html5-backend';
+import { ClientOnly } from 'remix-utils/client-only';
+import { cssTransition, ToastContainer } from 'react-toastify';
+
+import reactToastifyStyles from 'react-toastify/dist/ReactToastify.css?url';
+import globalStyles from '~/styles/index.scss?url';
+import xtermStyles from '@xterm/xterm/css/xterm.css?url';
+
+import 'virtual:uno.css';
+
+const toastAnimation = cssTransition({
+  enter: 'animated fadeInRight',
+  exit: 'animated fadeOutRight',
+});
+
+export const links: LinksFunction = () => [
+  {
+    rel: 'icon',
+    href: '/favicon.svg',
+    type: 'image/svg+xml',
+  },
+  { rel: 'stylesheet', href: reactToastifyStyles },
+  { rel: 'stylesheet', href: tailwindReset },
+  { rel: 'stylesheet', href: globalStyles },
+  { rel: 'stylesheet', href: xtermStyles },
+  {
+    rel: 'preconnect',
+    href: 'https://fonts.googleapis.com',
+  },
+  {
+    rel: 'preconnect',
+    href: 'https://fonts.gstatic.com',
+    crossOrigin: 'anonymous',
+  },
+  {
+    rel: 'stylesheet',
+    href: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap',
+  },
+];
+
+const inlineThemeCode = stripIndents`
+  setTutorialKitTheme();
+
+  function setTutorialKitTheme() {
+    let theme = localStorage.getItem('bolt_theme');
+
+    if (!theme) {
+      theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    }
+
+    document.querySelector('html')?.setAttribute('data-theme', theme);
+  }
+`;
+
+export const Head = createHead(() => (
+  <>
+    <meta charSet="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <Meta />
+    <Links />
+    <script dangerouslySetInnerHTML={{ __html: inlineThemeCode }} />
+  </>
+));
+
+export function Layout({ children }: { children: React.ReactNode }) {
+  const theme = useStore(themeStore);
+
+  useEffect(() => {
+    document.querySelector('html')?.setAttribute('data-theme', theme);
+  }, [theme]);
+
+  return (
+    <>
+      <ClientOnly>{() => <DndProvider backend={HTML5Backend}>{children}</DndProvider>}</ClientOnly>
+      <ClientOnly>
+        {() => (
+          <ToastContainer
+            closeButton={({ closeToast }) => {
+              return (
+                <button className="Toastify__close-button" onClick={closeToast}>
+                  <div className="i-ph:x text-lg" />
+                </button>
+              );
+            }}
+            icon={({ type }) => {
+              switch (type) {
+                case 'success': {
+                  return <div className="i-ph:check-bold text-bolt-elements-icon-success text-2xl" />;
+                }
+                case 'error': {
+                  return <div className="i-ph:warning-circle-bold text-bolt-elements-icon-error text-2xl" />;
+                }
+              }
+
+              return undefined;
+            }}
+            position="bottom-right"
+            pauseOnFocusLoss
+            transition={toastAnimation}
+            autoClose={3000}
+          />
+        )}
+      </ClientOnly>
+      <ScrollRestoration />
+      <Scripts />
+    </>
+  );
+}
+
+import { logStore } from '~/lib/stores/logs';
+
+export default function App() {
+  const theme = useStore(themeStore);
+
+  useEffect(() => {
+    logStore.logSystem('Application initialized', {
+      theme,
+      platform: navigator.platform,
+      userAgent: navigator.userAgent,
+      timestamp: new Date().toISOString(),
+    });
+
+    // Initialize debug logging with improved error handling
+    import('~/utils/debugLogger')
+      .then(({ debugLogger }) => {
+        /*
+         * The debug logger initializes itself and starts disabled by default
+         * It will only start capturing when enableDebugMode() is called
+         */
+        const status = debugLogger.getStatus();
+        logStore.logSystem('Debug logging ready', {
+          initialized: status.initialized,
+          capturing: status.capturing,
+          enabled: status.enabled,
+        });
+      })
+      .catch((error) => {
+        logStore.logError('Failed to initialize debug logging', error);
+      });
+  }, []);
+
+  return (
+    <Layout>
+      <Outlet />
+    </Layout>
+  );
+}

tools/bolt.diy/app/routes/_index.tsx

@@ -0,0 +1,175 @@
+import { json, type MetaFunction, type LoaderFunctionArgs } from '@remix-run/cloudflare';
+import { useLoaderData, Link } from '@remix-run/react';
+import { useEffect, useState } from 'react';
+import { Header } from '~/components/header/Header';
+import BackgroundRays from '~/components/ui/BackgroundRays';
+import { MandateSubmission } from '~/components/mandate/MandateSubmission';
+import { eventRegistry } from '~/lib/runtime/execution-events';
+
+export const meta: MetaFunction = () => {
+  return [{ title: 'Bolt.diy - LLM-Native Execution Engine' }, { name: 'description', content: 'Autonomous code execution via structured mandates' }];
+};
+
+/**
+ * Load recent mandates from event registry.
+ */
+export async function loader({ request }: LoaderFunctionArgs) {
+  try {
+    // Get all active mandate IDs from event registry
+    const allMandateIds = eventRegistry.getActiveMandates();
+    
+    // Get recent mandates (last 10)
+    const recentMandates = allMandateIds.slice(-10).reverse().map(mandateId => {
+      const emitter = eventRegistry.getEmitter(mandateId);
+      const events = emitter.getEvents();
+      const latestEvent = events[events.length - 1];
+      
+      return {
+        mandate_id: mandateId,
+        last_event_time: latestEvent?.timestamp || Date.now() / 1000,
+        event_count: events.length,
+        status: latestEvent?.type === 'iteration_end' ? 'completed' : 
+                latestEvent?.type === 'error' ? 'failed' :
+                events.length > 0 ? 'running' : 'accepted'
+      };
+    });
+    
+    return json({ recentMandates });
+  } catch (error) {
+    console.error('Error loading recent mandates:', error);
+    return json({ recentMandates: [] });
+  }
+}
+
+/**
+ * Landing page component for Bolt.diy
+ * LLM-native execution engine: accepts structured mandates from CorporateSwarm
+ * and executes code generation autonomously with full governance oversight.
+ */
+export default function Index() {
+  const { recentMandates: initialMandates } = useLoaderData<typeof loader>();
+  const [recentMandates, setRecentMandates] = useState(initialMandates);
+  const [isLive, setIsLive] = useState(false);
+  const [lastUpdate, setLastUpdate] = useState<Date>(new Date());
+
+  // Real-time updates via polling
+  useEffect(() => {
+    let pollInterval: NodeJS.Timeout | null = null;
+    let isMounted = true;
+
+    const updateMandates = async () => {
+      try {
+        // Fetch active mandates from API endpoint
+        const response = await fetch('/api/mandate?list=true');
+        if (response.ok) {
+          const data = await response.json() as { mandates?: typeof recentMandates };
+          const updatedMandates = data.mandates || [];
+
+          if (isMounted) {
+            setRecentMandates(updatedMandates);
+            setLastUpdate(new Date());
+            setIsLive(true);
+          }
+        } else {
+          if (isMounted) {
+            setIsLive(false);
+          }
+        }
+      } catch (error) {
+        console.error('Error updating mandates:', error);
+        if (isMounted) {
+          setIsLive(false);
+        }
+      }
+    };
+
+    // Initial update
+    updateMandates();
+
+    // Poll every 2 seconds
+    pollInterval = setInterval(updateMandates, 2000);
+
+    return () => {
+      isMounted = false;
+      if (pollInterval) {
+        clearInterval(pollInterval);
+      }
+    };
+  }, []);
+  
+  return (
+    <div className="flex flex-col h-full w-full bg-bolt-elements-background-depth-1">
+      <BackgroundRays />
+      <Header />
+      <div className="flex-1 overflow-auto p-8">
+        <div className="max-w-7xl mx-auto w-full space-y-8">
+          {/* Recent Mandates Section */}
+          {recentMandates && recentMandates.length > 0 && (
+            <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-6">
+              <div className="flex items-center justify-between mb-4">
+                <h2 className="text-xl font-semibold text-bolt-elements-textPrimary">
+                  Recent Mandates
+                </h2>
+                <div className="flex items-center gap-2">
+                  <div className={`w-2 h-2 rounded-full ${isLive ? 'bg-green-500' : 'bg-red-500'}`} title={isLive ? 'Live' : 'Disconnected'} />
+                  <span className="text-xs text-bolt-elements-textSecondary">
+                    {isLive ? 'Live' : 'Disconnected'} • Updated {lastUpdate.toLocaleTimeString()}
+                  </span>
+                </div>
+              </div>
+              <div className="space-y-3">
+                {recentMandates.map((mandate) => (
+                  <div
+                    key={mandate.mandate_id}
+                    className="flex items-center justify-between p-4 bg-bolt-elements-background-depth-3 border border-bolt-elements-borderColor rounded-md hover:border-accent-500/50 transition-colors"
+                  >
+                    <div className="flex-1">
+                      <div className="flex items-center space-x-3">
+                        <span className="text-sm font-mono text-bolt-elements-textSecondary">
+                          {mandate.mandate_id.substring(0, 8)}...
+                        </span>
+                        <span className={`px-2 py-1 rounded text-xs font-medium ${
+                          mandate.status === 'completed' ? 'bg-green-500/20 text-green-500' :
+                          mandate.status === 'failed' ? 'bg-red-500/20 text-red-500' :
+                          mandate.status === 'running' ? 'bg-blue-500/20 text-blue-500' :
+                          'bg-gray-500/20 text-gray-500'
+                        }`}>
+                          {mandate.status}
+                        </span>
+                        <span className="text-xs text-bolt-elements-textTertiary">
+                          {mandate.event_count} events
+                        </span>
+                      </div>
+                    </div>
+                    <div className="flex items-center space-x-2">
+                      <Link
+                        to={`/observability/${mandate.mandate_id}`}
+                        className="px-3 py-1 text-sm bg-accent-500/10 text-accent-500 rounded hover:bg-accent-500/20 transition-colors"
+                      >
+                        View
+                      </Link>
+                      <Link
+                        to={`/execute/${mandate.mandate_id}`}
+                        className="px-3 py-1 text-sm bg-blue-500/10 text-blue-500 rounded hover:bg-blue-500/20 transition-colors"
+                      >
+                        Execute
+                      </Link>
+                    </div>
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+          
+          {/* Mandate Submission Section */}
+          <div className="bg-bolt-elements-background-depth-2 border border-bolt-elements-borderColor rounded-lg p-6">
+            <h2 className="text-xl font-semibold text-bolt-elements-textPrimary mb-4">
+              Submit New Mandate
+            </h2>
+            <MandateSubmission />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}