diff --git a/src/pages/InvitationPage.tsx b/src/pages/InvitationPage.tsx index c9824b7..abc54b5 100644 --- a/src/pages/InvitationPage.tsx +++ b/src/pages/InvitationPage.tsx @@ -14,9 +14,7 @@ import { TextField, InputAdornment, Avatar, - Chip, - FormControlLabel, - Switch + Chip } from '@mui/material'; import { Share, @@ -27,7 +25,10 @@ import { GetApp, Refresh, ArrowBack, - Groups + Groups, + CheckCircle, + Schedule, + PersonOutline } from '@mui/icons-material'; import { QRCodeSVG } from 'qrcode.react'; import { dataService } from '../services/dataService'; @@ -41,11 +42,11 @@ const InvitationPage = () => { inviterName?: string; relationshipType?: string; }>({}); - const [isExistingMember, setIsExistingMember] = useState(false); const [copySuccess, setCopySuccess] = useState(false); const [invitationId, setInvitationId] = useState(''); const [group, setGroup] = useState(null); const [isGroupInvite, setIsGroupInvite] = useState(false); + const [inviteeNaoStatus, setInviteeNaoStatus] = useState<'member' | 'invited' | 'not_invited' | null>(null); const navigate = useNavigate(); const [searchParams] = useSearchParams(); @@ -64,17 +65,21 @@ const InvitationPage = () => { relationshipType: relationshipType || undefined, }); - // Auto-detect if invitee is an existing member by checking contacts + // Determine member status from contact data if available + let isExistingMember = false; if (inviteeName) { try { const contacts: Contact[] = await dataService.getContacts(); - const isExistingContact = contacts.some(contact => - contact.name.toLowerCase() === inviteeName.toLowerCase() + const contact = contacts.find(c => + c.name.toLowerCase() === inviteeName.toLowerCase() ); - if (isExistingContact) { - console.log(`Auto-detected ${inviteeName} as existing member`); - setIsExistingMember(true); + if (contact) { + isExistingMember = contact.naoStatus === 'member'; + setInviteeNaoStatus(contact.naoStatus || 'not_invited'); + console.log(`${inviteeName} NAO status:`, contact.naoStatus); + } else { + setInviteeNaoStatus('not_invited'); } } catch (error) { console.error('Failed to check contacts:', error); @@ -202,7 +207,7 @@ const InvitationPage = () => { } }; - const handleNewInvitation = () => { + const handleNewInvitation = async () => { const groupId = searchParams.get('groupId'); const inviteeName = searchParams.get('inviteeName'); const inviterName = searchParams.get('inviterName'); @@ -211,6 +216,26 @@ const InvitationPage = () => { const id = Math.random().toString(36).substring(2, 15); setInvitationId(id); + // Determine member status from contact data if available + let isExistingMember = false; + if (inviteeName) { + try { + const contacts: Contact[] = await dataService.getContacts(); + const contact = contacts.find(c => + c.name.toLowerCase() === inviteeName.toLowerCase() + ); + + if (contact) { + isExistingMember = contact.naoStatus === 'member'; + setInviteeNaoStatus(contact.naoStatus || 'not_invited'); + } else { + setInviteeNaoStatus('not_invited'); + } + } catch (error) { + console.error('Failed to check contacts:', error); + } + } + // Build URL with personalized parameters const urlParams = new URLSearchParams({ invite: id, @@ -364,48 +389,42 @@ const InvitationPage = () => { Invitation ID: {invitationId} + + {/* NAO Status Indicator */} + {personalizedInvite.inviteeName && inviteeNaoStatus && ( + + + Recipient Status: + + + {inviteeNaoStatus === 'member' && ( + <> + + + {personalizedInvite.inviteeName} is already a NAO member - they'll choose how to connect with this group + + + )} + {inviteeNaoStatus === 'invited' && ( + <> + + + {personalizedInvite.inviteeName} has been invited to NAO but hasn't joined yet + + + )} + {inviteeNaoStatus === 'not_invited' && ( + <> + + + {personalizedInvite.inviteeName} will need to create a new NAO account + + + )} + + + )} - {/* Existing Member Toggle */} - - { - setIsExistingMember(e.target.checked); - // Regenerate URL when toggle changes - const id = Math.random().toString(36).substring(2, 15); - setInvitationId(id); - const groupId = searchParams.get('groupId'); - const inviteeName = searchParams.get('inviteeName'); - const inviterName = searchParams.get('inviterName'); - const relationshipType = searchParams.get('relationshipType'); - - const urlParams = new URLSearchParams({ - invite: id, - ...(groupId && { groupId }), - ...(inviteeName && { inviteeName }), - ...(inviterName && { inviterName }), - ...(relationshipType && { relationshipType }), - ...(e.target.checked && { existingMember: 'true' }), - }); - - const url = `${window.location.origin}/onboarding?${urlParams.toString()}`; - setInvitationUrl(url); - }} - color="primary" - /> - } - label="Recipient is already a NAO member" - sx={{ alignItems: 'flex-start' }} - /> - - {isExistingMember - ? "They'll choose how to connect with this group using their existing profile" - : "They'll need to create a new NAO account first" - } - -