From 1b72449496ce3a057a43d002c8042d5e7a1d6576 Mon Sep 17 00:00:00 2001
From: soryu <soryu@soryu.co>
Date: Sat, 7 Feb 2026 16:36:19 +0000
Subject: Add directive init mechanism

---
 .../src/components/directives/DirectiveDetail.tsx  | 28 +++++++++++++++-------
 1 file changed, 20 insertions(+), 8 deletions(-)

(limited to 'makima/frontend/src/components/directives')

diff --git a/makima/frontend/src/components/directives/DirectiveDetail.tsx b/makima/frontend/src/components/directives/DirectiveDetail.tsx
index 3634a79..e519b92 100644
--- a/makima/frontend/src/components/directives/DirectiveDetail.tsx
+++ b/makima/frontend/src/components/directives/DirectiveDetail.tsx
@@ -8,6 +8,7 @@ interface DirectiveDetailProps {
   directive: DirectiveWithChains;
   onBack: () => void;
   onDelete?: (id: string) => void;
+  onStart?: (id: string) => void;
 }
 
 const statusColors: Record<DirectiveStatus, string> = {
@@ -79,6 +80,7 @@ export function DirectiveDetail({
   directive,
   onBack,
   onDelete,
+  onStart,
 }: DirectiveDetailProps) {
   return (
     <div className="panel h-full flex flex-col">
@@ -101,14 +103,24 @@ export function DirectiveDetail({
           <span className="font-mono text-[10px] text-[#7788aa]">
             v{directive.version}
           </span>
-          {onDelete && (
-            <button
-              onClick={() => onDelete(directive.id)}
-              className="ml-auto font-mono text-[10px] text-red-400 hover:text-red-300 transition-colors uppercase"
-            >
-              Delete
-            </button>
-          )}
+          <div className="ml-auto flex gap-2">
+            {onStart && directive.status === "draft" && (
+              <button
+                onClick={() => onStart(directive.id)}
+                className="font-mono text-[10px] text-green-400 hover:text-green-300 transition-colors uppercase"
+              >
+                Start
+              </button>
+            )}
+            {onDelete && (
+              <button
+                onClick={() => onDelete(directive.id)}
+                className="font-mono text-[10px] text-red-400 hover:text-red-300 transition-colors uppercase"
+              >
+                Delete
+              </button>
+            )}
+          </div>
         </div>
         <h2 className="font-mono text-sm text-[#dbe7ff]">
           {directive.title}
-- 
cgit v1.2.3