github/TREK
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(reservations): hide price/budget fields when budget addon is disabled

Browse Source 
Closes #440
This commit is contained in:
jubnl
2026-04-05 22:26:55 +02:00
parent fdbc015dbf
commit 7e0fe3b1b9
1 changed files with 42 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
client/src/components/Planner/ReservationModal.tsx
View File

@@ -2,6 +2,7 @@ import { useState, useEffect, useRef, useMemo } from 'react'
import { useParams } from 'react-router-dom' import { useParams } from 'react-router-dom'
import apiClient from '../../api/client' import apiClient from '../../api/client'
import { useTripStore } from '../../store/tripStore' import { useTripStore } from '../../store/tripStore'
import { useAddonStore } from '../../store/addonStore'
import Modal from '../shared/Modal' import Modal from '../shared/Modal'
import CustomSelect from '../shared/CustomSelect' import CustomSelect from '../shared/CustomSelect'
import { Plane, Hotel, Utensils, Train, Car, Ship, Ticket, FileText, Users, Paperclip, X, ExternalLink, Link2 } from 'lucide-react' import { Plane, Hotel, Utensils, Train, Car, Ship, Ticket, FileText, Users, Paperclip, X, ExternalLink, Link2 } from 'lucide-react'
@@ -71,6 +72,7 @@ export function ReservationModal({ isOpen, onClose, onSave, reservation, days, p
const { t, locale } = useTranslation() const { t, locale } = useTranslation()
const fileInputRef = useRef(null) const fileInputRef = useRef(null)
const isBudgetEnabled = useAddonStore(s => s.isEnabled('budget'))
const budgetItems = useTripStore(s => s.budgetItems) const budgetItems = useTripStore(s => s.budgetItems)
const budgetCategories = useMemo(() => { const budgetCategories = useMemo(() => {
const cats = new Set<string>() const cats = new Set<string>()
@@ -196,8 +198,10 @@ export function ReservationModal({ isOpen, onClose, onSave, reservation, days, p
if (form.end_date) { if (form.end_date) {
combinedEndTime = form.reservation_end_time ? `${form.end_date}T${form.reservation_end_time}` : form.end_date combinedEndTime = form.reservation_end_time ? `${form.end_date}T${form.reservation_end_time}` : form.end_date
} }
if (form.price) metadata.price = form.price if (isBudgetEnabled) {
if (form.budget_category) metadata.budget_category = form.budget_category if (form.price) metadata.price = form.price
if (form.budget_category) metadata.budget_category = form.budget_category
}
const saveData: Record<string, any> = { const saveData: Record<string, any> = {
title: form.title, type: form.type, status: form.status, title: form.title, type: form.type, status: form.status,
reservation_time: form.reservation_time, reservation_end_time: combinedEndTime, reservation_time: form.reservation_time, reservation_end_time: combinedEndTime,
@@ -208,9 +212,11 @@ export function ReservationModal({ isOpen, onClose, onSave, reservation, days, p
metadata: Object.keys(metadata).length > 0 ? metadata : null, metadata: Object.keys(metadata).length > 0 ? metadata : null,
} }
// Auto-create/update budget entry if price is set, or signal removal if cleared // Auto-create/update budget entry if price is set, or signal removal if cleared
saveData.create_budget_entry = form.price && parseFloat(form.price) > 0 if (isBudgetEnabled) {
? { total_price: parseFloat(form.price), category: form.budget_category || t(`reservations.type.${form.type}`) || 'Other' } saveData.create_budget_entry = form.price && parseFloat(form.price) > 0
: { total_price: 0 } ? { total_price: parseFloat(form.price), category: form.budget_category || t(`reservations.type.${form.type}`) || 'Other' }
: { total_price: 0 }
}
// If hotel with place + days, pass hotel data for auto-creation or update // If hotel with place + days, pass hotel data for auto-creation or update
if (form.type === 'hotel' && form.hotel_place_id && form.hotel_start_day && form.hotel_end_day) { if (form.type === 'hotel' && form.hotel_place_id && form.hotel_start_day && form.hotel_end_day) {
saveData.create_accommodation = { saveData.create_accommodation = {
@@ -643,33 +649,37 @@ export function ReservationModal({ isOpen, onClose, onSave, reservation, days, p
</div> </div>
</div> </div>
{/* Price + Budget Category */} {/* Price + Budget Category — only shown when budget addon is enabled */}
<div style={{ display: 'flex', gap: 8 }}> {isBudgetEnabled && (
<div style={{ flex: 1, minWidth: 0 }}> <>
<label style={labelStyle}>{t('reservations.price')}</label> <div style={{ display: 'flex', gap: 8 }}>
<input type="text" inputMode="decimal" value={form.price} <div style={{ flex: 1, minWidth: 0 }}>
onChange={e => { const v = e.target.value; if (v === '' || /^\d*\.?\d{0,2}$/.test(v)) set('price', v) }} <label style={labelStyle}>{t('reservations.price')}</label>
placeholder="0.00" <input type="text" inputMode="decimal" value={form.price}
style={inputStyle} /> onChange={e => { const v = e.target.value; if (v === '' || /^\d*\.?\d{0,2}$/.test(v)) set('price', v) }}
</div> placeholder="0.00"
<div style={{ flex: 1, minWidth: 0 }}> style={inputStyle} />
<label style={labelStyle}>{t('reservations.budgetCategory')}</label> </div>
<CustomSelect <div style={{ flex: 1, minWidth: 0 }}>
value={form.budget_category} <label style={labelStyle}>{t('reservations.budgetCategory')}</label>
onChange={v => set('budget_category', v)} <CustomSelect
options={[ value={form.budget_category}
{ value: '', label: t('reservations.budgetCategoryAuto') }, onChange={v => set('budget_category', v)}
...budgetCategories.map(c => ({ value: c, label: c })), options={[
]} { value: '', label: t('reservations.budgetCategoryAuto') },
placeholder={t('reservations.budgetCategoryAuto')} ...budgetCategories.map(c => ({ value: c, label: c })),
size="sm" ]}
/> placeholder={t('reservations.budgetCategoryAuto')}
</div> size="sm"
</div> />
{form.price && parseFloat(form.price) > 0 && ( </div>
<div style={{ fontSize: 11, color: 'var(--text-faint)', marginTop: -4 }}> </div>
{t('reservations.budgetHint')} {form.price && parseFloat(form.price) > 0 && (
</div> <div style={{ fontSize: 11, color: 'var(--text-faint)', marginTop: -4 }}>
{t('reservations.budgetHint')}
</div>
)}
</>
)} )}
{/* Actions */} {/* Actions */}