import { useState, useEffect } from 'react'; import { useRouter } from 'next/router'; import Link from 'next/link'; import Head from 'next/head'; export default function ClonePlant() { const router = useRouter(); const { parentId } = router.query; const [loading, setLoading] = useState(false); const [error, setError] = useState(''); const [success, setSuccess] = useState(false); const [parentPlant, setParentPlant] = useState(null); const [formData, setFormData] = useState({ propagationType: 'clone' as 'seed' | 'clone' | 'cutting' | 'division' | 'grafting', plantedDate: new Date().toISOString().split('T')[0], status: 'sprouted' as const, latitude: '', longitude: '', city: '', country: '', ownerName: '', ownerEmail: '', notes: '', }); useEffect(() => { if (parentId) { fetchParentPlant(); } }, [parentId]); const fetchParentPlant = async () => { try { const response = await fetch(`/api/plants/${parentId}`); const data = await response.json(); if (data.success) { setParentPlant(data.plant); } } catch (error) { console.error('Error fetching parent plant:', error); } }; const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); setLoading(true); setError(''); try { const newPlant = { plantedDate: formData.plantedDate, status: formData.status, location: { latitude: parseFloat(formData.latitude), longitude: parseFloat(formData.longitude), city: formData.city || undefined, country: formData.country || undefined, }, owner: { id: `user-${Date.now()}`, name: formData.ownerName, email: formData.ownerEmail, }, notes: formData.notes || undefined, }; const response = await fetch('/api/plants/clone', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ parentPlantId: parentId, propagationType: formData.propagationType, newPlant, }), }); const data = await response.json(); if (!response.ok) { throw new Error(data.error || 'Failed to clone plant'); } setSuccess(true); setTimeout(() => { router.push(`/plants/${data.plant.id}`); }, 2000); } catch (err: any) { setError(err.message || 'An error occurred'); } finally { setLoading(false); } }; const handleChange = ( e: React.ChangeEvent< HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement > ) => { setFormData({ ...formData, [e.target.name]: e.target.value, }); }; const getCurrentLocation = () => { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition( (position) => { setFormData({ ...formData, latitude: position.coords.latitude.toString(), longitude: position.coords.longitude.toString(), }); }, (error) => { setError('Unable to get your location: ' + error.message); } ); } else { setError('Geolocation is not supported by your browser'); } }; if (!parentId) { return (

Error

No parent plant specified. Please select a plant to clone.

Browse Plants
); } return (
Clone Plant - LocalGreenChain {/* Header */}
🌱 LocalGreenChain
{/* Main Content */}

Clone Plant

Register a new offspring from an existing plant.

{/* Parent Plant Info */} {parentPlant && (

Parent Plant

{parentPlant.commonName} {parentPlant.scientificName && ( ({parentPlant.scientificName}) )}

Generation {parentPlant.generation} • Owned by{' '} {parentPlant.owner.name}

)} {error && (
{error}
)} {success && (
Plant cloned successfully! Redirecting to plant page...
)}
{/* Propagation Type */}

Propagation Method

{formData.propagationType === 'clone' && 'An exact genetic copy of the parent plant'} {formData.propagationType === 'seed' && 'Grown from seed (may have genetic variation)'} {formData.propagationType === 'cutting' && 'Propagated from a stem, leaf, or root cutting'} {formData.propagationType === 'division' && 'Separated from the parent plant'} {formData.propagationType === 'grafting' && 'Grafted onto another rootstock'}

{/* Plant Status */}

Current Status

{/* Location */}

Location

{/* Owner Information */}

Your Information

{/* Notes */}