>(
user.link
)
@@ -87,6 +100,80 @@ export const OptionalProfileUserForm = (props: {
const [workChoices, setWorkChoices] = useState({})
const {locale} = useLocale()
+ const KEY = `draft-profile-${user.id}`
+
+ const clearProfileDraft = (userId: string) => {
+ try {
+ safeLocalStorage?.removeItem(`draft-profile-${userId}`)
+ safeLocalStorage?.removeItem(`draft-profile-${userId}-timestamp`)
+ } catch (error) {
+ console.warn('Failed to clear profile from store:', error)
+ }
+ }
+
+ // Debounced save function
+ const debouncedSaveProfile = useCallback(
+ (() => {
+ let timeoutId: NodeJS.Timeout
+ return (profileToSave: ProfileWithoutUser) => {
+ clearTimeout(timeoutId)
+ timeoutId = setTimeout(() => {
+ try {
+ safeLocalStorage?.setItem(KEY, JSON.stringify({
+ profile: profileToSave,
+ timestamp: Date.now().toString(),
+ }))
+ } catch (error) {
+ console.warn('Failed to save profile to store:', error)
+ }
+ }, 500) // 500ms debounce delay
+ }
+ })(),
+ [KEY]
+ )
+
+ useEffect(() => {
+ console.log({profile})
+ if (profile && Object.keys(profile).length > 0) {
+ debouncedSaveProfile(profile)
+ }
+ }, [profile, user.id, debouncedSaveProfile])
+
+ useEffect(() => {
+ try {
+ const savedProfileString = safeLocalStorage?.getItem(KEY)
+ if (savedProfileString) {
+ const data = JSON.parse(savedProfileString)
+ if (data) {
+ const {profile: savedProfile, timestamp} = data
+ // Check if saved data is older than 24 hours
+ if (timestamp) {
+ const savedTime = parseInt(timestamp, 10)
+ const now = Date.now()
+ const twentyFourHoursInMs = 24 * 60 * 60 * 1000
+
+ if (now - savedTime > twentyFourHoursInMs) {
+ console.log('Skipping profile update: saved data is older than 24 hours')
+ return
+ }
+ }
+
+ // Update all profile fields
+ Object.entries(savedProfile).forEach(([key, value]) => {
+ const typedKey = key as keyof ProfileWithoutUser
+ if (value !== profile[typedKey]) {
+ console.log(key, value)
+ setProfile(typedKey, value)
+ if (typedKey === 'height_in_inches') updateHeight(value)
+ }
+ })
+ }
+ }
+ } catch (error) {
+ console.warn('Failed to load profile from store:', error)
+ }
+ }, []) // Only run once on mount
+
useEffect(() => {
fetchChoices('interests', locale).then(setInterestChoices)
fetchChoices('causes', locale).then(setCauseChoices)
@@ -120,6 +207,8 @@ export const OptionalProfileUserForm = (props: {
}
try {
await Promise.all(promises)
+ // Clear profile draft from Zustand store after successful submission
+ clearProfileDraft(user.id)
} catch (error) {
console.error(error)
toast.error(
@@ -308,6 +397,7 @@ export const OptionalProfileUserForm = (props: {
}}
className={'w-16'}
value={typeof heightFeet === 'number' ? Math.floor(heightFeet) : ''}
+ min={0}
/>
@@ -325,6 +415,7 @@ export const OptionalProfileUserForm = (props: {
}}
className={'w-16'}
value={typeof heightInches === 'number' ? Math.floor(heightInches) : ''}
+ min={0}
/>
@@ -348,9 +439,10 @@ export const OptionalProfileUserForm = (props: {
}
}}
className={'w-20'}
- value={heightFeet !== undefined
- ? Math.round((heightFeet * 12 + (heightInches ?? 0)) * 2.54)
+ value={heightFeet !== undefined && profile['height_in_inches']
+ ? Math.round(profile['height_in_inches'] * 2.54)
: ''}
+ min={0}
/>
diff --git a/web/components/profile-about.tsx b/web/components/profile-about.tsx
index aa9eefe..8dad4c6 100644
--- a/web/components/profile-about.tsx
+++ b/web/components/profile-about.tsx
@@ -456,7 +456,7 @@ export const formatProfileValue = (key: string, value: any) => {
case 'has_pets':
return value ? 'Yes' : 'No'
case 'height_in_inches':
- return `${Math.floor(value / 12)}' ${value % 12}"`
+ return `${Math.floor(value / 12)}' ${Math.round(value % 12)}"`
case 'pref_age_max':
case 'pref_age_min':
return null // handle this in a special case
diff --git a/web/components/widgets/new-tab-link.tsx b/web/components/widgets/new-tab-link.tsx
index 9d04624..941c828 100644
--- a/web/components/widgets/new-tab-link.tsx
+++ b/web/components/widgets/new-tab-link.tsx
@@ -5,13 +5,14 @@ interface NewTabLinkProps {
href: string
children: React.ReactNode
className?: string
+ onClick?: () => void
}
-export function NewTabLink({href, children, className}: NewTabLinkProps) {
+export function NewTabLink({href, children, className, onClick}: NewTabLinkProps) {
// New tabs don't work on native apps
const isNative = isNativeMobile()
return (
-
+
{children}
)