gitarsenal-cli 1.9.108 → 1.9.112

package/.venv_status.json

@@ -1 +1 @@
-{"created":"2025-10-15T13:20:17.803Z","packages":["modal","gitingest","requests","anthropic"],"uv_version":"uv 0.8.4 (Homebrew 2025-07-30)"}
+{"created":"2025-10-15T14:03:01.884Z","packages":["modal","gitingest","requests","anthropic"],"uv_version":"uv 0.8.4 (Homebrew 2025-07-30)"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gitarsenal-cli",
-  "version": "1.9.108",
+  "version": "1.9.112",
   "description": "CLI tool for creating Modal sandboxes with GitHub repositories",
   "main": "index.js",
   "bin": {

package/tui-app/index.jsx

@@ -2,7 +2,7 @@
 
 import { render, useKeyboard, useTerminalDimensions } from '@opentui/react';
 import { useState, useEffect } from 'react';
-import { spawn } from 'child_process';
+import { spawn, exec } from 'child_process';
 import { join } from 'path';
 import { fileURLToPath } from 'url';
 import { dirname } from 'path';
@@ -12,6 +12,17 @@ import os from 'os';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 
+// Helper function to open URLs in default browser
+const openUrl = (url) => {
+  const command = process.platform === 'darwin' ? 'open' :
+                  process.platform === 'win32' ? 'start' : 'xdg-open';
+  exec(`${command} ${url}`, (error) => {
+    if (error) {
+      console.error('Could not open URL:', error);
+    }
+  });
+};
+
 // Helper functions for user credentials
 const getUserConfigPath = () => {
   const userConfigDir = join(os.homedir(), '.gitarsenal');
@@ -54,6 +65,71 @@ const saveUserCredentials = (userId, userName, userEmail) => {
   }
 };
 
+// Helper functions for API keys management
+// Uses the same storage format as gitarsenal-cli Python CredentialsManager
+const getCredentialsPath = () => {
+  const configDir = join(os.homedir(), '.gitarsenal');
+  const credentialsPath = join(configDir, 'credentials.json');
+  return { configDir, credentialsPath };
+};
+
+const loadApiKeys = () => {
+  const { credentialsPath } = getCredentialsPath();
+  if (fs.existsSync(credentialsPath)) {
+    try {
+      const credentials = JSON.parse(fs.readFileSync(credentialsPath, 'utf8'));
+      return credentials;
+    } catch (error) {
+      console.error('Could not read credentials:', error);
+    }
+  }
+  return {};
+};
+
+const saveApiKey = (serviceName, apiKey) => {
+  const { configDir, credentialsPath } = getCredentialsPath();
+  try {
+    if (!fs.existsSync(configDir)) {
+      fs.mkdirSync(configDir, { recursive: true });
+    }
+    
+    // Load existing credentials
+    let credentials = loadApiKeys();
+    
+    // Update or delete the key
+    if (apiKey && apiKey.trim()) {
+      credentials[serviceName] = apiKey.trim();
+    } else {
+      delete credentials[serviceName];
+    }
+    
+    fs.writeFileSync(credentialsPath, JSON.stringify(credentials, null, 2));
+    
+    // Set restrictive permissions on Unix-like systems
+    if (process.platform !== 'win32') {
+      fs.chmodSync(credentialsPath, 0o600);
+    }
+    
+    return true;
+  } catch (error) {
+    console.error('Could not save credentials:', error);
+    return false;
+  }
+};
+
+const deleteApiKey = (serviceName) => {
+  const { credentialsPath } = getCredentialsPath();
+  try {
+    let credentials = loadApiKeys();
+    delete credentials[serviceName];
+    fs.writeFileSync(credentialsPath, JSON.stringify(credentials, null, 2));
+    return true;
+  } catch (error) {
+    console.error('Could not delete credential:', error);
+    return false;
+  }
+};
+
 const menuItems = [
   'Create New Sandbox',
   'View Running Sandboxes',
@@ -362,6 +438,126 @@ const RegisterForm = ({ values, onInput, onSubmit }) => {
   );
 };
 
+const ApiKeysManagement = ({ apiKeys, selectedIndex }) => {
+  // Get all stored keys as an array
+  const storedKeyNames = Object.keys(apiKeys).sort();
+  const hasStoredKeys = storedKeyNames.length > 0;
+
+  return (
+    <box style={{ flexDirection: 'column', alignItems: 'center' }}>
+      <box borderStyle="single" padding={1} marginBottom={1}>
+        <text bold>API Keys Management</text>
+      </box>
+      <box marginBottom={2} style={{ flexDirection: 'column', alignItems: 'center' }}>
+        <text dimColor fg="gray">Universal support for any service API key</text>
+        {hasStoredKeys ? (
+          <text fg="green">{storedKeyNames.length} key{storedKeyNames.length > 1 ? 's' : ''} stored</text>
+        ) : (
+          <text dimColor fg="gray">No API keys stored yet</text>
+        )}
+      </box>
+      
+      {/* Add New button */}
+      <box marginY={0} marginBottom={1}>
+        {selectedIndex === 0 ? (
+          <box borderStyle="single" borderColor="cyan" paddingX={2} paddingY={0} width={54} style={{ justifyContent: 'center' }}>
+            <text bold fg="cyan">+ Add New API Key</text>
+          </box>
+        ) : (
+          <box borderStyle="single" borderColor="gray" paddingX={2} paddingY={0} width={54} style={{ justifyContent: 'center' }}>
+            <text dimColor>+ Add New API Key</text>
+          </box>
+        )}
+      </box>
+
+      {/* Stored keys */}
+      {storedKeyNames.map((serviceName, index) => {
+        const itemIndex = index + 1; // +1 because "Add New" is at index 0
+        return (
+          <box key={serviceName} marginY={0} marginBottom={0}>
+            {itemIndex === selectedIndex ? (
+              <box borderStyle="single" borderColor="cyan" paddingX={2} paddingY={0} width={54} style={{ justifyContent: 'center' }}>
+                <text bold fg="cyan">{serviceName}</text>
+              </box>
+            ) : (
+              <box borderStyle="single" borderColor="gray" paddingX={2} paddingY={0} width={54} style={{ justifyContent: 'center' }}>
+                <text dimColor>{serviceName}</text>
+              </box>
+            )}
+          </box>
+        );
+      })}
+
+      <box marginTop={2} style={{ flexDirection: 'column', alignItems: 'center' }}>
+        <text bold>Controls:</text>
+        <text dimColor fg="gray">↑↓ - Navigate • Enter - {selectedIndex === 0 ? 'Add' : 'Modify'}</text>
+        {selectedIndex > 0 && <text dimColor fg="gray">D - Delete selected key</text>}
+        <text dimColor fg="gray">Esc - Back to menu</text>
+      </box>
+    </box>
+  );
+};
+
+const ApiKeyForm = ({ serviceName, apiKey, onServiceInput, onKeyInput, onSubmit, isEditing }) => {
+  return (
+    <box style={{ flexDirection: 'column', alignItems: 'center' }}>
+      <box borderStyle="single" padding={1} marginBottom={1}>
+        <text bold>{isEditing ? 'Modify' : 'Add'} API Key</text>
+      </box>
+      <box marginBottom={2} style={{ flexDirection: 'column', alignItems: 'center' }}>
+        {isEditing ? (
+          <>
+            <text fg="green">Modifying existing API key</text>
+            <text dimColor fg="gray">Update the API key value below</text>
+          </>
+        ) : (
+          <>
+            <text dimColor fg="gray">Add API key for any service</text>
+            <text dimColor fg="gray">Examples: openai_api_key, WANDB_API_KEY, modal_token</text>
+          </>
+        )}
+      </box>
+      
+      {!isEditing && (
+        <box marginBottom={2} style={{ flexDirection: 'column', alignItems: 'center' }}>
+          <text bold>Service Name:</text>
+          <input
+            value={serviceName || ''}
+            onInput={onServiceInput}
+            placeholder="e.g., openai_api_key"
+            focused={true}
+            width={70}
+          />
+        </box>
+      )}
+      
+      {isEditing && (
+        <box marginBottom={2} style={{ flexDirection: 'column', alignItems: 'center' }}>
+          <text bold>Service:</text>
+          <text fg="cyan">{serviceName}</text>
+        </box>
+      )}
+      
+      <box marginBottom={1} style={{ flexDirection: 'column', alignItems: 'center' }}>
+        <text bold>API Key:</text>
+        <input
+          value={apiKey || ''}
+          onInput={onKeyInput}
+          onSubmit={onSubmit}
+          placeholder="Paste your API key here..."
+          focused={isEditing}
+          width={70}
+        />
+      </box>
+      
+      <box marginTop={1} style={{ flexDirection: 'column', alignItems: 'center' }}>
+        <text dimColor fg="gray">Enter to save • Esc to cancel</text>
+        {isEditing && <text dimColor fg="gray">Clear field to remove the key</text>}
+      </box>
+    </box>
+  );
+};
+
 const SandboxList = ({ sandboxes, selectedIndex }) => {
   const maxVisibleItems = 10;
   const totalSandboxes = sandboxes.length;
@@ -486,6 +682,11 @@ const App = () => {
   const [viewingSandboxId, setViewingSandboxId] = useState(null);
   const [userCredentials, setUserCredentials] = useState(null);
   const [authFormValues, setAuthFormValues] = useState({});
+  const [apiKeys, setApiKeys] = useState({});
+  const [editingServiceName, setEditingServiceName] = useState('');
+  const [serviceNameInput, setServiceNameInput] = useState('');
+  const [apiKeyInput, setApiKeyInput] = useState('');
+  const [isEditingExisting, setIsEditingExisting] = useState(false);
 
   // Load user credentials on mount
   useEffect(() => {
@@ -497,6 +698,12 @@ const App = () => {
     }
   }, []);
 
+  // Load API keys on mount
+  useEffect(() => {
+    const keys = loadApiKeys();
+    setApiKeys(keys);
+  }, []);
+
 
   const createSandbox = () => {
     const sandboxId = sandboxIdCounter;
@@ -606,6 +813,19 @@ const App = () => {
       return;
     }
 
+    if (screen === 'apiKeyForm') {
+      if (key.name === 'escape') {
+        setEditingServiceName('');
+        setServiceNameInput('');
+        setApiKeyInput('');
+        setIsEditingExisting(false);
+        setScreen('apiKeysManagement');
+        setSelectedIndex(0);
+      }
+      // Let the input component handle all other keys
+      return;
+    }
+
     if (screen === 'menu') {
       if (key.name === 'up') {
         setSelectedIndex((prev) => (prev > 0 ? prev - 1 : menuItems.length - 1));
@@ -618,6 +838,14 @@ const App = () => {
         } else if (selectedIndex === 1) {
           setScreen('sandboxList');
           setSelectedIndex(0);
+        } else if (selectedIndex === 2) {
+          setScreen('apiKeysManagement');
+          setSelectedIndex(0);
+        } else if (selectedIndex === 4) {
+          // Help & Examples - open docs page
+          openUrl('https://gitarsenal.dev/docs');
+          setStatusMessage('Opening documentation in your browser...');
+          setTimeout(() => setStatusMessage(''), 3000);
         } else if (selectedIndex === menuItems.length - 1) {
           process.exit(0);
         }
@@ -739,6 +967,50 @@ const App = () => {
         setViewingSandboxId(null);
         setScreen('sandboxList');
       }
+    } else if (screen === 'apiKeysManagement') {
+      // Calculate items: 1 "Add New" + all stored keys
+      const storedKeyNames = Object.keys(apiKeys).sort();
+      const totalItems = 1 + storedKeyNames.length; // 1 for "Add New" + stored keys
+      
+      if (key.name === 'up') {
+        setSelectedIndex((prev) => (prev > 0 ? prev - 1 : totalItems - 1));
+      } else if (key.name === 'down') {
+        setSelectedIndex((prev) => (prev < totalItems - 1 ? prev + 1 : 0));
+      } else if (key.name === 'return' || key.name === 'enter') {
+        if (selectedIndex === 0) {
+          // "Add New API Key" selected
+          setServiceNameInput('');
+          setApiKeyInput('');
+          setIsEditingExisting(false);
+          setScreen('apiKeyForm');
+        } else {
+          // One of the stored keys selected - edit it
+          const serviceName = storedKeyNames[selectedIndex - 1];
+          setEditingServiceName(serviceName);
+          setServiceNameInput(serviceName);
+          setApiKeyInput(apiKeys[serviceName] || '');
+          setIsEditingExisting(true);
+          setScreen('apiKeyForm');
+        }
+      } else if (key.name === 'd') {
+        if (selectedIndex > 0) {
+          // Delete a stored key
+          const serviceName = storedKeyNames[selectedIndex - 1];
+          const success = deleteApiKey(serviceName);
+          if (success) {
+            setApiKeys(loadApiKeys());
+            setStatusMessage(`${serviceName} removed`);
+            setTimeout(() => setStatusMessage(''), 3000);
+            // Adjust selection if needed
+            if (selectedIndex >= totalItems - 1 && selectedIndex > 0) {
+              setSelectedIndex(selectedIndex - 1);
+            }
+          }
+        }
+      } else if (key.name === 'escape') {
+        setScreen('menu');
+        setSelectedIndex(0);
+      }
     }
   });
 
@@ -818,6 +1090,60 @@ const App = () => {
     }
   };
 
+  const handleServiceNameInput = (value) => {
+    setServiceNameInput(value);
+  };
+
+  const handleApiKeyInput = (value) => {
+    setApiKeyInput(value);
+  };
+
+  const handleApiKeyFormSubmit = () => {
+    const serviceName = isEditingExisting ? editingServiceName : serviceNameInput.trim();
+    const apiKey = apiKeyInput.trim();
+    
+    // Validation
+    if (!isEditingExisting && !serviceName) {
+      setStatusMessage('Service name is required');
+      setTimeout(() => setStatusMessage(''), 3000);
+      return;
+    }
+    
+    if (!apiKey && !isEditingExisting) {
+      setStatusMessage('API key is required');
+      setTimeout(() => setStatusMessage(''), 3000);
+      return;
+    }
+    
+    // Save the API key
+    const saved = saveApiKey(serviceName, apiKey);
+    
+    if (saved) {
+      // Reload all keys
+      setApiKeys(loadApiKeys());
+      
+      if (!apiKey) {
+        setStatusMessage(`${serviceName} removed successfully!`);
+      } else if (isEditingExisting) {
+        setStatusMessage(`${serviceName} updated successfully!`);
+      } else {
+        setStatusMessage(`${serviceName} added successfully!`);
+      }
+      setTimeout(() => setStatusMessage(''), 3000);
+      
+      // Reset and go back
+      setEditingServiceName('');
+      setServiceNameInput('');
+      setApiKeyInput('');
+      setIsEditingExisting(false);
+      setScreen('apiKeysManagement');
+      setSelectedIndex(0);
+    } else {
+      setStatusMessage('Failed to save API key');
+      setTimeout(() => setStatusMessage(''), 3000);
+    }
+  };
+
   const viewingSandbox = viewingSandboxId ? sandboxes.find(s => s.id === viewingSandboxId) : null;
 
   return (
@@ -839,6 +1165,8 @@ const App = () => {
       {screen === 'register' && <RegisterForm values={authFormValues} onInput={handleAuthFormInput} onSubmit={handleRegisterSubmit} />}
       {screen === 'sandboxList' && <SandboxList sandboxes={sandboxes} selectedIndex={selectedIndex} />}
       {screen === 'sandboxLogs' && viewingSandbox && <SandboxLogs sandbox={viewingSandbox} />}
+      {screen === 'apiKeysManagement' && <ApiKeysManagement apiKeys={apiKeys} selectedIndex={selectedIndex} />}
+      {screen === 'apiKeyForm' && <ApiKeyForm serviceName={serviceNameInput} apiKey={apiKeyInput} onServiceInput={handleServiceNameInput} onKeyInput={handleApiKeyInput} onSubmit={handleApiKeyFormSubmit} isEditing={isEditingExisting} />}
     </box>
   );
 };