fix(crm): country dropdown on customer profile billing address too
Mirror the onboarding fix on the customer profile (Rechnungsadresse): replace the free-text 2-char Country input with the CountrySelect dropdown and move it below State/region. Grid reflowed: Postal+City row, then State+Country row.
This commit is contained in:
@@ -28,7 +28,7 @@ import { toast } from 'react-toastify';
|
|||||||
import { useQuery, useQueryClient } from '@tanstack/react-query';
|
import { useQuery, useQueryClient } from '@tanstack/react-query';
|
||||||
import { Lock, Save, User as UserIcon, MapPin, Phone, Mail } from 'lucide-react';
|
import { Lock, Save, User as UserIcon, MapPin, Phone, Mail } from 'lucide-react';
|
||||||
|
|
||||||
import { Button, Input, Loading } from '../../components/common';
|
import { Button, Input, Loading, CountrySelect } from '../../components/common';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Inline tile wrapper used in place of <Card> on this page.
|
* Inline tile wrapper used in place of <Card> on this page.
|
||||||
@@ -415,7 +415,7 @@ export const CustomerProfilePage: React.FC = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="sm:col-span-3">
|
<div className="sm:col-span-4">
|
||||||
<label className="block text-sm font-medium text-theme mb-1" htmlFor="profile-city">
|
<label className="block text-sm font-medium text-theme mb-1" htmlFor="profile-city">
|
||||||
{t('customer.profile.field.city', 'City')}
|
{t('customer.profile.field.city', 'City')}
|
||||||
</label>
|
</label>
|
||||||
@@ -428,21 +428,6 @@ export const CustomerProfilePage: React.FC = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="sm:col-span-1">
|
|
||||||
<label className="block text-sm font-medium text-theme mb-1" htmlFor="profile-country">
|
|
||||||
{t('customer.profile.field.countryCode', 'Country')}
|
|
||||||
</label>
|
|
||||||
<Input
|
|
||||||
id="profile-country"
|
|
||||||
name="country"
|
|
||||||
autoComplete="billing country"
|
|
||||||
placeholder="DE"
|
|
||||||
maxLength={2}
|
|
||||||
value={form.countryCode || ''}
|
|
||||||
onChange={(e) => updateField('countryCode', e.target.value.toUpperCase().slice(0, 2))}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="sm:col-span-3">
|
<div className="sm:col-span-3">
|
||||||
<label className="block text-sm font-medium text-theme mb-1" htmlFor="profile-state">
|
<label className="block text-sm font-medium text-theme mb-1" htmlFor="profile-state">
|
||||||
{t('customer.profile.field.state', 'State / region')}
|
{t('customer.profile.field.state', 'State / region')}
|
||||||
@@ -455,6 +440,17 @@ export const CustomerProfilePage: React.FC = () => {
|
|||||||
onChange={(e) => updateField('state', e.target.value)}
|
onChange={(e) => updateField('state', e.target.value)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className="sm:col-span-3">
|
||||||
|
{/* Country picker (ISO code) — dropdown, mirroring the admin
|
||||||
|
customer / business-profile forms, placed after State /
|
||||||
|
region. Replaces the old free-text 2-char input. */}
|
||||||
|
<CountrySelect
|
||||||
|
label={t('customer.profile.field.countryCode', 'Country') as string}
|
||||||
|
value={form.countryCode || ''}
|
||||||
|
onChange={(code) => updateField('countryCode', code)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ProfileTile>
|
</ProfileTile>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user