@agent-relay/dashboard 2.0.80 → 2.0.82

package/src/landing/AboutPage.tsx

@@ -0,0 +1,77 @@
+/**
+ * Agent Relay Cloud - About Page
+ */
+
+import React from 'react';
+import { StaticPage } from './StaticPage';
+
+export function AboutPage() {
+  return (
+    <StaticPage
+      title="About Agent Relay"
+      subtitle="Building the future of AI-powered software development."
+    >
+      <h2>Our Mission</h2>
+      <p>
+        We believe that AI agents working together can accomplish far more than any single agent or human developer alone. Agent Relay exists to make multi-agent orchestration accessible, reliable, and delightful for every developer and team.
+      </p>
+
+      <h2>The Problem We're Solving</h2>
+      <p>
+        AI coding assistants are transforming software development, but they work in isolation. Developers juggle multiple AI tools, copy-paste context between them, and manually coordinate their outputs. This fragmented workflow limits what AI can actually accomplish.
+      </p>
+      <p>
+        Agent Relay changes that. We provide the infrastructure for AI agents to communicate, collaborate, and complete complex tasks together&mdash;like a well-coordinated development team that never sleeps.
+      </p>
+
+      <h2>The Team</h2>
+      <p>
+        Agent Relay was founded by two engineers passionate about developer tools and AI.
+      </p>
+      <div className="team-grid">
+        <a href="https://github.com/khaliqgant" target="_blank" rel="noopener noreferrer" className="team-member">
+          <div className="team-avatar">K</div>
+          <h4>Khaliq Gant</h4>
+          <p>Co-founder</p>
+        </a>
+        <a href="https://github.com/willwashburn" target="_blank" rel="noopener noreferrer" className="team-member">
+          <div className="team-avatar">W</div>
+          <h4>Will Washburn</h4>
+          <p>Co-founder</p>
+        </a>
+      </div>
+
+      <h2>Our Values</h2>
+      <div className="values-grid">
+        <div className="value-card">
+          <h4>Developer-First</h4>
+          <p>Every decision we make starts with: "Does this make developers' lives better?"</p>
+        </div>
+        <div className="value-card">
+          <h4>Trust & Security</h4>
+          <p>Your code is sacred. We treat security as a feature, not an afterthought.</p>
+        </div>
+        <div className="value-card">
+          <h4>Open Ecosystem</h4>
+          <p>We integrate with the tools you already use. No vendor lock-in, ever.</p>
+        </div>
+        <div className="value-card">
+          <h4>Ship Fast, Learn Faster</h4>
+          <p>We iterate quickly based on real feedback from real developers.</p>
+        </div>
+      </div>
+
+      <h2>Get in Touch</h2>
+      <p>
+        Have questions or want to learn more? We'd love to hear from you.
+      </p>
+      <ul>
+        <li>General inquiries: <a href="mailto:hello@agent-relay.com">hello@agent-relay.com</a></li>
+        <li>Support: <a href="mailto:support@agent-relay.com">support@agent-relay.com</a></li>
+        <li>Careers: <a href="mailto:hiring@agent-relay.com">hiring@agent-relay.com</a></li>
+      </ul>
+    </StaticPage>
+  );
+}
+
+export default AboutPage;

package/src/landing/BlogContent.tsx

@@ -0,0 +1,187 @@
+/**
+ * Agent Relay Cloud - Blog Content Renderer
+ * Server-side compatible markdown rendering
+ */
+
+import React from 'react';
+
+function parseInlineMarkdown(text: string): string {
+  // Links: [text](url)
+  text = text.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>');
+  // Bold: **text**
+  text = text.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
+  // Italic: *text* (single asterisks, but not inside words)
+  text = text.replace(/(?<!\w)\*([^*]+)\*(?!\w)/g, '<em>$1</em>');
+  // Inline code: `text`
+  text = text.replace(/`([^`]+)`/g, '<code>$1</code>');
+  return text;
+}
+
+export function renderBlogContent(content: string): React.ReactNode[] {
+  const lines = content.trim().split('\n');
+  const elements: React.ReactNode[] = [];
+  let currentParagraph: string[] = [];
+  let inCodeBlock = false;
+  let codeBlockContent: string[] = [];
+  let codeBlockLang = '';
+  let inTable = false;
+  let tableRows: string[] = [];
+  let key = 0;
+
+  const flushParagraph = () => {
+    if (currentParagraph.length > 0) {
+      const text = currentParagraph.join(' ').trim();
+      if (text) {
+        elements.push(
+          <p key={key++} dangerouslySetInnerHTML={{ __html: parseInlineMarkdown(text) }} />
+        );
+      }
+      currentParagraph = [];
+    }
+  };
+
+  const flushTable = () => {
+    if (tableRows.length >= 2) {
+      const parseRow = (row: string) =>
+        row.split('|').slice(1, -1).map(cell => cell.trim());
+
+      const headerCells = parseRow(tableRows[0]);
+      const dataRows = tableRows.slice(2); // Skip header and separator
+
+      elements.push(
+        <div key={key++} style={{ overflowX: 'auto', margin: '24px 0' }}>
+          <table style={{ width: '100%', borderCollapse: 'collapse', fontSize: '15px' }}>
+            <thead>
+              <tr>
+                {headerCells.map((cell, i) => (
+                  <th key={i} style={{
+                    padding: '12px 16px',
+                    textAlign: 'left',
+                    borderBottom: '2px solid var(--border-subtle)',
+                    fontWeight: 600
+                  }} dangerouslySetInnerHTML={{ __html: parseInlineMarkdown(cell) }} />
+                ))}
+              </tr>
+            </thead>
+            <tbody>
+              {dataRows.map((row, i) => (
+                <tr key={i}>
+                  {parseRow(row).map((cell, j) => (
+                    <td key={j} style={{
+                      padding: '10px 16px',
+                      borderBottom: '1px solid var(--border-subtle)'
+                    }} dangerouslySetInnerHTML={{ __html: parseInlineMarkdown(cell) }} />
+                  ))}
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      );
+    }
+    tableRows = [];
+    inTable = false;
+  };
+
+  for (const line of lines) {
+    // Code block start/end
+    if (line.startsWith('```')) {
+      if (!inCodeBlock) {
+        flushParagraph();
+        inCodeBlock = true;
+        codeBlockLang = line.slice(3).trim();
+        codeBlockContent = [];
+      } else {
+        elements.push(
+          <pre key={key++} className="code-block" data-lang={codeBlockLang}>
+            <code>{codeBlockContent.join('\n')}</code>
+          </pre>
+        );
+        inCodeBlock = false;
+        codeBlockContent = [];
+        codeBlockLang = '';
+      }
+      continue;
+    }
+
+    if (inCodeBlock) {
+      codeBlockContent.push(line);
+      continue;
+    }
+
+    // Headers
+    if (line.startsWith('## ')) {
+      flushParagraph();
+      elements.push(<h2 key={key++}>{line.slice(3)}</h2>);
+      continue;
+    }
+    if (line.startsWith('### ')) {
+      flushParagraph();
+      elements.push(<h3 key={key++}>{line.slice(4)}</h3>);
+      continue;
+    }
+
+    // Empty line = paragraph break
+    if (line.trim() === '') {
+      flushParagraph();
+      if (inTable) flushTable();
+      continue;
+    }
+
+    // Table rows: | col1 | col2 |
+    if (line.trim().startsWith('|') && line.trim().endsWith('|')) {
+      flushParagraph();
+      inTable = true;
+      tableRows.push(line.trim());
+      continue;
+    } else if (inTable) {
+      flushTable();
+    }
+
+    // List items
+    if (line.trim().startsWith('- ')) {
+      flushParagraph();
+      elements.push(
+        <ul key={key++}>
+          <li dangerouslySetInnerHTML={{ __html: parseInlineMarkdown(line.trim().slice(2)) }} />
+        </ul>
+      );
+      continue;
+    }
+
+    // Images: ![alt](src)
+    const imageMatch = line.trim().match(/^!\[([^\]]*)\]\(([^)]+)\)$/);
+    if (imageMatch) {
+      flushParagraph();
+      elements.push(
+        <figure key={key++} className="blog-image" style={{ margin: '32px 0' }}>
+          <img src={imageMatch[2]} alt={imageMatch[1]} style={{ width: '100%', borderRadius: '8px' }} />
+          {imageMatch[1] && <figcaption style={{ textAlign: 'center', color: 'var(--text-secondary)', marginTop: '12px', fontSize: '14px', fontStyle: 'italic' }}>{imageMatch[1]}</figcaption>}
+        </figure>
+      );
+      continue;
+    }
+
+    // Twitter embed: {{tweet:TWEET_URL}}
+    const tweetMatch = line.trim().match(/^\{\{tweet:(.+)\}\}$/);
+    if (tweetMatch) {
+      flushParagraph();
+      const tweetUrl = tweetMatch[1];
+      elements.push(
+        <div key={key++} className="tweet-embed" style={{ margin: '24px 0', display: 'flex', justifyContent: 'center' }}>
+          <blockquote className="twitter-tweet" data-theme="dark">
+            <a href={tweetUrl}>View tweet</a>
+          </blockquote>
+        </div>
+      );
+      continue;
+    }
+
+    // Regular text
+    currentParagraph.push(line);
+  }
+
+  flushParagraph();
+  if (inTable) flushTable();
+  return elements;
+}

package/src/landing/BlogPage.tsx

@@ -0,0 +1,47 @@
+/**
+ * Agent Relay Cloud - Blog Listing Page
+ */
+
+import React from 'react';
+import { StaticPage } from './StaticPage';
+import { blogPosts } from './blogData';
+
+export function BlogPage() {
+  return (
+    <StaticPage
+      title="Blog"
+      subtitle="News, tutorials, and insights from the Agent Relay team."
+    >
+      <div className="blog-list">
+        {blogPosts.map((post) => (
+          <a
+            key={post.id}
+            href={`/blog/${post.id}`}
+            className="blog-card"
+            style={{ textDecoration: 'none', color: 'inherit' }}
+          >
+            <article>
+              <div className="blog-meta">
+                <span className="blog-category">{post.category}</span>
+                <span>{post.date}</span>
+                <span className="blog-author">by {post.author}</span>
+              </div>
+              <h3>{post.title}</h3>
+              <p>{post.excerpt}</p>
+              <span className="blog-read-more">Read more →</span>
+            </article>
+          </a>
+        ))}
+      </div>
+
+      <hr style={{ border: 'none', borderTop: '1px solid var(--border-subtle)', margin: '48px 0' }} />
+
+      <h2>Stay Updated</h2>
+      <p>
+        Follow us on <a href="https://twitter.com/agent_relay" target="_blank" rel="noopener noreferrer">Twitter</a> for the latest updates and more content.
+      </p>
+    </StaticPage>
+  );
+}
+
+export default BlogPage;

package/src/landing/CareersPage.tsx

@@ -0,0 +1,53 @@
+/**
+ * Agent Relay Cloud - Careers Page
+ */
+
+import React from 'react';
+import { StaticPage } from './StaticPage';
+
+export function CareersPage() {
+  return (
+    <StaticPage
+      title="Careers"
+      subtitle="Help us build the future of AI-powered development."
+    >
+      <h2>Join Us</h2>
+      <p>
+        We're building something that will fundamentally change how software gets built. AI agents working together as coordinated teams is the next evolution of developer tools, and we're at the forefront of making it happen.
+      </p>
+
+      <p>
+        If you think you'd be a great fit, send us an email at{' '}
+        <a href="mailto:hiring@agent-relay.com">hiring@agent-relay.com</a> with a bit about yourself and what you're interested in working on.
+      </p>
+
+      <h2>What We Value</h2>
+      <div className="values-grid">
+        <div className="value-card">
+          <h4>Curiosity</h4>
+          <p>We love people who ask questions and dig deep to understand how things work.</p>
+        </div>
+        <div className="value-card">
+          <h4>Ownership</h4>
+          <p>Take initiative, see things through, and take pride in your work.</p>
+        </div>
+        <div className="value-card">
+          <h4>Collaboration</h4>
+          <p>Great products are built by teams that communicate well and support each other.</p>
+        </div>
+        <div className="value-card">
+          <h4>Impact</h4>
+          <p>We focus on work that moves the needle for developers using our platform.</p>
+        </div>
+      </div>
+
+      <h2>Contact</h2>
+      <p>
+        Interested in joining us? Reach out at{' '}
+        <a href="mailto:hiring@agent-relay.com">hiring@agent-relay.com</a>.
+      </p>
+    </StaticPage>
+  );
+}
+
+export default CareersPage;

package/src/landing/ChangelogPage.tsx

@@ -0,0 +1,33 @@
+/**
+ * Agent Relay Cloud - Changelog Page
+ *
+ * Redirects to GitHub changelog
+ */
+
+import React, { useEffect } from 'react';
+import { StaticPage } from './StaticPage';
+
+const CHANGELOG_URL = 'https://github.com/AgentWorkforce/relay/blob/main/CHANGELOG.md';
+
+export function ChangelogPage() {
+  useEffect(() => {
+    window.location.href = CHANGELOG_URL;
+  }, []);
+
+  return (
+    <StaticPage
+      title="Changelog"
+      subtitle="Redirecting to GitHub..."
+    >
+      <p style={{ textAlign: 'center', marginTop: '32px' }}>
+        You are being redirected to our changelog on GitHub.
+      </p>
+      <p style={{ textAlign: 'center' }}>
+        If you are not redirected automatically, please click{' '}
+        <a href={CHANGELOG_URL}>here</a>.
+      </p>
+    </StaticPage>
+  );
+}
+
+export default ChangelogPage;

package/src/landing/ContactPage.tsx

@@ -0,0 +1,41 @@
+/**
+ * Agent Relay Cloud - Contact Page
+ */
+
+import { StaticPage } from './StaticPage';
+
+export function ContactPage() {
+  return (
+    <StaticPage
+      title="Contact Us"
+      subtitle="Have questions? We'd love to hear from you."
+    >
+      <h2>Get in Touch</h2>
+      <p>
+        Whether you have a question about features, pricing, need a demo, or anything else, our team is ready to answer all your questions.
+      </p>
+
+      <div className="value-card" style={{ marginTop: '32px', marginBottom: '32px' }}>
+        <h3 style={{ marginBottom: '16px' }}>Email</h3>
+        <p style={{ marginBottom: '24px' }}>
+          <a href="mailto:hello@agent-relay.com" style={{ fontSize: '1.1em' }}>hello@agent-relay.com</a>
+        </p>
+
+        <h3 style={{ marginBottom: '16px' }}>Twitter / X</h3>
+        <p style={{ marginBottom: 0 }}>
+          <a href="https://twitter.com/agent_relay" target="_blank" rel="noopener noreferrer" style={{ fontSize: '1.1em' }}>@agent_relay</a>
+        </p>
+      </div>
+
+      <h2>Open Source</h2>
+      <p>
+        Agent Relay is open source. You can find us on GitHub at{' '}
+        <a href="https://github.com/AgentWorkforce/relay" target="_blank" rel="noopener noreferrer">
+          github.com/AgentWorkforce/relay
+        </a>.
+      </p>
+    </StaticPage>
+  );
+}
+
+export default ContactPage;

package/src/landing/DocsPage.tsx

@@ -0,0 +1,43 @@
+/**
+ * Agent Relay Cloud - Documentation Page
+ *
+ * Redirects to external docs site at docs.agent-relay.com
+ */
+
+import React, { useEffect } from 'react';
+import { StaticPage } from './StaticPage';
+
+export function DocsPage() {
+  useEffect(() => {
+    // Redirect to external docs
+    window.location.href = 'https://docs.agent-relay.com/';
+  }, []);
+
+  return (
+    <StaticPage
+      title="Documentation"
+      subtitle="Redirecting to docs.agent-relay.com..."
+    >
+      <p style={{ textAlign: 'center', marginTop: '32px' }}>
+        You are being redirected to our documentation site.
+      </p>
+      <p style={{ textAlign: 'center' }}>
+        If you are not redirected automatically, please click{' '}
+        <a href="https://docs.agent-relay.com/">here</a>.
+      </p>
+
+      <div className="docs-nav" style={{ marginTop: '48px' }}>
+        <a href="https://docs.agent-relay.com/quickstart" className="docs-nav-card">
+          <h3>Quickstart Guide</h3>
+          <p>Get up and running with Agent Relay in minutes.</p>
+        </a>
+        <a href="https://docs.agent-relay.com/concepts" className="docs-nav-card">
+          <h3>Core Concepts</h3>
+          <p>Learn about agents, workspaces, and messaging.</p>
+        </a>
+      </div>
+    </StaticPage>
+  );
+}
+
+export default DocsPage;