{
- const saved = localStorage.getItem(`guestSortOrder_${eventId}`)
- return saved && ['asc', 'desc', 'none'].includes(saved) ? saved : 'none'
- }) // 'none' | 'asc' | 'desc'
+ const [sortField, setSortField] = useState(() => localStorage.getItem(`guestSortField_${eventId}`) || 'none')
+ const [sortDir, setSortDir] = useState(() => {
+ const d = localStorage.getItem(`guestSortDir_${eventId}`)
+ return (d === 'asc' || d === 'desc') ? d : 'asc'
+ })
const [considerationIds, setConsiderationIds] = useState(new Set())
const [showConsiderationPanel, setShowConsiderationPanel] = useState(true)
+ const [showColumnSettings, setShowColumnSettings] = useState(false)
+
+ const ALL_COLUMNS = [
+ { key: 'phone', label: he.phone },
+ { key: 'email', label: he.email },
+ { key: 'rsvpStatus', label: he.rsvpStatus },
+ { key: 'companions', label: he.companions },
+ { key: 'mealPref', label: he.mealPref },
+ { key: 'plusOne', label: he.plusOne },
+ ]
+ const DEFAULT_VISIBLE = new Set(['phone', 'rsvpStatus', 'companions'])
+
+ const [visibleColumns, setVisibleColumns] = useState(() => {
+ try {
+ const saved = localStorage.getItem(`guestColumns_${eventId}`)
+ if (saved) return new Set(JSON.parse(saved))
+ } catch {}
+ return DEFAULT_VISIBLE
+ })
+
+ const toggleColumn = (key) => {
+ setVisibleColumns(prev => {
+ const next = new Set(prev)
+ next.has(key) ? next.delete(key) : next.add(key)
+ localStorage.setItem(`guestColumns_${eventId}`, JSON.stringify([...next]))
+ return next
+ })
+ }
useEffect(() => {
loadGuests()
@@ -299,16 +330,45 @@ function GuestList({ eventId, onBack, onShowMembers }) {
return true
})
- const sortedGuests = sortOrder === 'none'
+ const sortedGuests = sortField === 'none'
? filteredGuests
: [...filteredGuests].sort((a, b) => {
- const nameA = `${a.first_name || ''} ${a.last_name || ''}`.toLowerCase()
- const nameB = `${b.first_name || ''} ${b.last_name || ''}`.toLowerCase()
- return sortOrder === 'asc'
- ? nameA.localeCompare(nameB, 'he')
- : nameB.localeCompare(nameA, 'he')
+ let valA, valB
+ if (sortField === 'name') {
+ valA = `${a.first_name || ''} ${a.last_name || ''}`.toLowerCase()
+ valB = `${b.first_name || ''} ${b.last_name || ''}`.toLowerCase()
+ return sortDir === 'asc' ? valA.localeCompare(valB, 'he') : valB.localeCompare(valA, 'he')
+ }
+ if (sortField === 'rsvp') {
+ const order = { confirmed: 0, invited: 1, declined: 2 }
+ valA = order[a.rsvp_status] ?? 3
+ valB = order[b.rsvp_status] ?? 3
+ }
+ if (sortField === 'companions') {
+ valA = a.companion_count ?? 0
+ valB = b.companion_count ?? 0
+ }
+ return sortDir === 'asc' ? valA - valB : valB - valA
})
+ const cycleSort = (field) => {
+ if (sortField !== field) {
+ // switching to a new field — start asc
+ setSortField(field)
+ setSortDir('asc')
+ localStorage.setItem(`guestSortField_${eventId}`, field)
+ localStorage.setItem(`guestSortDir_${eventId}`, 'asc')
+ } else if (sortDir === 'asc') {
+ setSortDir('desc')
+ localStorage.setItem(`guestSortDir_${eventId}`, 'desc')
+ } else {
+ // was desc → clear sort
+ setSortField('none')
+ setSortDir('asc')
+ localStorage.setItem(`guestSortField_${eventId}`, 'none')
+ }
+ }
+
const stats = {
total: guests.length,
confirmed: guests.filter(g => g.rsvp_status === 'confirmed').length,
@@ -418,6 +478,9 @@ function GuestList({ eventId, onBack, onShowMembers }) {
{/* ── Row 2: toolbar ── */}
+
@@ -426,6 +489,9 @@ function GuestList({ eventId, onBack, onShowMembers }) {
+
+ {showColumnSettings && (
+
+ עמודות מוצגות:
+ {ALL_COLUMNS.map(col => (
+
+ ))}
+
+ )}
+
{considerationIds.size > 0 && (
@@ -543,18 +625,23 @@ function GuestList({ eventId, onBack, onShowMembers }) {
title={he.selectAll}
/>
-
setSortOrder(o => {
- const next = o === 'asc' ? 'desc' : o === 'desc' ? 'none' : 'asc'
- localStorage.setItem(`guestSortOrder_${eventId}`, next)
- return next
- })} title={he.sortByName}>
- {he.name} {sortOrder === 'asc' ? '↑' : sortOrder === 'desc' ? '↓' : '⇅'}
+ | cycleSort('name')} title={he.sortByName}>
+ {he.name} {sortField === 'name' ? (sortDir === 'asc' ? '↑' : '↓') : '⇅'}
|
-
{he.phone} |
-
{he.email} |
-
{he.rsvpStatus} |
-
{he.mealPref} |
-
{he.plusOne} |
+ {visibleColumns.has('phone') &&
{he.phone} | }
+ {visibleColumns.has('email') &&
{he.email} | }
+ {visibleColumns.has('rsvpStatus') && (
+
cycleSort('rsvp')}>
+ {he.rsvpStatus} {sortField === 'rsvp' ? (sortDir === 'asc' ? '↑' : '↓') : '⇅'}
+ |
+ )}
+ {visibleColumns.has('companions') && (
+
cycleSort('companions')}>
+ {he.companions} {sortField === 'companions' ? (sortDir === 'asc' ? '↑' : '↓') : '⇅'}
+ |
+ )}
+ {visibleColumns.has('mealPref') &&
{he.mealPref} | }
+ {visibleColumns.has('plusOne') &&
{he.plusOne} | }
{he.actions} |
@@ -571,15 +658,18 @@ function GuestList({ eventId, onBack, onShowMembers }) {
{guest.first_name} {guest.last_name}
|
-
{guest.phone_number || '-'} |
-
{guest.email || '-'} |
-
-
- {he[guest.rsvp_status] || guest.rsvp_status}
-
- |
-
{guest.meal_preference || '-'} |
-
{guest.plus_one_name || (guest.has_plus_one ? 'Yes (not named)' : 'No')} |
+ {visibleColumns.has('phone') &&
{guest.phone_number || '-'} | }
+ {visibleColumns.has('email') &&
{guest.email || '-'} | }
+ {visibleColumns.has('rsvpStatus') && (
+
+
+ {he[guest.rsvp_status] || guest.rsvp_status}
+
+ |
+ )}
+ {visibleColumns.has('companions') &&
{guest.companion_count ?? 0} | }
+ {visibleColumns.has('mealPref') &&
{guest.meal_preference || '-'} | }
+ {visibleColumns.has('plusOne') &&
{guest.plus_one_name || (guest.has_plus_one ? 'Yes' : 'No')} | }
| 
{ e.target.style.display = 'none' }}
+ />
+