@planningcenter/chat-react-native 3.42.3-qa-staging.0 → 3.42.3-qa-staging.2

package/src/navigation/index.tsx

@@ -12,7 +12,7 @@ import {
   HeaderDoneButton,
   HeaderTextButton,
 } from '../components/display/platform_modal_header_buttons'
-import { useDirectMessagesEnabled, useQualifiedByAge } from '../hooks'
+import { useDirectMessagesEligible, useQualifiedByAge } from '../hooks'
 import {
   AttachmentActionsScreen,
   AttachmentActionsScreenOptions,
@@ -131,7 +131,7 @@ export const NewConversationStack = createNativeStackNavigator({
     },
     ConversationSelectDirectMessageRecipients: {
       screen: ConversationSelectDirectMessageRecipientsScreen,
-      if: useDirectMessagesEnabled,
+      if: useDirectMessagesEligible,
       options: ({ navigation, route }) => ({
         title: 'New conversation',
         headerRight: (props: NativeStackHeaderRightProps) => (

package/src/polyfills/events/EventTarget.ts

@@ -142,7 +142,7 @@ export default class EventTarget {
 
   removeEventListener(
     type: string,
-    callback: EventListener,
+    callback: EventListener | null,
     optionsOrUseCapture: EventListenerOptions | boolean = {}
   ): void {
     if (arguments.length < 2) {

package/src/screens/conversation_filters/components/conversation_filters.tsx

@@ -4,7 +4,7 @@ import { FlatList } from 'react-native-gesture-handler'
 import { Heading } from '../../../components'
 import {
   useAtFontScaleBreakpoint,
-  useDirectMessagesEnabled,
+  useDirectMessagesEligible,
   useHasDirectMessages,
   useTheme,
 } from '../../../hooks'
@@ -59,9 +59,9 @@ export const ConversationFilters = () => {
   const { setScrollOffset, params } = useContext(FilterContext)
   const { chat_group_graph_id, group_source_app_name = '', show_direct_messages } = params
 
-  const directMessagesEnabled = useDirectMessagesEnabled()
+  const directMessagesEligible = useDirectMessagesEligible()
   const hasDirectMessages = useHasDirectMessages()
-  const canFilterByDMs = directMessagesEnabled && hasDirectMessages
+  const canFilterByDMs = directMessagesEligible && hasDirectMessages
 
   const activeFilter: FilterTypes = useMemo(() => {
     if (chat_group_graph_id) {

package/src/screens/conversation_screen.tsx

@@ -28,6 +28,7 @@ import { KeyboardView } from '../components/display/keyboard_view'
 import BlankState from '../components/primitive/blank_state_primitive'
 import { ConversationContextProvider } from '../contexts/conversation_context'
 import { useTheme } from '../hooks'
+import { useMessageAvailableMembersAction } from '../hooks/direct_messages/use_message_available_members_action'
 import { useConversation } from '../hooks/use_conversation'
 import { useConversationJoltEvents } from '../hooks/use_conversation_jolt_events'
 import { useConversationMessages } from '../hooks/use_conversation_messages'
@@ -251,8 +252,15 @@ function ConversationBottomBar({
   currentlyEditingMessage,
   onFlaggedInMessageForm,
 }: ConversationBottomBarProps) {
+  const messageLink = useMessageAvailableMembersAction(conversation)
+
   if (conversation.disabled)
-    return <ConversationDisabledBanner disabledReason={conversation.disabledReason} />
+    return (
+      <ConversationDisabledBanner
+        disabledReason={conversation.disabledReason}
+        messageLink={messageLink}
+      />
+    )
   if (!canReply) return <MemberMessagesDisabledBanner />
   return (
     <MessageForm.Root

package/src/screens/conversation_select_recipients/conversation_select_direct_message_recipients_screen.tsx

@@ -17,16 +17,30 @@ import { ConversationSelectRecipientsScreenProps } from './types/screen_props'
 
 const MAX_RECIPIENTS = 9
 
-export function ConversationSelectDirectMessageRecipientsScreen(
-  _props: ConversationSelectRecipientsScreenProps
-) {
+export function ConversationSelectDirectMessageRecipientsScreen({
+  route,
+}: ConversationSelectRecipientsScreenProps) {
+  const { preselected_people = [] } = route.params ?? {}
   const styles = useStyles()
   const navigation = useNavigation()
   const { featureEnabled } = useFeatures()
   const [searchTerm, setSearchTerm] = useState('')
   const [debouncedTerm, setDebouncedTerm] = useState('')
   const [selectedPeople, setSelectedPeople] = useState<Map<string, DirectMessageCandidateResource>>(
-    new Map()
+    () =>
+      new Map(
+        preselected_people.map(person => [
+          person.id,
+          {
+            ...person,
+            type: 'DirectMessageCandidate' as const,
+            groups: [],
+            teams: [],
+            under_18: false,
+            directMessagesDisabled: false,
+          },
+        ])
+      )
   )
   const searchInputRef = useRef<TextInput>(null)
 

package/src/screens/conversation_select_recipients/types/screen_props.tsx

@@ -1,10 +1,12 @@
 import { StaticScreenProps } from '@react-navigation/native'
 import { AppName } from '../../../types/resources/app_name'
+import { PreselectedDirectMessagePerson } from '../../../types/resources/direct_message_candidate'
 import { GraphId } from '../../../types/resources/group_resource'
 
 export type ConversationSelectRecipientsParams = {
   chat_group_graph_id?: GraphId
   group_source_app_name?: AppName
+  preselected_people?: PreselectedDirectMessagePerson[]
 }
 
 export type ConversationSelectRecipientsScreenProps =

package/src/screens/conversation_select_type_screen.tsx

@@ -2,7 +2,6 @@ import { StaticScreenProps, useNavigation } from '@react-navigation/native'
 import React, { useLayoutEffect } from 'react'
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'
 import { useCurrentPerson } from '../hooks/use_current_person'
-import { availableFeatures, useFeatures } from '../hooks/use_features'
 import { useConversationTypeAccess } from '../hooks/use_new_conversation_entry'
 import type { NewConversationFromFilter } from '../hooks/use_new_conversation_from_filter'
 import { AppName } from '../types/resources/app_name'
@@ -28,17 +27,15 @@ export function ConversationSelectTypeScreen({ route }: ConversationSelectTypeSc
   const navigation = useNavigation()
   const { canCreateGroupsConversations, canCreateServicesConversations } =
     useConversationTypeAccess()
-  const { featureEnabled } = useFeatures()
-  const { directMessagesDisabled, under_18 } = useCurrentPerson()
+  const { directMessagesDisabled, directMessagesEligible } = useCurrentPerson()
   const { newConversationFromFilter, chat_group_graph_id, group_source_app_name } =
     route.params || {}
 
   const filterParams = { chat_group_graph_id, group_source_app_name }
-  const dmFeatureEnabled = featureEnabled(availableFeatures.direct_messages_eap)
-  const showDirectMessageOption = dmFeatureEnabled && !under_18
+  const showDirectMessageOption = directMessagesEligible
 
-  // sheetAllowedDetents depends on the DM feature flag, which isn't known until render, so it's
-  // set here instead of in the static ConversationSelectTypeScreenOptions. useLayoutEffect applies
+  // sheetAllowedDetents depends on DM eligibility, which isn't known until render, so it's set
+  // here instead of in the static ConversationSelectTypeScreenOptions. useLayoutEffect applies
   // it before paint so the sheet never visibly resizes after opening.
   useLayoutEffect(() => {
     navigation.setOptions({ sheetAllowedDetents: showDirectMessageOption ? [0.3] : [0.25] })

package/src/screens/conversations/components/list_header_component.tsx

@@ -6,7 +6,7 @@ import {
   useAtFontScaleBreakpoint,
   useCanCreateConversations,
   useCurrentPersonCache,
-  useDirectMessagesEnabled,
+  useDirectMessagesEligible,
   useHasDirectMessages,
   useNewConversationEntry,
   useTheme,
@@ -35,9 +35,9 @@ export const ListHeaderComponent = () => {
   const navigation = useNavigation()
   const canFilterByTeams = useCanDisplayGroups({ source_app_name: 'Services', source_type: 'Team' })
   const canFilterByGroups = useCanDisplayGroups({ source_app_name: 'Groups', source_type: 'Group' })
-  const directMessagesEnabled = useDirectMessagesEnabled()
+  const directMessagesEligible = useDirectMessagesEligible()
   const hasDirectMessages = useHasDirectMessages()
-  const canFilterByDMs = directMessagesEnabled && hasDirectMessages
+  const canFilterByDMs = directMessagesEligible && hasDirectMessages
   const route = useRoute<RouteProp<ConversationsScreenProps['route']>>()
   const {
     chat_group_graph_id,

package/src/screens/settings_screen.tsx

@@ -4,7 +4,7 @@ import React, { useCallback } from 'react'
 import { Platform, StyleSheet, View } from 'react-native'
 import { Heading, Icon, Text } from '../components'
 import { Switch } from '../components/display/switch'
-import { useDirectMessagesEnabled, useTheme } from '../hooks'
+import { useDirectMessagesEligible, useTheme } from '../hooks'
 import { useAppName } from '../hooks/use_app_name'
 import { usePersonSettings } from '../hooks/use_person_settings'
 
@@ -13,7 +13,7 @@ export type SettingsScreenProps = StaticScreenProps<{}>
 export function SettingsScreen({}: SettingsScreenProps) {
   const styles = useStyles()
   const { directMessagesDisabled, setDirectMessagesDisabled, isMutating } = usePersonSettings()
-  const directMessagesEnabled = useDirectMessagesEnabled()
+  const directMessagesEligible = useDirectMessagesEligible()
   const appName = useAppName()
   const navigation = useNavigation()
 
@@ -31,7 +31,7 @@ export function SettingsScreen({}: SettingsScreenProps) {
         <View style={styles.sectionHeader}>
           <Heading variant="h2">Messages</Heading>
         </View>
-        {directMessagesEnabled && (
+        {directMessagesEligible && (
           <View style={styles.settingRow}>
             <View style={styles.settingRowText}>
               <Text>Allow direct messages</Text>

package/src/types/resources/direct_message_candidate.ts

@@ -10,3 +10,8 @@ export interface DirectMessageCandidateResource extends ResourceObject {
   under_18: boolean
   directMessagesDisabled: boolean
 }
+
+export type PreselectedDirectMessagePerson = Pick<
+  DirectMessageCandidateResource,
+  'id' | 'name' | 'avatar'
+>

package/src/types/resources/member.ts

@@ -5,6 +5,7 @@ export interface MemberResource {
   avatar: string
   badges: MemberBadge[]
   child: boolean
+  directMessagesDisabled?: boolean
   gender: string | null
   role?: string
 }

package/src/types/resources/member_ability.ts

@@ -5,4 +5,5 @@ export interface MemberAbilityResource {
   canDeleteNonAuthoredMessages: boolean
   leader: boolean
   canReply: boolean
+  canMessageAvailableMembers: boolean
 }

package/src/types/resources/person.ts

@@ -22,5 +22,6 @@ export interface CurrentPersonResource extends PersonResource {
   pcoChatEnabled: boolean
   ageQualificationStatus?: AgeQualificationStatus
   directMessagesDisabled: boolean
+  directMessagesEligible: boolean
   under_18: boolean
 }

package/src/utils/index.ts

@@ -6,6 +6,7 @@ export * from './client'
 export * from './convert_attachments_for_create'
 export * from './destructure_chat_group_graph_id'
 export * from './host_bridge'
+export * from './liquid_glass'
 export * from './native_adapters'
 export * from './pluralize'
 export * from './conversation_safety_constants'

package/src/utils/liquid_glass.ts

@@ -0,0 +1,12 @@
+import { Platform } from 'react-native'
+
+let hostLiquidGlassEnabled = false
+
+export const setLiquidGlassCapability = (enabled: boolean) => {
+  hostLiquidGlassEnabled = enabled
+}
+
+// The host flag is required because JS cannot detect a binary built with a
+// pre-iOS-26 SDK or opted out via UIDesignRequiresCompatibility.
+export const isLiquidGlassEnabled = () =>
+  hostLiquidGlassEnabled && Platform.OS === 'ios' && parseInt(String(Platform.Version), 10) >= 26

package/src/utils/sha_256.ts

@@ -113,7 +113,7 @@ function preprocessMessage(message: number[]): Uint32Array {
   const words = new Uint32Array(message.length / 4)
   for (let i = 0; i < message.length; i += 4) {
     words[i / 4] =
-      (message[i] << 24) | (message[i + 1] << 16) | (message[i + 2] << 8) | message[i + 3]
+      (message[i]! << 24) | (message[i + 1]! << 16) | (message[i + 2]! << 8) | message[i + 3]!
   }
 
   return words
@@ -125,25 +125,25 @@ function processChunk(chunk: Uint32Array, hash: number[]): void {
 
   // Prepare message schedule
   for (let t = 0; t < 16; t++) {
-    W[t] = chunk[t]
+    W[t] = chunk[t]!
   }
   for (let t = 16; t < 64; t++) {
-    W[t] = (gamma1(W[t - 2]) + W[t - 7] + gamma0(W[t - 15]) + W[t - 16]) >>> 0
+    W[t] = (gamma1(W[t - 2]!) + W[t - 7]! + gamma0(W[t - 15]!) + W[t - 16]!) >>> 0
   }
 
   // Initialize working variables
-  let a = hash[0]
-  let b = hash[1]
-  let c = hash[2]
-  let d = hash[3]
-  let e = hash[4]
-  let f = hash[5]
-  let g = hash[6]
-  let h = hash[7]
+  let a = hash[0]!
+  let b = hash[1]!
+  let c = hash[2]!
+  let d = hash[3]!
+  let e = hash[4]!
+  let f = hash[5]!
+  let g = hash[6]!
+  let h = hash[7]!
 
   // Main loop
   for (let t = 0; t < 64; t++) {
-    const T1 = (h + sigma1(e) + ch(e, f, g) + K[t] + W[t]) >>> 0
+    const T1 = (h + sigma1(e) + ch(e, f, g) + K[t]! + W[t]!) >>> 0
     const T2 = (sigma0(a) + maj(a, b, c)) >>> 0
     h = g
     g = f
@@ -156,14 +156,14 @@ function processChunk(chunk: Uint32Array, hash: number[]): void {
   }
 
   // Add compressed chunk to current hash value
-  hash[0] = (hash[0] + a) >>> 0
-  hash[1] = (hash[1] + b) >>> 0
-  hash[2] = (hash[2] + c) >>> 0
-  hash[3] = (hash[3] + d) >>> 0
-  hash[4] = (hash[4] + e) >>> 0
-  hash[5] = (hash[5] + f) >>> 0
-  hash[6] = (hash[6] + g) >>> 0
-  hash[7] = (hash[7] + h) >>> 0
+  hash[0] = (hash[0]! + a) >>> 0
+  hash[1] = (hash[1]! + b) >>> 0
+  hash[2] = (hash[2]! + c) >>> 0
+  hash[3] = (hash[3]! + d) >>> 0
+  hash[4] = (hash[4]! + e) >>> 0
+  hash[5] = (hash[5]! + f) >>> 0
+  hash[6] = (hash[6]! + g) >>> 0
+  hash[7] = (hash[7]! + h) >>> 0
 }
 
 /** Compute SHA-256 hash and return as byte array */
@@ -181,10 +181,10 @@ function sha256Raw(message: string): number[] {
   // Convert hash to byte array
   const result: number[] = []
   for (let i = 0; i < 8; i++) {
-    result.push((hash[i] >>> 24) & 0xff)
-    result.push((hash[i] >>> 16) & 0xff)
-    result.push((hash[i] >>> 8) & 0xff)
-    result.push(hash[i] & 0xff)
+    result.push((hash[i]! >>> 24) & 0xff)
+    result.push((hash[i]! >>> 16) & 0xff)
+    result.push((hash[i]! >>> 8) & 0xff)
+    result.push(hash[i]! & 0xff)
   }
 
   return result

package/src/utils/system_messages.ts

@@ -1,4 +1,4 @@
-import { MessageResource } from '../types'
+import type { MessageResource } from '../types'
 
 const SYSTEM_MESSAGE_TYPES = ['user_joined'] as const
 

package/src/utils/theme.ts

@@ -1,10 +1,5 @@
-import {
-  ColorSchemeName,
-  ColorValue,
-  OpaqueColorValue,
-  Platform,
-  PlatformColor,
-} from 'react-native'
+import { Platform, PlatformColor } from 'react-native'
+import type { ColorSchemeName, ColorValue, OpaqueColorValue } from 'react-native'
 import { aliasTokensColorMap } from '../vendor/tapestry/alias_tokens_color_map'
 import { tokens } from '../vendor/tapestry/tokens'
 
@@ -36,7 +31,7 @@ export interface DefaultTheme {
   showBadgeProductLogo: boolean
 }
 
-export const defaultTheme = (colorScheme: ColorSchemeName): ChatTheme => {
+export const defaultTheme = (colorScheme: ColorSchemeName | null): ChatTheme => {
   const scheme: 'light' | 'dark' = colorScheme === 'dark' ? 'dark' : 'light'
 
   const defaultColors = {

package/build/hooks/use_direct_messages_enabled.d.ts

@@ -1,2 +0,0 @@
-export declare function useDirectMessagesEnabled(): boolean;
-//# sourceMappingURL=use_direct_messages_enabled.d.ts.map

package/build/hooks/use_direct_messages_enabled.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use_direct_messages_enabled.d.ts","sourceRoot":"","sources":["../../src/hooks/use_direct_messages_enabled.ts"],"names":[],"mappings":"AAOA,wBAAgB,wBAAwB,IAAI,OAAO,CAelD"}

package/build/hooks/use_direct_messages_enabled.js

@@ -1,16 +0,0 @@
-import { useQuery } from '@tanstack/react-query';
-import { getFeaturesRequestArgs, getFeaturesQueryKey } from '../utils/request/get_features';
-import { useApiClient } from './use_api_client';
-import { availableFeatures } from './use_features';
-export function useDirectMessagesEnabled() {
-    const apiClient = useApiClient();
-    const { data, isFetched } = useQuery({
-        queryKey: getFeaturesQueryKey(),
-        queryFn: () => apiClient.chat.get(getFeaturesRequestArgs()),
-        staleTime: 1000 * 60 * 5,
-    });
-    if (!isFetched)
-        return false;
-    return (data?.data.some(feature => feature.name === availableFeatures.direct_messages_eap && feature.enabled) ?? false);
-}
-//# sourceMappingURL=use_direct_messages_enabled.js.map

package/build/hooks/use_direct_messages_enabled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use_direct_messages_enabled.js","sourceRoot":"","sources":["../../src/hooks/use_direct_messages_enabled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGhD,OAAO,EAAE,sBAAsB,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAA;AAC3F,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD,MAAM,UAAU,wBAAwB;IACtC,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAChC,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,QAAQ,CAAiC;QACnE,QAAQ,EAAE,mBAAmB,EAAE;QAC/B,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAiC,sBAAsB,EAAE,CAAC;QAC3F,SAAS,EAAE,IAAI,GAAG,EAAE,GAAG,CAAC;KACzB,CAAC,CAAA;IAEF,IAAI,CAAC,SAAS;QAAE,OAAO,KAAK,CAAA;IAE5B,OAAO,CACL,IAAI,EAAE,IAAI,CAAC,IAAI,CACb,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,KAAK,iBAAiB,CAAC,mBAAmB,IAAI,OAAO,CAAC,OAAO,CACrF,IAAI,KAAK,CACX,CAAA;AACH,CAAC","sourcesContent":["import { useQuery } from '@tanstack/react-query'\nimport { ApiCollection } from '../types'\nimport type { FeatureResource } from '../types/resources/feature_resource'\nimport { getFeaturesRequestArgs, getFeaturesQueryKey } from '../utils/request/get_features'\nimport { useApiClient } from './use_api_client'\nimport { availableFeatures } from './use_features'\n\nexport function useDirectMessagesEnabled(): boolean {\n  const apiClient = useApiClient()\n  const { data, isFetched } = useQuery<ApiCollection<FeatureResource>>({\n    queryKey: getFeaturesQueryKey(),\n    queryFn: () => apiClient.chat.get<ApiCollection<FeatureResource>>(getFeaturesRequestArgs()),\n    staleTime: 1000 * 60 * 5,\n  })\n\n  if (!isFetched) return false\n\n  return (\n    data?.data.some(\n      feature => feature.name === availableFeatures.direct_messages_eap && feature.enabled\n    ) ?? false\n  )\n}\n"]}

package/src/hooks/use_direct_messages_enabled.ts

@@ -1,23 +0,0 @@
-import { useQuery } from '@tanstack/react-query'
-import { ApiCollection } from '../types'
-import type { FeatureResource } from '../types/resources/feature_resource'
-import { getFeaturesRequestArgs, getFeaturesQueryKey } from '../utils/request/get_features'
-import { useApiClient } from './use_api_client'
-import { availableFeatures } from './use_features'
-
-export function useDirectMessagesEnabled(): boolean {
-  const apiClient = useApiClient()
-  const { data, isFetched } = useQuery<ApiCollection<FeatureResource>>({
-    queryKey: getFeaturesQueryKey(),
-    queryFn: () => apiClient.chat.get<ApiCollection<FeatureResource>>(getFeaturesRequestArgs()),
-    staleTime: 1000 * 60 * 5,
-  })
-
-  if (!isFetched) return false
-
-  return (
-    data?.data.some(
-      feature => feature.name === availableFeatures.direct_messages_eap && feature.enabled
-    ) ?? false
-  )
-}