Add auto-PR creation for remote repos in directives

1 files changed, 34 insertions, 0 deletions

diff --git a/makima/frontend/src/components/directives/DirectiveDetail.tsx b/makima/frontend/src/components/directives/DirectiveDetail.tsx
index 1340482..616c5d2 100644
--- a/makima/frontend/src/components/directives/DirectiveDetail.tsx
+++ b/makima/frontend/src/components/directives/DirectiveDetail.tsx
@@ -114,6 +114,40 @@ export function DirectiveDetail({
           </div>
         )}
 
+        {/* PR link */}
+        {directive.prUrl && (
+          <div className="flex items-center gap-2 mb-2 px-2 py-1.5 bg-[#0a1a10] border border-emerald-900 rounded">
+            <span className="inline-block w-2 h-2 rounded-full bg-emerald-400" />
+            <span className="text-[10px] font-mono text-emerald-400">
+              PR created
+            </span>
+            <a
+              href={directive.prUrl}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-[10px] font-mono text-emerald-400 hover:text-emerald-300 underline ml-auto truncate max-w-[200px]"
+            >
+              {directive.prUrl}
+            </a>
+          </div>
+        )}
+
+        {/* Completion task indicator */}
+        {directive.completionTaskId && !directive.prUrl && (
+          <div className="flex items-center gap-2 mb-2 px-2 py-1.5 bg-[#1a1a10] border border-yellow-900 rounded">
+            <span className="inline-block w-2 h-2 rounded-full bg-yellow-400 animate-pulse" />
+            <span className="text-[10px] font-mono text-yellow-400">
+              Creating PR...
+            </span>
+            <a
+              href={`/mesh/${directive.completionTaskId}`}
+              className="text-[9px] font-mono text-[#556677] hover:text-yellow-400 underline ml-auto"
+            >
+              View task
+            </a>
+          </div>
+        )}
+
         {/* Controls */}
         <div className="flex flex-wrap gap-2">
           {(directive.status === "draft" || directive.status === "paused") && (