@planningcenter/chat-react-native 3.4.0 → 3.4.1-rc.1

package/build/components/conversation/message_form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_form.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAuD,MAAM,OAAO,CAAA;AAC3E,OAAO,EAA+B,SAAS,EAAE,MAAM,cAAc,CAAA;AAGrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAYlD,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA;AAED,UAAU,qBAAsB,SAAQ,SAAS;IAC/C,YAAY,EAAE,oBAAoB,CAAA;CACnC;AAqBD,iBAAS,eAAe,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,qBAAqB,qBAkGzE;AAiCD,iBAAS,gBAAgB,sBA4BxB;AAED,iBAAS,oBAAoB,sBAe5B;AAED,iBAAS,2BAA2B,6BA8EnC;AAED,iBAAS,mBAAmB,6BA4B3B"}
+{"version":3,"file":"message_form.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAuD,MAAM,OAAO,CAAA;AAC3E,OAAO,EAA+B,SAAS,EAAE,MAAM,cAAc,CAAA;AAGrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAYlD,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA;AAED,UAAU,qBAAsB,SAAQ,SAAS;IAC/C,YAAY,EAAE,oBAAoB,CAAA;CACnC;AAwBD,iBAAS,eAAe,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,qBAAqB,qBAkGzE;AAiCD,iBAAS,gBAAgB,sBAgCxB;AAED,iBAAS,oBAAoB,sBAe5B;AAED,iBAAS,2BAA2B,6BA8EnC;AAED,iBAAS,mBAAmB,6BA6B3B"}

package/build/components/conversation/message_form.js

@@ -24,6 +24,8 @@ const MessageFormContext = React.createContext({
     usingGiphy: false,
     setUsingGiphy: (_usingGiphy) => { },
 });
+const GIPHY_MAX_LENGTH = 50;
+const MAX_MESSAGE_LENGTH = 5000;
 function MessageFormRoot({ conversation, children }) {
     const { giphyApiKey } = useContext(ChatContext);
     const canGiphy = !!giphyApiKey;
@@ -132,12 +134,14 @@ function MessageFormInput() {
     const attachmentError = attachmentUploader?.errorMessage;
     return (<View style={styles.textInputBoundary}>
       <MessageFormAttachments />
-      <View style={styles.textInput}>
+      <View style={styles.textInputRow}>
         {usingGiphy ? (<View style={styles.giphyBadge}>
             <Text>/Giphy</Text>
           </View>) : null}
 
-        <TextInput aria-disabled={true} placeholder="Send a message" onChangeText={setText} value={text} onSubmitEditing={onSubmit}/>
+        <View style={styles.textInput}>
+          <TextInput multiline={true} aria-disabled={true} placeholder="Send a message" onChangeText={setText} value={text} maxLength={usingGiphy ? GIPHY_MAX_LENGTH : MAX_MESSAGE_LENGTH} onSubmitEditing={onSubmit}/>
+        </View>
       </View>
 
       {attachmentError ? <Text style={styles.inputErrorMessage}>{attachmentError}</Text> : null}
@@ -200,14 +204,14 @@ function MessageFormAttachmentPicker() {
     </View>);
 }
 function MessageFormCommands() {
-    const { canGiphy, usingGiphy, setUsingGiphy } = React.useContext(MessageFormContext);
+    const { text, canGiphy, usingGiphy, setUsingGiphy } = React.useContext(MessageFormContext);
     if (!canGiphy) {
         return null;
     }
     if (usingGiphy) {
         return (<IconButton accessibilityLabel="Exit Giphy Search" size="md" appearance="neutral" name={'general.x'} onPress={() => setUsingGiphy(false)}/>);
     }
-    return (<IconButton accessibilityLabel="Search Giphy" size="md" appearance="neutral" name={'general.bolt'} onPress={() => setUsingGiphy(true)}/>);
+    return (<IconButton accessibilityLabel="Search Giphy" size="md" appearance="neutral" name={'general.bolt'} onPress={() => setUsingGiphy(true)} disabled={text.length > GIPHY_MAX_LENGTH}/>);
 }
 const useMessageFormStyles = () => {
     const theme = useTheme();
@@ -231,10 +235,14 @@ const useMessageFormStyles = () => {
             flex: 1,
             gap: 12,
         },
-        textInput: {
+        textInputRow: {
             flexDirection: 'row',
+            alignItems: 'center',
             gap: 12,
         },
+        textInput: {
+            flex: 1,
+        },
         giphyBadge: {
             backgroundColor: theme.colors.fillColorNeutral050Base,
             borderRadius: 24,

package/build/components/conversation/message_form.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_form.js","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useNavigation, useTheme as useNavigationTheme, useRoute } from '@react-navigation/native'\nimport React, { useCallback, useContext, useEffect, useState } from 'react'\nimport { StyleSheet, TextInput, View, ViewProps } from 'react-native'\nimport { IconButton, Text } from '../../components'\nimport { useTheme } from '../../hooks'\nimport { ConversationResource } from '../../types'\nimport { useMessageCreate } from '../../hooks/use_message_create'\nimport { ConversationScreenProps } from '../../screens/conversation_screen'\nimport { ChatContext } from '../../contexts/chat_context'\nimport { ImagePicker, ImagePickerResult } from '../../utils/native_adapters'\nimport { useAttachmentUploader } from '../../hooks/use_attachment_uploader'\nimport {\n  DenormalizedAttachmentResourceForCreate,\n  DenormalizedMessageAttachmentResourceForCreate,\n} from '../../types/resources/denormalized_attachment_resource'\nimport { MessageFormAttachmentImage } from './message_form/message_form_attachment_image'\n\nexport const MessageForm = {\n  Root: MessageFormRoot,\n  TextInput: MessageFormInput,\n  SubmitButton: MessageFormSubmitBtn,\n  AttachmentPicker: MessageFormAttachmentPicker,\n  Commands: MessageFormCommands,\n}\n\ninterface MessagesFormRootProps extends ViewProps {\n  conversation: ConversationResource\n}\n\nconst MessageFormContext = React.createContext<{\n  text: string\n  setText: (text: string) => void\n  onSubmit: () => void\n  disabled: boolean\n  canGiphy: boolean\n  usingGiphy: boolean\n  setUsingGiphy: (usingGiphy: boolean) => void\n  attachmentUploader?: ReturnType<typeof useAttachmentUploader>\n}>({\n  text: '',\n  setText: (_text: string) => {},\n  onSubmit: () => {},\n  disabled: false,\n  canGiphy: false,\n  usingGiphy: false,\n  setUsingGiphy: (_usingGiphy: boolean) => {},\n})\n\nfunction MessageFormRoot({ conversation, children }: MessagesFormRootProps) {\n  const { giphyApiKey } = useContext(ChatContext)\n  const canGiphy = !!giphyApiKey\n  const styles = useMessageFormStyles()\n  const [text, setText] = React.useState('')\n  const [usingGiphy, setUsingGiphy] = useState(false)\n  const navigation = useNavigation()\n  const route = useRoute() as ConversationScreenProps['route']\n  const {\n    status,\n    isPending,\n    reset: resetMutation,\n    mutate,\n  } = useMessageCreate({\n    conversationId: conversation.id,\n  })\n  const attachmentUploader = useAttachmentUploader({\n    conversationId: conversation.id,\n  })\n  const resetAttachmentUploader = attachmentUploader.reset\n\n  const reset = useCallback(() => {\n    resetAttachmentUploader()\n    resetMutation()\n    setText('')\n    setUsingGiphy(false)\n  }, [resetAttachmentUploader, resetMutation])\n\n  useEffect(() => {\n    if (canGiphy && !usingGiphy && text.startsWith('/giphy ')) {\n      setUsingGiphy(true)\n      setText('')\n    }\n  }, [canGiphy, text, usingGiphy])\n\n  useEffect(() => {\n    switch (status) {\n      case 'success':\n        reset()\n        break\n    }\n  }, [reset, status])\n\n  useEffect(() => {\n    if (route.params.clear_input) {\n      reset()\n      navigation.setParams({ ...route.params, clear_input: false })\n    }\n  }, [reset, navigation, route.params])\n\n  const canSubmit = (() => {\n    if (isPending) return false\n    if (attachmentUploader?.pendingUploads) return false\n    if (text.length > 0) return true\n    if (attachmentUploader?.attachments?.length) return true\n    return false\n  })()\n  const disabled = !canSubmit\n\n  const handleSubmit = () => {\n    if (!canSubmit) return\n\n    if (canGiphy && usingGiphy) {\n      TextInput.State.blurTextInput(TextInput.State.currentlyFocusedInput())\n      navigation.navigate('SendGiphy', {\n        conversation_id: conversation.id,\n        search_term: text,\n      })\n    } else {\n      let attachmentsForSubmit: DenormalizedAttachmentResourceForCreate[] = []\n      if (attachmentUploader?.attachmentIds) {\n        attachmentsForSubmit = attachmentUploader.attachmentIds.map(\n          (id: string): DenormalizedMessageAttachmentResourceForCreate => ({\n            type: 'MessageAttachment',\n            id,\n          })\n        )\n      }\n      mutate({ text, attachments: attachmentsForSubmit })\n    }\n  }\n\n  return (\n    <MessageFormContext.Provider\n      value={{\n        text,\n        setText,\n        onSubmit: handleSubmit,\n        disabled,\n        canGiphy,\n        usingGiphy,\n        setUsingGiphy,\n        attachmentUploader,\n      }}\n    >\n      <View style={styles.textInputContainer}>{children}</View>\n    </MessageFormContext.Provider>\n  )\n}\n\nfunction MessageFormAttachments() {\n  const styles = useMessageFormStyles()\n  const { attachmentUploader } = React.useContext(MessageFormContext)\n  const numberOfAttachments = attachmentUploader?.attachments?.length || 0\n  const attachments = attachmentUploader?.attachments || []\n\n  if (numberOfAttachments === 0) {\n    return null\n  }\n\n  return (\n    <View style={styles.messageFormAttachments}>\n      {attachments.map(attachment => {\n        return (\n          <MessageFormAttachmentImage\n            key={attachment.file.uri}\n            uri={attachment.file.uri}\n            alt={attachment.file.name}\n            status={attachment.status}\n            width={attachment.file.width}\n            height={attachment.file.height}\n            removeAttachment={() => {\n              attachmentUploader?.removeAttachment(attachment)\n            }}\n          />\n        )\n      })}\n    </View>\n  )\n}\n\nfunction MessageFormInput() {\n  const styles = useMessageFormStyles()\n  const { text, setText, onSubmit, usingGiphy, attachmentUploader } =\n    React.useContext(MessageFormContext)\n  const attachmentError = attachmentUploader?.errorMessage\n\n  return (\n    <View style={styles.textInputBoundary}>\n      <MessageFormAttachments />\n      <View style={styles.textInput}>\n        {usingGiphy ? (\n          <View style={styles.giphyBadge}>\n            <Text>/Giphy</Text>\n          </View>\n        ) : null}\n\n        <TextInput\n          aria-disabled={true}\n          placeholder=\"Send a message\"\n          onChangeText={setText}\n          value={text}\n          onSubmitEditing={onSubmit}\n        />\n      </View>\n\n      {attachmentError ? <Text style={styles.inputErrorMessage}>{attachmentError}</Text> : null}\n    </View>\n  )\n}\n\nfunction MessageFormSubmitBtn() {\n  const styles = useMessageFormStyles()\n  const { onSubmit, disabled, usingGiphy } = React.useContext(MessageFormContext)\n\n  return (\n    <IconButton\n      disabled={disabled}\n      accessibilityLabel={usingGiphy ? 'Search Giphy' : 'Send message'}\n      size=\"md\"\n      appearance=\"neutral\"\n      style={styles.textInputSend}\n      name={usingGiphy ? 'general.search' : 'general.upArrow'}\n      onPress={onSubmit}\n    />\n  )\n}\n\nfunction MessageFormAttachmentPicker() {\n  const styles = useMessageFormStyles()\n  const { usingGiphy, attachmentUploader } = React.useContext(MessageFormContext)\n  const [isOpen, setIsOpen] = useState(false)\n\n  function uploadImagePickerResult(result: ImagePickerResult) {\n    if (result.canceled) {\n      return\n    }\n\n    const filteredAssets = result.assets\n      .filter(asset => {\n        return asset.fileSize && asset.fileName && asset.mimeType\n      })\n      .map(asset => {\n        return {\n          uri: asset.uri,\n          name: asset.fileName as string,\n          type: asset.mimeType as string,\n          size: asset.fileSize as number,\n          height: asset.height,\n          width: asset.width,\n        }\n      })\n\n    attachmentUploader?.handleFilesAttached(filteredAssets)\n  }\n\n  const openCamera = async () => {\n    setIsOpen(false)\n    let result = await ImagePicker.openCameraAsync()\n    if (!result.canceled) {\n      uploadImagePickerResult(result)\n    }\n  }\n\n  const pickImage = async () => {\n    setIsOpen(false)\n    let result = await ImagePicker.openImageLibraryAsync()\n    if (!result.canceled) {\n      uploadImagePickerResult(result)\n    }\n  }\n\n  if (usingGiphy) {\n    return null\n  }\n\n  return (\n    // TODO: Design Pass\n    <View style={styles.attachmentPicker}>\n      {isOpen && (\n        <View style={styles.attachmentPickerButtons}>\n          <IconButton\n            accessibilityLabel=\"Take a photo\"\n            size=\"md\"\n            appearance=\"neutral\"\n            name={'general.videoCamera'}\n            onPress={openCamera}\n          />\n          <IconButton\n            accessibilityLabel=\"Choose a photo\"\n            size=\"md\"\n            appearance=\"neutral\"\n            name={'churchCenter.photosIos'}\n            onPress={pickImage}\n          />\n        </View>\n      )}\n      <IconButton\n        accessibilityLabel=\"File Menu\"\n        size=\"md\"\n        appearance=\"neutral\"\n        name={'general.outlinedPlusCircle'}\n        onPress={() => setIsOpen(!isOpen)}\n      />\n    </View>\n  )\n}\n\nfunction MessageFormCommands() {\n  const { canGiphy, usingGiphy, setUsingGiphy } = React.useContext(MessageFormContext)\n\n  if (!canGiphy) {\n    return null\n  }\n\n  if (usingGiphy) {\n    return (\n      <IconButton\n        accessibilityLabel=\"Exit Giphy Search\"\n        size=\"md\"\n        appearance=\"neutral\"\n        name={'general.x'}\n        onPress={() => setUsingGiphy(false)}\n      />\n    )\n  }\n\n  return (\n    <IconButton\n      accessibilityLabel=\"Search Giphy\"\n      size=\"md\"\n      appearance=\"neutral\"\n      name={'general.bolt'}\n      onPress={() => setUsingGiphy(true)}\n    />\n  )\n}\n\nconst useMessageFormStyles = () => {\n  const theme = useTheme()\n  const navigationTheme = useNavigationTheme()\n\n  return StyleSheet.create({\n    textInputContainer: {\n      borderColor: theme.colors.fillColorNeutral050Base,\n      borderTopWidth: 1,\n      padding: 12,\n      backgroundColor: navigationTheme.colors.card,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n    },\n    textInputBoundary: {\n      borderRadius: 24,\n      borderWidth: 1,\n      padding: 12,\n      paddingHorizontal: 20,\n      borderColor: theme.colors.fillColorNeutral050Base,\n      flex: 1,\n      gap: 12,\n    },\n    textInput: {\n      flexDirection: 'row',\n      gap: 12,\n    },\n    giphyBadge: {\n      backgroundColor: theme.colors.fillColorNeutral050Base,\n      borderRadius: 24,\n      padding: 8,\n      paddingHorizontal: 12,\n    },\n    textInputSend: {\n      borderRadius: 24,\n      height: 36,\n      width: 36,\n    },\n    attachmentPicker: {\n      position: 'relative',\n    },\n    attachmentPickerButtons: {\n      position: 'absolute',\n      left: 0,\n      bottom: 40,\n      zIndex: 10,\n      gap: 16,\n    },\n    messageFormAttachments: {\n      flexDirection: 'row',\n      gap: 8,\n    },\n    inputErrorMessage: {\n      color: theme.colors.statusErrorText,\n      fontSize: 14,\n    },\n  })\n}\n"]}
+{"version":3,"file":"message_form.js","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useNavigation, useTheme as useNavigationTheme, useRoute } from '@react-navigation/native'\nimport React, { useCallback, useContext, useEffect, useState } from 'react'\nimport { StyleSheet, TextInput, View, ViewProps } from 'react-native'\nimport { IconButton, Text } from '../../components'\nimport { useTheme } from '../../hooks'\nimport { ConversationResource } from '../../types'\nimport { useMessageCreate } from '../../hooks/use_message_create'\nimport { ConversationScreenProps } from '../../screens/conversation_screen'\nimport { ChatContext } from '../../contexts/chat_context'\nimport { ImagePicker, ImagePickerResult } from '../../utils/native_adapters'\nimport { useAttachmentUploader } from '../../hooks/use_attachment_uploader'\nimport {\n  DenormalizedAttachmentResourceForCreate,\n  DenormalizedMessageAttachmentResourceForCreate,\n} from '../../types/resources/denormalized_attachment_resource'\nimport { MessageFormAttachmentImage } from './message_form/message_form_attachment_image'\n\nexport const MessageForm = {\n  Root: MessageFormRoot,\n  TextInput: MessageFormInput,\n  SubmitButton: MessageFormSubmitBtn,\n  AttachmentPicker: MessageFormAttachmentPicker,\n  Commands: MessageFormCommands,\n}\n\ninterface MessagesFormRootProps extends ViewProps {\n  conversation: ConversationResource\n}\n\nconst MessageFormContext = React.createContext<{\n  text: string\n  setText: (text: string) => void\n  onSubmit: () => void\n  disabled: boolean\n  canGiphy: boolean\n  usingGiphy: boolean\n  setUsingGiphy: (usingGiphy: boolean) => void\n  attachmentUploader?: ReturnType<typeof useAttachmentUploader>\n}>({\n  text: '',\n  setText: (_text: string) => {},\n  onSubmit: () => {},\n  disabled: false,\n  canGiphy: false,\n  usingGiphy: false,\n  setUsingGiphy: (_usingGiphy: boolean) => {},\n})\n\nconst GIPHY_MAX_LENGTH = 50\nconst MAX_MESSAGE_LENGTH = 5000\n\nfunction MessageFormRoot({ conversation, children }: MessagesFormRootProps) {\n  const { giphyApiKey } = useContext(ChatContext)\n  const canGiphy = !!giphyApiKey\n  const styles = useMessageFormStyles()\n  const [text, setText] = React.useState('')\n  const [usingGiphy, setUsingGiphy] = useState(false)\n  const navigation = useNavigation()\n  const route = useRoute() as ConversationScreenProps['route']\n  const {\n    status,\n    isPending,\n    reset: resetMutation,\n    mutate,\n  } = useMessageCreate({\n    conversationId: conversation.id,\n  })\n  const attachmentUploader = useAttachmentUploader({\n    conversationId: conversation.id,\n  })\n  const resetAttachmentUploader = attachmentUploader.reset\n\n  const reset = useCallback(() => {\n    resetAttachmentUploader()\n    resetMutation()\n    setText('')\n    setUsingGiphy(false)\n  }, [resetAttachmentUploader, resetMutation])\n\n  useEffect(() => {\n    if (canGiphy && !usingGiphy && text.startsWith('/giphy ')) {\n      setUsingGiphy(true)\n      setText('')\n    }\n  }, [canGiphy, text, usingGiphy])\n\n  useEffect(() => {\n    switch (status) {\n      case 'success':\n        reset()\n        break\n    }\n  }, [reset, status])\n\n  useEffect(() => {\n    if (route.params.clear_input) {\n      reset()\n      navigation.setParams({ ...route.params, clear_input: false })\n    }\n  }, [reset, navigation, route.params])\n\n  const canSubmit = (() => {\n    if (isPending) return false\n    if (attachmentUploader?.pendingUploads) return false\n    if (text.length > 0) return true\n    if (attachmentUploader?.attachments?.length) return true\n    return false\n  })()\n  const disabled = !canSubmit\n\n  const handleSubmit = () => {\n    if (!canSubmit) return\n\n    if (canGiphy && usingGiphy) {\n      TextInput.State.blurTextInput(TextInput.State.currentlyFocusedInput())\n      navigation.navigate('SendGiphy', {\n        conversation_id: conversation.id,\n        search_term: text,\n      })\n    } else {\n      let attachmentsForSubmit: DenormalizedAttachmentResourceForCreate[] = []\n      if (attachmentUploader?.attachmentIds) {\n        attachmentsForSubmit = attachmentUploader.attachmentIds.map(\n          (id: string): DenormalizedMessageAttachmentResourceForCreate => ({\n            type: 'MessageAttachment',\n            id,\n          })\n        )\n      }\n      mutate({ text, attachments: attachmentsForSubmit })\n    }\n  }\n\n  return (\n    <MessageFormContext.Provider\n      value={{\n        text,\n        setText,\n        onSubmit: handleSubmit,\n        disabled,\n        canGiphy,\n        usingGiphy,\n        setUsingGiphy,\n        attachmentUploader,\n      }}\n    >\n      <View style={styles.textInputContainer}>{children}</View>\n    </MessageFormContext.Provider>\n  )\n}\n\nfunction MessageFormAttachments() {\n  const styles = useMessageFormStyles()\n  const { attachmentUploader } = React.useContext(MessageFormContext)\n  const numberOfAttachments = attachmentUploader?.attachments?.length || 0\n  const attachments = attachmentUploader?.attachments || []\n\n  if (numberOfAttachments === 0) {\n    return null\n  }\n\n  return (\n    <View style={styles.messageFormAttachments}>\n      {attachments.map(attachment => {\n        return (\n          <MessageFormAttachmentImage\n            key={attachment.file.uri}\n            uri={attachment.file.uri}\n            alt={attachment.file.name}\n            status={attachment.status}\n            width={attachment.file.width}\n            height={attachment.file.height}\n            removeAttachment={() => {\n              attachmentUploader?.removeAttachment(attachment)\n            }}\n          />\n        )\n      })}\n    </View>\n  )\n}\n\nfunction MessageFormInput() {\n  const styles = useMessageFormStyles()\n  const { text, setText, onSubmit, usingGiphy, attachmentUploader } =\n    React.useContext(MessageFormContext)\n  const attachmentError = attachmentUploader?.errorMessage\n\n  return (\n    <View style={styles.textInputBoundary}>\n      <MessageFormAttachments />\n      <View style={styles.textInputRow}>\n        {usingGiphy ? (\n          <View style={styles.giphyBadge}>\n            <Text>/Giphy</Text>\n          </View>\n        ) : null}\n\n        <View style={styles.textInput}>\n          <TextInput\n            multiline={true}\n            aria-disabled={true}\n            placeholder=\"Send a message\"\n            onChangeText={setText}\n            value={text}\n            maxLength={usingGiphy ? GIPHY_MAX_LENGTH : MAX_MESSAGE_LENGTH}\n            onSubmitEditing={onSubmit}\n          />\n        </View>\n      </View>\n\n      {attachmentError ? <Text style={styles.inputErrorMessage}>{attachmentError}</Text> : null}\n    </View>\n  )\n}\n\nfunction MessageFormSubmitBtn() {\n  const styles = useMessageFormStyles()\n  const { onSubmit, disabled, usingGiphy } = React.useContext(MessageFormContext)\n\n  return (\n    <IconButton\n      disabled={disabled}\n      accessibilityLabel={usingGiphy ? 'Search Giphy' : 'Send message'}\n      size=\"md\"\n      appearance=\"neutral\"\n      style={styles.textInputSend}\n      name={usingGiphy ? 'general.search' : 'general.upArrow'}\n      onPress={onSubmit}\n    />\n  )\n}\n\nfunction MessageFormAttachmentPicker() {\n  const styles = useMessageFormStyles()\n  const { usingGiphy, attachmentUploader } = React.useContext(MessageFormContext)\n  const [isOpen, setIsOpen] = useState(false)\n\n  function uploadImagePickerResult(result: ImagePickerResult) {\n    if (result.canceled) {\n      return\n    }\n\n    const filteredAssets = result.assets\n      .filter(asset => {\n        return asset.fileSize && asset.fileName && asset.mimeType\n      })\n      .map(asset => {\n        return {\n          uri: asset.uri,\n          name: asset.fileName as string,\n          type: asset.mimeType as string,\n          size: asset.fileSize as number,\n          height: asset.height,\n          width: asset.width,\n        }\n      })\n\n    attachmentUploader?.handleFilesAttached(filteredAssets)\n  }\n\n  const openCamera = async () => {\n    setIsOpen(false)\n    let result = await ImagePicker.openCameraAsync()\n    if (!result.canceled) {\n      uploadImagePickerResult(result)\n    }\n  }\n\n  const pickImage = async () => {\n    setIsOpen(false)\n    let result = await ImagePicker.openImageLibraryAsync()\n    if (!result.canceled) {\n      uploadImagePickerResult(result)\n    }\n  }\n\n  if (usingGiphy) {\n    return null\n  }\n\n  return (\n    // TODO: Design Pass\n    <View style={styles.attachmentPicker}>\n      {isOpen && (\n        <View style={styles.attachmentPickerButtons}>\n          <IconButton\n            accessibilityLabel=\"Take a photo\"\n            size=\"md\"\n            appearance=\"neutral\"\n            name={'general.videoCamera'}\n            onPress={openCamera}\n          />\n          <IconButton\n            accessibilityLabel=\"Choose a photo\"\n            size=\"md\"\n            appearance=\"neutral\"\n            name={'churchCenter.photosIos'}\n            onPress={pickImage}\n          />\n        </View>\n      )}\n      <IconButton\n        accessibilityLabel=\"File Menu\"\n        size=\"md\"\n        appearance=\"neutral\"\n        name={'general.outlinedPlusCircle'}\n        onPress={() => setIsOpen(!isOpen)}\n      />\n    </View>\n  )\n}\n\nfunction MessageFormCommands() {\n  const { text, canGiphy, usingGiphy, setUsingGiphy } = React.useContext(MessageFormContext)\n\n  if (!canGiphy) {\n    return null\n  }\n\n  if (usingGiphy) {\n    return (\n      <IconButton\n        accessibilityLabel=\"Exit Giphy Search\"\n        size=\"md\"\n        appearance=\"neutral\"\n        name={'general.x'}\n        onPress={() => setUsingGiphy(false)}\n      />\n    )\n  }\n\n  return (\n    <IconButton\n      accessibilityLabel=\"Search Giphy\"\n      size=\"md\"\n      appearance=\"neutral\"\n      name={'general.bolt'}\n      onPress={() => setUsingGiphy(true)}\n      disabled={text.length > GIPHY_MAX_LENGTH}\n    />\n  )\n}\n\nconst useMessageFormStyles = () => {\n  const theme = useTheme()\n  const navigationTheme = useNavigationTheme()\n\n  return StyleSheet.create({\n    textInputContainer: {\n      borderColor: theme.colors.fillColorNeutral050Base,\n      borderTopWidth: 1,\n      padding: 12,\n      backgroundColor: navigationTheme.colors.card,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n    },\n    textInputBoundary: {\n      borderRadius: 24,\n      borderWidth: 1,\n      padding: 12,\n      paddingHorizontal: 20,\n      borderColor: theme.colors.fillColorNeutral050Base,\n      flex: 1,\n      gap: 12,\n    },\n    textInputRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n    },\n    textInput: {\n      flex: 1,\n    },\n    giphyBadge: {\n      backgroundColor: theme.colors.fillColorNeutral050Base,\n      borderRadius: 24,\n      padding: 8,\n      paddingHorizontal: 12,\n    },\n    textInputSend: {\n      borderRadius: 24,\n      height: 36,\n      width: 36,\n    },\n    attachmentPicker: {\n      position: 'relative',\n    },\n    attachmentPickerButtons: {\n      position: 'absolute',\n      left: 0,\n      bottom: 40,\n      zIndex: 10,\n      gap: 16,\n    },\n    messageFormAttachments: {\n      flexDirection: 'row',\n      gap: 8,\n    },\n    inputErrorMessage: {\n      color: theme.colors.statusErrorText,\n      fontSize: 14,\n    },\n  })\n}\n"]}

package/build/navigation/index.d.ts

@@ -49,6 +49,17 @@ export declare const NewConversationStack: import("@react-navigation/native").Ty
                 headerRight: (props: NativeStackHeaderRightProps) => React.JSX.Element;
             };
         };
+        readonly ConversationSelectTeamsILeadRecipients: {
+            readonly screen: ({ route, }: import("../screens/conversation_select_recipients/types/screen_props").ConversationSelectRecipientsScreenProps) => React.JSX.Element;
+            readonly options: ({ navigation, route }: {
+                route: import("@react-navigation/native").RouteProp<import("@react-navigation/native").ParamListBase, string>;
+                navigation: import("@react-navigation/native-stack").NativeStackNavigationProp<import("@react-navigation/native").ParamListBase, string, undefined>;
+                theme: ReactNavigation.Theme;
+            }) => {
+                title: string;
+                headerRight: (props: NativeStackHeaderRightProps) => React.JSX.Element;
+            };
+        };
         readonly ConversationFilterRecipients: {
             readonly screen: ({}: import("../screens/conversation_filter_recipients/types").ConversationFilterRecipientsScreenProps) => React.JSX.Element;
             readonly options: import("@react-navigation/native-stack").NativeStackNavigationOptions;
@@ -173,6 +184,17 @@ export declare const ChatStack: import("@react-navigation/native").TypedNavigato
                             headerRight: (props: NativeStackHeaderRightProps) => React.JSX.Element;
                         };
                     };
+                    readonly ConversationSelectTeamsILeadRecipients: {
+                        readonly screen: ({ route, }: import("../screens/conversation_select_recipients/types/screen_props").ConversationSelectRecipientsScreenProps) => React.JSX.Element;
+                        readonly options: ({ navigation, route }: {
+                            route: import("@react-navigation/native").RouteProp<import("@react-navigation/native").ParamListBase, string>;
+                            navigation: import("@react-navigation/native-stack").NativeStackNavigationProp<import("@react-navigation/native").ParamListBase, string, undefined>;
+                            theme: ReactNavigation.Theme;
+                        }) => {
+                            title: string;
+                            headerRight: (props: NativeStackHeaderRightProps) => React.JSX.Element;
+                        };
+                    };
                     readonly ConversationFilterRecipients: {
                         readonly screen: ({}: import("../screens/conversation_filter_recipients/types").ConversationFilterRecipientsScreenProps) => React.JSX.Element;
                         readonly options: import("@react-navigation/native-stack").NativeStackNavigationOptions;

package/build/navigation/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/navigation/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,EAEL,2BAA2B,EAC5B,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,wCAAwC,CAAA;AAClF,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAA;AAOnF,OAAO,EACL,oBAAoB,EAErB,MAAM,mCAAmC,CAAA;AAC1C,OAAO,EAAE,eAAe,EAA0B,MAAM,8BAA8B,CAAA;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAC/C,OAAO,EAAE,eAAe,EAA0B,MAAM,6BAA6B,CAAA;AAErF,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAQ7C,eAAO,MAAM,oBAAoB;;;;;;;;;uOAvBoC,mBACjE;;;;;;;;;;;;;uBAwK8jZ,gBAAiB,KAAK;;;qCAvI3jZ,2BAA2B;;;;;;;;;uBAuI0gZ,gBAAiB,KAAK;;;qCA3H3jZ,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;uBA2H0gZ,gBAAiB,KAAK;;;;qCAxG3jZ,2BAA2B;;;;EAQtD,CAAA;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;uBA8F4iZ,gBAAiB,KAAK;;;qCApF3jZ,2BAA2B;;;;;;;;;;;;uBAoF0gZ,gBAAiB,KAAK;;;;;;;;;;;uBAAtB,gBAAiB,KAAK;;;;qCA9C3jZ,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;mDA8C2hZ,KAAK;;;iDAvI3jZ,2BAA2B;;;;;;;;;mDAuI2hZ,KAAK;;;iDA3H3jZ,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;mDA2H2hZ,KAAK;;;;iDAxG3jZ,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+FtD,CAAA;AAEF,KAAK,kBAAkB,GAAG,eAAe,CAAC,OAAO,SAAS,CAAC,CAAA;AAE3D,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,eAAe,CAAC;QACxB,UAAU,aAAc,SAAQ,kBAAkB;SAAG;KACtD;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/navigation/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,EAEL,2BAA2B,EAC5B,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,wCAAwC,CAAA;AAClF,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAA;AAOnF,OAAO,EACL,oBAAoB,EAErB,MAAM,mCAAmC,CAAA;AAC1C,OAAO,EAAE,eAAe,EAA0B,MAAM,8BAA8B,CAAA;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAC/C,OAAO,EAAE,eAAe,EAA0B,MAAM,6BAA6B,CAAA;AAErF,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAS7C,eAAO,MAAM,oBAAoB;;;;;;;;;uOAxBoC,mBACjE;;;;;;;;;;;;;uBAuL+8X,gBAAiB,KAAK;;;qCArJ58X,2BAA2B;;;;;;;;;uBAqJ25X,gBAAiB,KAAK;;;qCAzI58X,2BAA2B;;;;;;;;uBAyI25X,gBAAiB,KAAK;;;qCA3H58X,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;uBA2H25X,gBAAiB,KAAK;;;;qCAxG58X,2BAA2B;;;;EAQtD,CAAA;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;uBA8F67X,gBAAiB,KAAK;;;qCApF58X,2BAA2B;;;;;;;;;;;;uBAoF25X,gBAAiB,KAAK;;;;;;;;;;;uBAAtB,gBAAiB,KAAK;;;;qCA9C58X,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;mDA8C46X,KAAK;;;iDArJ58X,2BAA2B;;;;;;;;;mDAqJ46X,KAAK;;;iDAzI58X,2BAA2B;;;;;;;;mDAyI46X,KAAK;;;iDA3H58X,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;mDA2H46X,KAAK;;;;iDAxG58X,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+FtD,CAAA;AAEF,KAAK,kBAAkB,GAAG,eAAe,CAAC,OAAO,SAAS,CAAC,CAAA;AAE3D,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,eAAe,CAAC;QACxB,UAAU,aAAc,SAAQ,kBAAkB;SAAG;KACtD;CACF"}

package/build/navigation/index.js

@@ -16,6 +16,7 @@ import { HeaderRightButton } from './header';
 import { ScreenLayout } from './screenLayout';
 import { ConversationFiltersScreen, ConversationFiltersScreenOptions, } from '../screens/conversation_filters_screen';
 import { ConversationSelectGroupRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_group_recipients_screen';
+import { ConversationSelectTeamsILeadRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen';
 export const NewConversationStack = createNativeStackNavigator({
     initialRouteName: 'ConversationSelectRecipients',
     screenOptions: {
@@ -42,6 +43,15 @@ export const NewConversationStack = createNativeStackNavigator({
           </HeaderRightButton>),
             }),
         },
+        ConversationSelectTeamsILeadRecipients: {
+            screen: ConversationSelectTeamsILeadRecipientsScreen,
+            options: ({ navigation, route }) => ({
+                title: 'New conversation',
+                headerRight: (props) => (<HeaderRightButton {...props} onPress={() => navigation.popTo('Conversations', route.params)}>
+            Cancel
+          </HeaderRightButton>),
+            }),
+        },
         ConversationFilterRecipients: {
             screen: ConversationFilterRecipientsScreen,
             options: ConversationFilterReceipientsScreenOptions,

package/build/navigation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/navigation/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HeaderBackButton } from '@react-navigation/elements'\nimport { StaticParamList } from '@react-navigation/native'\nimport {\n  createNativeStackNavigator,\n  NativeStackHeaderRightProps,\n} from '@react-navigation/native-stack'\nimport React from 'react'\nimport { Icon } from '../components'\nimport { ConversationDetailsScreen } from '../screens/conversation_details_screen'\nimport { ConversationScreen } from '../screens/conversation_screen'\nimport { ConversationsScreen } from '../screens/conversations/conversations_screen'\nimport { ConversationNewScreen } from '../screens/conversation_new/conversation_new_screen'\nimport {\n  ConversationFilterReceipientsScreenOptions,\n  ConversationFilterRecipientsScreen,\n} from '../screens/conversation_filter_recipients/conversation_filter_recipients_screen'\nimport { ConversationSelectRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_recipients_screen'\nimport {\n  MessageActionsScreen,\n  MessageActionsScreenOptions,\n} from '../screens/message_actions_screen'\nimport { SendGiphyScreen, SendGiphyScreenOptions } from '../screens/send_giphy_screen'\nimport { NotFound } from '../screens/not_found'\nimport { ReactionsScreen, ReactionsScreenOptions } from '../screens/reactions_screen'\nimport { HeaderRightButton } from './header'\nimport { ScreenLayout } from './screenLayout'\nimport {\n  ConversationFiltersScreen,\n  ConversationFiltersScreenOptions,\n} from '../screens/conversation_filters_screen'\nimport { ConversationFiltersParams } from '../screens/conversation_filters/screen_props'\nimport { ConversationSelectGroupRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_group_recipients_screen'\n\nexport const NewConversationStack = createNativeStackNavigator({\n  initialRouteName: 'ConversationSelectRecipients',\n  screenOptions: {\n    headerBackButtonDisplayMode: 'minimal',\n  },\n  screenLayout: ScreenLayout,\n  screens: {\n    ConversationSelectRecipients: {\n      screen: ConversationSelectRecipientsScreen,\n      options: ({ navigation }) => ({\n        title: 'New conversation',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton {...props} onPress={navigation.goBack}>\n            Cancel\n          </HeaderRightButton>\n        ),\n        headerBackVisible: false,\n      }),\n    },\n    ConversationSelectGroupRecipients: {\n      screen: ConversationSelectGroupRecipientsScreen,\n      options: ({ navigation, route }) => ({\n        title: 'New conversation',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton\n            {...props}\n            onPress={() => navigation.popTo('Conversations', route.params)}\n          >\n            Cancel\n          </HeaderRightButton>\n        ),\n      }),\n    },\n    ConversationFilterRecipients: {\n      screen: ConversationFilterRecipientsScreen,\n      options: ConversationFilterReceipientsScreenOptions,\n    },\n    ConversationNew: {\n      screen: ConversationNewScreen,\n      options: ({ navigation }) => ({\n        title: 'New conversation',\n        headerLeft: () => null,\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton {...props} onPress={() => navigation.getParent()?.goBack()}>\n            Cancel\n          </HeaderRightButton>\n        ),\n      }),\n    },\n  },\n})\n\nexport const ChatStack = createNativeStackNavigator({\n  screenOptions: {\n    headerBackButtonDisplayMode: 'minimal',\n  },\n  screenLayout: ScreenLayout,\n  screens: {\n    Conversations: {\n      screen: ConversationsScreen,\n      options: ({ route, navigation }) => ({\n        headerTitle: (route.params as { title?: string })?.title ?? 'Chat',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderBackButton\n            backImage={() => <Icon name=\"general.x\" size={18} color={props.tintColor} />}\n            onPress={navigation.goBack}\n            {...props}\n          />\n        ),\n      }),\n    },\n    ConversationFilters: {\n      screen: ConversationFiltersScreen,\n      options: ConversationFiltersScreenOptions,\n    },\n    Conversation: {\n      screen: ConversationScreen,\n      options: ({ route, navigation }) => ({\n        headerTitle: (route.params as { title?: string })?.title ?? 'Chat',\n        headerLeft: props => (\n          <HeaderBackButton\n            displayMode=\"minimal\"\n            onPress={() => {\n              if ((route.params as ConversationFiltersParams)?.chat_group_graph_id) {\n                // Ensure that conversations with a graph id pass them back to the conversation list\n                navigation.popTo('Conversations', route.params)\n              } else {\n                navigation.goBack()\n              }\n            }}\n            {...props}\n          />\n        ),\n      }),\n    },\n    ConversationDetails: {\n      screen: ConversationDetailsScreen,\n      options: ({ navigation }) => ({\n        presentation: 'modal',\n        title: 'Conversation details',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton {...props} onPress={navigation.goBack}>\n            Done\n          </HeaderRightButton>\n        ),\n      }),\n    },\n    New: {\n      screen: NewConversationStack,\n      options: {\n        headerShown: false,\n        presentation: 'modal',\n      },\n    },\n    SendGiphy: {\n      screen: SendGiphyScreen,\n      options: SendGiphyScreenOptions,\n    },\n    MessageActions: {\n      screen: MessageActionsScreen,\n      // Something about sheetAllowedDetents declared inline breaks TS\n      options: MessageActionsScreenOptions,\n    },\n    Reactions: {\n      screen: ReactionsScreen,\n      options: ReactionsScreenOptions,\n    },\n    NotFound: {\n      screen: NotFound,\n      options: {\n        title: '404',\n      },\n      linking: {\n        path: '*',\n      },\n    },\n  },\n})\n\ntype ChatStackParamList = StaticParamList<typeof ChatStack>\n\ndeclare global {\n  namespace ReactNavigation {\n    interface RootParamList extends ChatStackParamList {}\n  }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/navigation/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HeaderBackButton } from '@react-navigation/elements'\nimport { StaticParamList } from '@react-navigation/native'\nimport {\n  createNativeStackNavigator,\n  NativeStackHeaderRightProps,\n} from '@react-navigation/native-stack'\nimport React from 'react'\nimport { Icon } from '../components'\nimport { ConversationDetailsScreen } from '../screens/conversation_details_screen'\nimport { ConversationScreen } from '../screens/conversation_screen'\nimport { ConversationsScreen } from '../screens/conversations/conversations_screen'\nimport { ConversationNewScreen } from '../screens/conversation_new/conversation_new_screen'\nimport {\n  ConversationFilterReceipientsScreenOptions,\n  ConversationFilterRecipientsScreen,\n} from '../screens/conversation_filter_recipients/conversation_filter_recipients_screen'\nimport { ConversationSelectRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_recipients_screen'\nimport {\n  MessageActionsScreen,\n  MessageActionsScreenOptions,\n} from '../screens/message_actions_screen'\nimport { SendGiphyScreen, SendGiphyScreenOptions } from '../screens/send_giphy_screen'\nimport { NotFound } from '../screens/not_found'\nimport { ReactionsScreen, ReactionsScreenOptions } from '../screens/reactions_screen'\nimport { HeaderRightButton } from './header'\nimport { ScreenLayout } from './screenLayout'\nimport {\n  ConversationFiltersScreen,\n  ConversationFiltersScreenOptions,\n} from '../screens/conversation_filters_screen'\nimport { ConversationFiltersParams } from '../screens/conversation_filters/screen_props'\nimport { ConversationSelectGroupRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_group_recipients_screen'\nimport { ConversationSelectTeamsILeadRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen'\n\nexport const NewConversationStack = createNativeStackNavigator({\n  initialRouteName: 'ConversationSelectRecipients',\n  screenOptions: {\n    headerBackButtonDisplayMode: 'minimal',\n  },\n  screenLayout: ScreenLayout,\n  screens: {\n    ConversationSelectRecipients: {\n      screen: ConversationSelectRecipientsScreen,\n      options: ({ navigation }) => ({\n        title: 'New conversation',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton {...props} onPress={navigation.goBack}>\n            Cancel\n          </HeaderRightButton>\n        ),\n        headerBackVisible: false,\n      }),\n    },\n    ConversationSelectGroupRecipients: {\n      screen: ConversationSelectGroupRecipientsScreen,\n      options: ({ navigation, route }) => ({\n        title: 'New conversation',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton\n            {...props}\n            onPress={() => navigation.popTo('Conversations', route.params)}\n          >\n            Cancel\n          </HeaderRightButton>\n        ),\n      }),\n    },\n    ConversationSelectTeamsILeadRecipients: {\n      screen: ConversationSelectTeamsILeadRecipientsScreen,\n      options: ({ navigation, route }) => ({\n        title: 'New conversation',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton\n            {...props}\n            onPress={() => navigation.popTo('Conversations', route.params)}\n          >\n            Cancel\n          </HeaderRightButton>\n        ),\n      }),\n    },\n    ConversationFilterRecipients: {\n      screen: ConversationFilterRecipientsScreen,\n      options: ConversationFilterReceipientsScreenOptions,\n    },\n    ConversationNew: {\n      screen: ConversationNewScreen,\n      options: ({ navigation }) => ({\n        title: 'New conversation',\n        headerLeft: () => null,\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton {...props} onPress={() => navigation.getParent()?.goBack()}>\n            Cancel\n          </HeaderRightButton>\n        ),\n      }),\n    },\n  },\n})\n\nexport const ChatStack = createNativeStackNavigator({\n  screenOptions: {\n    headerBackButtonDisplayMode: 'minimal',\n  },\n  screenLayout: ScreenLayout,\n  screens: {\n    Conversations: {\n      screen: ConversationsScreen,\n      options: ({ route, navigation }) => ({\n        headerTitle: (route.params as { title?: string })?.title ?? 'Chat',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderBackButton\n            backImage={() => <Icon name=\"general.x\" size={18} color={props.tintColor} />}\n            onPress={navigation.goBack}\n            {...props}\n          />\n        ),\n      }),\n    },\n    ConversationFilters: {\n      screen: ConversationFiltersScreen,\n      options: ConversationFiltersScreenOptions,\n    },\n    Conversation: {\n      screen: ConversationScreen,\n      options: ({ route, navigation }) => ({\n        headerTitle: (route.params as { title?: string })?.title ?? 'Chat',\n        headerLeft: props => (\n          <HeaderBackButton\n            displayMode=\"minimal\"\n            onPress={() => {\n              if ((route.params as ConversationFiltersParams)?.chat_group_graph_id) {\n                // Ensure that conversations with a graph id pass them back to the conversation list\n                navigation.popTo('Conversations', route.params)\n              } else {\n                navigation.goBack()\n              }\n            }}\n            {...props}\n          />\n        ),\n      }),\n    },\n    ConversationDetails: {\n      screen: ConversationDetailsScreen,\n      options: ({ navigation }) => ({\n        presentation: 'modal',\n        title: 'Conversation details',\n        headerRight: (props: NativeStackHeaderRightProps) => (\n          <HeaderRightButton {...props} onPress={navigation.goBack}>\n            Done\n          </HeaderRightButton>\n        ),\n      }),\n    },\n    New: {\n      screen: NewConversationStack,\n      options: {\n        headerShown: false,\n        presentation: 'modal',\n      },\n    },\n    SendGiphy: {\n      screen: SendGiphyScreen,\n      options: SendGiphyScreenOptions,\n    },\n    MessageActions: {\n      screen: MessageActionsScreen,\n      // Something about sheetAllowedDetents declared inline breaks TS\n      options: MessageActionsScreenOptions,\n    },\n    Reactions: {\n      screen: ReactionsScreen,\n      options: ReactionsScreenOptions,\n    },\n    NotFound: {\n      screen: NotFound,\n      options: {\n        title: '404',\n      },\n      linking: {\n        path: '*',\n      },\n    },\n  },\n})\n\ntype ChatStackParamList = StaticParamList<typeof ChatStack>\n\ndeclare global {\n  namespace ReactNavigation {\n    interface RootParamList extends ChatStackParamList {}\n  }\n}\n"]}

package/build/screens/conversation_select_recipients/components/groups_recipient_row.d.ts

@@ -0,0 +1,8 @@
+import { GroupsGroupResource } from '../../../types';
+interface GroupsRecipientRowProps {
+    group: GroupsGroupResource;
+    onPress: (group: GroupsGroupResource) => void;
+}
+export declare const GroupsRecipientRow: ({ group, onPress }: GroupsRecipientRowProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=groups_recipient_row.d.ts.map

package/build/screens/conversation_select_recipients/components/groups_recipient_row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"groups_recipient_row.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_select_recipients/components/groups_recipient_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpD,UAAU,uBAAuB;IAC/B,KAAK,EAAE,mBAAmB,CAAA;IAC1B,OAAO,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAA;CAC9C;AAED,eAAO,MAAM,kBAAkB,uBAAwB,uBAAuB,gCAa7E,CAAA"}

package/build/screens/conversation_select_recipients/components/groups_recipient_row.js

@@ -0,0 +1,7 @@
+import { pluralize } from '../../../utils';
+import { RecipientLinkRow } from './recipient_link_row';
+export const GroupsRecipientRow = ({ group, onPress }) => {
+    const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`;
+    return (<RecipientLinkRow imageUri={group.headerImage?.thumbnail} title={group.name} subtitle={`${group.membershipsCount} members`} onPress={() => onPress(group)} accessibilityLabel={groupAccessibilityLabel} accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}/>);
+};
+//# sourceMappingURL=groups_recipient_row.js.map

package/build/screens/conversation_select_recipients/components/groups_recipient_row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"groups_recipient_row.js","sourceRoot":"","sources":["../../../../src/screens/conversation_select_recipients/components/groups_recipient_row.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAOvD,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAA2B,EAAE,EAAE;IAChF,MAAM,uBAAuB,GAAG,UAAU,KAAK,CAAC,IAAI,SAAS,SAAS,CAAC,KAAK,CAAC,gBAAgB,EAAE,QAAQ,CAAC,EAAE,CAAA;IAE1G,OAAO,CACL,CAAC,gBAAgB,CACf,QAAQ,CAAC,CAAC,KAAK,CAAC,WAAW,EAAE,SAAS,CAAC,CACvC,KAAK,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAClB,QAAQ,CAAC,CAAC,GAAG,KAAK,CAAC,gBAAgB,UAAU,CAAC,CAC9C,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAC9B,kBAAkB,CAAC,CAAC,uBAAuB,CAAC,CAC5C,iBAAiB,CAAC,CAAC,kGAAkG,CAAC,EACtH,CACH,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { GroupsGroupResource } from '../../../types'\nimport { pluralize } from '../../../utils'\nimport { RecipientLinkRow } from './recipient_link_row'\n\ninterface GroupsRecipientRowProps {\n  group: GroupsGroupResource\n  onPress: (group: GroupsGroupResource) => void\n}\n\nexport const GroupsRecipientRow = ({ group, onPress }: GroupsRecipientRowProps) => {\n  const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`\n\n  return (\n    <RecipientLinkRow\n      imageUri={group.headerImage?.thumbnail}\n      title={group.name}\n      subtitle={`${group.membershipsCount} members`}\n      onPress={() => onPress(group)}\n      accessibilityLabel={groupAccessibilityLabel}\n      accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}\n    />\n  )\n}\n"]}

package/build/screens/conversation_select_recipients/components/team_recipient_row.d.ts

@@ -0,0 +1,8 @@
+import { ServiceTypeWithTeams } from '../../conversation_filter_recipients/types';
+interface TeamRecipientRowProps {
+    serviceType: ServiceTypeWithTeams;
+    onPress: (teams: ServiceTypeWithTeams['teams']) => void;
+}
+export declare const TeamRecipientRow: ({ serviceType, onPress }: TeamRecipientRowProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=team_recipient_row.d.ts.map

package/build/screens/conversation_select_recipients/components/team_recipient_row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"team_recipient_row.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_select_recipients/components/team_recipient_row.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,4CAA4C,CAAA;AAGjF,UAAU,qBAAqB;IAC7B,WAAW,EAAE,oBAAoB,CAAA;IACjC,OAAO,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAA;CACxD;AAED,eAAO,MAAM,gBAAgB,6BAA8B,qBAAqB,gCAa/E,CAAA"}

package/build/screens/conversation_select_recipients/components/team_recipient_row.js

@@ -0,0 +1,8 @@
+import { pluralize } from '../../../utils';
+import { RecipientLinkRow } from './recipient_link_row';
+export const TeamRecipientRow = ({ serviceType, onPress }) => {
+    const serviceTypeAccessibilityLabel = `Select ${pluralize(serviceType.teams.length, 'team')} for ${serviceType.name}`;
+    const teamNames = serviceType.teams.map(team => team.name).join(', ');
+    return (<RecipientLinkRow title={serviceType.name} subtitle={teamNames} onPress={() => onPress(serviceType.teams)} accessibilityLabel={serviceTypeAccessibilityLabel} accessibilityHint={`Selects Service Type's teams as recipients and navigates to the final screen to finish creating the conversation`}/>);
+};
+//# sourceMappingURL=team_recipient_row.js.map

package/build/screens/conversation_select_recipients/components/team_recipient_row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"team_recipient_row.js","sourceRoot":"","sources":["../../../../src/screens/conversation_select_recipients/components/team_recipient_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAOvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,WAAW,EAAE,OAAO,EAAyB,EAAE,EAAE;IAClF,MAAM,6BAA6B,GAAG,UAAU,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC,QAAQ,WAAW,CAAC,IAAI,EAAE,CAAA;IACrH,MAAM,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAErE,OAAO,CACL,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,CACxB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAC1C,kBAAkB,CAAC,CAAC,6BAA6B,CAAC,CAClD,iBAAiB,CAAC,CAAC,kHAAkH,CAAC,EACtI,CACH,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { pluralize } from '../../../utils'\nimport { ServiceTypeWithTeams } from '../../conversation_filter_recipients/types'\nimport { RecipientLinkRow } from './recipient_link_row'\n\ninterface TeamRecipientRowProps {\n  serviceType: ServiceTypeWithTeams\n  onPress: (teams: ServiceTypeWithTeams['teams']) => void\n}\n\nexport const TeamRecipientRow = ({ serviceType, onPress }: TeamRecipientRowProps) => {\n  const serviceTypeAccessibilityLabel = `Select ${pluralize(serviceType.teams.length, 'team')} for ${serviceType.name}`\n  const teamNames = serviceType.teams.map(team => team.name).join(', ')\n\n  return (\n    <RecipientLinkRow\n      title={serviceType.name}\n      subtitle={teamNames}\n      onPress={() => onPress(serviceType.teams)}\n      accessibilityLabel={serviceTypeAccessibilityLabel}\n      accessibilityHint={`Selects Service Type's teams as recipients and navigates to the final screen to finish creating the conversation`}\n    />\n  )\n}\n"]}

package/build/screens/conversation_select_recipients/conversation_select_group_recipients_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_select_group_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_group_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,OAAO,EAAE,uCAAuC,EAAE,MAAM,sBAAsB,CAAA;AAG9E,eAAO,MAAM,uCAAuC,eAEjD,uCAAuC,sBA+CzC,CAAA"}
+{"version":3,"file":"conversation_select_group_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_group_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,EAAE,uCAAuC,EAAE,MAAM,sBAAsB,CAAA;AAI9E,eAAO,MAAM,uCAAuC,eAEjD,uCAAuC,sBAyCzC,CAAA"}

package/build/screens/conversation_select_recipients/conversation_select_group_recipients_screen.js

@@ -4,10 +4,9 @@ import { StyleSheet, View } from 'react-native';
 import { FlashList } from '@shopify/flash-list';
 import { Heading } from '../../components';
 import { useGroupsGroups } from '../../hooks/use_groups_groups';
-import { pluralize } from '../../utils';
-import { RecipientLinkRow } from './components/recipient_link_row';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row';
+import { GroupsRecipientRow } from './components/groups_recipient_row';
 export const ConversationSelectGroupRecipientsScreen = ({ route, }) => {
     const styles = useStyles();
     const navigation = useNavigation();
@@ -27,8 +26,7 @@ export const ConversationSelectGroupRecipientsScreen = ({ route, }) => {
     return (<FlashList data={groupsWithCreatePermission} keyExtractor={item => item.id.toString()} estimatedItemSize={65} contentContainerStyle={styles.contentContainer} ListHeaderComponent={<View style={styles.sectionHeader}>
           <Heading variant="h3">All my groups</Heading>
         </View>} renderItem={({ item: group }) => {
-            const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`;
-            return (<RecipientLinkRow key={group.id} imageUri={group.headerImage?.thumbnail} title={group.name} subtitle={`${group.membershipsCount} members`} onPress={() => handleNavigateToConversationNew(group)} accessibilityLabel={groupAccessibilityLabel} accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}/>);
+            return (<GroupsRecipientRow key={group.id} group={group} onPress={handleNavigateToConversationNew}/>);
         }} ListFooterComponent={showGroupsDisclaimer ? <GroupsWithoutChatDisclaimerRow /> : null}/>);
 };
 const useStyles = () => {

package/build/screens/conversation_select_recipients/conversation_select_group_recipients_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_select_group_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_group_recipients_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { FlashList } from '@shopify/flash-list'\nimport { Heading } from '../../components'\nimport { GroupsGroupResource } from '../../types'\nimport { useGroupsGroups } from '../../hooks/use_groups_groups'\nimport { pluralize } from '../../utils'\nimport { RecipientLinkRow } from './components/recipient_link_row'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { ConversationSelectRecipientsScreenProps } from './types/screen_props'\nimport { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row'\n\nexport const ConversationSelectGroupRecipientsScreen = ({\n  route,\n}: ConversationSelectRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const { data: groups = [] } = useGroupsGroups()\n  const groupsWithCreatePermission = groups.filter(g => g.canCreateConversation)\n  const showGroupsDisclaimer = groups.length > groupsWithCreatePermission.length\n\n  const handleNavigateToConversationNew = (group: GroupsGroupResource) => {\n    navigation.navigate('New', {\n      screen: 'ConversationNew',\n      params: {\n        group_id: group.id,\n        source_app_name: 'Groups',\n        ...route.params,\n      },\n    })\n  }\n\n  return (\n    <FlashList\n      data={groupsWithCreatePermission}\n      keyExtractor={item => item.id.toString()}\n      estimatedItemSize={65}\n      contentContainerStyle={styles.contentContainer}\n      ListHeaderComponent={\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">All my groups</Heading>\n        </View>\n      }\n      renderItem={({ item: group }: { item: GroupsGroupResource }) => {\n        const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`\n\n        return (\n          <RecipientLinkRow\n            key={group.id}\n            imageUri={group.headerImage?.thumbnail}\n            title={group.name}\n            subtitle={`${group.membershipsCount} members`}\n            onPress={() => handleNavigateToConversationNew(group)}\n            accessibilityLabel={groupAccessibilityLabel}\n            accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}\n          />\n        )\n      }}\n      ListFooterComponent={showGroupsDisclaimer ? <GroupsWithoutChatDisclaimerRow /> : null}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    contentContainer: {\n      paddingBottom: bottom,\n    },\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      padding: 16,\n      paddingBottom: 4,\n    },\n  })\n}\n"]}
+{"version":3,"file":"conversation_select_group_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_group_recipients_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAA;AACxD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAE1C,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAElE,OAAO,EAAE,8BAA8B,EAAE,MAAM,iDAAiD,CAAA;AAChG,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAA;AAEtE,MAAM,CAAC,MAAM,uCAAuC,GAAG,CAAC,EACtD,KAAK,GACmC,EAAE,EAAE;IAC5C,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,EAAE,EAAE,GAAG,eAAe,EAAE,CAAA;IAC/C,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAA;IAC9E,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,GAAG,0BAA0B,CAAC,MAAM,CAAA;IAE9E,MAAM,+BAA+B,GAAG,CAAC,KAA0B,EAAE,EAAE;QACrE,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE;YACzB,MAAM,EAAE,iBAAiB;YACzB,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK,CAAC,EAAE;gBAClB,eAAe,EAAE,QAAQ;gBACzB,GAAG,KAAK,CAAC,MAAM;aAChB;SACF,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,OAAO,CACL,CAAC,SAAS,CACR,IAAI,CAAC,CAAC,0BAA0B,CAAC,CACjC,YAAY,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,CACzC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CACtB,qBAAqB,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAC/C,mBAAmB,CAAC,CAClB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAChC;UAAA,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,OAAO,CAC9C;QAAA,EAAE,IAAI,CACR,CAAC,CACD,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAiC,EAAE,EAAE;YAC7D,OAAO,CACL,CAAC,kBAAkB,CACjB,GAAG,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CACd,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,OAAO,CAAC,CAAC,+BAA+B,CAAC,EACzC,CACH,CAAA;QACH,CAAC,CAAC,CACF,mBAAmB,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,8BAA8B,CAAC,AAAD,EAAG,CAAC,CAAC,CAAC,IAAI,CAAC,EACtF,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,gBAAgB,EAAE;YAChB,aAAa,EAAE,MAAM;SACtB;QACD,aAAa,EAAE;YACb,aAAa,EAAE,KAAK;YACpB,cAAc,EAAE,eAAe;YAC/B,OAAO,EAAE,EAAE;YACX,aAAa,EAAE,CAAC;SACjB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { FlashList } from '@shopify/flash-list'\nimport { Heading } from '../../components'\nimport { GroupsGroupResource } from '../../types'\nimport { useGroupsGroups } from '../../hooks/use_groups_groups'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { ConversationSelectRecipientsScreenProps } from './types/screen_props'\nimport { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row'\nimport { GroupsRecipientRow } from './components/groups_recipient_row'\n\nexport const ConversationSelectGroupRecipientsScreen = ({\n  route,\n}: ConversationSelectRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const { data: groups = [] } = useGroupsGroups()\n  const groupsWithCreatePermission = groups.filter(g => g.canCreateConversation)\n  const showGroupsDisclaimer = groups.length > groupsWithCreatePermission.length\n\n  const handleNavigateToConversationNew = (group: GroupsGroupResource) => {\n    navigation.navigate('New', {\n      screen: 'ConversationNew',\n      params: {\n        group_id: group.id,\n        source_app_name: 'Groups',\n        ...route.params,\n      },\n    })\n  }\n\n  return (\n    <FlashList\n      data={groupsWithCreatePermission}\n      keyExtractor={item => item.id.toString()}\n      estimatedItemSize={65}\n      contentContainerStyle={styles.contentContainer}\n      ListHeaderComponent={\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">All my groups</Heading>\n        </View>\n      }\n      renderItem={({ item: group }: { item: GroupsGroupResource }) => {\n        return (\n          <GroupsRecipientRow\n            key={group.id}\n            group={group}\n            onPress={handleNavigateToConversationNew}\n          />\n        )\n      }}\n      ListFooterComponent={showGroupsDisclaimer ? <GroupsWithoutChatDisclaimerRow /> : null}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    contentContainer: {\n      paddingBottom: bottom,\n    },\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      padding: 16,\n      paddingBottom: 4,\n    },\n  })\n}\n"]}

package/build/screens/conversation_select_recipients/conversation_select_recipients_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_select_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,EAAE,uCAAuC,EAAE,MAAM,sBAAsB,CAAA;AAK9E,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBAkFzC,CAAA"}
+{"version":3,"file":"conversation_select_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,EAAE,uCAAuC,EAAE,MAAM,sBAAsB,CAAA;AAU9E,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBAyHzC,CAAA"}

package/build/screens/conversation_select_recipients/conversation_select_recipients_screen.js

@@ -3,22 +3,23 @@ import React from 'react';
 import { ScrollView, StyleSheet, View } from 'react-native';
 import { Button, Heading } from '../../components';
 import { useGroupsGroups } from '../../hooks/use_groups_groups';
-import { pluralize } from '../../utils';
-import { RecipientLinkRow } from './components/recipient_link_row';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { ViewMoreLinkRow } from './components/view_more_link_row';
 import { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row';
-const MAX_VISIBLE_GROUPS = 5;
+import { useServiceTypesWithTeams } from '../conversation_filter_recipients/hooks/use_service_types_with_teams';
+import { TeamRecipientRow } from './components/team_recipient_row';
+import { GroupsRecipientRow } from './components/groups_recipient_row';
+const MAX_VISIBLE_RECIPIENTS = 5;
 export const ConversationSelectRecipientsScreen = ({ route, }) => {
     const styles = useStyles();
     const navigation = useNavigation();
     const { data: groups = [] } = useGroupsGroups();
     const groupsWithCreatePermission = groups.filter(g => g.canCreateConversation);
-    const visibleGroups = groupsWithCreatePermission.slice(0, MAX_VISIBLE_GROUPS);
-    const hasMoreGroups = groupsWithCreatePermission.length > MAX_VISIBLE_GROUPS;
+    const visibleGroups = groupsWithCreatePermission.slice(0, MAX_VISIBLE_RECIPIENTS);
+    const hasMoreGroups = groupsWithCreatePermission.length > MAX_VISIBLE_RECIPIENTS;
     const hasGroupsWithoutChatPermission = groups.length > groupsWithCreatePermission.length;
     const showGroupsDisclaimer = hasGroupsWithoutChatPermission && !hasMoreGroups;
-    const handleNavigateToConversationNew = (group) => {
+    const handleGroupsNavigateToConversationNew = (group) => {
         navigation.navigate('New', {
             screen: 'ConversationNew',
             params: {
@@ -36,6 +37,28 @@ export const ConversationSelectRecipientsScreen = ({ route, }) => {
             },
         });
     };
+    const { serviceTypes } = useServiceTypesWithTeams();
+    const visibleServiceTypes = serviceTypes.slice(0, MAX_VISIBLE_RECIPIENTS);
+    const hasMoreServiceTypes = serviceTypes.length > MAX_VISIBLE_RECIPIENTS;
+    const handleTeamsNavigateToConversationNew = (teams) => {
+        const teamIds = teams.map(team => team.id);
+        navigation.navigate('New', {
+            screen: 'ConversationNew',
+            params: {
+                team_ids: teamIds,
+                source_app_name: 'Services',
+                ...route.params,
+            },
+        });
+    };
+    const handleServiceTypesViewMore = () => {
+        navigation.navigate('New', {
+            screen: 'ConversationSelectTeamsILeadRecipients',
+            params: {
+                ...route.params,
+            },
+        });
+    };
     return (<ScrollView contentContainerStyle={styles.contentContainer}>
       <View style={styles.section}>
         <View style={styles.sectionHeader}>
@@ -43,8 +66,7 @@ export const ConversationSelectRecipientsScreen = ({ route, }) => {
         </View>
         <View>
           {visibleGroups.map(group => {
-            const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`;
-            return (<RecipientLinkRow key={group.id} imageUri={group.headerImage?.thumbnail} title={group.name} subtitle={`${group.membershipsCount} members`} onPress={() => handleNavigateToConversationNew(group)} accessibilityLabel={groupAccessibilityLabel} accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}/>);
+            return (<GroupsRecipientRow key={group.id} group={group} onPress={handleGroupsNavigateToConversationNew}/>);
         })}
           {hasMoreGroups && (<ViewMoreLinkRow onPress={handleGroupsViewMore} accessibilityHint="Navigate to a full list of your groups."/>)}
           {showGroupsDisclaimer && <GroupsWithoutChatDisclaimerRow />}
@@ -58,7 +80,13 @@ export const ConversationSelectRecipientsScreen = ({ route, }) => {
             params: {
                 source_app_name: 'Services',
             },
-        })} title="Select teams" variant="outline" iconNameLeft="general.search"/>
+        })} title="Select teams" variant="outline" iconNameLeft="general.search" size="sm"/>
+        </View>
+        <View>
+          {visibleServiceTypes.map(serviceType => {
+            return (<TeamRecipientRow key={serviceType.id} serviceType={serviceType} onPress={handleTeamsNavigateToConversationNew}/>);
+        })}
+          {hasMoreServiceTypes && (<ViewMoreLinkRow onPress={handleServiceTypesViewMore} accessibilityHint="Navigate to a full list of teams you lead."/>)}
         </View>
       </View>
     </ScrollView>);

package/build/screens/conversation_select_recipients/conversation_select_recipients_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_select_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_recipients_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAA;AACxD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC3D,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAElD,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAA;AACjE,OAAO,EAAE,8BAA8B,EAAE,MAAM,iDAAiD,CAAA;AAChG,MAAM,kBAAkB,GAAG,CAAC,CAAA;AAE5B,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAAC,EACjD,KAAK,GACmC,EAAE,EAAE;IAC5C,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,EAAE,EAAE,GAAG,eAAe,EAAE,CAAA;IAC/C,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAA;IAC9E,MAAM,aAAa,GAAG,0BAA0B,CAAC,KAAK,CAAC,CAAC,EAAE,kBAAkB,CAAC,CAAA;IAC7E,MAAM,aAAa,GAAG,0BAA0B,CAAC,MAAM,GAAG,kBAAkB,CAAA;IAC5E,MAAM,8BAA8B,GAAG,MAAM,CAAC,MAAM,GAAG,0BAA0B,CAAC,MAAM,CAAA;IACxF,MAAM,oBAAoB,GAAG,8BAA8B,IAAI,CAAC,aAAa,CAAA;IAE7E,MAAM,+BAA+B,GAAG,CAAC,KAA0B,EAAE,EAAE;QACrE,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE;YACzB,MAAM,EAAE,iBAAiB;YACzB,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK,CAAC,EAAE;gBAClB,eAAe,EAAE,QAAQ;gBACzB,GAAG,KAAK,CAAC,MAAM;aAChB;SACF,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE;YACzB,MAAM,EAAE,mCAAmC;YAC3C,MAAM,EAAE;gBACN,GAAG,KAAK,CAAC,MAAM;aAChB;SACF,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,OAAO,CACL,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CACzD;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAC1B;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAChC;UAAA,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,CAC1C;QAAA,EAAE,IAAI,CACN;QAAA,CAAC,IAAI,CACH;UAAA,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;YACzB,MAAM,uBAAuB,GAAG,UAAU,KAAK,CAAC,IAAI,SAAS,SAAS,CAAC,KAAK,CAAC,gBAAgB,EAAE,QAAQ,CAAC,EAAE,CAAA;YAE1G,OAAO,CACL,CAAC,gBAAgB,CACf,GAAG,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CACd,QAAQ,CAAC,CAAC,KAAK,CAAC,WAAW,EAAE,SAAS,CAAC,CACvC,KAAK,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAClB,QAAQ,CAAC,CAAC,GAAG,KAAK,CAAC,gBAAgB,UAAU,CAAC,CAC9C,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,+BAA+B,CAAC,KAAK,CAAC,CAAC,CACtD,kBAAkB,CAAC,CAAC,uBAAuB,CAAC,CAC5C,iBAAiB,CAAC,CAAC,kGAAkG,CAAC,EACtH,CACH,CAAA;QACH,CAAC,CAAC,CACF;UAAA,CAAC,aAAa,IAAI,CAChB,CAAC,eAAe,CACd,OAAO,CAAC,CAAC,oBAAoB,CAAC,CAC9B,iBAAiB,CAAC,yCAAyC,EAC3D,CACH,CACD;UAAA,CAAC,oBAAoB,IAAI,CAAC,8BAA8B,CAAC,AAAD,EAAG,CAC7D;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,IAAI,CACN;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAC1B;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAChC;UAAA,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,EAAE,OAAO,CAC3C;UAAA,CAAC,MAAM,CACL,KAAK,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAChC,OAAO,CAAC,CAAC,GAAG,EAAE,CACZ,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE;YACzB,MAAM,EAAE,8BAA8B;YACtC,MAAM,EAAE;gBACN,eAAe,EAAE,UAAU;aAC5B;SACF,CACH,CAAC,CACD,KAAK,CAAC,cAAc,CACpB,OAAO,CAAC,SAAS,CACjB,YAAY,CAAC,gBAAgB,EAEjC;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,UAAU,CAAC,CACd,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,gBAAgB,EAAE;YAChB,GAAG,EAAE,EAAE;YACP,UAAU,EAAE,EAAE;YACd,aAAa,EAAE,EAAE,GAAG,MAAM;SAC3B;QACD,OAAO,EAAE;YACP,IAAI,EAAE,CAAC;SACR;QACD,aAAa,EAAE;YACb,aAAa,EAAE,KAAK;YACpB,cAAc,EAAE,eAAe;YAC/B,iBAAiB,EAAE,EAAE;YACrB,aAAa,EAAE,CAAC;SACjB;QACD,iBAAiB,EAAE,EAAE;KACtB,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport React from 'react'\nimport { ScrollView, StyleSheet, View } from 'react-native'\nimport { Button, Heading } from '../../components'\nimport { GroupsGroupResource } from '../../types'\nimport { useGroupsGroups } from '../../hooks/use_groups_groups'\nimport { pluralize } from '../../utils'\nimport { RecipientLinkRow } from './components/recipient_link_row'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { ConversationSelectRecipientsScreenProps } from './types/screen_props'\nimport { ViewMoreLinkRow } from './components/view_more_link_row'\nimport { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row'\nconst MAX_VISIBLE_GROUPS = 5\n\nexport const ConversationSelectRecipientsScreen = ({\n  route,\n}: ConversationSelectRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const { data: groups = [] } = useGroupsGroups()\n  const groupsWithCreatePermission = groups.filter(g => g.canCreateConversation)\n  const visibleGroups = groupsWithCreatePermission.slice(0, MAX_VISIBLE_GROUPS)\n  const hasMoreGroups = groupsWithCreatePermission.length > MAX_VISIBLE_GROUPS\n  const hasGroupsWithoutChatPermission = groups.length > groupsWithCreatePermission.length\n  const showGroupsDisclaimer = hasGroupsWithoutChatPermission && !hasMoreGroups\n\n  const handleNavigateToConversationNew = (group: GroupsGroupResource) => {\n    navigation.navigate('New', {\n      screen: 'ConversationNew',\n      params: {\n        group_id: group.id,\n        source_app_name: 'Groups',\n        ...route.params,\n      },\n    })\n  }\n\n  const handleGroupsViewMore = () => {\n    navigation.navigate('New', {\n      screen: 'ConversationSelectGroupRecipients',\n      params: {\n        ...route.params,\n      },\n    })\n  }\n\n  return (\n    <ScrollView contentContainerStyle={styles.contentContainer}>\n      <View style={styles.section}>\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">My groups</Heading>\n        </View>\n        <View>\n          {visibleGroups.map(group => {\n            const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`\n\n            return (\n              <RecipientLinkRow\n                key={group.id}\n                imageUri={group.headerImage?.thumbnail}\n                title={group.name}\n                subtitle={`${group.membershipsCount} members`}\n                onPress={() => handleNavigateToConversationNew(group)}\n                accessibilityLabel={groupAccessibilityLabel}\n                accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}\n              />\n            )\n          })}\n          {hasMoreGroups && (\n            <ViewMoreLinkRow\n              onPress={handleGroupsViewMore}\n              accessibilityHint=\"Navigate to a full list of your groups.\"\n            />\n          )}\n          {showGroupsDisclaimer && <GroupsWithoutChatDisclaimerRow />}\n        </View>\n      </View>\n      <View style={styles.section}>\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">Teams I lead</Heading>\n          <Button\n            style={styles.selectTeamsButton}\n            onPress={() =>\n              navigation.navigate('New', {\n                screen: 'ConversationFilterRecipients',\n                params: {\n                  source_app_name: 'Services',\n                },\n              })\n            }\n            title=\"Select teams\"\n            variant=\"outline\"\n            iconNameLeft=\"general.search\"\n          />\n        </View>\n      </View>\n    </ScrollView>\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    contentContainer: {\n      gap: 24,\n      paddingTop: 16,\n      paddingBottom: 16 + bottom,\n    },\n    section: {\n      flex: 1,\n    },\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      paddingHorizontal: 16,\n      paddingBottom: 4,\n    },\n    selectTeamsButton: {},\n  })\n}\n"]}
+{"version":3,"file":"conversation_select_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_recipients_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport React from 'react'\nimport { ScrollView, StyleSheet, View } from 'react-native'\nimport { Button, Heading } from '../../components'\nimport { GroupsGroupResource } from '../../types'\nimport { useGroupsGroups } from '../../hooks/use_groups_groups'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { ConversationSelectRecipientsScreenProps } from './types/screen_props'\nimport { ViewMoreLinkRow } from './components/view_more_link_row'\nimport { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row'\nimport { useServiceTypesWithTeams } from '../conversation_filter_recipients/hooks/use_service_types_with_teams'\nimport { ServiceTypeWithTeams } from '../conversation_filter_recipients/types'\nimport { TeamRecipientRow } from './components/team_recipient_row'\nimport { GroupsRecipientRow } from './components/groups_recipient_row'\n\nconst MAX_VISIBLE_RECIPIENTS = 5\n\nexport const ConversationSelectRecipientsScreen = ({\n  route,\n}: ConversationSelectRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n\n  const { data: groups = [] } = useGroupsGroups()\n  const groupsWithCreatePermission = groups.filter(g => g.canCreateConversation)\n  const visibleGroups = groupsWithCreatePermission.slice(0, MAX_VISIBLE_RECIPIENTS)\n  const hasMoreGroups = groupsWithCreatePermission.length > MAX_VISIBLE_RECIPIENTS\n  const hasGroupsWithoutChatPermission = groups.length > groupsWithCreatePermission.length\n  const showGroupsDisclaimer = hasGroupsWithoutChatPermission && !hasMoreGroups\n\n  const handleGroupsNavigateToConversationNew = (group: GroupsGroupResource) => {\n    navigation.navigate('New', {\n      screen: 'ConversationNew',\n      params: {\n        group_id: group.id,\n        source_app_name: 'Groups',\n        ...route.params,\n      },\n    })\n  }\n\n  const handleGroupsViewMore = () => {\n    navigation.navigate('New', {\n      screen: 'ConversationSelectGroupRecipients',\n      params: {\n        ...route.params,\n      },\n    })\n  }\n\n  const { serviceTypes } = useServiceTypesWithTeams()\n  const visibleServiceTypes = serviceTypes.slice(0, MAX_VISIBLE_RECIPIENTS)\n  const hasMoreServiceTypes = serviceTypes.length > MAX_VISIBLE_RECIPIENTS\n\n  const handleTeamsNavigateToConversationNew = (teams: ServiceTypeWithTeams['teams']) => {\n    const teamIds = teams.map(team => team.id)\n\n    navigation.navigate('New', {\n      screen: 'ConversationNew',\n      params: {\n        team_ids: teamIds,\n        source_app_name: 'Services',\n        ...route.params,\n      },\n    })\n  }\n\n  const handleServiceTypesViewMore = () => {\n    navigation.navigate('New', {\n      screen: 'ConversationSelectTeamsILeadRecipients',\n      params: {\n        ...route.params,\n      },\n    })\n  }\n\n  return (\n    <ScrollView contentContainerStyle={styles.contentContainer}>\n      <View style={styles.section}>\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">My groups</Heading>\n        </View>\n        <View>\n          {visibleGroups.map(group => {\n            return (\n              <GroupsRecipientRow\n                key={group.id}\n                group={group}\n                onPress={handleGroupsNavigateToConversationNew}\n              />\n            )\n          })}\n          {hasMoreGroups && (\n            <ViewMoreLinkRow\n              onPress={handleGroupsViewMore}\n              accessibilityHint=\"Navigate to a full list of your groups.\"\n            />\n          )}\n          {showGroupsDisclaimer && <GroupsWithoutChatDisclaimerRow />}\n        </View>\n      </View>\n      <View style={styles.section}>\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">Teams I lead</Heading>\n          <Button\n            style={styles.selectTeamsButton}\n            onPress={() =>\n              navigation.navigate('New', {\n                screen: 'ConversationFilterRecipients',\n                params: {\n                  source_app_name: 'Services',\n                },\n              })\n            }\n            title=\"Select teams\"\n            variant=\"outline\"\n            iconNameLeft=\"general.search\"\n            size=\"sm\"\n          />\n        </View>\n        <View>\n          {visibleServiceTypes.map(serviceType => {\n            return (\n              <TeamRecipientRow\n                key={serviceType.id}\n                serviceType={serviceType}\n                onPress={handleTeamsNavigateToConversationNew}\n              />\n            )\n          })}\n          {hasMoreServiceTypes && (\n            <ViewMoreLinkRow\n              onPress={handleServiceTypesViewMore}\n              accessibilityHint=\"Navigate to a full list of teams you lead.\"\n            />\n          )}\n        </View>\n      </View>\n    </ScrollView>\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    contentContainer: {\n      gap: 24,\n      paddingTop: 16,\n      paddingBottom: 16 + bottom,\n    },\n    section: {\n      flex: 1,\n    },\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      paddingHorizontal: 16,\n      paddingBottom: 4,\n    },\n    selectTeamsButton: {},\n  })\n}\n"]}

package/build/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ConversationSelectRecipientsScreenProps } from './types/screen_props';
+export declare const ConversationSelectTeamsILeadRecipientsScreen: ({ route, }: ConversationSelectRecipientsScreenProps) => React.JSX.Element;
+//# sourceMappingURL=conversation_select_teams_i_lead_recipients_screen.d.ts.map

package/build/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation_select_teams_i_lead_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,EAAE,uCAAuC,EAAE,MAAM,sBAAsB,CAAA;AAK9E,eAAO,MAAM,4CAA4C,eAEtD,uCAAuC,sBAwCzC,CAAA"}

package/build/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.js

@@ -0,0 +1,44 @@
+import { useNavigation } from '@react-navigation/native';
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { FlashList } from '@shopify/flash-list';
+import { Heading } from '../../components';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { useServiceTypesWithTeams } from '../conversation_filter_recipients/hooks/use_service_types_with_teams';
+import { TeamRecipientRow } from './components/team_recipient_row';
+export const ConversationSelectTeamsILeadRecipientsScreen = ({ route, }) => {
+    const styles = useStyles();
+    const navigation = useNavigation();
+    const { serviceTypes } = useServiceTypesWithTeams();
+    const handleNavigateToConversationNew = (teams) => {
+        const teamIds = teams.map(team => team.id);
+        navigation.navigate('New', {
+            screen: 'ConversationNew',
+            params: {
+                team_ids: teamIds,
+                source_app_name: 'Services',
+                ...route.params,
+            },
+        });
+    };
+    return (<FlashList data={serviceTypes} keyExtractor={item => item.id.toString()} estimatedItemSize={65} contentContainerStyle={styles.contentContainer} ListHeaderComponent={<View style={styles.sectionHeader}>
+          <Heading variant="h3">All teams I lead</Heading>
+        </View>} renderItem={({ item: serviceType }) => {
+            return (<TeamRecipientRow key={serviceType.id} serviceType={serviceType} onPress={handleNavigateToConversationNew}/>);
+        }}/>);
+};
+const useStyles = () => {
+    const { bottom } = useSafeAreaInsets();
+    return StyleSheet.create({
+        contentContainer: {
+            paddingBottom: bottom,
+        },
+        sectionHeader: {
+            flexDirection: 'row',
+            justifyContent: 'space-between',
+            padding: 16,
+            paddingBottom: 4,
+        },
+    });
+};
+//# sourceMappingURL=conversation_select_teams_i_lead_recipients_screen.js.map

package/build/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation_select_teams_i_lead_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAA;AACxD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAElE,OAAO,EAAE,wBAAwB,EAAE,MAAM,sEAAsE,CAAA;AAE/G,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AAElE,MAAM,CAAC,MAAM,4CAA4C,GAAG,CAAC,EAC3D,KAAK,GACmC,EAAE,EAAE;IAC5C,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,EAAE,YAAY,EAAE,GAAG,wBAAwB,EAAE,CAAA;IAEnD,MAAM,+BAA+B,GAAG,CAAC,KAAoC,EAAE,EAAE;QAC/E,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;QAE1C,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE;YACzB,MAAM,EAAE,iBAAiB;YACzB,MAAM,EAAE;gBACN,QAAQ,EAAE,OAAO;gBACjB,eAAe,EAAE,UAAU;gBAC3B,GAAG,KAAK,CAAC,MAAM;aAChB;SACF,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,OAAO,CACL,CAAC,SAAS,CACR,IAAI,CAAC,CAAC,YAAY,CAAC,CACnB,YAAY,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,CACzC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CACtB,qBAAqB,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAC/C,mBAAmB,CAAC,CAClB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAChC;UAAA,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAE,OAAO,CACjD;QAAA,EAAE,IAAI,CACR,CAAC,CACD,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,WAAW,EAAkC,EAAE,EAAE;YACpE,OAAO,CACL,CAAC,gBAAgB,CACf,GAAG,CAAC,CAAC,WAAW,CAAC,EAAE,CAAC,CACpB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,OAAO,CAAC,CAAC,+BAA+B,CAAC,EACzC,CACH,CAAA;QACH,CAAC,CAAC,EACF,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,gBAAgB,EAAE;YAChB,aAAa,EAAE,MAAM;SACtB;QACD,aAAa,EAAE;YACb,aAAa,EAAE,KAAK;YACpB,cAAc,EAAE,eAAe;YAC/B,OAAO,EAAE,EAAE;YACX,aAAa,EAAE,CAAC;SACjB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { FlashList } from '@shopify/flash-list'\nimport { Heading } from '../../components'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { ConversationSelectRecipientsScreenProps } from './types/screen_props'\nimport { useServiceTypesWithTeams } from '../conversation_filter_recipients/hooks/use_service_types_with_teams'\nimport { ServiceTypeWithTeams } from '../conversation_filter_recipients/types'\nimport { TeamRecipientRow } from './components/team_recipient_row'\n\nexport const ConversationSelectTeamsILeadRecipientsScreen = ({\n  route,\n}: ConversationSelectRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const { serviceTypes } = useServiceTypesWithTeams()\n\n  const handleNavigateToConversationNew = (teams: ServiceTypeWithTeams['teams']) => {\n    const teamIds = teams.map(team => team.id)\n\n    navigation.navigate('New', {\n      screen: 'ConversationNew',\n      params: {\n        team_ids: teamIds,\n        source_app_name: 'Services',\n        ...route.params,\n      },\n    })\n  }\n\n  return (\n    <FlashList\n      data={serviceTypes}\n      keyExtractor={item => item.id.toString()}\n      estimatedItemSize={65}\n      contentContainerStyle={styles.contentContainer}\n      ListHeaderComponent={\n        <View style={styles.sectionHeader}>\n          <Heading variant=\"h3\">All teams I lead</Heading>\n        </View>\n      }\n      renderItem={({ item: serviceType }: { item: ServiceTypeWithTeams }) => {\n        return (\n          <TeamRecipientRow\n            key={serviceType.id}\n            serviceType={serviceType}\n            onPress={handleNavigateToConversationNew}\n          />\n        )\n      }}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    contentContainer: {\n      paddingBottom: bottom,\n    },\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      padding: 16,\n      paddingBottom: 4,\n    },\n  })\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "3.4.0",
+  "version": "3.4.1-rc.1",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -54,5 +54,5 @@
     "prettier": "^3.4.2",
     "typescript": "<5.6.0"
   },
-  "gitHead": "5c47cfa9c8362e445772bd0e821e500241a1c7d9"
+  "gitHead": "d1c7d24ac64460940d65b763e8903d722aa2ab5e"
 }

package/src/components/conversation/message_form.tsx

@@ -46,6 +46,9 @@ const MessageFormContext = React.createContext<{
   setUsingGiphy: (_usingGiphy: boolean) => {},
 })
 
+const GIPHY_MAX_LENGTH = 50
+const MAX_MESSAGE_LENGTH = 5000
+
 function MessageFormRoot({ conversation, children }: MessagesFormRootProps) {
   const { giphyApiKey } = useContext(ChatContext)
   const canGiphy = !!giphyApiKey
@@ -186,20 +189,24 @@ function MessageFormInput() {
   return (
     <View style={styles.textInputBoundary}>
       <MessageFormAttachments />
-      <View style={styles.textInput}>
+      <View style={styles.textInputRow}>
         {usingGiphy ? (
           <View style={styles.giphyBadge}>
             <Text>/Giphy</Text>
           </View>
         ) : null}
 
-        <TextInput
-          aria-disabled={true}
-          placeholder="Send a message"
-          onChangeText={setText}
-          value={text}
-          onSubmitEditing={onSubmit}
-        />
+        <View style={styles.textInput}>
+          <TextInput
+            multiline={true}
+            aria-disabled={true}
+            placeholder="Send a message"
+            onChangeText={setText}
+            value={text}
+            maxLength={usingGiphy ? GIPHY_MAX_LENGTH : MAX_MESSAGE_LENGTH}
+            onSubmitEditing={onSubmit}
+          />
+        </View>
       </View>
 
       {attachmentError ? <Text style={styles.inputErrorMessage}>{attachmentError}</Text> : null}
@@ -305,7 +312,7 @@ function MessageFormAttachmentPicker() {
 }
 
 function MessageFormCommands() {
-  const { canGiphy, usingGiphy, setUsingGiphy } = React.useContext(MessageFormContext)
+  const { text, canGiphy, usingGiphy, setUsingGiphy } = React.useContext(MessageFormContext)
 
   if (!canGiphy) {
     return null
@@ -330,6 +337,7 @@ function MessageFormCommands() {
       appearance="neutral"
       name={'general.bolt'}
       onPress={() => setUsingGiphy(true)}
+      disabled={text.length > GIPHY_MAX_LENGTH}
     />
   )
 }
@@ -357,10 +365,14 @@ const useMessageFormStyles = () => {
       flex: 1,
       gap: 12,
     },
-    textInput: {
+    textInputRow: {
       flexDirection: 'row',
+      alignItems: 'center',
       gap: 12,
     },
+    textInput: {
+      flex: 1,
+    },
     giphyBadge: {
       backgroundColor: theme.colors.fillColorNeutral050Base,
       borderRadius: 24,

package/src/navigation/index.tsx

@@ -30,6 +30,7 @@ import {
 } from '../screens/conversation_filters_screen'
 import { ConversationFiltersParams } from '../screens/conversation_filters/screen_props'
 import { ConversationSelectGroupRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_group_recipients_screen'
+import { ConversationSelectTeamsILeadRecipientsScreen } from '../screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen'
 
 export const NewConversationStack = createNativeStackNavigator({
   initialRouteName: 'ConversationSelectRecipients',
@@ -64,6 +65,20 @@ export const NewConversationStack = createNativeStackNavigator({
         ),
       }),
     },
+    ConversationSelectTeamsILeadRecipients: {
+      screen: ConversationSelectTeamsILeadRecipientsScreen,
+      options: ({ navigation, route }) => ({
+        title: 'New conversation',
+        headerRight: (props: NativeStackHeaderRightProps) => (
+          <HeaderRightButton
+            {...props}
+            onPress={() => navigation.popTo('Conversations', route.params)}
+          >
+            Cancel
+          </HeaderRightButton>
+        ),
+      }),
+    },
     ConversationFilterRecipients: {
       screen: ConversationFilterRecipientsScreen,
       options: ConversationFilterReceipientsScreenOptions,

package/src/screens/conversation_select_recipients/components/groups_recipient_row.tsx

@@ -0,0 +1,23 @@
+import { GroupsGroupResource } from '../../../types'
+import { pluralize } from '../../../utils'
+import { RecipientLinkRow } from './recipient_link_row'
+
+interface GroupsRecipientRowProps {
+  group: GroupsGroupResource
+  onPress: (group: GroupsGroupResource) => void
+}
+
+export const GroupsRecipientRow = ({ group, onPress }: GroupsRecipientRowProps) => {
+  const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`
+
+  return (
+    <RecipientLinkRow
+      imageUri={group.headerImage?.thumbnail}
+      title={group.name}
+      subtitle={`${group.membershipsCount} members`}
+      onPress={() => onPress(group)}
+      accessibilityLabel={groupAccessibilityLabel}
+      accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}
+    />
+  )
+}

package/src/screens/conversation_select_recipients/components/team_recipient_row.tsx

@@ -0,0 +1,23 @@
+import { pluralize } from '../../../utils'
+import { ServiceTypeWithTeams } from '../../conversation_filter_recipients/types'
+import { RecipientLinkRow } from './recipient_link_row'
+
+interface TeamRecipientRowProps {
+  serviceType: ServiceTypeWithTeams
+  onPress: (teams: ServiceTypeWithTeams['teams']) => void
+}
+
+export const TeamRecipientRow = ({ serviceType, onPress }: TeamRecipientRowProps) => {
+  const serviceTypeAccessibilityLabel = `Select ${pluralize(serviceType.teams.length, 'team')} for ${serviceType.name}`
+  const teamNames = serviceType.teams.map(team => team.name).join(', ')
+
+  return (
+    <RecipientLinkRow
+      title={serviceType.name}
+      subtitle={teamNames}
+      onPress={() => onPress(serviceType.teams)}
+      accessibilityLabel={serviceTypeAccessibilityLabel}
+      accessibilityHint={`Selects Service Type's teams as recipients and navigates to the final screen to finish creating the conversation`}
+    />
+  )
+}

package/src/screens/conversation_select_recipients/conversation_select_group_recipients_screen.tsx

@@ -5,11 +5,10 @@ import { FlashList } from '@shopify/flash-list'
 import { Heading } from '../../components'
 import { GroupsGroupResource } from '../../types'
 import { useGroupsGroups } from '../../hooks/use_groups_groups'
-import { pluralize } from '../../utils'
-import { RecipientLinkRow } from './components/recipient_link_row'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { ConversationSelectRecipientsScreenProps } from './types/screen_props'
 import { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row'
+import { GroupsRecipientRow } from './components/groups_recipient_row'
 
 export const ConversationSelectGroupRecipientsScreen = ({
   route,
@@ -43,17 +42,11 @@ export const ConversationSelectGroupRecipientsScreen = ({
         </View>
       }
       renderItem={({ item: group }: { item: GroupsGroupResource }) => {
-        const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`
-
         return (
-          <RecipientLinkRow
+          <GroupsRecipientRow
             key={group.id}
-            imageUri={group.headerImage?.thumbnail}
-            title={group.name}
-            subtitle={`${group.membershipsCount} members`}
-            onPress={() => handleNavigateToConversationNew(group)}
-            accessibilityLabel={groupAccessibilityLabel}
-            accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}
+            group={group}
+            onPress={handleNavigateToConversationNew}
           />
         )
       }}

package/src/screens/conversation_select_recipients/conversation_select_recipients_screen.tsx

@@ -4,27 +4,31 @@ import { ScrollView, StyleSheet, View } from 'react-native'
 import { Button, Heading } from '../../components'
 import { GroupsGroupResource } from '../../types'
 import { useGroupsGroups } from '../../hooks/use_groups_groups'
-import { pluralize } from '../../utils'
-import { RecipientLinkRow } from './components/recipient_link_row'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { ConversationSelectRecipientsScreenProps } from './types/screen_props'
 import { ViewMoreLinkRow } from './components/view_more_link_row'
 import { GroupsWithoutChatDisclaimerRow } from './components/groups_without_chat_disclaimer_row'
-const MAX_VISIBLE_GROUPS = 5
+import { useServiceTypesWithTeams } from '../conversation_filter_recipients/hooks/use_service_types_with_teams'
+import { ServiceTypeWithTeams } from '../conversation_filter_recipients/types'
+import { TeamRecipientRow } from './components/team_recipient_row'
+import { GroupsRecipientRow } from './components/groups_recipient_row'
+
+const MAX_VISIBLE_RECIPIENTS = 5
 
 export const ConversationSelectRecipientsScreen = ({
   route,
 }: ConversationSelectRecipientsScreenProps) => {
   const styles = useStyles()
   const navigation = useNavigation()
+
   const { data: groups = [] } = useGroupsGroups()
   const groupsWithCreatePermission = groups.filter(g => g.canCreateConversation)
-  const visibleGroups = groupsWithCreatePermission.slice(0, MAX_VISIBLE_GROUPS)
-  const hasMoreGroups = groupsWithCreatePermission.length > MAX_VISIBLE_GROUPS
+  const visibleGroups = groupsWithCreatePermission.slice(0, MAX_VISIBLE_RECIPIENTS)
+  const hasMoreGroups = groupsWithCreatePermission.length > MAX_VISIBLE_RECIPIENTS
   const hasGroupsWithoutChatPermission = groups.length > groupsWithCreatePermission.length
   const showGroupsDisclaimer = hasGroupsWithoutChatPermission && !hasMoreGroups
 
-  const handleNavigateToConversationNew = (group: GroupsGroupResource) => {
+  const handleGroupsNavigateToConversationNew = (group: GroupsGroupResource) => {
     navigation.navigate('New', {
       screen: 'ConversationNew',
       params: {
@@ -44,6 +48,32 @@ export const ConversationSelectRecipientsScreen = ({
     })
   }
 
+  const { serviceTypes } = useServiceTypesWithTeams()
+  const visibleServiceTypes = serviceTypes.slice(0, MAX_VISIBLE_RECIPIENTS)
+  const hasMoreServiceTypes = serviceTypes.length > MAX_VISIBLE_RECIPIENTS
+
+  const handleTeamsNavigateToConversationNew = (teams: ServiceTypeWithTeams['teams']) => {
+    const teamIds = teams.map(team => team.id)
+
+    navigation.navigate('New', {
+      screen: 'ConversationNew',
+      params: {
+        team_ids: teamIds,
+        source_app_name: 'Services',
+        ...route.params,
+      },
+    })
+  }
+
+  const handleServiceTypesViewMore = () => {
+    navigation.navigate('New', {
+      screen: 'ConversationSelectTeamsILeadRecipients',
+      params: {
+        ...route.params,
+      },
+    })
+  }
+
   return (
     <ScrollView contentContainerStyle={styles.contentContainer}>
       <View style={styles.section}>
@@ -52,17 +82,11 @@ export const ConversationSelectRecipientsScreen = ({
         </View>
         <View>
           {visibleGroups.map(group => {
-            const groupAccessibilityLabel = `Select ${group.name} with ${pluralize(group.membershipsCount, 'member')}`
-
             return (
-              <RecipientLinkRow
+              <GroupsRecipientRow
                 key={group.id}
-                imageUri={group.headerImage?.thumbnail}
-                title={group.name}
-                subtitle={`${group.membershipsCount} members`}
-                onPress={() => handleNavigateToConversationNew(group)}
-                accessibilityLabel={groupAccessibilityLabel}
-                accessibilityHint={`Selects group as recipient and navigates to the final screen to finish creating the conversation`}
+                group={group}
+                onPress={handleGroupsNavigateToConversationNew}
               />
             )
           })}
@@ -91,8 +115,26 @@ export const ConversationSelectRecipientsScreen = ({
             title="Select teams"
             variant="outline"
             iconNameLeft="general.search"
+            size="sm"
           />
         </View>
+        <View>
+          {visibleServiceTypes.map(serviceType => {
+            return (
+              <TeamRecipientRow
+                key={serviceType.id}
+                serviceType={serviceType}
+                onPress={handleTeamsNavigateToConversationNew}
+              />
+            )
+          })}
+          {hasMoreServiceTypes && (
+            <ViewMoreLinkRow
+              onPress={handleServiceTypesViewMore}
+              accessibilityHint="Navigate to a full list of teams you lead."
+            />
+          )}
+        </View>
       </View>
     </ScrollView>
   )

package/src/screens/conversation_select_recipients/conversation_select_teams_i_lead_recipients_screen.tsx

@@ -0,0 +1,70 @@
+import { useNavigation } from '@react-navigation/native'
+import React from 'react'
+import { StyleSheet, View } from 'react-native'
+import { FlashList } from '@shopify/flash-list'
+import { Heading } from '../../components'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
+import { ConversationSelectRecipientsScreenProps } from './types/screen_props'
+import { useServiceTypesWithTeams } from '../conversation_filter_recipients/hooks/use_service_types_with_teams'
+import { ServiceTypeWithTeams } from '../conversation_filter_recipients/types'
+import { TeamRecipientRow } from './components/team_recipient_row'
+
+export const ConversationSelectTeamsILeadRecipientsScreen = ({
+  route,
+}: ConversationSelectRecipientsScreenProps) => {
+  const styles = useStyles()
+  const navigation = useNavigation()
+  const { serviceTypes } = useServiceTypesWithTeams()
+
+  const handleNavigateToConversationNew = (teams: ServiceTypeWithTeams['teams']) => {
+    const teamIds = teams.map(team => team.id)
+
+    navigation.navigate('New', {
+      screen: 'ConversationNew',
+      params: {
+        team_ids: teamIds,
+        source_app_name: 'Services',
+        ...route.params,
+      },
+    })
+  }
+
+  return (
+    <FlashList
+      data={serviceTypes}
+      keyExtractor={item => item.id.toString()}
+      estimatedItemSize={65}
+      contentContainerStyle={styles.contentContainer}
+      ListHeaderComponent={
+        <View style={styles.sectionHeader}>
+          <Heading variant="h3">All teams I lead</Heading>
+        </View>
+      }
+      renderItem={({ item: serviceType }: { item: ServiceTypeWithTeams }) => {
+        return (
+          <TeamRecipientRow
+            key={serviceType.id}
+            serviceType={serviceType}
+            onPress={handleNavigateToConversationNew}
+          />
+        )
+      }}
+    />
+  )
+}
+
+const useStyles = () => {
+  const { bottom } = useSafeAreaInsets()
+
+  return StyleSheet.create({
+    contentContainer: {
+      paddingBottom: bottom,
+    },
+    sectionHeader: {
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      padding: 16,
+      paddingBottom: 4,
+    },
+  })
+}