Merge branch 'main' into main

src/locale/helpers.ts

@@ -110,16 +110,18 @@ export function sanitizeAppLanguageSetting(appLanguage: string): AppLanguage {
     switch (lang) {
       case 'en':
         return AppLanguage.en
+      // DISABLED until this translation is fixed -prf
+      // case 'de':
+      //   return AppLanguage.de
+      // DISABLED until this translation is more thoroughly reviewed -prf
+      // case 'es':
+      //   return AppLanguage.es
+      case 'fr':
+        return AppLanguage.fr
       case 'hi':
         return AppLanguage.hi
       case 'ja':
         return AppLanguage.ja
-      case 'fr':
-        return AppLanguage.fr
-      case 'de':
-        return AppLanguage.de
-      case 'es':
-        return AppLanguage.es
       case 'ko':
         return AppLanguage.ko
       default:

src/locale/i18n.ts

@@ -3,11 +3,13 @@ import {i18n} from '@lingui/core'
 
 import {useLanguagePrefs} from '#/state/preferences'
 import {messages as messagesEn} from '#/locale/locales/en/messages'
+// DISABLED until this translation is fixed -prf
+// import {messages as messagesDe} from '#/locale/locales/de/messages'
+// DISABLED until this translation is more thoroughly reviewed -prf
+// import {messages as messagesEs} from '#/locale/locales/es/messages'
+import {messages as messagesFr} from '#/locale/locales/fr/messages'
 import {messages as messagesHi} from '#/locale/locales/hi/messages'
 import {messages as messagesJa} from '#/locale/locales/ja/messages'
-import {messages as messagesFr} from '#/locale/locales/fr/messages'
-import {messages as messagesDe} from '#/locale/locales/de/messages'
-import {messages as messagesEs} from '#/locale/locales/es/messages'
 import {messages as messagesKo} from '#/locale/locales/ko/messages'
 
 import {sanitizeAppLanguageSetting} from '#/locale/helpers'
@@ -18,24 +20,26 @@ import {AppLanguage} from '#/locale/languages'
  */
 export async function dynamicActivate(locale: AppLanguage) {
   switch (locale) {
-    case AppLanguage.hi: {
-      i18n.loadAndActivate({locale, messages: messagesHi})
-      break
-    }
-    case AppLanguage.ja: {
-      i18n.loadAndActivate({locale, messages: messagesJa})
-      break
-    }
+    // DISABLED until this translation is fixed -prf
+    // case AppLanguage.de: {
+    //   i18n.loadAndActivate({locale, messages: messagesDe})
+    //   break
+    // }
+    // DISABLED until this translation is more thoroughly reviewed -prf
+    // case AppLanguage.es: {
+    //   i18n.loadAndActivate({locale, messages: messagesEs})
+    //   break
+    // }
     case AppLanguage.fr: {
       i18n.loadAndActivate({locale, messages: messagesFr})
       break
     }
-    case AppLanguage.de: {
-      i18n.loadAndActivate({locale, messages: messagesDe})
+    case AppLanguage.hi: {
+      i18n.loadAndActivate({locale, messages: messagesHi})
       break
     }
-    case AppLanguage.es: {
-      i18n.loadAndActivate({locale, messages: messagesEs})
+    case AppLanguage.ja: {
+      i18n.loadAndActivate({locale, messages: messagesJa})
       break
     }
     case AppLanguage.ko: {

src/locale/i18n.web.ts

@@ -12,24 +12,26 @@ export async function dynamicActivate(locale: AppLanguage) {
   let mod: any
 
   switch (locale) {
-    case AppLanguage.hi: {
-      mod = await import(`./locales/hi/messages`)
-      break
-    }
-    case AppLanguage.ja: {
-      mod = await import(`./locales/ja/messages`)
-      break
-    }
+    // DISABLED until this translation is fixed -prf
+    // case AppLanguage.de: {
+    //   mod = await import(`./locales/de/messages`)
+    //   break
+    // }
+    // DISABLED until this translation is more thoroughly reviewed -prf
+    // case AppLanguage.es: {
+    //   mod = await import(`./locales/es/messages`)
+    //   break
+    // }
     case AppLanguage.fr: {
       mod = await import(`./locales/fr/messages`)
       break
     }
-    case AppLanguage.de: {
-      mod = await import(`./locales/de/messages`)
+    case AppLanguage.hi: {
+      mod = await import(`./locales/hi/messages`)
       break
     }
-    case AppLanguage.es: {
-      mod = await import(`./locales/es/messages`)
+    case AppLanguage.ja: {
+      mod = await import(`./locales/ja/messages`)
       break
     }
     case AppLanguage.ko: {

src/locale/languages.ts

@@ -6,11 +6,13 @@ interface Language {
 
 export enum AppLanguage {
   en = 'en',
+  // DISABLED until this translation is fixed -prf
+  // de = 'de',
+  // DISABLED until this translation is more thoroughly reviewed -prf
+  // es = 'es',
+  fr = 'fr',
   hi = 'hi',
   ja = 'ja',
-  fr = 'fr',
-  de = 'de',
-  es = 'es',
   ko = 'ko',
 }
 
@@ -21,11 +23,13 @@ interface AppLanguageConfig {
 
 export const APP_LANGUAGES: AppLanguageConfig[] = [
   {code2: AppLanguage.en, name: 'English'},
+  // DISABLED until this translation is fixed -prf
+  // {code2: AppLanguage.de, name: 'Deutsch'},
+  // DISABLED until this translation is more thoroughly reviewed -prf
+  // {code2: AppLanguage.es, name: 'Español'},
+  {code2: AppLanguage.fr, name: 'Français'},
   {code2: AppLanguage.hi, name: 'हिंदी'},
   {code2: AppLanguage.ja, name: '日本語'},
-  {code2: AppLanguage.fr, name: 'Français'},
-  {code2: AppLanguage.de, name: 'Deutsch'},
-  {code2: AppLanguage.es, name: 'Español'},
   {code2: AppLanguage.ko, name: '한국어'},
 ]
 

src/view/com/auth/create/Step2.tsx

@@ -13,6 +13,17 @@ import {isWeb} from 'platform/detection'
 import {Trans, msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
+import {logger} from '#/logger'
+
+function sanitizeDate(date: Date): Date {
+  if (!date || date.toString() === 'Invalid Date') {
+    logger.error(`Create account: handled invalid date for birthDate`, {
+      hasDate: !!date,
+    })
+    return new Date()
+  }
+  return date
+}
 
 /** STEP 2: Your account
  * @field Invite code or waitlist
@@ -38,6 +49,10 @@ export function Step2({
     openModal({name: 'waitlist'})
   }, [openModal])
 
+  const birthDate = React.useMemo(() => {
+    return sanitizeDate(uiState.birthDate)
+  }, [uiState.birthDate])
+
   return (
     <View>
       <StepHeader step="2" title={_(msg`Your account`)} />
@@ -122,8 +137,9 @@ export function Step2({
               <Trans>Your birth date</Trans>
             </Text>
             <DateInput
+              handleAsUTC
               testID="birthdayInput"
-              value={uiState.birthDate}
+              value={birthDate}
               onChange={value => uiDispatch({type: 'set-birth-date', value})}
               buttonType="default-light"
               buttonStyle={[pal.border, styles.dateInputButton]}

src/view/com/modals/BirthDateSettings.tsx

@@ -23,7 +23,7 @@ import {
 } from '#/state/queries/preferences'
 import {logger} from '#/logger'
 
-export const snapPoints = ['50%']
+export const snapPoints = ['50%', '90%']
 
 function Inner({preferences}: {preferences: UsePreferencesQueryResponse}) {
   const pal = usePalette('default')
@@ -63,6 +63,7 @@ function Inner({preferences}: {preferences: UsePreferencesQueryResponse}) {
 
       <View>
         <DateInput
+          handleAsUTC
           testID="birthdayInput"
           value={date}
           onChange={setDate}

src/view/com/util/forms/DateInput.tsx

@@ -13,6 +13,9 @@ import {Text} from '../text/Text'
 import {TypographyVariant} from 'lib/ThemeContext'
 import {useTheme} from 'lib/ThemeContext'
 import {usePalette} from 'lib/hooks/usePalette'
+import {getLocales} from 'expo-localization'
+
+const LOCALE = getLocales()[0]
 
 interface Props {
   testID?: string
@@ -25,13 +28,20 @@ interface Props {
   accessibilityLabel: string
   accessibilityHint: string
   accessibilityLabelledBy?: string
+  handleAsUTC?: boolean
 }
 
 export function DateInput(props: Props) {
   const [show, setShow] = useState(false)
   const theme = useTheme()
   const pal = usePalette('default')
 
+  const formatter = React.useMemo(() => {
+    return new Intl.DateTimeFormat(LOCALE.languageTag, {
+      timeZone: props.handleAsUTC ? 'UTC' : undefined,
+    })
+  }, [props.handleAsUTC])
+
   const onChangeInternal = useCallback(
     (event: DateTimePickerEvent, date: Date | undefined) => {
       setShow(false)
@@ -64,7 +74,7 @@ export function DateInput(props: Props) {
             <Text
               type={props.buttonLabelType}
               style={[pal.text, props.buttonLabelStyle]}>
-              {props.value.toLocaleDateString()}
+              {formatter.format(props.value)}
             </Text>
           </View>
         </Button>
@@ -73,6 +83,7 @@ export function DateInput(props: Props) {
         <DateTimePicker
           testID={props.testID ? `${props.testID}-datepicker` : undefined}
           mode="date"
+          timeZoneName={props.handleAsUTC ? 'Etc/UTC' : undefined}
           display="spinner"
           // @ts-ignore applies in iOS only -prf
           themeVariant={theme.colorScheme}