neural-loom 0.1.2 → 0.2.0

package/src/app/components/ClaudeWizard.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useEffect, useState } from "react";
+import DirectoryBrowserModal from "./DirectoryBrowserModal";
 
 interface ClaudeConfig {
   name: string;
@@ -25,6 +26,8 @@ export default function ClaudeWizard({ onClose, onConfirmLaunch, isDocker }: Cla
   const [isLoading, setIsLoading] = useState(true);
   const [isSaving, setIsSaving] = useState(false);
   const [errorMessage, setErrorMessage] = useState("");
+  const [isBrowsingWorkspace, setIsBrowsingWorkspace] = useState(false);
+  const [isBrowsingScope, setIsBrowsingScope] = useState(false);
 
   // Load config on mount
   useEffect(() => {
@@ -119,13 +122,22 @@ export default function ClaudeWizard({ onClose, onConfirmLaunch, isDocker }: Cla
 
           <div style={formGroupStyle}>
             <label style={labelStyle}>Workspace Directory (Root)</label>
-            <input
-              type="text"
-              value={config.workspaceRoot}
-              onChange={(e) => setConfig({ ...config, workspaceRoot: e.target.value })}
-              placeholder="e.g. C:\Users\Dave\OneDrive\Projects\JS\wingman"
-              style={inputStyle}
-            />
+            <div style={{ display: "flex", gap: "0.5rem" }}>
+              <input
+                type="text"
+                value={config.workspaceRoot}
+                onChange={(e) => setConfig({ ...config, workspaceRoot: e.target.value })}
+                placeholder="e.g. C:\Users\Dave\OneDrive\Projects\JS\wingman"
+                style={{ ...inputStyle, flex: 1 }}
+              />
+              <button
+                type="button"
+                onClick={() => setIsBrowsingWorkspace(true)}
+                style={browseButtonStyle}
+              >
+                Browse...
+              </button>
+            </div>
             <span style={{ fontSize: "0.7rem", color: "var(--muted)", marginTop: "0.25rem" }}>
               The active folder Claude Code will run in. Leave blank to run in the current orchestrator directory.
             </span>
@@ -160,6 +172,13 @@ export default function ClaudeWizard({ onClose, onConfirmLaunch, isDocker }: Cla
                 placeholder="e.g. C:\Users\Dave\OneDrive\Projects\JS\other-repo"
                 style={{ ...inputStyle, flex: 1 }}
               />
+              <button
+                type="button"
+                onClick={() => setIsBrowsingScope(true)}
+                style={browseButtonStyle}
+              >
+                Browse...
+              </button>
               <button
                 type="button"
                 onClick={() => {
@@ -207,6 +226,23 @@ export default function ClaudeWizard({ onClose, onConfirmLaunch, isDocker }: Cla
             {isSaving ? "Saving..." : "Launch Session"}
           </button>
         </div>
+        {isBrowsingWorkspace && (
+          <DirectoryBrowserModal
+            title="Select Workspace Root"
+            initialPath={config.workspaceRoot}
+            onClose={() => setIsBrowsingWorkspace(false)}
+            onSelect={(selectedPath) => setConfig({ ...config, workspaceRoot: selectedPath })}
+          />
+        )}
+
+        {isBrowsingScope && (
+          <DirectoryBrowserModal
+            title="Add Scoped Directory"
+            initialPath={newScopePath}
+            onClose={() => setIsBrowsingScope(false)}
+            onSelect={(selectedPath) => setNewScopePath(selectedPath)}
+          />
+        )}
       </div>
     </div>
   );
@@ -333,3 +369,15 @@ const secondaryButtonStyle: React.CSSProperties = {
   fontWeight: 600,
   cursor: "pointer",
 };
+
+const browseButtonStyle: React.CSSProperties = {
+  padding: "0.35rem 0.75rem",
+  borderRadius: "6px",
+  border: "1px solid var(--border)",
+  backgroundColor: "rgba(255, 255, 255, 0.05)",
+  color: "var(--foreground)",
+  fontSize: "0.75rem",
+  fontWeight: 600,
+  cursor: "pointer",
+  transition: "all 0.15s ease",
+};

package/src/app/components/DirectoryBrowserModal.tsx

@@ -0,0 +1,362 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+interface DirectoryItem {
+  name: string;
+  path: string;
+}
+
+interface DirectoryBrowserModalProps {
+  title: string;
+  initialPath: string;
+  onClose: () => void;
+  onSelect: (selectedPath: string) => void;
+}
+
+export default function DirectoryBrowserModal({
+  title,
+  initialPath,
+  onClose,
+  onSelect,
+}: DirectoryBrowserModalProps) {
+  const [currentPath, setCurrentPath] = useState(initialPath || "");
+  const [parentPath, setParentPath] = useState<string | null>(null);
+  const [directories, setDirectories] = useState<DirectoryItem[]>([]);
+  const [highlightedPath, setHighlightedPath] = useState<string | null>(null);
+  const [typedPath, setTypedPath] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState("");
+
+  const fetchDirectories = async (pathTarget: string) => {
+    setIsLoading(true);
+    setError("");
+    try {
+      const url = `/api/files?action=browse_dirs&path=${encodeURIComponent(pathTarget)}`;
+      const res = await fetch(url);
+      const data = await res.json();
+      if (res.ok && data.success) {
+        setCurrentPath(data.currentPath);
+        setTypedPath(data.currentPath);
+        setParentPath(data.parentPath);
+        setDirectories(data.directories);
+        setHighlightedPath(null); // Reset highlight when entering a new folder
+      } else {
+        setError(data.error || "Failed to load directory content.");
+      }
+    } catch (err) {
+      console.error("Error browsing directories:", err);
+      setError("Failed to fetch directory contents.");
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  // Load initial path on mount
+  useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
+    fetchDirectories(initialPath);
+  }, [initialPath]);
+
+  const handleNavigate = (pathTarget: string) => {
+    fetchDirectories(pathTarget);
+  };
+
+  const handleGoClick = () => {
+    if (typedPath.trim()) {
+      fetchDirectories(typedPath.trim());
+    }
+  };
+
+  const handleKeyPress = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    if (e.key === "Enter") {
+      handleGoClick();
+    }
+  };
+
+  const handleSelectClick = () => {
+    const finalSelection = highlightedPath || currentPath;
+    onSelect(finalSelection);
+    onClose();
+  };
+
+  return (
+    <div style={modalOverlayStyle}>
+      <div style={modalContainerStyle}>
+        {/* Header */}
+        <div style={headerStyle}>
+          <h3 style={{ fontSize: "1rem", fontWeight: 700, margin: 0, color: "var(--foreground)" }}>
+            📁 {title}
+          </h3>
+          <button onClick={onClose} style={closeButtonStyle} aria-label="Close browser">✖</button>
+        </div>
+
+        {/* Path Bar */}
+        <div style={pathBarContainerStyle}>
+          <input
+            type="text"
+            value={typedPath}
+            onChange={(e) => setTypedPath(e.target.value)}
+            onKeyDown={handleKeyPress}
+            style={pathInputStyle}
+            placeholder="Absolute folder path..."
+          />
+          <button onClick={handleGoClick} style={goButtonStyle} disabled={isLoading}>
+            Go
+          </button>
+        </div>
+
+        {/* Directory List Container */}
+        <div style={listContainerStyle}>
+          {isLoading ? (
+            <div style={statusMessageStyle}>Loading directories...</div>
+          ) : error ? (
+            <div style={{ ...statusMessageStyle, color: "var(--danger)" }}>
+              {error}
+              <button 
+                onClick={() => fetchDirectories(currentPath || ".")} 
+                style={{ ...goButtonStyle, display: "block", margin: "0.75rem auto 0" }}
+              >
+                Retry
+              </button>
+            </div>
+          ) : (
+            <div style={listStyle}>
+              {/* Up directory item */}
+              {parentPath && (
+                <div
+                  onClick={() => handleNavigate(parentPath)}
+                  onDoubleClick={() => handleNavigate(parentPath)}
+                  style={listItemStyle}
+                  title="Go up to parent directory"
+                >
+                  <span style={{ fontSize: "1.1rem" }}>⬆️</span>
+                  <span style={{ fontWeight: 600 }}>.. (Up)</span>
+                </div>
+              )}
+
+              {/* Child directories */}
+              {directories.length === 0 ? (
+                <div style={{ ...statusMessageStyle, color: "var(--muted)" }}>
+                  No subdirectories found
+                </div>
+              ) : (
+                directories.map((dir) => {
+                  const isHighlighted = highlightedPath === dir.path;
+                  return (
+                    <div
+                      key={dir.path}
+                      onClick={() => setHighlightedPath(dir.path)}
+                      onDoubleClick={() => handleNavigate(dir.path)}
+                      style={{
+                        ...listItemStyle,
+                        backgroundColor: isHighlighted ? "rgba(109, 40, 217, 0.25)" : "transparent",
+                        borderColor: isHighlighted ? "var(--border-focus)" : "transparent",
+                      }}
+                      title="Single click to highlight, double click to enter"
+                    >
+                      <span style={{ fontSize: "1.1rem" }}>📁</span>
+                      <span style={{ flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }}>
+                        {dir.name}
+                      </span>
+                      {isHighlighted && (
+                        <button
+                          type="button"
+                          onClick={(e) => {
+                            e.stopPropagation();
+                            handleNavigate(dir.path);
+                          }}
+                          style={enterFolderButtonStyle}
+                        >
+                          Enter ➜
+                        </button>
+                      )}
+                    </div>
+                  );
+                })
+              )}
+            </div>
+          )}
+        </div>
+
+        {/* Footer */}
+        <div style={footerStyle}>
+          <span style={selectionPreviewStyle}>
+            Selection: <span style={{ color: "var(--foreground)", fontFamily: "var(--font-mono), monospace" }}>
+              {highlightedPath || currentPath || "(None)"}
+            </span>
+          </span>
+          <div style={{ display: "flex", gap: "0.5rem" }}>
+            <button onClick={onClose} style={secondaryButtonStyle}>
+              Cancel
+            </button>
+            <button onClick={handleSelectClick} style={primaryButtonStyle} disabled={isLoading}>
+              Select Folder
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+// Styling for Directory Browser
+const modalOverlayStyle: React.CSSProperties = {
+  position: "fixed",
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+  backgroundColor: "rgba(5, 7, 10, 0.85)",
+  backdropFilter: "blur(12px)",
+  zIndex: 1100, // Higher than regular wizard overlays
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+};
+
+const modalContainerStyle: React.CSSProperties = {
+  width: "90%",
+  maxWidth: "550px",
+  height: "480px",
+  backgroundColor: "var(--card)",
+  border: "1px solid var(--border-focus)",
+  borderRadius: "12px",
+  boxShadow: "0 20px 25px -5px rgba(0,0,0,0.7), 0 10px 10px -5px rgba(0,0,0,0.7)",
+  display: "flex",
+  flexDirection: "column",
+  overflow: "hidden",
+};
+
+const headerStyle: React.CSSProperties = {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  padding: "0.85rem 1.25rem",
+  borderBottom: "1px solid var(--border)",
+  background: "hsla(var(--border-hsl), 0.2)",
+};
+
+const closeButtonStyle: React.CSSProperties = {
+  background: "none",
+  border: "none",
+  color: "var(--muted)",
+  fontSize: "0.9rem",
+  cursor: "pointer",
+  padding: "0.25rem",
+};
+
+const pathBarContainerStyle: React.CSSProperties = {
+  display: "flex",
+  padding: "0.75rem 1.25rem",
+  gap: "0.5rem",
+  backgroundColor: "rgba(10, 15, 25, 0.5)",
+  borderBottom: "1px solid var(--border)",
+};
+
+const pathInputStyle: React.CSSProperties = {
+  flex: 1,
+  padding: "0.45rem 0.75rem",
+  backgroundColor: "#05070a",
+  border: "1px solid var(--border)",
+  borderRadius: "6px",
+  color: "var(--foreground)",
+  fontFamily: "var(--font-mono), monospace",
+  fontSize: "0.8rem",
+  outline: "none",
+};
+
+const goButtonStyle: React.CSSProperties = {
+  padding: "0.45rem 0.85rem",
+  backgroundColor: "var(--border)",
+  border: "1px solid var(--border-focus)",
+  borderRadius: "6px",
+  color: "var(--foreground)",
+  fontSize: "0.75rem",
+  fontWeight: 600,
+  cursor: "pointer",
+};
+
+const enterFolderButtonStyle: React.CSSProperties = {
+  padding: "0.15rem 0.45rem",
+  backgroundColor: "rgba(255, 255, 255, 0.15)",
+  border: "none",
+  borderRadius: "4px",
+  color: "var(--foreground)",
+  fontSize: "0.7rem",
+  cursor: "pointer",
+  fontWeight: 600,
+};
+
+const listContainerStyle: React.CSSProperties = {
+  flex: 1,
+  padding: "0.5rem 1.25rem",
+  overflowY: "auto",
+  backgroundColor: "#070a0f",
+};
+
+const listStyle: React.CSSProperties = {
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.25rem",
+};
+
+const listItemStyle: React.CSSProperties = {
+  display: "flex",
+  alignItems: "center",
+  gap: "0.6rem",
+  padding: "0.45rem 0.65rem",
+  borderRadius: "6px",
+  cursor: "pointer",
+  fontSize: "0.825rem",
+  border: "1px solid transparent",
+  userSelect: "none",
+  transition: "all 0.15s ease",
+};
+
+const statusMessageStyle: React.CSSProperties = {
+  textAlign: "center",
+  padding: "2rem",
+  fontSize: "0.85rem",
+  color: "var(--muted)",
+};
+
+const footerStyle: React.CSSProperties = {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  padding: "0.85rem 1.25rem",
+  borderTop: "1px solid var(--border)",
+  background: "hsla(var(--border-hsl), 0.2)",
+};
+
+const selectionPreviewStyle: React.CSSProperties = {
+  fontSize: "0.75rem",
+  color: "var(--muted)",
+  maxWidth: "240px",
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap",
+};
+
+const primaryButtonStyle: React.CSSProperties = {
+  padding: "0.45rem 0.9rem",
+  borderRadius: "6px",
+  border: "none",
+  background: "linear-gradient(135deg, hsl(262, 83%, 60%) 0%, hsl(195, 100%, 45%) 100%)",
+  color: "#fff",
+  fontSize: "0.75rem",
+  fontWeight: 600,
+  cursor: "pointer",
+};
+
+const secondaryButtonStyle: React.CSSProperties = {
+  padding: "0.45rem 0.9rem",
+  borderRadius: "6px",
+  border: "1px solid var(--border)",
+  backgroundColor: "transparent",
+  color: "var(--foreground)",
+  fontSize: "0.75rem",
+  fontWeight: 600,
+  cursor: "pointer",
+};

package/.next/static/chunks/0ewdhgxsa_h.q.js

@@ -1 +0,0 @@
-(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,44837,e=>{"use strict";var r=e.i(43476),o=e.i(71645);let t={position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(5, 7, 10, 0.8)",backdropFilter:"blur(8px)",zIndex:1e3,display:"flex",alignItems:"center",justifyContent:"center",animation:"fadeIn 0.2s ease-out"},n={width:"90%",maxWidth:"500px",backgroundColor:"var(--card)",border:"1px solid var(--border-focus)",borderRadius:"12px",boxShadow:"0 10px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.5)",overflow:"hidden",display:"flex",flexDirection:"column"},a={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"1rem 1.25rem",borderBottom:"1px solid var(--border)",background:"hsla(var(--border-hsl), 0.2)"},i={background:"none",border:"none",color:"var(--muted)",fontSize:"0.9rem",cursor:"pointer",padding:"0.25rem"},l={padding:"1.25rem",display:"flex",flexDirection:"column"},s={display:"flex",flexDirection:"column",marginBottom:"1rem"},d={fontSize:"0.75rem",fontWeight:600,color:"var(--foreground)",marginBottom:"0.375rem",textTransform:"uppercase",letterSpacing:"0.05em"},c={width:"100%",padding:"0.5rem 0.75rem",backgroundColor:"#080c14",border:"1px solid var(--border)",borderRadius:"6px",color:"var(--foreground)",fontFamily:"var(--font-mono), monospace",fontSize:"0.825rem",outline:"none",transition:"border-color 0.15s ease"},p={marginTop:"0.75rem",padding:"0.75rem",borderRadius:"6px",border:"1px solid var(--danger)",backgroundColor:"rgba(239, 68, 68, 0.05)",color:"var(--danger)",fontSize:"0.8rem",lineHeight:1.4},u={display:"flex",justifyContent:"flex-end",gap:"0.75rem",padding:"1rem 1.25rem",borderTop:"1px solid var(--border)",background:"hsla(var(--border-hsl), 0.2)"},m={padding:"0.5rem 1rem",borderRadius:"6px",border:"none",background:"linear-gradient(135deg, hsl(262, 83%, 60%) 0%, hsl(195, 100%, 45%) 100%)",color:"#fff",fontSize:"0.8rem",fontWeight:600,cursor:"pointer"},g={padding:"0.5rem 1rem",borderRadius:"6px",border:"1px solid var(--border)",backgroundColor:"transparent",color:"var(--foreground)",fontSize:"0.8rem",fontWeight:600,cursor:"pointer"};e.s(["default",0,function({onClose:e,onConfirmLaunch:x,isDocker:f}){let[h,b]=(0,o.useState)({name:f?"Claude Docker":"Claude Local",workspaceRoot:"",scopedDirs:[]}),[y,v]=(0,o.useState)(""),[j,C]=(0,o.useState)(!0),[k,S]=(0,o.useState)(!1),[D,w]=(0,o.useState)("");(0,o.useEffect)(()=>{(async()=>{try{let e=await fetch("/api/context/claude");if(e.ok){let r=await e.json();r.success&&r.config&&b({name:r.config.name||(f?"Claude Docker":"Claude Local"),workspaceRoot:r.config.workspaceRoot||"",scopedDirs:r.config.scopedDirs||[]})}}catch(e){console.error("Failed to load Claude configuration:",e)}finally{C(!1)}})()},[f]);let R=async()=>{S(!0),w("");try{let e=await fetch("/api/context/claude",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(h)});if(e.ok)S(!1),x(h.name,h.workspaceRoot,h.scopedDirs);else{let r=await e.json();w(r.error||"Failed to save settings."),S(!1)}}catch(e){console.error(e),w("Network error: failed to connect to NeuralLoom dashboard API."),S(!1)}};return j?(0,r.jsx)("div",{style:t,children:(0,r.jsx)("div",{style:n,children:(0,r.jsx)("div",{style:{textAlign:"center",padding:"2rem"},children:(0,r.jsx)("span",{style:{color:"var(--muted)"},children:"Loading Claude Configuration..."})})})}):(0,r.jsx)("div",{style:t,children:(0,r.jsxs)("div",{style:n,children:[(0,r.jsxs)("div",{style:a,children:[(0,r.jsxs)("h3",{style:{fontSize:"1.1rem",fontWeight:700,margin:0,display:"flex",alignItems:"center",gap:"0.5rem"},children:[f?"🐳":"🤖"," Claude PTY Launch Wizard ",f?"(Docker)":"(Local)"]}),(0,r.jsx)("button",{onClick:e,style:i,"aria-label":"Close wizard",children:"✖"})]}),(0,r.jsxs)("div",{style:l,children:[(0,r.jsx)("p",{style:{fontSize:"0.825rem",color:"var(--muted)",marginBottom:"1.25rem",lineHeight:1.4},children:"Configure the local workspace path and access parameters for the Claude Code session. Settings are saved in `.ai/neural-loom/claude.json`."}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Session Display Name"}),(0,r.jsx)("input",{type:"text",value:h.name,onChange:e=>b({...h,name:e.target.value}),placeholder:f?"Claude Docker":"Claude Local",style:c})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Workspace Directory (Root)"}),(0,r.jsx)("input",{type:"text",value:h.workspaceRoot,onChange:e=>b({...h,workspaceRoot:e.target.value}),placeholder:"e.g. C:\\Users\\Dave\\OneDrive\\Projects\\JS\\wingman",style:c}),(0,r.jsx)("span",{style:{fontSize:"0.7rem",color:"var(--muted)",marginTop:"0.25rem"},children:"The active folder Claude Code will run in. Leave blank to run in the current orchestrator directory."})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Scoped Directories (Additional Access)"}),h.scopedDirs.length>0&&(0,r.jsx)("div",{style:{display:"flex",flexDirection:"column",gap:"0.5rem",marginBottom:"0.5rem"},children:h.scopedDirs.map((e,o)=>(0,r.jsxs)("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",backgroundColor:"#080c14",padding:"0.35rem 0.5rem",borderRadius:"4px",border:"1px solid var(--border)"},children:[(0,r.jsx)("span",{style:{fontSize:"0.8rem",fontFamily:"var(--font-mono), monospace",wordBreak:"break-all"},children:e}),(0,r.jsx)("button",{type:"button",onClick:()=>{let e=h.scopedDirs.filter((e,r)=>r!==o);b({...h,scopedDirs:e})},style:{background:"none",border:"none",color:"var(--danger)",cursor:"pointer",fontSize:"0.8rem",padding:"0 0.25rem"},children:"Remove"})]},o))}),(0,r.jsxs)("div",{style:{display:"flex",gap:"0.5rem"},children:[(0,r.jsx)("input",{type:"text",value:y,onChange:e=>v(e.target.value),placeholder:"e.g. C:\\Users\\Dave\\OneDrive\\Projects\\JS\\other-repo",style:{...c,flex:1}}),(0,r.jsx)("button",{type:"button",onClick:()=>{y.trim()&&!h.scopedDirs.includes(y.trim())&&(b({...h,scopedDirs:[...h.scopedDirs,y.trim()]}),v(""))},style:{padding:"0.35rem 0.75rem",borderRadius:"6px",border:"1px solid var(--border-focus)",backgroundColor:"rgba(109, 40, 217, 0.1)",color:"var(--foreground)",fontSize:"0.75rem",fontWeight:600,cursor:"pointer"},children:"Add"})]})]}),D&&(0,r.jsxs)("div",{style:p,children:["✗ ",D]})]}),(0,r.jsxs)("div",{style:u,children:[(0,r.jsx)("button",{onClick:e,style:g,disabled:k,children:"Cancel"}),(0,r.jsx)("button",{onClick:R,style:m,disabled:k,children:k?"Saving...":"Launch Session"})]})]})})}])},20032,e=>{e.n(e.i(44837))}]);

package/.next/static/chunks/0mej.ad_ddvf1.js

@@ -1 +0,0 @@
-(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,1663,e=>{"use strict";var r=e.i(43476),o=e.i(71645);let i={position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(5, 7, 10, 0.8)",backdropFilter:"blur(8px)",zIndex:1e3,display:"flex",alignItems:"center",justifyContent:"center",animation:"fadeIn 0.2s ease-out"},n={width:"90%",maxWidth:"500px",backgroundColor:"var(--card)",border:"1px solid var(--border-focus)",borderRadius:"12px",boxShadow:"0 10px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.5)",overflow:"hidden",display:"flex",flexDirection:"column"},t={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"1rem 1.25rem",borderBottom:"1px solid var(--border)",background:"hsla(var(--border-hsl), 0.2)"},l={background:"none",border:"none",color:"var(--muted)",fontSize:"0.9rem",cursor:"pointer",padding:"0.25rem"},a={padding:"1.25rem",display:"flex",flexDirection:"column"},s={display:"flex",flexDirection:"column",marginBottom:"1rem"},d={fontSize:"0.75rem",fontWeight:600,color:"var(--foreground)",marginBottom:"0.375rem",textTransform:"uppercase",letterSpacing:"0.05em"},c={width:"100%",padding:"0.5rem 0.75rem",backgroundColor:"#080c14",border:"1px solid var(--border)",borderRadius:"6px",color:"var(--foreground)",fontFamily:"var(--font-mono), monospace",fontSize:"0.825rem",outline:"none",transition:"border-color 0.15s ease"},p={width:"100%",padding:"0.5rem 0.75rem",backgroundColor:"#080c14",border:"1px solid var(--border)",borderRadius:"6px",color:"var(--foreground)",fontSize:"0.825rem",outline:"none",cursor:"pointer"},g={marginTop:"0.75rem",padding:"0.75rem",borderRadius:"6px",border:"1px solid var(--danger)",backgroundColor:"rgba(239, 68, 68, 0.05)",color:"var(--danger)",fontSize:"0.8rem",lineHeight:1.4},m={display:"flex",justifyContent:"flex-end",gap:"0.75rem",padding:"1rem 1.25rem",borderTop:"1px solid var(--border)",background:"hsla(var(--border-hsl), 0.2)"},u={padding:"0.5rem 1rem",borderRadius:"6px",border:"none",background:"linear-gradient(135deg, hsl(210, 80%, 45%) 0%, hsl(262, 80%, 55%) 100%)",color:"#fff",fontSize:"0.8rem",fontWeight:600,cursor:"pointer"},x={padding:"0.5rem 1rem",borderRadius:"6px",border:"1px solid var(--border)",backgroundColor:"transparent",color:"var(--foreground)",fontSize:"0.8rem",fontWeight:600,cursor:"pointer"};e.s(["default",0,function({onClose:e,onConfirmLaunch:h,isDocker:y}){let[f,b]=(0,o.useState)({openaiApiKey:"",anthropicApiKey:"",geminiApiKey:"",model:"claude-3-5-sonnet",extraFlags:"",workspaceRoot:"",scopedDirs:[]}),[v,j]=(0,o.useState)(""),[k,A]=(0,o.useState)(!0),[C,S]=(0,o.useState)(!1),[w,K]=(0,o.useState)("");(0,o.useEffect)(()=>{(async()=>{try{let e=await fetch("/api/context/aider");if(e.ok){let r=await e.json();r.success&&r.config&&b({openaiApiKey:r.config.openaiApiKey||"",anthropicApiKey:r.config.anthropicApiKey||"",geminiApiKey:r.config.geminiApiKey||"",model:r.config.model||"claude-3-5-sonnet",extraFlags:r.config.extraFlags||"",workspaceRoot:r.config.workspaceRoot||"",scopedDirs:r.config.scopedDirs||[]})}}catch(e){console.error("Failed to load Aider configuration:",e)}finally{A(!1)}})()},[]);let D=async()=>{S(!0),K("");try{let e=await fetch("/api/context/aider",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(f)});if(e.ok)S(!1),h();else{let r=await e.json();K(r.error||"Failed to save settings."),S(!1)}}catch(e){console.error(e),K("Network error: failed to connect to NeuralLoom dashboard API."),S(!1)}};return k?(0,r.jsx)("div",{style:i,children:(0,r.jsx)("div",{style:n,children:(0,r.jsx)("div",{style:{textAlign:"center",padding:"2rem"},children:(0,r.jsx)("span",{style:{color:"var(--muted)"},children:"Loading Aider Configuration..."})})})}):(0,r.jsx)("div",{style:i,children:(0,r.jsxs)("div",{style:n,children:[(0,r.jsxs)("div",{style:t,children:[(0,r.jsxs)("h3",{style:{fontSize:"1.1rem",fontWeight:700,margin:0,display:"flex",alignItems:"center",gap:"0.5rem"},children:["🐍 Aider Launch Panel ",y?"(Docker)":""]}),(0,r.jsx)("button",{onClick:e,style:l,"aria-label":"Close wizard",children:"✖"})]}),(0,r.jsxs)("div",{style:a,children:[(0,r.jsx)("p",{style:{fontSize:"0.825rem",color:"var(--muted)",marginBottom:"1.25rem",lineHeight:1.4},children:"Configure model and environment variables for the Aider session. API keys are saved locally in `.ai/neural-loom/aider.json` and are ignored by git."}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Anthropic API Key"}),(0,r.jsx)("input",{type:"password",value:f.anthropicApiKey,onChange:e=>b({...f,anthropicApiKey:e.target.value}),placeholder:f.anthropicApiKey?"••••••••••••••••":"sk-ant-...",style:c})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"OpenAI API Key"}),(0,r.jsx)("input",{type:"password",value:f.openaiApiKey,onChange:e=>b({...f,openaiApiKey:e.target.value}),placeholder:f.openaiApiKey?"••••••••••••••••":"sk-...",style:c})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Gemini API Key"}),(0,r.jsx)("input",{type:"password",value:f.geminiApiKey,onChange:e=>b({...f,geminiApiKey:e.target.value}),placeholder:f.geminiApiKey?"••••••••••••••••":"AIzaSy...",style:c})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Workspace Directory (Root)"}),(0,r.jsx)("input",{type:"text",value:f.workspaceRoot,onChange:e=>b({...f,workspaceRoot:e.target.value}),placeholder:"e.g. C:\\Users\\Dave\\OneDrive\\Projects\\JS\\neural-loom",style:c}),(0,r.jsx)("span",{style:{fontSize:"0.7rem",color:"var(--muted)",marginTop:"0.25rem"},children:"Leave blank to default to the current orchestrator directory."})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Scoped Directories (Additional Access)"}),f.scopedDirs.length>0&&(0,r.jsx)("div",{style:{display:"flex",flexDirection:"column",gap:"0.5rem",marginBottom:"0.5rem"},children:f.scopedDirs.map((e,o)=>(0,r.jsxs)("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",backgroundColor:"#080c14",padding:"0.35rem 0.5rem",borderRadius:"4px",border:"1px solid var(--border)"},children:[(0,r.jsx)("span",{style:{fontSize:"0.8rem",fontFamily:"var(--font-mono), monospace",wordBreak:"break-all"},children:e}),(0,r.jsx)("button",{type:"button",onClick:()=>{let e=f.scopedDirs.filter((e,r)=>r!==o);b({...f,scopedDirs:e})},style:{background:"none",border:"none",color:"var(--danger)",cursor:"pointer",fontSize:"0.8rem",padding:"0 0.25rem"},children:"Remove"})]},o))}),(0,r.jsxs)("div",{style:{display:"flex",gap:"0.5rem"},children:[(0,r.jsx)("input",{type:"text",value:v,onChange:e=>j(e.target.value),placeholder:"e.g. C:\\Users\\Dave\\OneDrive\\Projects\\JS\\wingman",style:{...c,flex:1}}),(0,r.jsx)("button",{type:"button",onClick:()=>{v.trim()&&!f.scopedDirs.includes(v.trim())&&(b({...f,scopedDirs:[...f.scopedDirs,v.trim()]}),j(""))},style:{padding:"0.35rem 0.75rem",borderRadius:"6px",border:"1px solid var(--border-focus)",backgroundColor:"rgba(109, 40, 217, 0.1)",color:"var(--foreground)",fontSize:"0.75rem",fontWeight:600,cursor:"pointer"},children:"Add"})]})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"AI Model Selection"}),(0,r.jsxs)("select",{value:f.model,onChange:e=>b({...f,model:e.target.value}),style:p,children:[(0,r.jsx)("option",{value:"claude-3-5-sonnet",children:"Claude 3.5 Sonnet (Recommended)"}),(0,r.jsx)("option",{value:"gemini/gemini-1.5-pro",children:"Gemini 1.5 Pro"}),(0,r.jsx)("option",{value:"gemini/gemini-1.5-flash",children:"Gemini 1.5 Flash"}),(0,r.jsx)("option",{value:"gemini/gemini-2.0-flash-exp",children:"Gemini 2.0 Flash Exp"}),(0,r.jsx)("option",{value:"gpt-4o",children:"GPT-4o"}),(0,r.jsx)("option",{value:"deepseek/deepseek-coder",children:"DeepSeek Coder"}),(0,r.jsx)("option",{value:"gpt-4-turbo",children:"GPT-4 Turbo"})]})]}),(0,r.jsxs)("div",{style:s,children:[(0,r.jsx)("label",{style:d,children:"Extra CLI Flags (Optional)"}),(0,r.jsx)("input",{type:"text",value:f.extraFlags,onChange:e=>b({...f,extraFlags:e.target.value}),placeholder:"e.g. --no-git --auto-commits",style:c}),(0,r.jsx)("span",{style:{fontSize:"0.7rem",color:"var(--muted)",marginTop:"0.25rem"},children:"Appended directly to the startup shell command."})]}),w&&(0,r.jsxs)("div",{style:g,children:["✗ ",w]})]}),(0,r.jsxs)("div",{style:m,children:[(0,r.jsx)("button",{onClick:e,style:x,disabled:C,children:"Cancel"}),(0,r.jsx)("button",{onClick:D,style:u,disabled:C,children:C?"Saving...":"Save & Launch Session"})]})]})})}])},9949,e=>{e.n(e.i(1663))}]);