feat: Add country selection dropdown with predefined options in company profile form

This commit is contained in:
seaznCode 2025-10-12 13:58:02 +02:00
parent 8798979fe9
commit d96f13474c

View File

@ -21,6 +21,16 @@ interface CompanyProfileData {
emergencyPhone: string emergencyPhone: string
} }
// Common countries list
const COUNTRIES = [
'Germany', 'Austria', 'Switzerland', 'Italy', 'France', 'Spain', 'Portugal', 'Netherlands',
'Belgium', 'Poland', 'Czech Republic', 'Hungary', 'Croatia', 'Slovenia', 'Slovakia',
'United Kingdom', 'Ireland', 'Sweden', 'Norway', 'Denmark', 'Finland', 'Russia',
'Turkey', 'Greece', 'Romania', 'Bulgaria', 'Serbia', 'Albania', 'Bosnia and Herzegovina',
'United States', 'Canada', 'Brazil', 'Argentina', 'Mexico', 'China', 'Japan',
'India', 'Pakistan', 'Australia', 'South Africa', 'Other'
]
const init: CompanyProfileData = { const init: CompanyProfileData = {
companyName: '', companyName: '',
vatNumber: '', vatNumber: '',
@ -46,7 +56,7 @@ export default function CompanyAdditionalInformationPage() {
const [success, setSuccess] = useState(false) const [success, setSuccess] = useState(false)
const [error, setError] = useState('') const [error, setError] = useState('')
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => { const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {
const { name, value } = e.target const { name, value } = e.target
setForm(p => ({ ...p, [name]: value })) setForm(p => ({ ...p, [name]: value }))
setError('') setError('')
@ -231,13 +241,20 @@ export default function CompanyAdditionalInformationPage() {
<label className="block text-sm font-medium text-gray-700 mb-1"> <label className="block text-sm font-medium text-gray-700 mb-1">
Country * Country *
</label> </label>
<input <select
name="country" name="country"
value={form.country} value={form.country}
onChange={handleChange} onChange={handleChange}
className="w-full rounded-lg border border-gray-300 px-3 py-2 text-sm focus:ring-2 focus:ring-indigo-500 focus:border-transparent" className="w-full rounded-lg border border-gray-300 px-3 py-2 text-sm focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
required required
/> >
<option value="">Select country...</option>
{COUNTRIES.map(country => (
<option key={country} value={country}>
{country}
</option>
))}
</select>
</div> </div>
</div> </div>
</section> </section>