fix: standalone /book page applies saved widget settings from backend
BookingWidgetStandalonePage now fetches widgetSettings from the public config API and applies them (color, language, mode, etc.) instead of always falling back to URL param defaults. URL params still work as overrides if present. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1655,6 +1655,17 @@ export interface WidgetConfig {
|
|||||||
currency: string
|
currency: string
|
||||||
rooms: WidgetRoom[]
|
rooms: WidgetRoom[]
|
||||||
categories: WidgetCategory[]
|
categories: WidgetCategory[]
|
||||||
|
widgetSettings?: {
|
||||||
|
primaryColor: string
|
||||||
|
language: string
|
||||||
|
roomDisplayMode: string
|
||||||
|
minNights: number
|
||||||
|
showRental: boolean
|
||||||
|
showPromo: boolean
|
||||||
|
allowExtraBeds: boolean
|
||||||
|
allowChildren: boolean
|
||||||
|
hotelName: string
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WidgetBookingPayload {
|
export interface WidgetBookingPayload {
|
||||||
|
|||||||
@@ -8,19 +8,24 @@ export function BookingWidgetStandalonePage() {
|
|||||||
const { slug } = useParams<{ slug: string }>()
|
const { slug } = useParams<{ slug: string }>()
|
||||||
const [searchParams] = useSearchParams()
|
const [searchParams] = useSearchParams()
|
||||||
|
|
||||||
const color = searchParams.get('color') ?? '#4F46E5'
|
|
||||||
const lang = (searchParams.get('lang') ?? 'ru') as 'ru' | 'en'
|
|
||||||
const mode = (searchParams.get('mode') ?? 'rooms') as 'rooms' | 'categories'
|
|
||||||
const minNights = parseInt(searchParams.get('min-nights') ?? '1') || 1
|
|
||||||
const showRental = searchParams.get('rental') === 'true'
|
|
||||||
const showPromo = searchParams.get('promo') !== 'false'
|
|
||||||
const extraBeds = searchParams.get('extra-beds') !== 'false'
|
|
||||||
const children = searchParams.get('children') !== 'false'
|
|
||||||
|
|
||||||
const [realRooms, setRealRooms] = useState<WidgetRoom[]>([])
|
const [realRooms, setRealRooms] = useState<WidgetRoom[]>([])
|
||||||
const [realCategories, setRealCategories] = useState<WidgetCategory[]>([])
|
const [realCategories, setRealCategories] = useState<WidgetCategory[]>([])
|
||||||
const [hotelName, setHotelName] = useState('')
|
|
||||||
const [paymentEnabled, setPaymentEnabled] = useState<boolean | undefined>(undefined)
|
const [paymentEnabled, setPaymentEnabled] = useState<boolean | undefined>(undefined)
|
||||||
|
const [settings, setSettings] = useState<WidgetSettings>({
|
||||||
|
hotelName: '',
|
||||||
|
primaryColor: searchParams.get('color') ?? '#4F46E5',
|
||||||
|
language: (searchParams.get('lang') ?? 'ru') as 'ru' | 'en',
|
||||||
|
showRooms: true,
|
||||||
|
showRental: searchParams.get('rental') === 'true',
|
||||||
|
roomDisplayMode: (searchParams.get('mode') ?? 'rooms') as 'rooms' | 'categories',
|
||||||
|
minNights: parseInt(searchParams.get('min-nights') ?? '1') || 1,
|
||||||
|
paymentProvider: 'yukassa',
|
||||||
|
showPromo: searchParams.get('promo') !== 'false',
|
||||||
|
allowExtraBeds: searchParams.get('extra-beds') !== 'false',
|
||||||
|
allowChildren: searchParams.get('children') !== 'false',
|
||||||
|
formFields: DEFAULT_FORM_FIELDS,
|
||||||
|
additionalServices: DEFAULT_SERVICES,
|
||||||
|
})
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!slug) return
|
if (!slug) return
|
||||||
@@ -28,28 +33,28 @@ export function BookingWidgetStandalonePage() {
|
|||||||
.then(config => {
|
.then(config => {
|
||||||
setRealRooms(config.rooms ?? [])
|
setRealRooms(config.rooms ?? [])
|
||||||
setRealCategories(config.categories ?? [])
|
setRealCategories(config.categories ?? [])
|
||||||
setHotelName(config.hotelName ?? '')
|
|
||||||
setPaymentEnabled(config.paymentEnabled)
|
setPaymentEnabled(config.paymentEnabled)
|
||||||
|
if (config.widgetSettings) {
|
||||||
|
const ws = config.widgetSettings
|
||||||
|
setSettings(prev => ({
|
||||||
|
...prev,
|
||||||
|
hotelName: ws.hotelName ?? config.hotelName ?? prev.hotelName,
|
||||||
|
primaryColor: ws.primaryColor ?? prev.primaryColor,
|
||||||
|
language: (ws.language ?? prev.language) as 'ru' | 'en',
|
||||||
|
roomDisplayMode: (ws.roomDisplayMode ?? prev.roomDisplayMode) as 'rooms' | 'categories',
|
||||||
|
minNights: ws.minNights ?? prev.minNights,
|
||||||
|
showRental: ws.showRental ?? prev.showRental,
|
||||||
|
showPromo: ws.showPromo ?? prev.showPromo,
|
||||||
|
allowExtraBeds: ws.allowExtraBeds ?? prev.allowExtraBeds,
|
||||||
|
allowChildren: ws.allowChildren ?? prev.allowChildren,
|
||||||
|
}))
|
||||||
|
} else {
|
||||||
|
setSettings(prev => ({ ...prev, hotelName: config.hotelName ?? prev.hotelName }))
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.catch(() => {})
|
.catch(() => {})
|
||||||
}, [slug])
|
}, [slug])
|
||||||
|
|
||||||
const settings: WidgetSettings = {
|
|
||||||
hotelName,
|
|
||||||
primaryColor: color,
|
|
||||||
language: lang,
|
|
||||||
showRooms: true,
|
|
||||||
showRental,
|
|
||||||
roomDisplayMode: mode,
|
|
||||||
minNights,
|
|
||||||
paymentProvider: 'yukassa',
|
|
||||||
showPromo,
|
|
||||||
allowExtraBeds: extraBeds,
|
|
||||||
allowChildren: children,
|
|
||||||
formFields: DEFAULT_FORM_FIELDS,
|
|
||||||
additionalServices: DEFAULT_SERVICES,
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-slate-50 flex items-start justify-center py-6 px-3">
|
<div className="min-h-screen bg-slate-50 flex items-start justify-center py-6 px-3">
|
||||||
<div className="w-full max-w-lg">
|
<div className="w-full max-w-lg">
|
||||||
|
|||||||
Reference in New Issue
Block a user