diff --git a/pages/deploy.tsx b/pages/deploy.tsx new file mode 100644 index 0000000..b1f3a08 --- /dev/null +++ b/pages/deploy.tsx @@ -0,0 +1,124 @@ +import { useState } from 'react'; +import axios from 'axios'; + +export default function DeploymentForm() { + const [formData, setFormData] = useState({ + project_name: '', + git_url: '', + port: '', + env_vars: '' + }); + const [deployedUrl, setDeployedUrl] = useState(null); + const [loading, setLoading] = useState(false); + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setLoading(true); + + try { + // Parse env vars from text to object + const envLines = formData.env_vars.split('\n').filter(line => line.trim()); + const filteredEnvVars = Object.fromEntries( + envLines.map(line => { + const [key, value] = line.split('='); + return [key.trim(), value.trim()]; + }) + ); + + const response = await axios.post('http://35.227.177.48:8080/deploy', { + git_url: formData.git_url, + project_name: formData.project_name, + port: formData.port, + env_vars: filteredEnvVars + }); + + setDeployedUrl(response.data.url); + } catch (error) { + console.error('Deployment failed:', error); + } finally { + setLoading(false); + } + }; + + return ( +
+

Deploy Project

+ +
+
+ + setFormData(prev => ({...prev, project_name: e.target.value}))} + className="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" + required + /> +
+ +
+ + setFormData(prev => ({...prev, git_url: e.target.value}))} + className="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" + required + /> +
+ +
+ + setFormData(prev => ({...prev, port: e.target.value}))} + className="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" + required + /> +
+ +
+ +