From aadd29e55439f72ad8fd74372947536dae10682e Mon Sep 17 00:00:00 2001
From: Jaime Idolpx <jaime@idolpx.com>
Date: Sun, 7 Jun 2026 20:43:29 -0400
Subject: [PATCH] feat: add file browsing functionality to IECPage for boot
 disk selection

---
 src/app/components/IECPage.tsx | 37 ++++++++++++++++++++++++++++------
 1 file changed, 31 insertions(+), 6 deletions(-)

diff --git a/src/app/components/IECPage.tsx b/src/app/components/IECPage.tsx
index 7cbcd8d..372c986 100644
--- a/src/app/components/IECPage.tsx
+++ b/src/app/components/IECPage.tsx
@@ -1,9 +1,14 @@
+import { useState } from 'react';
+import { FolderOpen } from 'lucide-react';
+import FileBrowser from './FileBrowser';
+
 interface IECPageProps {
   config: any;
   setConfig: (config: any) => void;
 }
 
 export default function IECPage({ config, setConfig }: IECPageProps) {
+  const [showFileBrowser, setShowFileBrowser] = useState(false);
   const updateSetting = (path: string[], value: any) => {
     const newConfig = JSON.parse(JSON.stringify(config));
     let current = newConfig;
@@ -57,13 +62,33 @@ export default function IECPage({ config, setConfig }: IECPageProps) {
 
         <div className="p-4">
           <label className="text-sm text-neutral-500 block mb-2">Boot Disk</label>
-          <input
-            type="text"
-            value={iec.boot_disk || ''}
-            onChange={(e) => updateSetting(['iec', 'boot_disk'], e.target.value)}
-            className="w-full px-3 py-2 border border-neutral-300 rounded-lg"
-          />
+          <div className="flex gap-2">
+            <input
+              type="text"
+              value={iec.boot_disk || ''}
+              onChange={(e) => updateSetting(['iec', 'boot_disk'], e.target.value)}
+              className="flex-1 px-3 py-2 border border-neutral-300 rounded-lg"
+            />
+            <button
+              onClick={() => setShowFileBrowser(true)}
+              className="px-3 py-2 border border-neutral-300 rounded-lg bg-neutral-50 hover:bg-neutral-100"
+              title="Browse files"
+            >
+              <FolderOpen className="w-5 h-5" />
+            </button>
+          </div>
         </div>
+
+      {showFileBrowser && (
+        <FileBrowser
+          currentPath={iec.boot_disk || '/'}
+          onSelect={(path) => {
+            updateSetting(['iec', 'boot_disk'], path);
+            setShowFileBrowser(false);
+          }}
+          onClose={() => setShowFileBrowser(false)}
+        />
+      )}
       </div>
 
       <h2 className="text-sm text-neutral-500 pt-4">Directory Settings</h2>