1 files changed, 33 insertions, 2 deletions

diff --git a/makima/frontend/src/components/files/FileDetail.tsx b/makima/frontend/src/components/files/FileDetail.tsx
index 29311b8..c7b716a 100644
--- a/makima/frontend/src/components/files/FileDetail.tsx
+++ b/makima/frontend/src/components/files/FileDetail.tsx
@@ -1,6 +1,7 @@
 import { useState, useEffect } from "react";
-import type { FileDetail as FileDetailType } from "../../lib/api";
+import type { FileDetail as FileDetailType, FileVersionSummary, FileVersion } from "../../lib/api";
 import { BodyRenderer } from "./BodyRenderer";
+import { VersionHistoryDropdown } from "./VersionHistoryDropdown";
 
 interface FileDetailProps {
   file: FileDetailType;
@@ -13,6 +14,15 @@ interface FileDetailProps {
   onEditingChange?: (isEditing: boolean) => void;
   hasPendingRemoteUpdate?: boolean;
   onOverwrite?: () => void;
+  // Version history props
+  versions?: FileVersionSummary[];
+  versionsLoading?: boolean;
+  selectedVersion?: FileVersion | null;
+  loadingVersion?: boolean;
+  restoring?: boolean;
+  onSelectVersion?: (version: number) => void;
+  onRestoreVersion?: (version: number) => void;
+  onClearVersionSelection?: () => void;
 }
 
 export function FileDetail({
@@ -26,6 +36,14 @@ export function FileDetail({
   onEditingChange,
   hasPendingRemoteUpdate,
   onOverwrite,
+  versions = [],
+  versionsLoading = false,
+  selectedVersion = null,
+  loadingVersion = false,
+  restoring = false,
+  onSelectVersion,
+  onRestoreVersion,
+  onClearVersionSelection,
 }: FileDetailProps) {
   const [isEditing, setIsEditing] = useState(false);
   const [name, setName] = useState(file.name);
@@ -68,9 +86,22 @@ export function FileDetail({
           >
             ← Back to list
           </button>
-          <div className="flex gap-2">
+          <div className="flex items-center gap-2">
             {isEditing ? (
               <>
+                {onSelectVersion && onRestoreVersion && onClearVersionSelection && (
+                  <VersionHistoryDropdown
+                    currentVersion={file.version}
+                    versions={versions}
+                    loading={versionsLoading}
+                    selectedVersion={selectedVersion}
+                    loadingVersion={loadingVersion}
+                    onSelectVersion={onSelectVersion}
+                    onRestoreVersion={onRestoreVersion}
+                    onClearSelection={onClearVersionSelection}
+                    restoring={restoring}
+                  />
+                )}
                 <button
                   onClick={handleCancel}
                   className="px-3 py-1.5 font-mono text-xs text-[#9bc3ff] border border-[rgba(117,170,252,0.25)] hover:border-[#3f6fb3] transition-colors uppercase"