diff --git a/lib/components/core/map/place-autocomplete.tsx b/lib/components/core/map/place-autocomplete.tsx index 37d7aec10..494ede991 100644 --- a/lib/components/core/map/place-autocomplete.tsx +++ b/lib/components/core/map/place-autocomplete.tsx @@ -11,12 +11,16 @@ export function PlaceAutoComplete({ value, onSelect, autoFocus, + error, + hint, }: { label?: string; placeholder?: string; value?: string; onSelect?: (address: Address | undefined) => void; autoFocus?: boolean; + error?: boolean; + hint?: string; }) { const [toggle, setToggle] = React.useState(false); const [query, setQuery] = React.useState(''); @@ -84,8 +88,10 @@ export function PlaceAutoComplete({ label={label} autoFocus={autoFocus} iconLeft="icon-location-outline text-tertiary" - right={{ icon: 'icon-cancel text-tertiary size-5 cursor-pointer', onClick: handleClear }} + right={query ? { icon: 'icon-cancel text-tertiary size-5 cursor-pointer', onClick: handleClear } : undefined} value={query} + error={error} + hint={hint} placeholder={placeholder} onChange={(e) => { setQuery(e.currentTarget.value); diff --git a/lib/components/features/event-manage/registration-form/AddPersonalDetailsQuestion.tsx b/lib/components/features/event-manage/registration-form/AddPersonalDetailsQuestion.tsx index b384d5dfb..69b9876f8 100644 --- a/lib/components/features/event-manage/registration-form/AddPersonalDetailsQuestion.tsx +++ b/lib/components/features/event-manage/registration-form/AddPersonalDetailsQuestion.tsx @@ -1,17 +1,18 @@ -import { useState, useEffect } from "react"; +import { useState, useEffect } from 'react'; -import { Button, Input, LabeledInput, ModalContent, modal, Toggle, Select } from "$lib/components/core"; -import { ApplicationProfileField } from "$lib/graphql/generated/backend/graphql"; +import { Button, Input, LabeledInput, ModalContent, modal, Toggle, Select } from '$lib/components/core'; +import { ApplicationProfileField } from '$lib/graphql/generated/backend/graphql'; -import { AddQuestionModal } from "./AddQuestionModal"; -import { useSaveApplicationProfileField } from "../hooks"; +import { AddQuestionModal } from './AddQuestionModal'; +import { useSaveApplicationProfileField } from '../hooks'; const INFO_OPTIONS = ['Bio', 'Location', 'Pronouns']; const FIELD_CONFIG: Record = { - 'Bio': { field: 'description', defaultQuestion: 'Tell us about yourself' }, - // 'Location': { field: 'location_line', defaultQuestion: 'Where are you based?' }, - 'Pronouns': { field: 'pronoun', defaultQuestion: 'What are your pronouns?' } + Bio: { field: 'description', defaultQuestion: 'Tell us about yourself' }, + // Location: { field: 'location_line', defaultQuestion: 'Where are you based?' }, + Location: { field: 'addresses', defaultQuestion: 'Where are you based?' }, + Pronouns: { field: 'pronoun', defaultQuestion: 'What are your pronouns?' }, }; interface AddPersonalDetailsQuestionProps { @@ -21,14 +22,14 @@ interface AddPersonalDetailsQuestionProps { export function AddPersonalDetailsQuestion({ field }: AddPersonalDetailsQuestionProps) { const getInitialInfoType = () => { if (!field) return INFO_OPTIONS[0]; - + const fieldConfig = Object.entries(FIELD_CONFIG).find(([_, config]) => config.field === field.field); return fieldConfig ? fieldConfig[0] : INFO_OPTIONS[0]; }; const getInitialQuestion = () => { if (field?.question) return field.question; - + const infoType = getInitialInfoType(); return FIELD_CONFIG[infoType]?.defaultQuestion || INFO_OPTIONS[0]; }; @@ -37,7 +38,7 @@ export function AddPersonalDetailsQuestion({ field }: AddPersonalDetailsQuestion const [required, setRequired] = useState(field?.required || false); const [selectedInfoType, setSelectedInfoType] = useState(getInitialInfoType()); const { saveApplicationProfileField, loading } = useSaveApplicationProfileField(); - + useEffect(() => { if (field) { const infoType = getInitialInfoType(); @@ -46,17 +47,17 @@ export function AddPersonalDetailsQuestion({ field }: AddPersonalDetailsQuestion setRequired(field.required || false); } }, [field]); - + const handleSaveClick = () => { const fieldConfig = FIELD_CONFIG[selectedInfoType]; if (!fieldConfig) { return; } - + const questionText = question || fieldConfig.defaultQuestion || selectedInfoType; saveApplicationProfileField(fieldConfig.field, required, questionText); }; - + return ( - setQuestion(e.target.value)} - /> -

We'll automatically get this information from their profile if available.

+ setQuestion(e.target.value)} /> +

+ We'll automatically get this information from their profile if available. +

Required

- setRequired(value)} - /> + setRequired(value)} />
-