docs: add CONTRIBUTING.md to .github with lifecycle diagram and stand

components/dashboard/ContributeDialog.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import React from "react";
 import { GitBranch, Star, ExternalLink, Code2 } from "lucide-react";
 import {
   Dialog,
@@ -40,7 +41,7 @@ export function ContributeDialog({
 
         <div className="space-y-5 mt-2">
           {/* Issue label */}
-          <div className="flex items-center gap-2">
+          <div className="flex items-center gap-2" role="group" aria-label="Issue properties">
             <Badge variant="warning">High Complexity Issue</Badge>
             <Badge variant="outline">Stellar Drips Eligible</Badge>
           </div>

components/dashboard/EventFeedTable.test.tsx

@@ -0,0 +1,71 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import { describe, it, expect, vi } from "vitest";
+import { axe } from "vitest-axe";
+import { EventFeedTable } from "./EventFeedTable";
+
+vi.mock("react-syntax-highlighter", () => ({
+  Prism: () => <div data-testid="mock-syntax-highlighter" />
+}));
+
+describe("EventFeedTable Accessibility", () => {
+  it("should have no accessibility violations", async () => {
+    const mockEvents = [
+      {
+        status: "translated" as const,
+        description: "Transferred 100 XLM to Bob",
+        eventType: "transfer",
+        raw: {
+          id: "1",
+          type: "contract",
+          ledger: 123456,
+          ledgerClosedAt: "2026-06-17T17:11:21Z",
+          contractId: "CAAA...D2KM",
+          pagingToken: "token",
+          txHash: "hash123",
+          topics: ["topic1"],
+          data: "data123",
+          timestamp: Date.now() / 1000 - 3600,
+        },
+      },
+      {
+        status: "cryptic" as const,
+        description: "",
+        eventType: "",
+        raw: {
+          id: "2",
+          type: "contract",
+          ledger: 123456,
+          ledgerClosedAt: "2026-06-17T17:11:21Z",
+          contractId: "CAAA...D2KM",
+          pagingToken: "token",
+          txHash: "hash456",
+          topics: ["topic2"],
+          data: "data456",
+          timestamp: Date.now() / 1000 - 7200,
+        },
+      },
+    ];
+
+    const columns = {
+      status: true,
+      time: true,
+      description: true,
+      contract: true,
+      actions: true,
+    };
+
+    const { container } = render(
+      <EventFeedTable
+        events={mockEvents}
+        columns={columns}
+        density="comfortable"
+        onToggleColumn={vi.fn()}
+        onDensityChange={vi.fn()}
+      />
+    );
+
+    const results = await axe(container);
+    expect(results).toHaveNoViolations();
+  });
+});

components/dashboard/EventFeedTable.tsx

@@ -47,22 +47,25 @@ function StatusBadge({ status }: { status: TranslatedEvent["status"] }): React.J
   if (status === "translated") {
     return (
       <Badge variant="success" className="gap-1 whitespace-nowrap">
-        <CheckCircle2 className="h-3 w-3" />
+        <CheckCircle2 className="h-3 w-3" aria-hidden="true" />
+        <span className="sr-only">Status: </span>
         Translated
       </Badge>
     );
   }
   if (status === "pending") {
     return (
       <Badge variant="secondary" className="gap-1 whitespace-nowrap">
-        <Clock className="h-3 w-3" />
+        <Clock className="h-3 w-3" aria-hidden="true" />
+        <span className="sr-only">Status: </span>
         Pending
       </Badge>
     );
   }
   return (
     <Badge variant="warning" className="gap-1 whitespace-nowrap">
-      <HelpCircle className="h-3 w-3" />
+      <HelpCircle className="h-3 w-3" aria-hidden="true" />
+      <span className="sr-only">Status: </span>
       Cryptic
     </Badge>
   );
@@ -97,6 +100,22 @@ export function EventFeedTable({
   /** txHash of the event whose execution DAG is being viewed, or null. */
   const [dagTxHash, setDagTxHash] = useState<string | null>(null);
 
+  const handleKeyDown = (e: React.KeyboardEvent<HTMLTableSectionElement>) => {
+    if (e.target instanceof HTMLElement && e.target.tagName === "TR") {
+      const currentRow = e.target as HTMLTableRowElement;
+
+      if (e.key === "ArrowDown" || e.key === "j" || e.key === "J") {
+        e.preventDefault();
+        const nextRow = currentRow.nextElementSibling as HTMLTableRowElement;
+        if (nextRow) nextRow.focus();
+      } else if (e.key === "ArrowUp" || e.key === "k" || e.key === "K") {
+        e.preventDefault();
+        const prevRow = currentRow.previousElementSibling as HTMLTableRowElement;
+        if (prevRow) prevRow.focus();
+      }
+    }
+  };
+
   const cellPadding = density === "compact" ? "py-1.5" : "py-3";
   const visibleColCount = Object.values(columns).filter(Boolean).length;
 
@@ -173,7 +192,7 @@ export function EventFeedTable({
               )}
             </TableRow>
           </TableHeader>
-          <TableBody>
+          <TableBody onKeyDown={handleKeyDown}>
             {isLoading
               ? Array.from({ length: 5 }).map(function (_, i) {
                   return <SkeletonRow key={i} colCount={visibleColCount} />;
@@ -184,7 +203,9 @@ export function EventFeedTable({
                   return (
                     <TableRow
                       key={event.raw.id}
-                      className={`group transition-colors ${
+                      tabIndex={0}
+                      role="row"
+                      className={`group transition-colors focus:outline-none focus:ring-2 focus:ring-inset focus:ring-violet-500 ${
                         newEventIds.has(event.raw.id)
                           ? "animate-slide-in bg-violet-50/60 dark:bg-violet-950/30"
                           : ""

components/dashboard/RawDataDialog.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import { Code, ExternalLink, Copy, Check, Loader2, AlertCircle } from "lucide-react";
-import { useState } from "react";
+import { Code, ExternalLink, Copy, Check } from "lucide-react";
+import React, { useState } from "react";
 import {
   Dialog,
   DialogContent,
@@ -46,10 +46,14 @@ function CopyButton({ text }: { text: string }): React.JSX.Element {
           <Button
             variant="ghost"
             size="icon"
-            className="h-7 w-7"
+            className="h-7 w-7 relative"
             onClick={handleCopy}
+            aria-label="Copy to clipboard"
           >
-            {copied ? <Check className="h-3.5 w-3.5" /> : <Copy className="h-3.5 w-3.5" />}
+            <span aria-live="polite" className="sr-only">
+              {copied ? "Copied" : ""}
+            </span>
+            {copied ? <Check className="h-3.5 w-3.5" aria-hidden="true" /> : <Copy className="h-3.5 w-3.5" aria-hidden="true" />}
           </Button>
         </TooltipTrigger>
         <TooltipContent>Copy to clipboard</TooltipContent>