import { useState } from 'react'; import { useRouter } from 'next/router'; import Link from 'next/link'; import Head from 'next/head'; import { VerticalFarm, FacilitySpecs, GrowingZone } from '../../lib/vertical-farming/types'; export default function RegisterVerticalFarm() { const router = useRouter(); const [step, setStep] = useState(1); const [loading, setLoading] = useState(false); const [error, setError] = useState(''); const [formData, setFormData] = useState({ name: '', address: '', city: '', country: '', latitude: '', longitude: '', timezone: Intl.DateTimeFormat().resolvedOptions().timeZone, totalAreaSqm: '', growingAreaSqm: '', numberOfLevels: '1', ceilingHeightM: '3', totalGrowingPositions: '', powerCapacityKw: '', waterStorageL: '', buildingType: 'warehouse' as const, automationLevel: 'semi_automated' as const, zones: [] as Partial[], }); const updateField = (field: string, value: any) => { setFormData(prev => ({ ...prev, [field]: value })); }; const addZone = () => { const newZone: Partial = { id: `zone-${Date.now()}`, name: `Zone ${formData.zones.length + 1}`, level: 1, areaSqm: 10, lengthM: 5, widthM: 2, growingMethod: 'NFT', plantPositions: 100, status: 'empty', plantIds: [], }; setFormData(prev => ({ ...prev, zones: [...prev.zones, newZone] })); }; const updateZone = (index: number, updates: Partial) => { setFormData(prev => ({ ...prev, zones: prev.zones.map((z, i) => (i === index ? { ...z, ...updates } : z)), })); }; const removeZone = (index: number) => { setFormData(prev => ({ ...prev, zones: prev.zones.filter((_, i) => i !== index), })); }; const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); setLoading(true); setError(''); try { const farmData = { name: formData.name, location: { latitude: parseFloat(formData.latitude), longitude: parseFloat(formData.longitude), address: formData.address, city: formData.city, country: formData.country, timezone: formData.timezone, }, specs: { totalAreaSqm: parseFloat(formData.totalAreaSqm), growingAreaSqm: parseFloat(formData.growingAreaSqm), numberOfLevels: parseInt(formData.numberOfLevels), ceilingHeightM: parseFloat(formData.ceilingHeightM), totalGrowingPositions: parseInt(formData.totalGrowingPositions), currentActivePlants: 0, powerCapacityKw: parseFloat(formData.powerCapacityKw) || 0, waterStorageL: parseFloat(formData.waterStorageL) || 0, backupPowerHours: 0, certifications: [], buildingType: formData.buildingType, insulation: 'standard', }, zones: formData.zones, automationLevel: formData.automationLevel, }; const response = await fetch('/api/vertical-farm/register', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(farmData), }); const data = await response.json(); if (data.success) { router.push(`/vertical-farm/${data.farm.id}`); } else { setError(data.error || 'Failed to register farm'); } } catch (err) { setError('Network error. Please try again.'); } finally { setLoading(false); } }; return (
Register Vertical Farm - LocalGreenChain

Register Vertical Farm

{/* Progress Steps */}
{[1, 2, 3].map(s => (
= s ? 'bg-green-600 text-white' : 'bg-gray-200 text-gray-600' }`} > {s}
{s < 3 && (
s ? 'bg-green-600' : 'bg-gray-200'}`} /> )}
))}
Basic Info Facility Specs Zones
{error && (
{error}
)}
{/* Step 1: Basic Info */} {step === 1 && (

Basic Information

updateField('name', e.target.value)} placeholder="My Vertical Farm" className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('address', e.target.value)} placeholder="123 Farm Street" className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('city', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('country', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('latitude', e.target.value)} placeholder="40.7128" className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('longitude', e.target.value)} placeholder="-74.0060" className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
)} {/* Step 2: Facility Specs */} {step === 2 && (

Facility Specifications

updateField('totalAreaSqm', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('growingAreaSqm', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('numberOfLevels', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('ceilingHeightM', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('totalGrowingPositions', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('powerCapacityKw', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
updateField('waterStorageL', e.target.value)} className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500" />
)} {/* Step 3: Zones */} {step === 3 && (

Growing Zones

{formData.zones.length === 0 ? (

No zones added yet. Click "Add Zone" to create your first growing zone.

) : (
{formData.zones.map((zone, index) => (
updateZone(index, { name: e.target.value })} className="text-lg font-medium border-none focus:ring-0 p-0" />
updateZone(index, { level: parseInt(e.target.value) })} className="w-full px-2 py-1 border border-gray-300 rounded text-sm" />
updateZone(index, { areaSqm: parseFloat(e.target.value) })} className="w-full px-2 py-1 border border-gray-300 rounded text-sm" />
updateZone(index, { plantPositions: parseInt(e.target.value) })} className="w-full px-2 py-1 border border-gray-300 rounded text-sm" />
))}
)}
)} {/* Navigation Buttons */}
{step > 1 ? ( ) : (
)} {step < 3 ? ( ) : ( )}
); }