[APP-1684] Some contact import tweaks (#9555)

* Handle download link

* Improve NUX geo gating from #9549

* Fix alignment of phone code select

* Show full name

* Add gate to nux banner

* Add gate to settings screen

* Invert gate check in settings, whoops

src/components/contacts/FindContactsBannerNUX.tsx

@@ -6,6 +6,7 @@ import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {HITSLOP_10} from '#/lib/constants'
+import {useGate} from '#/lib/statsig/statsig'
 import {logger} from '#/logger'
 import {isWeb} from '#/platform/detection'
 import {Nux, useNux, useSaveNux} from '#/state/queries/nuxs'
@@ -20,9 +21,8 @@ export function FindContactsBannerNUX() {
   const t = useTheme()
   const {_} = useLingui()
   const {visible, close} = useInternalState()
-  const isFeatureEnabled = useIsFindContactsFeatureEnabledBasedOnGeolocation()
 
-  if (!visible || !isFeatureEnabled) return null
+  if (!visible) return null
 
   return (
     <View style={[a.w_full, a.p_lg, a.border_b, t.atoms.border_contrast_low]}>
@@ -88,13 +88,17 @@ function useInternalState() {
   const {nux} = useNux(Nux.FindContactsDismissibleBanner)
   const {mutate: save, variables} = useSaveNux()
   const hidden = !!variables
+  const isFeatureEnabled = useIsFindContactsFeatureEnabledBasedOnGeolocation()
+  const gate = useGate()
 
   const visible = useMemo(() => {
     if (isWeb) return false
     if (hidden) return false
     if (nux && nux.completed) return false
+    if (!isFeatureEnabled) return false
+    if (gate('disable_settings_find_contacts')) return false
     return true
-  }, [hidden, nux])
+  }, [hidden, nux, isFeatureEnabled, gate])
 
   const close = () => {
     save({

src/components/contacts/country-allowlist.ts

@@ -18,7 +18,16 @@ const FIND_CONTACTS_FEATURE_COUNTRY_ALLOWLIST = [
   'IT',
 ] satisfies CountryCode[] as string[]
 
-export function isFindContactsFeatureEnabled(countryCode: string): boolean {
+export function isFindContactsFeatureEnabled(countryCode?: string): boolean {
+  if (IS_DEV) return true
+
+  /*
+   * This should never happen unless geolocation fails entirely. In that
+   * case, let the user try, since it should work as long as they have a
+   * phone number from one of the allow-listed countries.
+   */
+  if (!countryCode) return true
+
   return FIND_CONTACTS_FEATURE_COUNTRY_ALLOWLIST.includes(
     countryCode.toUpperCase(),
   )
@@ -26,12 +35,5 @@ export function isFindContactsFeatureEnabled(countryCode: string): boolean {
 
 export function useIsFindContactsFeatureEnabledBasedOnGeolocation() {
   const location = useGeolocation()
-
-  if (IS_DEV) return true
-
-  // they can try, by they'll need a phone number
-  // from one of the allowlisted countries
-  if (!location.countryCode) return true
-
   return isFindContactsFeatureEnabled(location.countryCode)
 }

src/components/contacts/screens/ViewMatches.tsx

@@ -104,8 +104,6 @@ export function ViewMatches({
     match => !state.dismissedMatches.includes(match.profile.did),
   )
 
-  console.log(matches)
-
   const followableDids = matches.map(match => match.profile.did)
   const [didFollowAll, setDidFollowAll] = useState(followableDids.length === 0)
 
@@ -449,7 +447,7 @@ function MatchItem({
   const contactName = useMemo(() => {
     if (!contact) return null
 
-    const name = contact.firstName ?? contact.lastName ?? contact.name
+    const name = contact.name ?? contact.firstName ?? contact.lastName
     if (name) return _(msg`Your contact ${name}`)
     const phone =
       contact.phoneNumbers?.find(p => p.isPrimary) ?? contact.phoneNumbers?.[0]
@@ -520,7 +518,7 @@ function ContactItem({
   const {_} = useLingui()
   const {currentAccount} = useSession()
 
-  const name = contact.firstName ?? contact.lastName ?? contact.name
+  const name = contact.name ?? contact.firstName ?? contact.lastName
   const phone =
     contact.phoneNumbers?.find(phone => phone.isPrimary) ??
     contact.phoneNumbers?.[0]