merge: wave 2 executor (01-02) into main

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

paperclip-reference/ui/src/pages/MyIssues.tsx

@@ -0,0 +1,72 @@
+import { useEffect } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { issuesApi } from "../api/issues";
+import { useCompany } from "../context/CompanyContext";
+import { useBreadcrumbs } from "../context/BreadcrumbContext";
+import { queryKeys } from "../lib/queryKeys";
+import { StatusIcon } from "../components/StatusIcon";
+
+import { EntityRow } from "../components/EntityRow";
+import { EmptyState } from "../components/EmptyState";
+import { PageSkeleton } from "../components/PageSkeleton";
+import { formatDate } from "../lib/utils";
+import { ListTodo } from "lucide-react";
+
+export function MyIssues() {
+  const { selectedCompanyId } = useCompany();
+  const { setBreadcrumbs } = useBreadcrumbs();
+
+  useEffect(() => {
+    setBreadcrumbs([{ label: "My Issues" }]);
+  }, [setBreadcrumbs]);
+
+  const { data: issues, isLoading, error } = useQuery({
+    queryKey: queryKeys.issues.list(selectedCompanyId!),
+    queryFn: () => issuesApi.list(selectedCompanyId!),
+    enabled: !!selectedCompanyId,
+  });
+
+  if (!selectedCompanyId) {
+    return <EmptyState icon={ListTodo} message="Select a company to view your issues." />;
+  }
+
+  if (isLoading) {
+    return <PageSkeleton variant="list" />;
+  }
+
+  // Show issues that are not assigned (user-created or unassigned)
+  const myIssues = (issues ?? []).filter(
+    (i) => !i.assigneeAgentId && !["done", "cancelled"].includes(i.status)
+  );
+
+  return (
+    <div className="space-y-4">
+      {error && <p className="text-sm text-destructive">{error.message}</p>}
+
+      {myIssues.length === 0 && (
+        <EmptyState icon={ListTodo} message="No issues assigned to you." />
+      )}
+
+      {myIssues.length > 0 && (
+        <div className="border border-border">
+          {myIssues.map((issue) => (
+            <EntityRow
+              key={issue.id}
+              identifier={issue.identifier ?? issue.id.slice(0, 8)}
+              title={issue.title}
+              to={`/issues/${issue.identifier ?? issue.id}`}
+              leading={
+                <StatusIcon status={issue.status} />
+              }
+              trailing={
+                <span className="text-xs text-muted-foreground">
+                  {formatDate(issue.createdAt)}
+                </span>
+              }
+            />
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}