List Your Property

Fill out the form below to list your property for rent.

\n\n

\n {errors.submit && (\n

{errors.submit}

\n )}\n\n {/* Property Details */}\n

Property Details

\n \n

\n Property Title *\n handleInputChange('title', e.target.value)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.title ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"e.g., Beautiful 2BR Apartment in Downtown\"\n />\n {errors.title &&

{errors.title}

}\n

\n\n

\n Description *\n handleInputChange('description', e.target.value)}\n rows={4}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.description ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"Describe your property, amenities, and what makes it special...\"\n />\n {errors.description &&

{errors.description}

}\n

\n\n

\n Location *\n handleInputChange('location', e.target.value)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.location ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"e.g., Downtown Seattle, WA\"\n />\n {errors.location &&

{errors.location}

}\n

\n\n

\n Monthly Rent ($) *\n handleInputChange('price', parseInt(e.target.value) || 0)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.price ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"2500\"\n min=\"0\"\n />\n {errors.price &&

{errors.price}

}\n

\n\n

\n Property Type *\n handleInputChange('propertyType', e.target.value as any)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n >\n \n \n \n \n \n

\n\n

\n Bedrooms *\n handleInputChange('bedrooms', parseInt(e.target.value) || 0)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.bedrooms ? 'border-red-300' : 'border-gray-300'\n }`}\n min=\"0\"\n />\n {errors.bedrooms &&

{errors.bedrooms}

}\n

\n\n

\n Bathrooms *\n handleInputChange('bathrooms', parseFloat(e.target.value) || 0)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.bathrooms ? 'border-red-300' : 'border-gray-300'\n }`}\n min=\"0\"\n />\n {errors.bathrooms &&

{errors.bathrooms}

}\n

\n\n

\n Area (sq ft) *\n handleInputChange('area', parseInt(e.target.value) || 0)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.area ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"1200\"\n min=\"0\"\n />\n {errors.area &&

{errors.area}

}\n

\n\n

\n Image URL (optional)\n handleInputChange('imageUrl', e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"https://example.com/property-image.jpg\"\n />\n

\n\n {/* Owner Contact Information */}\n

Contact Information

\n \n

\n Your Name *\n handleInputChange('ownerName', e.target.value)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.ownerName ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"John Doe\"\n />\n {errors.ownerName &&

{errors.ownerName}

}\n

\n\n

\n Email *\n handleInputChange('ownerEmail', e.target.value)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.ownerEmail ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"john@example.com\"\n />\n {errors.ownerEmail &&

{errors.ownerEmail}

}\n

\n\n

\n Phone *\n handleInputChange('ownerPhone', e.target.value)}\n className={`w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 ${\n errors.ownerPhone ? 'border-red-300' : 'border-gray-300'\n }`}\n placeholder=\"(555) 123-4567\"\n />\n {errors.ownerPhone &&

{errors.ownerPhone}

}\n

\n\n

\n \n {loading ? 'Listing Property...' : 'List Property'}\n \n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/osakwe/osakwe1/code/frontend/components/PropertyForm.tsx","extension","actionData","errors"]