automagik-cli
Version:
Automagik CLI - A powerful command-line interface for interacting with Automagik Hive multi-agent AI systems
100 lines (99 loc) • 7.05 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React, { useState } from 'react';
import { Box, Text } from 'ink';
import TextInput from 'ink-text-input';
import { Colors } from '../colors.js';
export const SettingsSetupDialog = ({ onSubmit, onCancel, isConnecting = false, connectionError, }) => {
const [step, setStep] = useState('url');
const [apiUrl, setApiUrl] = useState('http://localhost:8886');
const [apiKey, setApiKey] = useState('');
const [isSubmitting, setIsSubmitting] = useState(false);
const handleUrlSubmit = () => {
if (!apiUrl.trim()) {
return;
}
// Validate URL format
try {
new URL(apiUrl);
}
catch {
// If URL is invalid, try adding http:// prefix
if (!apiUrl.startsWith('http://') && !apiUrl.startsWith('https://')) {
try {
new URL(`http://${apiUrl}`);
setApiUrl(`http://${apiUrl}`);
}
catch {
return; // Invalid URL format
}
}
else {
return; // Invalid URL format
}
}
setStep('apikey');
};
const handleApiKeySubmit = async () => {
setIsSubmitting(true);
setStep('testing');
try {
await onSubmit({
apiBaseUrl: apiUrl,
apiKey: apiKey.trim() || undefined,
});
setStep('complete');
}
catch (error) {
setIsSubmitting(false);
setStep('apikey');
}
};
const handleSkipApiKey = async () => {
setIsSubmitting(true);
setStep('testing');
try {
await onSubmit({
apiBaseUrl: apiUrl,
apiKey: undefined,
});
setStep('complete');
}
catch (error) {
setIsSubmitting(false);
setStep('apikey');
}
};
const renderUrlStep = () => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.AccentBlue, children: "\uD83D\uDE80 Welcome to Automagik CLI - Initial Setup" }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: "Let's configure your API server connection. This will be saved to:" }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.Comment, children: "~/.automagik-cli/settings.json" }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: "Please enter your Automagik Hive API server URL:" }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.Comment, children: "Examples: http://localhost:8886, https://api.example.com, 192.168.1.100:8080" }) }), _jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: Colors.AccentCyan, children: "API Server URL: " }), _jsx(TextInput, { value: apiUrl, onChange: setApiUrl, onSubmit: handleUrlSubmit, placeholder: "http://localhost:8886" })] }), _jsx(Box, { children: _jsx(Text, { color: Colors.Comment, children: "Press Enter to continue, or Ctrl+C to cancel" }) })] }));
const renderApiKeyStep = () => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.AccentBlue, children: "\uD83D\uDD11 API Key Configuration (Optional)" }) }), _jsx(Box, { marginBottom: 1, children: _jsxs(Text, { children: ["API Server: ", _jsx(Text, { color: Colors.AccentGreen, children: apiUrl })] }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: "Do you have an API key for authentication? (Leave empty if not required)" }) }), connectionError && (_jsx(Box, { marginBottom: 1, children: _jsxs(Text, { color: Colors.AccentRed, children: ["\u274C Connection Error: ", connectionError] }) })), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.Comment, children: "API keys typically look like: hive_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx" }) }), _jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: Colors.AccentCyan, children: "API Key: " }), _jsx(TextInput, { value: apiKey, onChange: setApiKey, onSubmit: handleApiKeySubmit, placeholder: "Optional - press Enter to skip", mask: "*" })] }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.Comment, children: "Press Enter to test connection \u2022 Ctrl+U to go back \u2022 Ctrl+C to cancel" }) }), _jsx(Box, { children: _jsx(Text, { color: Colors.Comment, children: "\uD83D\uDCA1 You can always update these settings later" }) })] }));
const renderTestingStep = () => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.AccentBlue, children: "\uD83D\uDD04 Testing Connection..." }) }), _jsx(Box, { marginBottom: 1, children: _jsxs(Text, { children: ["Server: ", _jsx(Text, { color: Colors.AccentCyan, children: apiUrl })] }) }), _jsx(Box, { marginBottom: 1, children: _jsxs(Text, { children: ["API Key: ", _jsx(Text, { color: Colors.AccentCyan, children: apiKey ? '••••••••••••••••' : 'None (no authentication)' })] }) }), _jsx(Box, { children: _jsx(Text, { color: Colors.AccentYellow, children: "\u23F3 Validating server connection and saving settings..." }) })] }));
const renderCompleteStep = () => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: Colors.AccentGreen, children: "\u2705 Setup Complete!" }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: "Your settings have been saved to ~/.automagik-cli/settings.json" }) }), _jsx(Box, { marginBottom: 1, children: _jsxs(Text, { children: ["Server: ", _jsx(Text, { color: Colors.AccentGreen, children: apiUrl })] }) }), _jsx(Box, { marginBottom: 1, children: _jsxs(Text, { children: ["API Key: ", _jsx(Text, { color: Colors.AccentGreen, children: apiKey ? 'Configured' : 'Not required' })] }) }), _jsx(Box, { children: _jsx(Text, { color: Colors.Comment, children: "\uD83D\uDE80 Starting Automagik CLI..." }) })] }));
// Handle keyboard shortcuts
React.useEffect(() => {
const handleInput = (input, key) => {
if (step === 'apikey') {
if (key.ctrl && key.name === 'u') {
// Go back to URL step
setStep('url');
}
}
};
// Note: This is a simplified approach. In a real implementation,
// you might need to use a more sophisticated input handling mechanism
// that's compatible with Ink's architecture
return () => {
// Cleanup if needed
};
}, [step]);
switch (step) {
case 'url':
return renderUrlStep();
case 'apikey':
return renderApiKeyStep();
case 'testing':
return renderTestingStep();
case 'complete':
return renderCompleteStep();
default:
return renderUrlStep();
}
};