Rewrite from Go + vanilla JS to Python (FastAPI) + React (TypeScript)

- Backend: Python 3.12 with FastAPI, SQLAlchemy, boto3
- Frontend: React 18 with TypeScript, Vite build tooling
- Updated Dockerfile for multi-stage Node + Python build
- Updated CI pipeline for Python backend
- Removed old Go code (cmd/, internal/, go.mod, go.sum)
- Updated README with new tech stack documentation
This commit is contained in:
2025-12-05 17:16:43 -06:00
parent a1d6542222
commit b9a12607f3
45 changed files with 2104 additions and 3359 deletions

128
frontend/src/pages/Home.tsx Normal file
View File

@@ -0,0 +1,128 @@
import { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
import { Grove } from '../types';
import { listGroves, createGrove } from '../api';
import './Home.css';
function Home() {
const [groves, setGroves] = useState<Grove[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [showForm, setShowForm] = useState(false);
const [newGrove, setNewGrove] = useState({ name: '', description: '', is_public: true });
const [creating, setCreating] = useState(false);
useEffect(() => {
loadGroves();
}, []);
async function loadGroves() {
try {
setLoading(true);
const data = await listGroves();
setGroves(data);
setError(null);
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to load groves');
} finally {
setLoading(false);
}
}
async function handleCreateGrove(e: React.FormEvent) {
e.preventDefault();
try {
setCreating(true);
await createGrove(newGrove);
setNewGrove({ name: '', description: '', is_public: true });
setShowForm(false);
loadGroves();
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to create grove');
} finally {
setCreating(false);
}
}
if (loading) {
return <div className="loading">Loading groves...</div>;
}
return (
<div className="home">
<div className="page-header">
<h1>Groves</h1>
<button className="btn btn-primary" onClick={() => setShowForm(!showForm)}>
{showForm ? 'Cancel' : '+ New Grove'}
</button>
</div>
{error && <div className="error-message">{error}</div>}
{showForm && (
<form className="form card" onSubmit={handleCreateGrove}>
<h3>Create New Grove</h3>
<div className="form-group">
<label htmlFor="name">Name</label>
<input
id="name"
type="text"
value={newGrove.name}
onChange={(e) => setNewGrove({ ...newGrove, name: e.target.value })}
placeholder="my-project"
required
/>
</div>
<div className="form-group">
<label htmlFor="description">Description</label>
<input
id="description"
type="text"
value={newGrove.description}
onChange={(e) => setNewGrove({ ...newGrove, description: e.target.value })}
placeholder="Optional description"
/>
</div>
<div className="form-group checkbox">
<label>
<input
type="checkbox"
checked={newGrove.is_public}
onChange={(e) => setNewGrove({ ...newGrove, is_public: e.target.checked })}
/>
Public
</label>
</div>
<button type="submit" className="btn btn-primary" disabled={creating}>
{creating ? 'Creating...' : 'Create Grove'}
</button>
</form>
)}
{groves.length === 0 ? (
<div className="empty-state">
<p>No groves yet. Create your first grove to get started!</p>
</div>
) : (
<div className="grove-grid">
{groves.map((grove) => (
<Link to={`/grove/${grove.name}`} key={grove.id} className="grove-card card">
<h3>{grove.name}</h3>
{grove.description && <p>{grove.description}</p>}
<div className="grove-meta">
<span className={`badge ${grove.is_public ? 'badge-public' : 'badge-private'}`}>
{grove.is_public ? 'Public' : 'Private'}
</span>
<span className="date">
Created {new Date(grove.created_at).toLocaleDateString()}
</span>
</div>
</Link>
))}
</div>
)}
</div>
);
}
export default Home;