diff --git a/src/PickupConfigEditor.js b/src/PickupConfigEditor.js index 47e75eb..f30401a 100644 --- a/src/PickupConfigEditor.js +++ b/src/PickupConfigEditor.js @@ -3,21 +3,33 @@ import { startOfDay } from 'date-fns'; import PickupConfigTable from './components/PickupConfigTable'; import RangePickerModal from './components/RangePickerModal'; import usePickupConfig from './hooks/usePickupConfig'; -import { formatDateValue } from './utils/dateUtils'; +import 'react-date-range/dist/styles.css'; +import 'react-date-range/dist/theme/default.css'; const PickupConfigEditor = () => { const { config, - setConfig, loading, status, error, fetchConfig, - saveConfig + saveConfig, + toggleActive, + toggleProfileCheck, + toggleOnlyNotify, + changeWeekday, + updateDateRange } = usePickupConfig(); const [activeRangePicker, setActiveRangePicker] = useState(null); const minSelectableDate = startOfDay(new Date()); + const handleWeekdayChange = (index, value, entryId) => { + changeWeekday(index, value); + if (value && entryId) { + setActiveRangePicker((prev) => (prev === entryId ? null : prev)); + } + }; + useEffect(() => { if (!activeRangePicker) { return; @@ -28,65 +40,6 @@ const PickupConfigEditor = () => { } }, [activeRangePicker, config]); - const handleToggleActive = (index) => { - const newConfig = [...config]; - newConfig[index].active = !newConfig[index].active; - setConfig(newConfig); - }; - - const handleToggleProfileCheck = (index) => { - const newConfig = [...config]; - newConfig[index].checkProfileId = !newConfig[index].checkProfileId; - setConfig(newConfig); - }; - - const handleToggleOnlyNotify = (index) => { - const newConfig = [...config]; - newConfig[index].onlyNotify = !newConfig[index].onlyNotify; - setConfig(newConfig); - }; - - const handleWeekdayChange = (index, value) => { - const newConfig = [...config]; - const entryId = newConfig[index]?.id; - newConfig[index].desiredWeekday = value; - if (newConfig[index].desiredDateRange) { - delete newConfig[index].desiredDateRange; - } - setConfig(newConfig); - if (value && entryId) { - setActiveRangePicker((prev) => (prev === entryId ? null : prev)); - } - }; - - const handleDateRangeSelection = (entryId, startDate, endDate) => { - const startValue = formatDateValue(startDate); - const endValue = formatDateValue(endDate); - setConfig((prev) => - prev.map((item) => { - if (item.id !== entryId) { - return item; - } - const updated = { ...item }; - if (startValue || endValue) { - updated.desiredDateRange = { - start: startValue || endValue, - end: endValue || startValue - }; - if (updated.desiredWeekday) { - delete updated.desiredWeekday; - } - } else if (updated.desiredDateRange) { - delete updated.desiredDateRange; - } - if (updated.desiredDate) { - delete updated.desiredDate; - } - return updated; - }) - ); - }; - const activeRangeEntry = activeRangePicker ? config.find((item) => item.id === activeRangePicker) || null : null; @@ -116,9 +69,9 @@ const PickupConfigEditor = () => { @@ -150,10 +103,10 @@ const PickupConfigEditor = () => { entry={activeRangeEntry} minDate={minSelectableDate} onSelectRange={(startDate, endDate) => - handleDateRangeSelection(activeRangeEntry.id, startDate, endDate) + updateDateRange(activeRangeEntry.id, startDate, endDate) } onResetRange={() => { - handleDateRangeSelection(activeRangeEntry.id, null, null); + updateDateRange(activeRangeEntry.id, null, null); setActiveRangePicker(null); }} onClose={() => setActiveRangePicker(null)} diff --git a/src/components/PickupConfigTable.js b/src/components/PickupConfigTable.js index 0400784..aa9998c 100644 --- a/src/components/PickupConfigTable.js +++ b/src/components/PickupConfigTable.js @@ -32,8 +32,9 @@ const PickupConfigTable = ({ const rangeStart = normalizedRange?.start || ''; const rangeEnd = normalizedRange?.end || ''; const hasDateRange = Boolean(rangeStart || rangeEnd); + const rowKey = item.id ? `${item.id}-${index}` : `row-${index}`; return ( - +