@planningcenter/chat-react-native 3.12.2 → 3.12.3-rc.0

package/build/screens/conversation/message_read_receipts_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_read_receipts_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation/message_read_receipts_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAC3E,OAAO,KAAe,MAAM,OAAO,CAAA;AAUnC,eAAO,MAAM,gCAAgC,uEAM3C,CAAA;AAEF,MAAM,MAAM,8BAA8B,GAAG,iBAAiB,CAAC;IAC7D,eAAe,EAAE,MAAM,CAAA;IACvB,UAAU,EAAE,MAAM,CAAA;CACnB,CAAC,CAAA;AAEF,wBAAgB,yBAAyB,CAAC,EAAE,KAAK,EAAE,EAAE,8BAA8B,qBAiClF"}
+{"version":3,"file":"message_read_receipts_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation/message_read_receipts_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAC3E,OAAO,KAA+C,MAAM,OAAO,CAAA;AAYnE,eAAO,MAAM,gCAAgC,uEAM3C,CAAA;AAEF,MAAM,MAAM,8BAA8B,GAAG,iBAAiB,CAAC;IAC7D,eAAe,EAAE,MAAM,CAAA;IACvB,UAAU,EAAE,MAAM,CAAA;CACnB,CAAC,CAAA;AAEF,wBAAgB,yBAAyB,CAAC,EAAE,KAAK,EAAE,EAAE,8BAA8B,qBAmDlF"}

package/build/screens/conversation/message_read_receipts_screen.js

@@ -1,5 +1,5 @@
 import { useNavigation } from '@react-navigation/native';
-import React, { memo } from 'react';
+import React, { memo, useCallback, useMemo, useState } from 'react';
 import { Platform, StyleSheet, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { Avatar, Text } from '../../components';
@@ -7,6 +7,7 @@ import { useReadReceipts } from '../../hooks/use_read_receipts';
 import { FlatList } from 'react-native-gesture-handler';
 import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet';
 import { useTheme } from '../../hooks';
+const LIST_BOTTOM_PADDING = 24;
 export const MessageReadReceiptsScreenOptions = getFormSheetScreenOptions({
     sheetAllowedDetents: Platform.select({
         android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android
@@ -17,18 +18,31 @@ export const MessageReadReceiptsScreenOptions = getFormSheetScreenOptions({
 export function MessageReadReceiptsScreen({ route }) {
     const styles = useStyles();
     const navigation = useNavigation();
+    const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(0);
+    const { bottom } = useSafeAreaInsets();
     const { conversation_id, message_id } = route.params;
     const { data: receipts, totalCount, fetchNextPage, } = useReadReceipts({ conversation_id, message_id });
+    const contentContainerPaddingBottomStyles = useMemo(() => {
+        return Platform.select({
+            android: { paddingBottom: bottom + LIST_BOTTOM_PADDING },
+            default: { paddingBottom: bottom + formSheetHeaderHeight + LIST_BOTTOM_PADDING },
+        });
+    }, [bottom, formSheetHeaderHeight]);
+    const handleFormSheetHeaderLayout = useCallback((event) => {
+        setFormSheetHeaderHeight(event.nativeEvent.layout.height);
+    }, [setFormSheetHeaderHeight]);
     return (<FormSheet.Root>
-      <FormSheet.Header>
-        <FormSheet.HeaderTitle>Read receipts ({totalCount})</FormSheet.HeaderTitle>
-        <FormSheet.HeaderActions>
-          <FormSheet.HeaderTextButton onPress={() => navigation.goBack()}>
-            Close
-          </FormSheet.HeaderTextButton>
-        </FormSheet.HeaderActions>
-      </FormSheet.Header>
-      <FlatList data={receipts} contentContainerStyle={styles.contentContainer} keyExtractor={item => item.id.toString()} renderItem={({ item }) => <Receipt receipt={item}/>} nestedScrollEnabled ListEmptyComponent={<Text style={styles.emptyText}>No one has read this message yet.</Text>} onEndReached={() => fetchNextPage()} onEndReachedThreshold={0.2}/>
+      <View onLayout={handleFormSheetHeaderLayout}>
+        <FormSheet.Header>
+          <FormSheet.HeaderTitle>Read receipts ({totalCount})</FormSheet.HeaderTitle>
+          <FormSheet.HeaderActions>
+            <FormSheet.HeaderTextButton onPress={() => navigation.goBack()}>
+              Close
+            </FormSheet.HeaderTextButton>
+          </FormSheet.HeaderActions>
+        </FormSheet.Header>
+      </View>
+      <FlatList data={receipts} contentContainerStyle={[styles.contentContainer, contentContainerPaddingBottomStyles]} keyExtractor={item => item.id.toString()} renderItem={({ item }) => <Receipt receipt={item}/>} nestedScrollEnabled ListEmptyComponent={<Text style={styles.emptyText}>No one has read this message yet.</Text>} onEndReached={() => fetchNextPage()} onEndReachedThreshold={0.2}/>
     </FormSheet.Root>);
 }
 const Receipt = memo(({ receipt }) => {
@@ -41,13 +55,11 @@ const Receipt = memo(({ receipt }) => {
     </View>);
 });
 const useStyles = () => {
-    const { bottom } = useSafeAreaInsets();
     const { colors } = useTheme();
     return StyleSheet.create({
         contentContainer: {
             paddingHorizontal: 16,
             paddingTop: 8,
-            paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
         },
         receiptRow: {
             flexDirection: 'row',

package/build/screens/conversation/message_read_receipts_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_read_receipts_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation/message_read_receipts_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps, useNavigation } from '@react-navigation/native'\nimport React, { memo } from 'react'\nimport { Platform, StyleSheet, View } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Avatar, Text } from '../../components'\nimport { useReadReceipts } from '../../hooks/use_read_receipts'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { ReadReceiptResource } from '../../types/resources/read_receipt'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useTheme } from '../../hooks'\n\nexport const MessageReadReceiptsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android\n    default: [0.5, 1],\n  }),\n  headerTitle: 'Read receipts',\n})\n\nexport type MessageReadReceiptsScreenProps = StaticScreenProps<{\n  conversation_id: number\n  message_id: string\n}>\n\nexport function MessageReadReceiptsScreen({ route }: MessageReadReceiptsScreenProps) {\n  const styles = useStyles()\n  const navigation = useNavigation()\n\n  const { conversation_id, message_id } = route.params\n  const {\n    data: receipts,\n    totalCount,\n    fetchNextPage,\n  } = useReadReceipts({ conversation_id, message_id })\n\n  return (\n    <FormSheet.Root>\n      <FormSheet.Header>\n        <FormSheet.HeaderTitle>Read receipts ({totalCount})</FormSheet.HeaderTitle>\n        <FormSheet.HeaderActions>\n          <FormSheet.HeaderTextButton onPress={() => navigation.goBack()}>\n            Close\n          </FormSheet.HeaderTextButton>\n        </FormSheet.HeaderActions>\n      </FormSheet.Header>\n      <FlatList\n        data={receipts}\n        contentContainerStyle={styles.contentContainer}\n        keyExtractor={item => item.id.toString()}\n        renderItem={({ item }) => <Receipt receipt={item} />}\n        nestedScrollEnabled\n        ListEmptyComponent={<Text style={styles.emptyText}>No one has read this message yet.</Text>}\n        onEndReached={() => fetchNextPage()}\n        onEndReachedThreshold={0.2}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst Receipt = memo(({ receipt }: { receipt: ReadReceiptResource }) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.receiptRow}>\n      <Avatar sourceUri={receipt.avatar} size=\"sm\" />\n      <Text variant=\"tertiary\" numberOfLines={2} style={styles.name}>\n        {receipt.name}\n      </Text>\n    </View>\n  )\n})\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    contentContainer: {\n      paddingHorizontal: 16,\n      paddingTop: 8,\n      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),\n    },\n    receiptRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n      paddingVertical: 8,\n      flex: 1,\n    },\n    name: {\n      flex: 1,\n    },\n    emptyText: {\n      textAlign: 'center',\n      color: colors.textColorDefaultSecondary,\n      marginTop: 32,\n      fontSize: 16,\n    },\n    emptyContainer: {\n      flex: 1,\n      justifyContent: 'center',\n    },\n  })\n}\n"]}
+{"version":3,"file":"message_read_receipts_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation/message_read_receipts_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps, useNavigation } from '@react-navigation/native'\nimport React, { memo, useCallback, useMemo, useState } from 'react'\nimport { LayoutChangeEvent, Platform, StyleSheet, View } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Avatar, Text } from '../../components'\nimport { useReadReceipts } from '../../hooks/use_read_receipts'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { ReadReceiptResource } from '../../types/resources/read_receipt'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useTheme } from '../../hooks'\n\nconst LIST_BOTTOM_PADDING = 24\n\nexport const MessageReadReceiptsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android\n    default: [0.5, 1],\n  }),\n  headerTitle: 'Read receipts',\n})\n\nexport type MessageReadReceiptsScreenProps = StaticScreenProps<{\n  conversation_id: number\n  message_id: string\n}>\n\nexport function MessageReadReceiptsScreen({ route }: MessageReadReceiptsScreenProps) {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(0)\n  const { bottom } = useSafeAreaInsets()\n\n  const { conversation_id, message_id } = route.params\n  const {\n    data: receipts,\n    totalCount,\n    fetchNextPage,\n  } = useReadReceipts({ conversation_id, message_id })\n\n  const contentContainerPaddingBottomStyles = useMemo(() => {\n    return Platform.select({\n      android: { paddingBottom: bottom + LIST_BOTTOM_PADDING },\n      default: { paddingBottom: bottom + formSheetHeaderHeight + LIST_BOTTOM_PADDING },\n    })\n  }, [bottom, formSheetHeaderHeight])\n\n  const handleFormSheetHeaderLayout = useCallback(\n    (event: LayoutChangeEvent) => {\n      setFormSheetHeaderHeight(event.nativeEvent.layout.height)\n    },\n    [setFormSheetHeaderHeight]\n  )\n\n  return (\n    <FormSheet.Root>\n      <View onLayout={handleFormSheetHeaderLayout}>\n        <FormSheet.Header>\n          <FormSheet.HeaderTitle>Read receipts ({totalCount})</FormSheet.HeaderTitle>\n          <FormSheet.HeaderActions>\n            <FormSheet.HeaderTextButton onPress={() => navigation.goBack()}>\n              Close\n            </FormSheet.HeaderTextButton>\n          </FormSheet.HeaderActions>\n        </FormSheet.Header>\n      </View>\n      <FlatList\n        data={receipts}\n        contentContainerStyle={[styles.contentContainer, contentContainerPaddingBottomStyles]}\n        keyExtractor={item => item.id.toString()}\n        renderItem={({ item }) => <Receipt receipt={item} />}\n        nestedScrollEnabled\n        ListEmptyComponent={<Text style={styles.emptyText}>No one has read this message yet.</Text>}\n        onEndReached={() => fetchNextPage()}\n        onEndReachedThreshold={0.2}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst Receipt = memo(({ receipt }: { receipt: ReadReceiptResource }) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.receiptRow}>\n      <Avatar sourceUri={receipt.avatar} size=\"sm\" />\n      <Text variant=\"tertiary\" numberOfLines={2} style={styles.name}>\n        {receipt.name}\n      </Text>\n    </View>\n  )\n})\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  return StyleSheet.create({\n    contentContainer: {\n      paddingHorizontal: 16,\n      paddingTop: 8,\n    },\n    receiptRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n      paddingVertical: 8,\n      flex: 1,\n    },\n    name: {\n      flex: 1,\n    },\n    emptyText: {\n      textAlign: 'center',\n      color: colors.textColorDefaultSecondary,\n      marginTop: 32,\n      fontSize: 16,\n    },\n    emptyContainer: {\n      flex: 1,\n      justifyContent: 'center',\n    },\n  })\n}\n"]}

package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filter_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAY7D,OAAO,EAAE,uCAAuC,EAAiC,MAAM,SAAS,CAAA;AAKhG,eAAO,MAAM,0CAA0C,uEAMrD,CAAA;AAEF,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBAiHzC,CAAA"}
+{"version":3,"file":"conversation_filter_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAY7D,OAAO,EAAE,uCAAuC,EAAiC,MAAM,SAAS,CAAA;AAMhG,eAAO,MAAM,0CAA0C,uEAMrD,CAAA;AAEF,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBAsHzC,CAAA"}

package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js

@@ -14,6 +14,7 @@ import { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams';
 import { SectionTypes, TeamFilterTypes } from './types';
 import { DefaultLoading } from '../../components/page/loading';
 const SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-';
+const SPACE_UNDER_ROW = 16;
 export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({
     sheetAllowedDetents: Platform.select({
         android: [0.75, 0.94],
@@ -24,9 +25,11 @@ export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOpti
 export const ConversationFilterRecipientsScreen = ({ route, }) => {
     const styles = useStyles();
     // Set the height of the container to accommodate the team filters
-    const [teamFiltersHeight, setTeamFiltersHeight] = useState(200);
-    const { top, bottom } = useSafeAreaInsets();
-    const listContainerStyle = useMemo(() => Platform.select({ ios: { paddingBottom: teamFiltersHeight + bottom + top } }), [teamFiltersHeight, bottom, top]);
+    const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(200);
+    const { bottom } = useSafeAreaInsets();
+    const listContainerStyle = useMemo(() => Platform.select({
+        ios: { paddingBottom: formSheetHeaderHeight + bottom + SPACE_UNDER_ROW },
+    }), [formSheetHeaderHeight, bottom]);
     const navigation = useNavigation();
     const { team_ids: teamIds } = route.params;
     const { params } = route;
@@ -56,20 +59,22 @@ export const ConversationFilterRecipientsScreen = ({ route, }) => {
     const applyTeamFilters = useCallback(() => {
         navigation.dispatch(StackActions.popTo('ConversationNew', params));
     }, [navigation, params]);
-    const handleTeamFiltersLayout = useCallback((event) => {
-        setTeamFiltersHeight(event.nativeEvent.layout.height);
+    const handleFormSheetHeaderLayout = useCallback((event) => {
+        setFormSheetHeaderHeight(event.nativeEvent.layout.height);
     }, []);
     return (<FormSheet.Root style={styles.root}>
-      <FormSheet.Header style={styles.header}>
-        <FormSheet.HeaderTitle>{headerTitle}</FormSheet.HeaderTitle>
-        <FormSheet.HeaderActions>
-          <FormSheet.HeaderTextButton onPress={resetTeamFilters} accessibilityHint="Cancels any selected teams and closes this modal.">
-            Cancel
-          </FormSheet.HeaderTextButton>
-          <FormSheet.HeaderButton title="Apply" accessibilityHint={applyButtonAccessibilityHint} onPress={applyTeamFilters} disabled={noTeamsSelected}/>
-        </FormSheet.HeaderActions>
-      </FormSheet.Header>
-      <TeamFilters onLayout={handleTeamFiltersLayout}/>
+      <View onLayout={handleFormSheetHeaderLayout}>
+        <FormSheet.Header style={styles.header}>
+          <FormSheet.HeaderTitle>{headerTitle}</FormSheet.HeaderTitle>
+          <FormSheet.HeaderActions>
+            <FormSheet.HeaderTextButton onPress={resetTeamFilters} accessibilityHint="Cancels any selected teams and closes this modal.">
+              Cancel
+            </FormSheet.HeaderTextButton>
+            <FormSheet.HeaderButton title="Apply" accessibilityHint={applyButtonAccessibilityHint} onPress={applyTeamFilters} disabled={noTeamsSelected}/>
+          </FormSheet.HeaderActions>
+        </FormSheet.Header>
+        <TeamFilters />
+      </View>
       <FlatList data={data} ListHeaderComponent={<Heading variant="h3" style={styles.listHeader}>
             Service Types
           </Heading>} contentContainerStyle={[styles.listContentContainer, listContainerStyle]} keyExtractor={item => `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`} ListEmptyComponent={isFetched ? <BlankState title="No teams found"/> : <DefaultLoading />} renderItem={({ item }) => {
@@ -134,7 +139,7 @@ const useStyles = () => {
         lastRow: {
             borderBottomStartRadius: tokens.borderRadiusLg,
             borderBottomEndRadius: tokens.borderRadiusLg,
-            marginBottom: 16,
+            marginBottom: SPACE_UNDER_ROW,
         },
         teamFiltersContainer: {
             gap: 12,

package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filter_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'\nimport { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { useCallback, useMemo, useState } from 'react'\nimport { LayoutChangeEvent, Platform, StyleSheet, View } from 'react-native'\nimport { FlatList, TextInput } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { BlankState, Heading, ToggleButton } from '../../components'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useTheme } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { CheckboxRow } from './components/checkbox_row'\nimport { HeaderRow } from './components/header_row'\nimport { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams'\nimport { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams'\nimport { ConversationFilterRecipientsScreenProps, SectionTypes, TeamFilterTypes } from './types'\nimport { DefaultLoading } from '../../components/page/loading'\n\nconst SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-'\n\nexport const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.75, 0.94],\n    default: [0.75, 1],\n  }),\n  headerTitle: 'Teams I lead',\n})\n\nexport const ConversationFilterRecipientsScreen = ({\n  route,\n}: ConversationFilterRecipientsScreenProps) => {\n  const styles = useStyles()\n\n  // Set the height of the container to accommodate the team filters\n  const [teamFiltersHeight, setTeamFiltersHeight] = useState(200)\n  const { top, bottom } = useSafeAreaInsets()\n  const listContainerStyle = useMemo(\n    () => Platform.select({ ios: { paddingBottom: teamFiltersHeight + bottom + top } }),\n    [teamFiltersHeight, bottom, top]\n  )\n\n  const navigation =\n    useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n  const { team_ids: teamIds } = route.params\n  const { params } = route\n  const teamIdCount = Number(teamIds?.length)\n  const headerTitle = useMemo(() => {\n    return teamIdCount >= 1 ? `Selected teams (${teamIdCount})` : 'Select teams'\n  }, [teamIdCount])\n\n  const { serviceTypes, isFetched } = useServiceTypesWithTeams({\n    filterType: params.team_filter_type,\n    searchQuery: params.search_query,\n  })\n  const data = useFlattenedArrayOfServiceTypesWithTeams({\n    data: serviceTypes,\n    firstRowStyle: styles.firstRow,\n    lastRowStyle: styles.lastRow,\n  })\n\n  const noTeamsSelected = params.team_ids?.length === 0 || !params.team_ids\n  const applyButtonAccessibilityHint = noTeamsSelected\n    ? 'Select at least one team to navigate to the final step in creating your conversation.'\n    : 'Saves selected teams and navigates to the final step to create your conversation.'\n\n  const setTeamFilters = useCallback(\n    ({ team_ids }: { team_ids: number[] }) => {\n      navigation.setParams({ team_ids })\n    },\n    [navigation]\n  )\n\n  const resetTeamFilters = useCallback(() => {\n    navigation.goBack()\n  }, [navigation])\n\n  const applyTeamFilters = useCallback(() => {\n    navigation.dispatch(StackActions.popTo('ConversationNew', params))\n  }, [navigation, params])\n\n  const handleTeamFiltersLayout = useCallback((event: LayoutChangeEvent) => {\n    setTeamFiltersHeight(event.nativeEvent.layout.height)\n  }, [])\n\n  return (\n    <FormSheet.Root style={styles.root}>\n      <FormSheet.Header style={styles.header}>\n        <FormSheet.HeaderTitle>{headerTitle}</FormSheet.HeaderTitle>\n        <FormSheet.HeaderActions>\n          <FormSheet.HeaderTextButton\n            onPress={resetTeamFilters}\n            accessibilityHint=\"Cancels any selected teams and closes this modal.\"\n          >\n            Cancel\n          </FormSheet.HeaderTextButton>\n          <FormSheet.HeaderButton\n            title=\"Apply\"\n            accessibilityHint={applyButtonAccessibilityHint}\n            onPress={applyTeamFilters}\n            disabled={noTeamsSelected}\n          />\n        </FormSheet.HeaderActions>\n      </FormSheet.Header>\n      <TeamFilters onLayout={handleTeamFiltersLayout} />\n      <FlatList\n        data={data}\n        ListHeaderComponent={\n          <Heading variant=\"h3\" style={styles.listHeader}>\n            Service Types\n          </Heading>\n        }\n        contentContainerStyle={[styles.listContentContainer, listContainerStyle]}\n        keyExtractor={item =>\n          `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`\n        }\n        ListEmptyComponent={isFetched ? <BlankState title=\"No teams found\" /> : <DefaultLoading />}\n        renderItem={({ item }) => {\n          switch (item.type) {\n            case SectionTypes.header:\n              return (\n                <HeaderRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            case SectionTypes.team:\n              return (\n                <CheckboxRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            default:\n              return null\n          }\n        }}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst TeamFilters = ({ onLayout }: { onLayout?: (event: LayoutChangeEvent) => void }) => {\n  const styles = useStyles()\n  const { colors } = useTheme()\n  const navigation =\n    useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n  const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()\n  const { params } = route\n\n  const active = params.team_filter_type || TeamFilterTypes.TeamsIlead\n\n  const handleFilterChange = useCallback(\n    (filter: TeamFilterTypes) => {\n      navigation.setParams({\n        team_filter_type: filter,\n        team_ids: [],\n      })\n    },\n    [navigation]\n  )\n\n  return (\n    <View style={styles.teamFiltersContainer} onLayout={onLayout}>\n      <TextInput\n        defaultValue={params.search_query}\n        placeholder=\"Search teams\"\n        placeholderTextColor={colors.textColorDefaultPlaceholder}\n        style={styles.searchInput}\n        onChangeText={text => {\n          navigation.setParams({\n            search_query: text,\n          })\n        }}\n      />\n      <View style={styles.filterToggleContainer}>\n        <ToggleButton\n          active={active === TeamFilterTypes.TeamsIlead}\n          title={TeamFilterTypes.TeamsIlead}\n          accessibilityLabel=\"Show all teams I lead\"\n          onPress={() => handleFilterChange(TeamFilterTypes.TeamsIlead)}\n        />\n        <ToggleButton\n          active={active === TeamFilterTypes.MyTeams}\n          title={TeamFilterTypes.MyTeams}\n          accessibilityLabel=\"Show all my teams\"\n          onPress={() => handleFilterChange(TeamFilterTypes.MyTeams)}\n        />\n        <ToggleButton\n          active={active === TeamFilterTypes.All}\n          title={TeamFilterTypes.All}\n          accessibilityLabel=\"Show all teams\"\n          onPress={() => handleFilterChange(TeamFilterTypes.All)}\n        />\n      </View>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    root: {\n      backgroundColor: colors.surfaceColor080,\n    },\n    header: {\n      borderBottomWidth: 0,\n    },\n    listContentContainer: {\n      padding: 16,\n      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),\n    },\n    listHeader: {\n      paddingBottom: 16,\n    },\n    firstRow: {\n      borderTopStartRadius: tokens.borderRadiusLg,\n      borderTopEndRadius: tokens.borderRadiusLg,\n    },\n    lastRow: {\n      borderBottomStartRadius: tokens.borderRadiusLg,\n      borderBottomEndRadius: tokens.borderRadiusLg,\n      marginBottom: 16,\n    },\n    teamFiltersContainer: {\n      gap: 12,\n      paddingHorizontal: 16,\n      paddingBottom: 28,\n      backgroundColor: colors.fillColorNeutral100Inverted,\n      borderBottomWidth: 1,\n      borderBottomColor: colors.borderColorDefaultBase,\n    },\n    filterToggleContainer: {\n      flexDirection: 'row',\n      gap: 8,\n    },\n    searchInput: {\n      paddingVertical: 16,\n      paddingHorizontal: 16,\n      color: colors.textColorDefaultPrimary,\n      textAlignVertical: 'center',\n      justifyContent: 'center',\n      fontSize: 16,\n      borderWidth: 1,\n      borderColor: colors.borderColorDefaultBase,\n      borderRadius: 24,\n      backgroundColor: colors.fillColorNeutral100Inverted,\n    },\n  })\n}\n"]}
+{"version":3,"file":"conversation_filter_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'\nimport { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { useCallback, useMemo, useState } from 'react'\nimport { LayoutChangeEvent, Platform, StyleSheet, View } from 'react-native'\nimport { FlatList, TextInput } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { BlankState, Heading, ToggleButton } from '../../components'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useTheme } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { CheckboxRow } from './components/checkbox_row'\nimport { HeaderRow } from './components/header_row'\nimport { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams'\nimport { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams'\nimport { ConversationFilterRecipientsScreenProps, SectionTypes, TeamFilterTypes } from './types'\nimport { DefaultLoading } from '../../components/page/loading'\n\nconst SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-'\nconst SPACE_UNDER_ROW = 16\n\nexport const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.75, 0.94],\n    default: [0.75, 1],\n  }),\n  headerTitle: 'Teams I lead',\n})\n\nexport const ConversationFilterRecipientsScreen = ({\n  route,\n}: ConversationFilterRecipientsScreenProps) => {\n  const styles = useStyles()\n\n  // Set the height of the container to accommodate the team filters\n  const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(200)\n  const { bottom } = useSafeAreaInsets()\n  const listContainerStyle = useMemo(\n    () =>\n      Platform.select({\n        ios: { paddingBottom: formSheetHeaderHeight + bottom + SPACE_UNDER_ROW },\n      }),\n    [formSheetHeaderHeight, bottom]\n  )\n\n  const navigation =\n    useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n  const { team_ids: teamIds } = route.params\n  const { params } = route\n  const teamIdCount = Number(teamIds?.length)\n  const headerTitle = useMemo(() => {\n    return teamIdCount >= 1 ? `Selected teams (${teamIdCount})` : 'Select teams'\n  }, [teamIdCount])\n\n  const { serviceTypes, isFetched } = useServiceTypesWithTeams({\n    filterType: params.team_filter_type,\n    searchQuery: params.search_query,\n  })\n  const data = useFlattenedArrayOfServiceTypesWithTeams({\n    data: serviceTypes,\n    firstRowStyle: styles.firstRow,\n    lastRowStyle: styles.lastRow,\n  })\n\n  const noTeamsSelected = params.team_ids?.length === 0 || !params.team_ids\n  const applyButtonAccessibilityHint = noTeamsSelected\n    ? 'Select at least one team to navigate to the final step in creating your conversation.'\n    : 'Saves selected teams and navigates to the final step to create your conversation.'\n\n  const setTeamFilters = useCallback(\n    ({ team_ids }: { team_ids: number[] }) => {\n      navigation.setParams({ team_ids })\n    },\n    [navigation]\n  )\n\n  const resetTeamFilters = useCallback(() => {\n    navigation.goBack()\n  }, [navigation])\n\n  const applyTeamFilters = useCallback(() => {\n    navigation.dispatch(StackActions.popTo('ConversationNew', params))\n  }, [navigation, params])\n\n  const handleFormSheetHeaderLayout = useCallback((event: LayoutChangeEvent) => {\n    setFormSheetHeaderHeight(event.nativeEvent.layout.height)\n  }, [])\n\n  return (\n    <FormSheet.Root style={styles.root}>\n      <View onLayout={handleFormSheetHeaderLayout}>\n        <FormSheet.Header style={styles.header}>\n          <FormSheet.HeaderTitle>{headerTitle}</FormSheet.HeaderTitle>\n          <FormSheet.HeaderActions>\n            <FormSheet.HeaderTextButton\n              onPress={resetTeamFilters}\n              accessibilityHint=\"Cancels any selected teams and closes this modal.\"\n            >\n              Cancel\n            </FormSheet.HeaderTextButton>\n            <FormSheet.HeaderButton\n              title=\"Apply\"\n              accessibilityHint={applyButtonAccessibilityHint}\n              onPress={applyTeamFilters}\n              disabled={noTeamsSelected}\n            />\n          </FormSheet.HeaderActions>\n        </FormSheet.Header>\n        <TeamFilters />\n      </View>\n      <FlatList\n        data={data}\n        ListHeaderComponent={\n          <Heading variant=\"h3\" style={styles.listHeader}>\n            Service Types\n          </Heading>\n        }\n        contentContainerStyle={[styles.listContentContainer, listContainerStyle]}\n        keyExtractor={item =>\n          `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`\n        }\n        ListEmptyComponent={isFetched ? <BlankState title=\"No teams found\" /> : <DefaultLoading />}\n        renderItem={({ item }) => {\n          switch (item.type) {\n            case SectionTypes.header:\n              return (\n                <HeaderRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            case SectionTypes.team:\n              return (\n                <CheckboxRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            default:\n              return null\n          }\n        }}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst TeamFilters = ({ onLayout }: { onLayout?: (event: LayoutChangeEvent) => void }) => {\n  const styles = useStyles()\n  const { colors } = useTheme()\n  const navigation =\n    useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n  const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()\n  const { params } = route\n\n  const active = params.team_filter_type || TeamFilterTypes.TeamsIlead\n\n  const handleFilterChange = useCallback(\n    (filter: TeamFilterTypes) => {\n      navigation.setParams({\n        team_filter_type: filter,\n        team_ids: [],\n      })\n    },\n    [navigation]\n  )\n\n  return (\n    <View style={styles.teamFiltersContainer} onLayout={onLayout}>\n      <TextInput\n        defaultValue={params.search_query}\n        placeholder=\"Search teams\"\n        placeholderTextColor={colors.textColorDefaultPlaceholder}\n        style={styles.searchInput}\n        onChangeText={text => {\n          navigation.setParams({\n            search_query: text,\n          })\n        }}\n      />\n      <View style={styles.filterToggleContainer}>\n        <ToggleButton\n          active={active === TeamFilterTypes.TeamsIlead}\n          title={TeamFilterTypes.TeamsIlead}\n          accessibilityLabel=\"Show all teams I lead\"\n          onPress={() => handleFilterChange(TeamFilterTypes.TeamsIlead)}\n        />\n        <ToggleButton\n          active={active === TeamFilterTypes.MyTeams}\n          title={TeamFilterTypes.MyTeams}\n          accessibilityLabel=\"Show all my teams\"\n          onPress={() => handleFilterChange(TeamFilterTypes.MyTeams)}\n        />\n        <ToggleButton\n          active={active === TeamFilterTypes.All}\n          title={TeamFilterTypes.All}\n          accessibilityLabel=\"Show all teams\"\n          onPress={() => handleFilterChange(TeamFilterTypes.All)}\n        />\n      </View>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    root: {\n      backgroundColor: colors.surfaceColor080,\n    },\n    header: {\n      borderBottomWidth: 0,\n    },\n    listContentContainer: {\n      padding: 16,\n      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),\n    },\n    listHeader: {\n      paddingBottom: 16,\n    },\n    firstRow: {\n      borderTopStartRadius: tokens.borderRadiusLg,\n      borderTopEndRadius: tokens.borderRadiusLg,\n    },\n    lastRow: {\n      borderBottomStartRadius: tokens.borderRadiusLg,\n      borderBottomEndRadius: tokens.borderRadiusLg,\n      marginBottom: SPACE_UNDER_ROW,\n    },\n    teamFiltersContainer: {\n      gap: 12,\n      paddingHorizontal: 16,\n      paddingBottom: 28,\n      backgroundColor: colors.fillColorNeutral100Inverted,\n      borderBottomWidth: 1,\n      borderBottomColor: colors.borderColorDefaultBase,\n    },\n    filterToggleContainer: {\n      flexDirection: 'row',\n      gap: 8,\n    },\n    searchInput: {\n      paddingVertical: 16,\n      paddingHorizontal: 16,\n      color: colors.textColorDefaultPrimary,\n      textAlignVertical: 'center',\n      justifyContent: 'center',\n      fontSize: 16,\n      borderWidth: 1,\n      borderColor: colors.borderColorDefaultBase,\n      borderRadius: 24,\n      backgroundColor: colors.fillColorNeutral100Inverted,\n    },\n  })\n}\n"]}

package/build/screens/conversation_filters/components/conversation_filters.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filters.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/components/conversation_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAoDlD,eAAO,MAAM,mBAAmB,yBAgH/B,CAAA"}
+{"version":3,"file":"conversation_filters.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/components/conversation_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAmDlD,eAAO,MAAM,mBAAmB,yBAgH/B,CAAA"}

package/build/screens/conversation_filters/components/conversation_filters.js

@@ -1,10 +1,9 @@
 import React, { useContext, useMemo } from 'react';
-import { Platform, StyleSheet, View } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 import { FlatList } from 'react-native-gesture-handler';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { Heading } from '../../../components';
 import { useTheme } from '../../../hooks';
-import { FilterContext } from '../context/conversation_filter_context';
+import { FilterContext, useFilterContext } from '../context/conversation_filter_context';
 import { FilterTypes } from '../filter_types';
 import { useGroupsToFilter, useTeamsToFilter } from '../hooks/filters';
 import { FilterRow, GroupRow, TeamRow, ViewMore, } from './rows';
@@ -122,14 +121,11 @@ export const ConversationFilters = () => {
         }}/>);
 };
 const useStyles = () => {
-    const { bottom } = useSafeAreaInsets();
+    const { platformListPaddingBottom } = useFilterContext();
     const theme = useTheme();
     return StyleSheet.create({
         flatlistContainer: {
-            paddingBottom: Platform.select({
-                ios: 64 + bottom,
-                android: 16 + bottom,
-            }),
+            paddingBottom: platformListPaddingBottom,
         },
         section: {},
         sectionHeader: {

package/build/screens/conversation_filters/components/conversation_filters.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filters.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/components/conversation_filters.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useMemo } from 'react'\nimport { Platform, StyleSheet, View, ViewStyle } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Heading } from '../../../components'\nimport { useTheme } from '../../../hooks'\nimport { FilterContext } from '../context/conversation_filter_context'\nimport { FilterTypes } from '../filter_types'\nimport { useGroupsToFilter, useTeamsToFilter } from '../hooks/filters'\nimport {\n  FilterProps,\n  FilterRow,\n  GroupRow,\n  GroupRowProps,\n  TeamRow,\n  TeamRowProps,\n  ViewMore,\n  ViewMoreRowProps,\n} from './rows'\n\n// =========================================\n// ====== Factory Constants & Types ========\n// =========================================\n\nenum SectionTypes {\n  filter,\n  groups,\n  header,\n  hidden,\n  more,\n  teams,\n}\n\ntype SectionListData = Array<\n  | DataItem<FilterProps, SectionTypes.filter>\n  | DataItem<GroupRowProps, SectionTypes.groups>\n  | DataItem<HeaderProps, SectionTypes.header>\n  | DataItem<any, SectionTypes.hidden>\n  | DataItem<ViewMoreRowProps, SectionTypes.more>\n  | DataItem<TeamRowProps, SectionTypes.teams>\n>\n\ninterface DataItem<T, TName extends SectionTypes> {\n  type: TName\n  data: T\n  sectionStyle?: ViewStyle\n}\n\n// =================================\n// ====== Components ===============\n// =================================\n\nexport const ConversationFilters = () => {\n  const styles = useStyles()\n  const { setScrollOffset, params } = useContext(FilterContext)\n  const { chat_group_graph_id, group_source_app_name = '' } = params\n\n  const activeFilter: FilterTypes = useMemo(() => {\n    if (chat_group_graph_id) {\n      return FilterTypes.More\n    } else if (/groups/i.test(group_source_app_name)) {\n      return FilterTypes.Groups\n    } else if (/services/i.test(group_source_app_name)) {\n      return FilterTypes.Teams\n    }\n\n    return FilterTypes.All\n  }, [chat_group_graph_id, group_source_app_name])\n\n  const { groups = [] } = useGroupsToFilter()\n  const { teams = [] } = useTeamsToFilter()\n\n  const activeGroupId = chat_group_graph_id\n  const isExactGroupFilter = activeFilter === FilterTypes.More\n\n  const teamItems: DataItem<TeamRowProps, SectionTypes.teams>[] = teams.map(team => ({\n    type: SectionTypes.teams,\n    data: {\n      team,\n      isActive: isExactGroupFilter && team.id.toString() === activeGroupId,\n    },\n  }))\n\n  const groupItems: DataItem<GroupRowProps, SectionTypes.groups>[] = groups.map(group => ({\n    type: SectionTypes.groups,\n    data: {\n      group,\n      isActive: isExactGroupFilter && group?.id.toString() === activeGroupId,\n    },\n  }))\n  const groupItemData = selectActiveWithFirst(5)(groupItems)\n  const teamItemData = selectActiveWithFirst(5)(teamItems)\n\n  const hideAppFilters = groupItems.length < 1 || teamItems.length < 1\n\n  const listData: SectionListData = [\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.header,\n      data: { title: 'General Filters' },\n    },\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.filter,\n      data: { filter: FilterTypes.All, isActive: activeFilter === FilterTypes.All },\n    },\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.filter,\n      data: {\n        filter: FilterTypes.Groups,\n        group_source_app_name: 'groups',\n        isActive: activeFilter === FilterTypes.Groups,\n      },\n    },\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.filter,\n      data: {\n        filter: FilterTypes.Teams,\n        group_source_app_name: 'services',\n        isActive: activeFilter === FilterTypes.Teams,\n      },\n    },\n    {\n      type: groupItems.length ? SectionTypes.header : SectionTypes.hidden,\n      data: { title: 'Groups' },\n    },\n    ...groupItemData,\n    {\n      type: groupItems.length > 5 ? SectionTypes.more : SectionTypes.hidden,\n      data: { routeName: 'GroupFilters' },\n    },\n    {\n      type: teamItems.length ? SectionTypes.header : SectionTypes.hidden,\n      data: { title: 'Teams' },\n    },\n    ...teamItemData,\n    {\n      type: teamItems.length > 5 ? SectionTypes.more : SectionTypes.hidden,\n      data: { routeName: 'TeamFilters' },\n    },\n  ]\n\n  return (\n    <FlatList\n      data={listData}\n      contentContainerStyle={styles.flatlistContainer}\n      nestedScrollEnabled={true}\n      onScroll={e => setScrollOffset(e.nativeEvent.contentOffset.y)}\n      renderItem={({ item }) => {\n        switch (item.type) {\n          case SectionTypes.header:\n            return <Header {...item.data} />\n          case SectionTypes.filter:\n            return <FilterRow {...item.data} />\n          case SectionTypes.groups:\n            return <GroupRow {...item.data} />\n          case SectionTypes.teams:\n            return <TeamRow {...item.data} />\n          case SectionTypes.more:\n            return <ViewMore {...item.data} />\n          default:\n            return null\n        }\n      }}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n  const theme = useTheme()\n\n  return StyleSheet.create({\n    flatlistContainer: {\n      paddingBottom: Platform.select({\n        ios: 64 + bottom,\n        android: 16 + bottom,\n      }),\n    },\n    section: {},\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      paddingTop: 24,\n      paddingBottom: 8,\n      paddingHorizontal: 16,\n    },\n    selectTeamsButton: {},\n    filterBar: {\n      backgroundColor: theme.colors.fillColorNeutral100Inverted,\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      paddingHorizontal: 16,\n      paddingVertical: 16,\n      gap: 8,\n    },\n    filterBarScroll: {\n      elevation: 4,\n      boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.1)',\n    },\n    filterBarActions: {\n      flexDirection: 'row',\n      gap: 8,\n      alignItems: 'center',\n    },\n  })\n}\n\ntype HeaderProps = {\n  title: string\n}\n\nconst Header = ({ title }: HeaderProps) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.sectionHeader}>\n      <Heading variant=\"h3\">{title}</Heading>\n    </View>\n  )\n}\n\ntype GroupSectionType =\n  | DataItem<TeamRowProps, SectionTypes.teams>\n  | DataItem<GroupRowProps, SectionTypes.groups>\n\nconst selectActiveWithFirst =\n  (number: number) =>\n  <T extends GroupSectionType>(groups: T[]): T[] => {\n    const activeGroupIndex = groups.findIndex(group => group.data.isActive)\n    const activeGroup = groups[activeGroupIndex]\n\n    if (!activeGroup || activeGroupIndex <= number) {\n      return groups.slice(0, number)\n    }\n\n    return [activeGroup, ...groups].slice(0, number)\n  }\n"]}
+{"version":3,"file":"conversation_filters.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/components/conversation_filters.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useMemo } from 'react'\nimport { StyleSheet, View, ViewStyle } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Heading } from '../../../components'\nimport { useTheme } from '../../../hooks'\nimport { FilterContext, useFilterContext } from '../context/conversation_filter_context'\nimport { FilterTypes } from '../filter_types'\nimport { useGroupsToFilter, useTeamsToFilter } from '../hooks/filters'\nimport {\n  FilterProps,\n  FilterRow,\n  GroupRow,\n  GroupRowProps,\n  TeamRow,\n  TeamRowProps,\n  ViewMore,\n  ViewMoreRowProps,\n} from './rows'\n\n// =========================================\n// ====== Factory Constants & Types ========\n// =========================================\n\nenum SectionTypes {\n  filter,\n  groups,\n  header,\n  hidden,\n  more,\n  teams,\n}\n\ntype SectionListData = Array<\n  | DataItem<FilterProps, SectionTypes.filter>\n  | DataItem<GroupRowProps, SectionTypes.groups>\n  | DataItem<HeaderProps, SectionTypes.header>\n  | DataItem<any, SectionTypes.hidden>\n  | DataItem<ViewMoreRowProps, SectionTypes.more>\n  | DataItem<TeamRowProps, SectionTypes.teams>\n>\n\ninterface DataItem<T, TName extends SectionTypes> {\n  type: TName\n  data: T\n  sectionStyle?: ViewStyle\n}\n\n// =================================\n// ====== Components ===============\n// =================================\n\nexport const ConversationFilters = () => {\n  const styles = useStyles()\n  const { setScrollOffset, params } = useContext(FilterContext)\n  const { chat_group_graph_id, group_source_app_name = '' } = params\n\n  const activeFilter: FilterTypes = useMemo(() => {\n    if (chat_group_graph_id) {\n      return FilterTypes.More\n    } else if (/groups/i.test(group_source_app_name)) {\n      return FilterTypes.Groups\n    } else if (/services/i.test(group_source_app_name)) {\n      return FilterTypes.Teams\n    }\n\n    return FilterTypes.All\n  }, [chat_group_graph_id, group_source_app_name])\n\n  const { groups = [] } = useGroupsToFilter()\n  const { teams = [] } = useTeamsToFilter()\n\n  const activeGroupId = chat_group_graph_id\n  const isExactGroupFilter = activeFilter === FilterTypes.More\n\n  const teamItems: DataItem<TeamRowProps, SectionTypes.teams>[] = teams.map(team => ({\n    type: SectionTypes.teams,\n    data: {\n      team,\n      isActive: isExactGroupFilter && team.id.toString() === activeGroupId,\n    },\n  }))\n\n  const groupItems: DataItem<GroupRowProps, SectionTypes.groups>[] = groups.map(group => ({\n    type: SectionTypes.groups,\n    data: {\n      group,\n      isActive: isExactGroupFilter && group?.id.toString() === activeGroupId,\n    },\n  }))\n  const groupItemData = selectActiveWithFirst(5)(groupItems)\n  const teamItemData = selectActiveWithFirst(5)(teamItems)\n\n  const hideAppFilters = groupItems.length < 1 || teamItems.length < 1\n\n  const listData: SectionListData = [\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.header,\n      data: { title: 'General Filters' },\n    },\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.filter,\n      data: { filter: FilterTypes.All, isActive: activeFilter === FilterTypes.All },\n    },\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.filter,\n      data: {\n        filter: FilterTypes.Groups,\n        group_source_app_name: 'groups',\n        isActive: activeFilter === FilterTypes.Groups,\n      },\n    },\n    {\n      type: hideAppFilters ? SectionTypes.hidden : SectionTypes.filter,\n      data: {\n        filter: FilterTypes.Teams,\n        group_source_app_name: 'services',\n        isActive: activeFilter === FilterTypes.Teams,\n      },\n    },\n    {\n      type: groupItems.length ? SectionTypes.header : SectionTypes.hidden,\n      data: { title: 'Groups' },\n    },\n    ...groupItemData,\n    {\n      type: groupItems.length > 5 ? SectionTypes.more : SectionTypes.hidden,\n      data: { routeName: 'GroupFilters' },\n    },\n    {\n      type: teamItems.length ? SectionTypes.header : SectionTypes.hidden,\n      data: { title: 'Teams' },\n    },\n    ...teamItemData,\n    {\n      type: teamItems.length > 5 ? SectionTypes.more : SectionTypes.hidden,\n      data: { routeName: 'TeamFilters' },\n    },\n  ]\n\n  return (\n    <FlatList\n      data={listData}\n      contentContainerStyle={styles.flatlistContainer}\n      nestedScrollEnabled={true}\n      onScroll={e => setScrollOffset(e.nativeEvent.contentOffset.y)}\n      renderItem={({ item }) => {\n        switch (item.type) {\n          case SectionTypes.header:\n            return <Header {...item.data} />\n          case SectionTypes.filter:\n            return <FilterRow {...item.data} />\n          case SectionTypes.groups:\n            return <GroupRow {...item.data} />\n          case SectionTypes.teams:\n            return <TeamRow {...item.data} />\n          case SectionTypes.more:\n            return <ViewMore {...item.data} />\n          default:\n            return null\n        }\n      }}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { platformListPaddingBottom } = useFilterContext()\n  const theme = useTheme()\n\n  return StyleSheet.create({\n    flatlistContainer: {\n      paddingBottom: platformListPaddingBottom,\n    },\n    section: {},\n    sectionHeader: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      paddingTop: 24,\n      paddingBottom: 8,\n      paddingHorizontal: 16,\n    },\n    selectTeamsButton: {},\n    filterBar: {\n      backgroundColor: theme.colors.fillColorNeutral100Inverted,\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      paddingHorizontal: 16,\n      paddingVertical: 16,\n      gap: 8,\n    },\n    filterBarScroll: {\n      elevation: 4,\n      boxShadow: '0px 4px 4px rgba(0, 0, 0, 0.1)',\n    },\n    filterBarActions: {\n      flexDirection: 'row',\n      gap: 8,\n      alignItems: 'center',\n    },\n  })\n}\n\ntype HeaderProps = {\n  title: string\n}\n\nconst Header = ({ title }: HeaderProps) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.sectionHeader}>\n      <Heading variant=\"h3\">{title}</Heading>\n    </View>\n  )\n}\n\ntype GroupSectionType =\n  | DataItem<TeamRowProps, SectionTypes.teams>\n  | DataItem<GroupRowProps, SectionTypes.groups>\n\nconst selectActiveWithFirst =\n  (number: number) =>\n  <T extends GroupSectionType>(groups: T[]): T[] => {\n    const activeGroupIndex = groups.findIndex(group => group.data.isActive)\n    const activeGroup = groups[activeGroupIndex]\n\n    if (!activeGroup || activeGroupIndex <= number) {\n      return groups.slice(0, number)\n    }\n\n    return [activeGroup, ...groups].slice(0, number)\n  }\n"]}

package/build/screens/conversation_filters/context/conversation_filter_context.d.ts

@@ -5,19 +5,23 @@ export declare const FilterContext: React.Context<{
     params: ConversationFiltersParams;
     scrollOffset: number;
     setScrollOffset: (offset: number) => void;
+    setFormSheetHeaderHeight: (height: number) => void;
     resetFilter: () => void;
     setGroupFilter: (params: ConversationFiltersParams) => void;
     setAppFilter: (params: ConversationFiltersParams) => void;
     applyFilters: (params: ConversationFiltersParams) => void;
+    platformListPaddingBottom: number | undefined;
 }>;
 export declare const FilterProvider: ({ children }: PropsWithChildren) => React.JSX.Element;
 export declare const useFilterContext: () => {
     params: ConversationFiltersParams;
     scrollOffset: number;
     setScrollOffset: (offset: number) => void;
+    setFormSheetHeaderHeight: (height: number) => void;
     resetFilter: () => void;
     setGroupFilter: (params: ConversationFiltersParams) => void;
     setAppFilter: (params: ConversationFiltersParams) => void;
     applyFilters: (params: ConversationFiltersParams) => void;
+    platformListPaddingBottom: number | undefined;
 };
 //# sourceMappingURL=conversation_filter_context.d.ts.map

package/build/screens/conversation_filters/context/conversation_filter_context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filter_context.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/context/conversation_filter_context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAiB,iBAAiB,EAAY,MAAM,OAAO,CAAA;AAClE,OAAO,EAAE,yBAAyB,EAAkC,MAAM,iBAAiB,CAAA;AAG3F,eAAO,MAAM,aAAa;YAChB,yBAAyB;kBACnB,MAAM;qBACH,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI;iBAC5B,MAAM,IAAI;oBACP,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC7C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC3C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;EAYzD,CAAA;AAEF,eAAO,MAAM,cAAc,iBAAkB,iBAAiB,sBAkC7D,CAAA;AAED,eAAO,MAAM,gBAAgB;YAxDnB,yBAAyB;kBACnB,MAAM;qBACH,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI;iBAC5B,MAAM,IAAI;oBACP,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC7C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC3C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;CAoD1D,CAAA"}
+{"version":3,"file":"conversation_filter_context.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/context/conversation_filter_context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAiB,iBAAiB,EAAY,MAAM,OAAO,CAAA;AAClE,OAAO,EAAE,yBAAyB,EAAkC,MAAM,iBAAiB,CAAA;AAO3F,eAAO,MAAM,aAAa;YAChB,yBAAyB;kBACnB,MAAM;qBACH,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI;8BACf,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI;iBACrC,MAAM,IAAI;oBACP,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC7C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC3C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;+BAC9B,MAAM,GAAG,SAAS;EAc7C,CAAA;AAEF,eAAO,MAAM,cAAc,iBAAkB,iBAAiB,sBA4C7D,CAAA;AAED,eAAO,MAAM,gBAAgB;YAtEnB,yBAAyB;kBACnB,MAAM;qBACH,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI;8BACf,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI;iBACrC,MAAM,IAAI;oBACP,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC7C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;kBAC3C,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI;+BAC9B,MAAM,GAAG,SAAS;CAgE9C,CAAA"}

package/build/screens/conversation_filters/context/conversation_filter_context.js

@@ -1,6 +1,9 @@
 import React from 'react';
 import { createContext, useState } from 'react';
 import { StackActions, useNavigation, useRoute } from '@react-navigation/native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { Platform } from 'react-native';
+const DEFAULT_LIST_PADDING_BOTTOM = 64;
 export const FilterContext = createContext({
     params: {
         chat_group_graph_id: undefined,
@@ -8,19 +11,29 @@ export const FilterContext = createContext({
     },
     scrollOffset: 0,
     setScrollOffset: () => { },
+    setFormSheetHeaderHeight: () => { },
     resetFilter: () => { },
     setGroupFilter: () => { },
     setAppFilter: () => { },
     applyFilters: () => { },
+    platformListPaddingBottom: DEFAULT_LIST_PADDING_BOTTOM,
 });
 export const FilterProvider = ({ children }) => {
     const [scrollOffset, setScrollOffset] = useState(0);
+    const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(56);
     const navigation = useNavigation();
     const route = useRoute();
+    const { bottom } = useSafeAreaInsets();
+    const platformListPaddingBottom = Platform.select({
+        ios: bottom + formSheetHeaderHeight,
+        android: bottom + 12,
+    });
     const filterContextValue = {
         params: route.params,
         scrollOffset,
         setScrollOffset,
+        platformListPaddingBottom,
+        setFormSheetHeaderHeight,
         resetFilter: () => {
             navigation.dispatch(StackActions.popTo('Conversations', {
                 chat_group_graph_id: undefined,

package/build/screens/conversation_filters/context/conversation_filter_context.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filter_context.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/context/conversation_filter_context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,aAAa,EAAqB,QAAQ,EAAE,MAAM,OAAO,CAAA;AAElE,OAAO,EAAa,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAE3F,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAQvC;IACD,MAAM,EAAE;QACN,mBAAmB,EAAE,SAAS;QAC9B,qBAAqB,EAAE,SAAS;KACjC;IACD,YAAY,EAAE,CAAC;IACf,eAAe,EAAE,GAAG,EAAE,GAAE,CAAC;IACzB,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;IACrB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;CACvB,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAqB,EAAE,EAAE;IAChE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IACnD,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,KAAK,GAAG,QAAQ,EAAsD,CAAA;IAC5E,MAAM,kBAAkB,GAAG;QACzB,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,YAAY;QACZ,eAAe;QACf,WAAW,EAAE,GAAG,EAAE;YAChB,UAAU,CAAC,QAAQ,CACjB,YAAY,CAAC,KAAK,CAAC,eAAe,EAAE;gBAClC,mBAAmB,EAAE,SAAS;gBAC9B,qBAAqB,EAAE,SAAS;aACjC,CAAC,CACH,CAAA;QACH,CAAC;QACD,cAAc,EAAE,CAAC,MAAgE,EAAE,EAAE;YACnF,UAAU,CAAC,SAAS,CAAC;gBACnB,mBAAmB,EAAE,MAAM,CAAC,mBAAmB;gBAC/C,qBAAqB,EAAE,SAAS;aACjC,CAAC,CAAA;QACJ,CAAC;QACD,YAAY,EAAE,CAAC,MAA8D,EAAE,EAAE;YAC/E,UAAU,CAAC,SAAS,CAAC;gBACnB,mBAAmB,EAAE,SAAS;gBAC9B,qBAAqB,EAAE,MAAM,CAAC,qBAAqB;aACpD,CAAC,CAAA;QACJ,CAAC;QACD,YAAY,EAAE,CAAC,MAAiC,EAAE,EAAE;YAClD,UAAU,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAA;QAClE,CAAC;KACF,CAAA;IAED,OAAO,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAA;AAC/F,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,OAAO,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAA;AACxC,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { createContext, PropsWithChildren, useState } from 'react'\nimport { ConversationFiltersParams, ConversationFiltersScreenProps } from '../screen_props'\nimport { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'\n\nexport const FilterContext = createContext<{\n  params: ConversationFiltersParams\n  scrollOffset: number\n  setScrollOffset: (offset: number) => void\n  resetFilter: () => void\n  setGroupFilter: (params: ConversationFiltersParams) => void\n  setAppFilter: (params: ConversationFiltersParams) => void\n  applyFilters: (params: ConversationFiltersParams) => void\n}>({\n  params: {\n    chat_group_graph_id: undefined,\n    group_source_app_name: undefined,\n  },\n  scrollOffset: 0,\n  setScrollOffset: () => {},\n  resetFilter: () => {},\n  setGroupFilter: () => {},\n  setAppFilter: () => {},\n  applyFilters: () => {},\n})\n\nexport const FilterProvider = ({ children }: PropsWithChildren) => {\n  const [scrollOffset, setScrollOffset] = useState(0)\n  const navigation = useNavigation()\n  const route = useRoute<RouteProp<ConversationFiltersScreenProps['route']>>()\n  const filterContextValue = {\n    params: route.params,\n    scrollOffset,\n    setScrollOffset,\n    resetFilter: () => {\n      navigation.dispatch(\n        StackActions.popTo('Conversations', {\n          chat_group_graph_id: undefined,\n          group_source_app_name: undefined,\n        })\n      )\n    },\n    setGroupFilter: (params: Omit<ConversationFiltersParams, 'group_source_app_name'>) => {\n      navigation.setParams({\n        chat_group_graph_id: params.chat_group_graph_id,\n        group_source_app_name: undefined,\n      })\n    },\n    setAppFilter: (params: Omit<ConversationFiltersParams, 'chat_group_graph_id'>) => {\n      navigation.setParams({\n        chat_group_graph_id: undefined,\n        group_source_app_name: params.group_source_app_name,\n      })\n    },\n    applyFilters: (params: ConversationFiltersParams) => {\n      navigation.dispatch(StackActions.popTo('Conversations', params))\n    },\n  }\n\n  return <FilterContext.Provider value={filterContextValue}>{children}</FilterContext.Provider>\n}\n\nexport const useFilterContext = () => {\n  return React.useContext(FilterContext)\n}\n"]}
+{"version":3,"file":"conversation_filter_context.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filters/context/conversation_filter_context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,aAAa,EAAqB,QAAQ,EAAE,MAAM,OAAO,CAAA;AAElE,OAAO,EAAa,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAC3F,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAEvC,MAAM,2BAA2B,GAAG,EAAE,CAAA;AAEtC,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAUvC;IACD,MAAM,EAAE;QACN,mBAAmB,EAAE,SAAS;QAC9B,qBAAqB,EAAE,SAAS;KACjC;IACD,YAAY,EAAE,CAAC;IACf,eAAe,EAAE,GAAG,EAAE,GAAE,CAAC;IACzB,wBAAwB,EAAE,GAAG,EAAE,GAAE,CAAC;IAClC,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;IACrB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,yBAAyB,EAAE,2BAA2B;CACvD,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAqB,EAAE,EAAE;IAChE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IACnD,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IACtE,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,KAAK,GAAG,QAAQ,EAAsD,CAAA;IAC5E,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,MAAM,yBAAyB,GAAG,QAAQ,CAAC,MAAM,CAAC;QAChD,GAAG,EAAE,MAAM,GAAG,qBAAqB;QACnC,OAAO,EAAE,MAAM,GAAG,EAAE;KACrB,CAAC,CAAA;IAEF,MAAM,kBAAkB,GAAG;QACzB,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,YAAY;QACZ,eAAe;QACf,yBAAyB;QACzB,wBAAwB;QACxB,WAAW,EAAE,GAAG,EAAE;YAChB,UAAU,CAAC,QAAQ,CACjB,YAAY,CAAC,KAAK,CAAC,eAAe,EAAE;gBAClC,mBAAmB,EAAE,SAAS;gBAC9B,qBAAqB,EAAE,SAAS;aACjC,CAAC,CACH,CAAA;QACH,CAAC;QACD,cAAc,EAAE,CAAC,MAAgE,EAAE,EAAE;YACnF,UAAU,CAAC,SAAS,CAAC;gBACnB,mBAAmB,EAAE,MAAM,CAAC,mBAAmB;gBAC/C,qBAAqB,EAAE,SAAS;aACjC,CAAC,CAAA;QACJ,CAAC;QACD,YAAY,EAAE,CAAC,MAA8D,EAAE,EAAE;YAC/E,UAAU,CAAC,SAAS,CAAC;gBACnB,mBAAmB,EAAE,SAAS;gBAC9B,qBAAqB,EAAE,MAAM,CAAC,qBAAqB;aACpD,CAAC,CAAA;QACJ,CAAC;QACD,YAAY,EAAE,CAAC,MAAiC,EAAE,EAAE;YAClD,UAAU,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAA;QAClE,CAAC;KACF,CAAA;IAED,OAAO,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAA;AAC/F,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,OAAO,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAA;AACxC,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { createContext, PropsWithChildren, useState } from 'react'\nimport { ConversationFiltersParams, ConversationFiltersScreenProps } from '../screen_props'\nimport { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Platform } from 'react-native'\n\nconst DEFAULT_LIST_PADDING_BOTTOM = 64\n\nexport const FilterContext = createContext<{\n  params: ConversationFiltersParams\n  scrollOffset: number\n  setScrollOffset: (offset: number) => void\n  setFormSheetHeaderHeight: (height: number) => void\n  resetFilter: () => void\n  setGroupFilter: (params: ConversationFiltersParams) => void\n  setAppFilter: (params: ConversationFiltersParams) => void\n  applyFilters: (params: ConversationFiltersParams) => void\n  platformListPaddingBottom: number | undefined\n}>({\n  params: {\n    chat_group_graph_id: undefined,\n    group_source_app_name: undefined,\n  },\n  scrollOffset: 0,\n  setScrollOffset: () => {},\n  setFormSheetHeaderHeight: () => {},\n  resetFilter: () => {},\n  setGroupFilter: () => {},\n  setAppFilter: () => {},\n  applyFilters: () => {},\n  platformListPaddingBottom: DEFAULT_LIST_PADDING_BOTTOM,\n})\n\nexport const FilterProvider = ({ children }: PropsWithChildren) => {\n  const [scrollOffset, setScrollOffset] = useState(0)\n  const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(56)\n  const navigation = useNavigation()\n  const route = useRoute<RouteProp<ConversationFiltersScreenProps['route']>>()\n  const { bottom } = useSafeAreaInsets()\n\n  const platformListPaddingBottom = Platform.select({\n    ios: bottom + formSheetHeaderHeight,\n    android: bottom + 12,\n  })\n\n  const filterContextValue = {\n    params: route.params,\n    scrollOffset,\n    setScrollOffset,\n    platformListPaddingBottom,\n    setFormSheetHeaderHeight,\n    resetFilter: () => {\n      navigation.dispatch(\n        StackActions.popTo('Conversations', {\n          chat_group_graph_id: undefined,\n          group_source_app_name: undefined,\n        })\n      )\n    },\n    setGroupFilter: (params: Omit<ConversationFiltersParams, 'group_source_app_name'>) => {\n      navigation.setParams({\n        chat_group_graph_id: params.chat_group_graph_id,\n        group_source_app_name: undefined,\n      })\n    },\n    setAppFilter: (params: Omit<ConversationFiltersParams, 'chat_group_graph_id'>) => {\n      navigation.setParams({\n        chat_group_graph_id: undefined,\n        group_source_app_name: params.group_source_app_name,\n      })\n    },\n    applyFilters: (params: ConversationFiltersParams) => {\n      navigation.dispatch(StackActions.popTo('Conversations', params))\n    },\n  }\n\n  return <FilterContext.Provider value={filterContextValue}>{children}</FilterContext.Provider>\n}\n\nexport const useFilterContext = () => {\n  return React.useContext(FilterContext)\n}\n"]}

package/build/screens/conversation_filters/group_filters.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"group_filters.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filters/group_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAA;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAM5D,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,yBAAyB,CAAC,CAAA;AAElF,eAAO,MAAM,YAAY,yBAkBxB,CAAA"}
+{"version":3,"file":"group_filters.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filters/group_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAA;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAK5D,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,yBAAyB,CAAC,CAAA;AAElF,eAAO,MAAM,YAAY,yBAkBxB,CAAA"}

package/build/screens/conversation_filters/group_filters.js

@@ -5,7 +5,6 @@ import { Text } from '../../components/display';
 import { useGroupsToFilter } from './hooks/filters';
 import { GroupRow } from './components/rows';
 import { useFilterContext } from './context/conversation_filter_context';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
 export const GroupFilters = () => {
     const styles = useStyles();
     const { groups, fetchNextPage, isRefetching, refetch } = useGroupsToFilter();
@@ -14,10 +13,10 @@ export const GroupFilters = () => {
     return (<FlatList data={groups} renderItem={({ item }) => (<GroupRow group={item} isActive={item?.id.toString() === chat_group_graph_id}/>)} ListEmptyComponent={<Text>No groups available</Text>} refreshing={isRefetching} refreshControl={<RefreshControl refreshing={isRefetching} onRefresh={refetch}/>} onEndReached={() => fetchNextPage()} contentContainerStyle={styles.container}/>);
 };
 const useStyles = () => {
-    const { bottom } = useSafeAreaInsets();
+    const { platformListPaddingBottom } = useFilterContext();
     return StyleSheet.create({
         container: {
-            paddingBottom: bottom + 12,
+            paddingBottom: platformListPaddingBottom,
         },
     });
 };

package/build/screens/conversation_filters/group_filters.js.map

@@ -1 +1 @@
-{"version":3,"file":"group_filters.js","sourceRoot":"","sources":["../../../src/screens/conversation_filters/group_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAG/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAA;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAIlE,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAC5E,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAA;IACrC,MAAM,EAAE,mBAAmB,EAAE,GAAG,MAAM,CAAA;IACtC,OAAO,CACL,CAAC,QAAQ,CACP,IAAI,CAAC,CAAC,MAAM,CAAC,CACb,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACxB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,QAAQ,EAAE,KAAK,mBAAmB,CAAC,EAAG,CACjF,CAAC,CACF,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,mBAAmB,EAAE,IAAI,CAAC,CAAC,CACrD,UAAU,CAAC,CAAC,YAAY,CAAC,CACzB,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,EAAG,CAAC,CACjF,YAAY,CAAC,CAAC,GAAG,EAAE,CAAC,aAAa,EAAE,CAAC,CACpC,qBAAqB,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,EACxC,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IACtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,aAAa,EAAE,MAAM,GAAG,EAAE;SAC3B;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { RefreshControl, StyleSheet } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Text } from '../../components/display'\nimport { ConversationFiltersParams } from './screen_props'\nimport { StaticScreenProps } from '@react-navigation/native'\nimport { useGroupsToFilter } from './hooks/filters'\nimport { GroupRow } from './components/rows'\nimport { useFilterContext } from './context/conversation_filter_context'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\n\nexport type GroupFiltersScreenProps = StaticScreenProps<ConversationFiltersParams>\n\nexport const GroupFilters = () => {\n  const styles = useStyles()\n  const { groups, fetchNextPage, isRefetching, refetch } = useGroupsToFilter()\n  const { params } = useFilterContext()\n  const { chat_group_graph_id } = params\n  return (\n    <FlatList\n      data={groups}\n      renderItem={({ item }) => (\n        <GroupRow group={item} isActive={item?.id.toString() === chat_group_graph_id} />\n      )}\n      ListEmptyComponent={<Text>No groups available</Text>}\n      refreshing={isRefetching}\n      refreshControl={<RefreshControl refreshing={isRefetching} onRefresh={refetch} />}\n      onEndReached={() => fetchNextPage()}\n      contentContainerStyle={styles.container}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n  return StyleSheet.create({\n    container: {\n      paddingBottom: bottom + 12,\n    },\n  })\n}\n"]}
+{"version":3,"file":"group_filters.js","sourceRoot":"","sources":["../../../src/screens/conversation_filters/group_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAG/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAA;AAIxE,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAC5E,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAA;IACrC,MAAM,EAAE,mBAAmB,EAAE,GAAG,MAAM,CAAA;IACtC,OAAO,CACL,CAAC,QAAQ,CACP,IAAI,CAAC,CAAC,MAAM,CAAC,CACb,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACxB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,QAAQ,EAAE,KAAK,mBAAmB,CAAC,EAAG,CACjF,CAAC,CACF,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,mBAAmB,EAAE,IAAI,CAAC,CAAC,CACrD,UAAU,CAAC,CAAC,YAAY,CAAC,CACzB,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,EAAG,CAAC,CACjF,YAAY,CAAC,CAAC,GAAG,EAAE,CAAC,aAAa,EAAE,CAAC,CACpC,qBAAqB,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,EACxC,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,yBAAyB,EAAE,GAAG,gBAAgB,EAAE,CAAA;IACxD,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,aAAa,EAAE,yBAAyB;SACzC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { RefreshControl, StyleSheet } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Text } from '../../components/display'\nimport { ConversationFiltersParams } from './screen_props'\nimport { StaticScreenProps } from '@react-navigation/native'\nimport { useGroupsToFilter } from './hooks/filters'\nimport { GroupRow } from './components/rows'\nimport { useFilterContext } from './context/conversation_filter_context'\n\nexport type GroupFiltersScreenProps = StaticScreenProps<ConversationFiltersParams>\n\nexport const GroupFilters = () => {\n  const styles = useStyles()\n  const { groups, fetchNextPage, isRefetching, refetch } = useGroupsToFilter()\n  const { params } = useFilterContext()\n  const { chat_group_graph_id } = params\n  return (\n    <FlatList\n      data={groups}\n      renderItem={({ item }) => (\n        <GroupRow group={item} isActive={item?.id.toString() === chat_group_graph_id} />\n      )}\n      ListEmptyComponent={<Text>No groups available</Text>}\n      refreshing={isRefetching}\n      refreshControl={<RefreshControl refreshing={isRefetching} onRefresh={refetch} />}\n      onEndReached={() => fetchNextPage()}\n      contentContainerStyle={styles.container}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { platformListPaddingBottom } = useFilterContext()\n  return StyleSheet.create({\n    container: {\n      paddingBottom: platformListPaddingBottom,\n    },\n  })\n}\n"]}

package/build/screens/conversation_filters/team_filters.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"team_filters.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filters/team_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAA;AAG1D,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,yBAAyB,CAAC,CAAA;AAElF,eAAO,MAAM,WAAW,yBAkBvB,CAAA"}
+{"version":3,"file":"team_filters.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filters/team_filters.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAA;AAE1D,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,yBAAyB,CAAC,CAAA;AAElF,eAAO,MAAM,WAAW,yBAkBvB,CAAA"}

package/build/screens/conversation_filters/team_filters.js

@@ -5,7 +5,6 @@ import { Text } from '../../components/display';
 import { TeamRow } from './components/rows';
 import { useFilterContext } from './context/conversation_filter_context';
 import { useTeamsToFilter } from './hooks/filters';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
 export const TeamFilters = () => {
     const styles = useStyles();
     const { teams, fetchNextPage, isRefetching, refetch } = useTeamsToFilter();
@@ -14,10 +13,10 @@ export const TeamFilters = () => {
     return (<FlatList data={teams} renderItem={({ item }) => (<TeamRow team={item} isActive={item?.id.toString() === chat_group_graph_id}/>)} refreshing={isRefetching} refreshControl={<RefreshControl refreshing={isRefetching} onRefresh={refetch}/>} ListEmptyComponent={<Text>No teams available</Text>} onEndReached={() => fetchNextPage()} contentContainerStyle={styles.container}/>);
 };
 const useStyles = () => {
-    const { bottom } = useSafeAreaInsets();
+    const { platformListPaddingBottom } = useFilterContext();
     return StyleSheet.create({
         container: {
-            paddingBottom: bottom + 12,
+            paddingBottom: platformListPaddingBottom,
         },
     });
 };

package/build/screens/conversation_filters/team_filters.js.map

@@ -1 +1 @@
-{"version":3,"file":"team_filters.js","sourceRoot":"","sources":["../../../src/screens/conversation_filters/team_filters.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAA;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAIlE,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAC1E,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAA;IACrC,MAAM,EAAE,mBAAmB,EAAE,GAAG,MAAM,CAAA;IACtC,OAAO,CACL,CAAC,QAAQ,CACP,IAAI,CAAC,CAAC,KAAK,CAAC,CACZ,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACxB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,QAAQ,EAAE,KAAK,mBAAmB,CAAC,EAAG,CAC/E,CAAC,CACF,UAAU,CAAC,CAAC,YAAY,CAAC,CACzB,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,EAAG,CAAC,CACjF,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAC,CACpD,YAAY,CAAC,CAAC,GAAG,EAAE,CAAC,aAAa,EAAE,CAAC,CACpC,qBAAqB,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,EACxC,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IACtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,aAAa,EAAE,MAAM,GAAG,EAAE;SAC3B;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { StaticScreenProps } from '@react-navigation/native'\nimport React from 'react'\nimport { RefreshControl, StyleSheet } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Text } from '../../components/display'\nimport { TeamRow } from './components/rows'\nimport { useFilterContext } from './context/conversation_filter_context'\nimport { useTeamsToFilter } from './hooks/filters'\nimport { ConversationFiltersParams } from './screen_props'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\n\nexport type GroupFiltersScreenProps = StaticScreenProps<ConversationFiltersParams>\n\nexport const TeamFilters = () => {\n  const styles = useStyles()\n  const { teams, fetchNextPage, isRefetching, refetch } = useTeamsToFilter()\n  const { params } = useFilterContext()\n  const { chat_group_graph_id } = params\n  return (\n    <FlatList\n      data={teams}\n      renderItem={({ item }) => (\n        <TeamRow team={item} isActive={item?.id.toString() === chat_group_graph_id} />\n      )}\n      refreshing={isRefetching}\n      refreshControl={<RefreshControl refreshing={isRefetching} onRefresh={refetch} />}\n      ListEmptyComponent={<Text>No teams available</Text>}\n      onEndReached={() => fetchNextPage()}\n      contentContainerStyle={styles.container}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { bottom } = useSafeAreaInsets()\n  return StyleSheet.create({\n    container: {\n      paddingBottom: bottom + 12,\n    },\n  })\n}\n"]}
+{"version":3,"file":"team_filters.js","sourceRoot":"","sources":["../../../src/screens/conversation_filters/team_filters.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAA;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAKlD,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAC1E,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAA;IACrC,MAAM,EAAE,mBAAmB,EAAE,GAAG,MAAM,CAAA;IACtC,OAAO,CACL,CAAC,QAAQ,CACP,IAAI,CAAC,CAAC,KAAK,CAAC,CACZ,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACxB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,QAAQ,EAAE,KAAK,mBAAmB,CAAC,EAAG,CAC/E,CAAC,CACF,UAAU,CAAC,CAAC,YAAY,CAAC,CACzB,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,EAAG,CAAC,CACjF,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAC,CACpD,YAAY,CAAC,CAAC,GAAG,EAAE,CAAC,aAAa,EAAE,CAAC,CACpC,qBAAqB,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,EACxC,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,yBAAyB,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAExD,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,aAAa,EAAE,yBAAyB;SACzC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { StaticScreenProps } from '@react-navigation/native'\nimport React from 'react'\nimport { RefreshControl, StyleSheet } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Text } from '../../components/display'\nimport { TeamRow } from './components/rows'\nimport { useFilterContext } from './context/conversation_filter_context'\nimport { useTeamsToFilter } from './hooks/filters'\nimport { ConversationFiltersParams } from './screen_props'\n\nexport type GroupFiltersScreenProps = StaticScreenProps<ConversationFiltersParams>\n\nexport const TeamFilters = () => {\n  const styles = useStyles()\n  const { teams, fetchNextPage, isRefetching, refetch } = useTeamsToFilter()\n  const { params } = useFilterContext()\n  const { chat_group_graph_id } = params\n  return (\n    <FlatList\n      data={teams}\n      renderItem={({ item }) => (\n        <TeamRow team={item} isActive={item?.id.toString() === chat_group_graph_id} />\n      )}\n      refreshing={isRefetching}\n      refreshControl={<RefreshControl refreshing={isRefetching} onRefresh={refetch} />}\n      ListEmptyComponent={<Text>No teams available</Text>}\n      onEndReached={() => fetchNextPage()}\n      contentContainerStyle={styles.container}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { platformListPaddingBottom } = useFilterContext()\n\n  return StyleSheet.create({\n    container: {\n      paddingBottom: platformListPaddingBottom,\n    },\n  })\n}\n"]}

package/build/screens/conversation_filters_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filters_screen.d.ts","sourceRoot":"","sources":["../../src/screens/conversation_filters_screen.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,OAAO,EACL,8BAA8B,EAE/B,MAAM,qCAAqC,CAAA;AAI5C,eAAO,MAAM,gCAAgC,uEAO3C,CAAA;AAoCF,eAAO,MAAM,yBAAyB,WAAY,8BAA8B,sBAW/E,CAAA"}
+{"version":3,"file":"conversation_filters_screen.d.ts","sourceRoot":"","sources":["../../src/screens/conversation_filters_screen.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAS1C,OAAO,EACL,8BAA8B,EAE/B,MAAM,qCAAqC,CAAA;AAI5C,eAAO,MAAM,gCAAgC,uEAO3C,CAAA;AAoCF,eAAO,MAAM,yBAAyB,WAAY,8BAA8B,sBAW/E,CAAA"}

package/build/screens/conversation_filters_screen.js

@@ -1,8 +1,8 @@
 import { useHeaderHeight } from '@react-navigation/elements';
 import { createComponentForStaticNavigation, useRoute } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
-import React from 'react';
-import { Platform, StyleSheet, useWindowDimensions } from 'react-native';
+import React, { useCallback } from 'react';
+import { Platform, StyleSheet, useWindowDimensions, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { FilterProvider, useFilterContext, } from './conversation_filters/context/conversation_filter_context';
 import { ConversationFilters } from './conversation_filters/components/conversation_filters';
@@ -59,16 +59,21 @@ export const ConversationFiltersScreen = (_props) => {
     </FilterProvider>);
 };
 const FormSheetHeaderWithContext = () => {
-    const { resetFilter, applyFilters } = useFilterContext();
+    const { resetFilter, applyFilters, setFormSheetHeaderHeight } = useFilterContext();
     const route = useRoute();
     const styles = useStyles();
-    return (<FormSheet.Header style={styles.header}>
-      <FormSheet.HeaderTitle>Filters</FormSheet.HeaderTitle>
-      <FormSheet.HeaderActions>
-        <FormSheet.HeaderTextButton onPress={resetFilter}>Reset</FormSheet.HeaderTextButton>
-        <FormSheet.HeaderButton title="Apply" onPress={() => applyFilters(route.params)}/>
-      </FormSheet.HeaderActions>
-    </FormSheet.Header>);
+    const handleFormSheetHeaderLayout = useCallback((event) => {
+        setFormSheetHeaderHeight(event.nativeEvent.layout.height);
+    }, [setFormSheetHeaderHeight]);
+    return (<View onLayout={handleFormSheetHeaderLayout}>
+      <FormSheet.Header style={styles.header}>
+        <FormSheet.HeaderTitle>Filters</FormSheet.HeaderTitle>
+        <FormSheet.HeaderActions>
+          <FormSheet.HeaderTextButton onPress={resetFilter}>Reset</FormSheet.HeaderTextButton>
+          <FormSheet.HeaderButton title="Apply" onPress={() => applyFilters(route.params)}/>
+        </FormSheet.HeaderActions>
+      </FormSheet.Header>
+    </View>);
 };
 const useStyles = () => {
     const { top } = useSafeAreaInsets();

package/build/screens/conversation_filters_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filters_screen.js","sourceRoot":"","sources":["../../src/screens/conversation_filters_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useHeaderHeight } from '@react-navigation/elements'\nimport { createComponentForStaticNavigation, RouteProp, useRoute } from '@react-navigation/native'\nimport { createNativeStackNavigator } from '@react-navigation/native-stack'\nimport React from 'react'\nimport { Platform, StyleSheet, useWindowDimensions } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport {\n  FilterProvider,\n  useFilterContext,\n} from './conversation_filters/context/conversation_filter_context'\nimport { ConversationFilters } from './conversation_filters/components/conversation_filters'\nimport { GroupFilters } from './conversation_filters/group_filters'\nimport {\n  ConversationFiltersScreenProps,\n  ConversationFilterStackParamList,\n} from './conversation_filters/screen_props'\nimport { TeamFilters } from './conversation_filters/team_filters'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\n\nexport const ConversationFiltersScreenOptions = getFormSheetScreenOptions({\n  presentation: Platform.select({ android: 'modal', ios: 'formSheet' }),\n  sheetAllowedDetents: Platform.select({\n    ios: [0.75, 1],\n    default: [1],\n  }),\n  headerTitle: 'Filters',\n})\n\nconst FilterNavigator = createNativeStackNavigator<ConversationFilterStackParamList>({\n  initialRouteName: 'Filters',\n  screens: {\n    Filters: {\n      screen: ConversationFilters,\n      options: {\n        headerShown: false,\n      },\n    },\n    GroupFilters: {\n      screen: GroupFilters,\n      options: {\n        headerTitle: Platform.select({\n          android: 'Groups',\n          ios: '',\n        }),\n        headerBackTitle: 'Groups',\n      },\n    },\n    TeamFilters: {\n      screen: TeamFilters,\n      options: {\n        headerTitle: Platform.select({\n          android: 'Teams',\n          ios: '',\n        }),\n        headerBackTitle: 'Teams',\n      },\n    },\n  },\n})\n\nconst Filters = createComponentForStaticNavigation(FilterNavigator, 'Filters')\n\nexport const ConversationFiltersScreen = (_props: ConversationFiltersScreenProps) => {\n  const styles = useStyles()\n\n  return (\n    <FilterProvider>\n      <FormSheet.Root contentStyle={styles.contentContainer} showAndroidSheetGrabber={false}>\n        <FormSheetHeaderWithContext />\n        <Filters />\n      </FormSheet.Root>\n    </FilterProvider>\n  )\n}\n\nconst FormSheetHeaderWithContext = () => {\n  const { resetFilter, applyFilters } = useFilterContext()\n  const route = useRoute<RouteProp<ConversationFiltersScreenProps['route']>>()\n  const styles = useStyles()\n\n  return (\n    <FormSheet.Header style={styles.header}>\n      <FormSheet.HeaderTitle>Filters</FormSheet.HeaderTitle>\n      <FormSheet.HeaderActions>\n        <FormSheet.HeaderTextButton onPress={resetFilter}>Reset</FormSheet.HeaderTextButton>\n        <FormSheet.HeaderButton title=\"Apply\" onPress={() => applyFilters(route.params)} />\n      </FormSheet.HeaderActions>\n    </FormSheet.Header>\n  )\n}\n\nconst useStyles = () => {\n  const { top } = useSafeAreaInsets()\n  const { height } = useWindowDimensions()\n  const headerHeight = useHeaderHeight()\n\n  const containerHeight = Platform.select({\n    android: height,\n    ios: height - top - headerHeight,\n  })\n\n  return StyleSheet.create({\n    contentContainer: {\n      height: containerHeight,\n    },\n    header: {\n      paddingTop: Platform.select({\n        ios: 20,\n        android: 20 + top,\n      }),\n    },\n  })\n}\n"]}
+{"version":3,"file":"conversation_filters_screen.js","sourceRoot":"","sources":["../../src/screens/conversation_filters_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAC5D,OAAO,EAAE,kCAAkC,EAAa,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAClG,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAA;AAC3E,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAqB,QAAQ,EAAE,UAAU,EAAE,mBAAmB,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACjG,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAClE,OAAO,EACL,cAAc,EACd,gBAAgB,GACjB,MAAM,4DAA4D,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,wDAAwD,CAAA;AAC5F,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAA;AAKnE,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAA;AACjE,OAAO,SAAS,EAAE,EAAE,yBAAyB,EAAE,MAAM,oCAAoC,CAAA;AAEzF,MAAM,CAAC,MAAM,gCAAgC,GAAG,yBAAyB,CAAC;IACxE,YAAY,EAAE,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,WAAW,EAAE,CAAC;IACrE,mBAAmB,EAAE,QAAQ,CAAC,MAAM,CAAC;QACnC,GAAG,EAAE,CAAC,IAAI,EAAE,CAAC,CAAC;QACd,OAAO,EAAE,CAAC,CAAC,CAAC;KACb,CAAC;IACF,WAAW,EAAE,SAAS;CACvB,CAAC,CAAA;AAEF,MAAM,eAAe,GAAG,0BAA0B,CAAmC;IACnF,gBAAgB,EAAE,SAAS;IAC3B,OAAO,EAAE;QACP,OAAO,EAAE;YACP,MAAM,EAAE,mBAAmB;YAC3B,OAAO,EAAE;gBACP,WAAW,EAAE,KAAK;aACnB;SACF;QACD,YAAY,EAAE;YACZ,MAAM,EAAE,YAAY;YACpB,OAAO,EAAE;gBACP,WAAW,EAAE,QAAQ,CAAC,MAAM,CAAC;oBAC3B,OAAO,EAAE,QAAQ;oBACjB,GAAG,EAAE,EAAE;iBACR,CAAC;gBACF,eAAe,EAAE,QAAQ;aAC1B;SACF;QACD,WAAW,EAAE;YACX,MAAM,EAAE,WAAW;YACnB,OAAO,EAAE;gBACP,WAAW,EAAE,QAAQ,CAAC,MAAM,CAAC;oBAC3B,OAAO,EAAE,OAAO;oBAChB,GAAG,EAAE,EAAE;iBACR,CAAC;gBACF,eAAe,EAAE,OAAO;aACzB;SACF;KACF;CACF,CAAC,CAAA;AAEF,MAAM,OAAO,GAAG,kCAAkC,CAAC,eAAe,EAAE,SAAS,CAAC,CAAA;AAE9E,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,MAAsC,EAAE,EAAE;IAClF,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,cAAc,CACb;MAAA,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,uBAAuB,CAAC,CAAC,KAAK,CAAC,CACpF;QAAA,CAAC,0BAA0B,CAAC,AAAD,EAC3B;QAAA,CAAC,OAAO,CAAC,AAAD,EACV;MAAA,EAAE,SAAS,CAAC,IAAI,CAClB;IAAA,EAAE,cAAc,CAAC,CAClB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,0BAA0B,GAAG,GAAG,EAAE;IACtC,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,wBAAwB,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAClF,MAAM,KAAK,GAAG,QAAQ,EAAsD,CAAA;IAC5E,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,MAAM,2BAA2B,GAAG,WAAW,CAC7C,CAAC,KAAwB,EAAE,EAAE;QAC3B,wBAAwB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;IAC3D,CAAC,EACD,CAAC,wBAAwB,CAAC,CAC3B,CAAA;IAED,OAAO,CACL,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,2BAA2B,CAAC,CAC1C;MAAA,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CACrC;QAAA,CAAC,SAAS,CAAC,WAAW,CAAC,OAAO,EAAE,SAAS,CAAC,WAAW,CACrD;QAAA,CAAC,SAAS,CAAC,aAAa,CACtB;UAAA,CAAC,SAAS,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,EAAE,SAAS,CAAC,gBAAgB,CACnF;UAAA,CAAC,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAClF;QAAA,EAAE,SAAS,CAAC,aAAa,CAC3B;MAAA,EAAE,SAAS,CAAC,MAAM,CACpB;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,GAAG,EAAE,GAAG,iBAAiB,EAAE,CAAA;IACnC,MAAM,EAAE,MAAM,EAAE,GAAG,mBAAmB,EAAE,CAAA;IACxC,MAAM,YAAY,GAAG,eAAe,EAAE,CAAA;IAEtC,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM,CAAC;QACtC,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,MAAM,GAAG,GAAG,GAAG,YAAY;KACjC,CAAC,CAAA;IAEF,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,gBAAgB,EAAE;YAChB,MAAM,EAAE,eAAe;SACxB;QACD,MAAM,EAAE;YACN,UAAU,EAAE,QAAQ,CAAC,MAAM,CAAC;gBAC1B,GAAG,EAAE,EAAE;gBACP,OAAO,EAAE,EAAE,GAAG,GAAG;aAClB,CAAC;SACH;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useHeaderHeight } from '@react-navigation/elements'\nimport { createComponentForStaticNavigation, RouteProp, useRoute } from '@react-navigation/native'\nimport { createNativeStackNavigator } from '@react-navigation/native-stack'\nimport React, { useCallback } from 'react'\nimport { LayoutChangeEvent, Platform, StyleSheet, useWindowDimensions, View } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport {\n  FilterProvider,\n  useFilterContext,\n} from './conversation_filters/context/conversation_filter_context'\nimport { ConversationFilters } from './conversation_filters/components/conversation_filters'\nimport { GroupFilters } from './conversation_filters/group_filters'\nimport {\n  ConversationFiltersScreenProps,\n  ConversationFilterStackParamList,\n} from './conversation_filters/screen_props'\nimport { TeamFilters } from './conversation_filters/team_filters'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\n\nexport const ConversationFiltersScreenOptions = getFormSheetScreenOptions({\n  presentation: Platform.select({ android: 'modal', ios: 'formSheet' }),\n  sheetAllowedDetents: Platform.select({\n    ios: [0.75, 1],\n    default: [1],\n  }),\n  headerTitle: 'Filters',\n})\n\nconst FilterNavigator = createNativeStackNavigator<ConversationFilterStackParamList>({\n  initialRouteName: 'Filters',\n  screens: {\n    Filters: {\n      screen: ConversationFilters,\n      options: {\n        headerShown: false,\n      },\n    },\n    GroupFilters: {\n      screen: GroupFilters,\n      options: {\n        headerTitle: Platform.select({\n          android: 'Groups',\n          ios: '',\n        }),\n        headerBackTitle: 'Groups',\n      },\n    },\n    TeamFilters: {\n      screen: TeamFilters,\n      options: {\n        headerTitle: Platform.select({\n          android: 'Teams',\n          ios: '',\n        }),\n        headerBackTitle: 'Teams',\n      },\n    },\n  },\n})\n\nconst Filters = createComponentForStaticNavigation(FilterNavigator, 'Filters')\n\nexport const ConversationFiltersScreen = (_props: ConversationFiltersScreenProps) => {\n  const styles = useStyles()\n\n  return (\n    <FilterProvider>\n      <FormSheet.Root contentStyle={styles.contentContainer} showAndroidSheetGrabber={false}>\n        <FormSheetHeaderWithContext />\n        <Filters />\n      </FormSheet.Root>\n    </FilterProvider>\n  )\n}\n\nconst FormSheetHeaderWithContext = () => {\n  const { resetFilter, applyFilters, setFormSheetHeaderHeight } = useFilterContext()\n  const route = useRoute<RouteProp<ConversationFiltersScreenProps['route']>>()\n  const styles = useStyles()\n\n  const handleFormSheetHeaderLayout = useCallback(\n    (event: LayoutChangeEvent) => {\n      setFormSheetHeaderHeight(event.nativeEvent.layout.height)\n    },\n    [setFormSheetHeaderHeight]\n  )\n\n  return (\n    <View onLayout={handleFormSheetHeaderLayout}>\n      <FormSheet.Header style={styles.header}>\n        <FormSheet.HeaderTitle>Filters</FormSheet.HeaderTitle>\n        <FormSheet.HeaderActions>\n          <FormSheet.HeaderTextButton onPress={resetFilter}>Reset</FormSheet.HeaderTextButton>\n          <FormSheet.HeaderButton title=\"Apply\" onPress={() => applyFilters(route.params)} />\n        </FormSheet.HeaderActions>\n      </FormSheet.Header>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { top } = useSafeAreaInsets()\n  const { height } = useWindowDimensions()\n  const headerHeight = useHeaderHeight()\n\n  const containerHeight = Platform.select({\n    android: height,\n    ios: height - top - headerHeight,\n  })\n\n  return StyleSheet.create({\n    contentContainer: {\n      height: containerHeight,\n    },\n    header: {\n      paddingTop: Platform.select({\n        ios: 20,\n        android: 20 + top,\n      }),\n    },\n  })\n}\n"]}

package/build/screens/reactions_screen.js

@@ -64,6 +64,7 @@ const Author = memo(({ author }) => {
       </Text>
     </View>);
 });
+const TABS_HEIGHT = 67;
 const useStyles = () => {
     const { colors } = useTheme();
     const { bottom } = useSafeAreaInsets();
@@ -74,7 +75,7 @@ const useStyles = () => {
         },
         contentContainer: {
             paddingTop: 8,
-            paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
+            paddingBottom: bottom + Platform.select({ android: 24, default: TABS_HEIGHT + 24 }),
         },
         authorRow: {
             flexDirection: 'row',

package/build/screens/reactions_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"reactions_screen.js","sourceRoot":"","sources":["../../src/screens/reactions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps } from '@react-navigation/native'\nimport React, { memo } from 'react'\nimport { Platform, StyleSheet, View } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Avatar, Text } from '../components'\nimport { REACTION_EMOJIS } from '../components/conversation/message_reaction'\nimport { Tabs } from '../components/display/tabs'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useSuspenseGet, useTheme } from '../hooks'\nimport { useConversationMessages } from '../hooks/use_conversation_messages'\nimport { useFontScale } from '../hooks/use_font_scale'\nimport { MemberResource } from '../types'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { platformFontWeightMedium } from '../utils'\n\nexport const ReactionsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android\n    default: [0.5, 1],\n  }),\n  headerTitle: 'Reactions',\n})\n\nexport type ReactionScreenProps = StaticScreenProps<{\n  message_id: string\n  conversation_id: number\n  reaction_value?: string\n}>\n\nexport function ReactionsScreen({ route }: ReactionScreenProps) {\n  const { conversation_id, message_id, reaction_value } = route.params\n  const styles = useStyles()\n\n  const { messages } = useConversationMessages({ conversation_id }, { refetchOnMount: false })\n  const { data: members } = useSuspenseGet<MemberResource[]>({\n    url: `/me/conversations/${conversation_id}/members`,\n    data: {\n      fields: {\n        Member: ['id', 'name', 'avatar', 'badges', 'child', 'role'],\n      },\n    },\n  })\n  const message = messages.find(m => m.id === message_id)\n  const reactionCounts = message?.reactionCounts || []\n  const initialReactionCount =\n    reactionCounts.find(r => r.value === reaction_value) || reactionCounts[0]\n  const [reactionCountValue, setReactionCountValue] = React.useState<\n    ReactionCountResource['value']\n  >(initialReactionCount.value)\n  const reactionCount = reactionCounts.find(r => r.value === reactionCountValue)\n\n  if (!reactionCount) {\n    return (\n      <View style={styles.errorContainer}>\n        <Text>No reactions found for this message.</Text>\n      </View>\n    )\n  }\n\n  const authorIds = reactionCount.authorIds\n  const authors = members.filter(member => authorIds.includes(member.id))\n\n  return (\n    <FormSheet.Root contentStyle={styles.formSheetContent}>\n      <Tabs\n        data={reactionCounts}\n        activeTab={reactionCount}\n        onTabPress={item => {\n          setReactionCountValue(item.value)\n        }}\n        renderItem={({ item }) => (\n          <Reaction\n            active={reactionCount.id === item.id}\n            reaction={item}\n            onPress={() => setReactionCountValue(item.value)}\n          />\n        )}\n        style={styles.actions}\n      />\n      <FlatList\n        data={authors}\n        contentContainerStyle={styles.contentContainer}\n        keyExtractor={item => item.id.toString()}\n        renderItem={({ item: author }) => <Author author={author} key={author.id} />}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst Reaction = ({\n  reaction,\n}: {\n  active: boolean\n  reaction: ReactionCountResource\n  onPress: () => void\n}) => {\n  const styles = useStyles()\n\n  return (\n    <View key={reaction.value} style={styles.reaction}>\n      <Text style={styles.reactionContent}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionContent}>{reaction.count}</Text>\n    </View>\n  )\n}\n\ntype AuthorProps = Pick<MemberResource, 'id' | 'name' | 'avatar'>\n\nconst Author = memo(({ author }: { author: AuthorProps }) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.authorRow}>\n      <Avatar sourceUri={author.avatar} size=\"sm\" />\n      <Text variant=\"tertiary\" numberOfLines={2} style={styles.authorName}>\n        {author.name}\n      </Text>\n    </View>\n  )\n})\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n  const fontScale = useFontScale({ maxFontSizeMultiplier: 1.3 })\n\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n    contentContainer: {\n      paddingTop: 8,\n      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),\n    },\n    authorRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n      paddingVertical: 8,\n      paddingHorizontal: 16,\n      flex: 1,\n    },\n    authorName: {\n      flex: 1,\n    },\n    reaction: {\n      paddingHorizontal: 8,\n      paddingVertical: 16,\n      flexDirection: 'row',\n      gap: 4,\n    },\n    reactionContent: {\n      fontSize: 18,\n      fontWeight: platformFontWeightMedium,\n    },\n    actions: {\n      minHeight: 68 * fontScale,\n      borderBottomColor: colors.borderColorDefaultBase,\n      borderBottomWidth: 1,\n    },\n    errorContainer: {\n      flex: 1,\n      justifyContent: 'center',\n      alignItems: 'center',\n      padding: 16,\n      marginTop: 30,\n    },\n  })\n}\n"]}
+{"version":3,"file":"reactions_screen.js","sourceRoot":"","sources":["../../src/screens/reactions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps } from '@react-navigation/native'\nimport React, { memo } from 'react'\nimport { Platform, StyleSheet, View } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Avatar, Text } from '../components'\nimport { REACTION_EMOJIS } from '../components/conversation/message_reaction'\nimport { Tabs } from '../components/display/tabs'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useSuspenseGet, useTheme } from '../hooks'\nimport { useConversationMessages } from '../hooks/use_conversation_messages'\nimport { useFontScale } from '../hooks/use_font_scale'\nimport { MemberResource } from '../types'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { platformFontWeightMedium } from '../utils'\n\nexport const ReactionsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android\n    default: [0.5, 1],\n  }),\n  headerTitle: 'Reactions',\n})\n\nexport type ReactionScreenProps = StaticScreenProps<{\n  message_id: string\n  conversation_id: number\n  reaction_value?: string\n}>\n\nexport function ReactionsScreen({ route }: ReactionScreenProps) {\n  const { conversation_id, message_id, reaction_value } = route.params\n  const styles = useStyles()\n\n  const { messages } = useConversationMessages({ conversation_id }, { refetchOnMount: false })\n  const { data: members } = useSuspenseGet<MemberResource[]>({\n    url: `/me/conversations/${conversation_id}/members`,\n    data: {\n      fields: {\n        Member: ['id', 'name', 'avatar', 'badges', 'child', 'role'],\n      },\n    },\n  })\n  const message = messages.find(m => m.id === message_id)\n  const reactionCounts = message?.reactionCounts || []\n  const initialReactionCount =\n    reactionCounts.find(r => r.value === reaction_value) || reactionCounts[0]\n  const [reactionCountValue, setReactionCountValue] = React.useState<\n    ReactionCountResource['value']\n  >(initialReactionCount.value)\n  const reactionCount = reactionCounts.find(r => r.value === reactionCountValue)\n\n  if (!reactionCount) {\n    return (\n      <View style={styles.errorContainer}>\n        <Text>No reactions found for this message.</Text>\n      </View>\n    )\n  }\n\n  const authorIds = reactionCount.authorIds\n  const authors = members.filter(member => authorIds.includes(member.id))\n\n  return (\n    <FormSheet.Root contentStyle={styles.formSheetContent}>\n      <Tabs\n        data={reactionCounts}\n        activeTab={reactionCount}\n        onTabPress={item => {\n          setReactionCountValue(item.value)\n        }}\n        renderItem={({ item }) => (\n          <Reaction\n            active={reactionCount.id === item.id}\n            reaction={item}\n            onPress={() => setReactionCountValue(item.value)}\n          />\n        )}\n        style={styles.actions}\n      />\n      <FlatList\n        data={authors}\n        contentContainerStyle={styles.contentContainer}\n        keyExtractor={item => item.id.toString()}\n        renderItem={({ item: author }) => <Author author={author} key={author.id} />}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst Reaction = ({\n  reaction,\n}: {\n  active: boolean\n  reaction: ReactionCountResource\n  onPress: () => void\n}) => {\n  const styles = useStyles()\n\n  return (\n    <View key={reaction.value} style={styles.reaction}>\n      <Text style={styles.reactionContent}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionContent}>{reaction.count}</Text>\n    </View>\n  )\n}\n\ntype AuthorProps = Pick<MemberResource, 'id' | 'name' | 'avatar'>\n\nconst Author = memo(({ author }: { author: AuthorProps }) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.authorRow}>\n      <Avatar sourceUri={author.avatar} size=\"sm\" />\n      <Text variant=\"tertiary\" numberOfLines={2} style={styles.authorName}>\n        {author.name}\n      </Text>\n    </View>\n  )\n})\n\nconst TABS_HEIGHT = 67\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n  const fontScale = useFontScale({ maxFontSizeMultiplier: 1.3 })\n\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n    contentContainer: {\n      paddingTop: 8,\n      paddingBottom: bottom + Platform.select({ android: 24, default: TABS_HEIGHT + 24 }),\n    },\n    authorRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n      paddingVertical: 8,\n      paddingHorizontal: 16,\n      flex: 1,\n    },\n    authorName: {\n      flex: 1,\n    },\n    reaction: {\n      paddingHorizontal: 8,\n      paddingVertical: 16,\n      flexDirection: 'row',\n      gap: 4,\n    },\n    reactionContent: {\n      fontSize: 18,\n      fontWeight: platformFontWeightMedium,\n    },\n    actions: {\n      minHeight: 68 * fontScale,\n      borderBottomColor: colors.borderColorDefaultBase,\n      borderBottomWidth: 1,\n    },\n    errorContainer: {\n      flex: 1,\n      justifyContent: 'center',\n      alignItems: 'center',\n      padding: 16,\n      marginTop: 30,\n    },\n  })\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "3.12.2",
+  "version": "3.12.3-rc.0",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -55,5 +55,5 @@
     "react-native-url-polyfill": "^2.0.0",
     "typescript": "<5.6.0"
   },
-  "gitHead": "bc21db666c21fbbf7e654776bb40d4ec15e5ba6b"
+  "gitHead": "7fd9ca92d700ca503fab9aa60bb3af54f4ab509b"
 }

package/src/screens/conversation/message_read_receipts_screen.tsx

@@ -1,6 +1,6 @@
 import { StaticScreenProps, useNavigation } from '@react-navigation/native'
-import React, { memo } from 'react'
-import { Platform, StyleSheet, View } from 'react-native'
+import React, { memo, useCallback, useMemo, useState } from 'react'
+import { LayoutChangeEvent, Platform, StyleSheet, View } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { Avatar, Text } from '../../components'
 import { useReadReceipts } from '../../hooks/use_read_receipts'
@@ -9,6 +9,8 @@ import { ReadReceiptResource } from '../../types/resources/read_receipt'
 import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'
 import { useTheme } from '../../hooks'
 
+const LIST_BOTTOM_PADDING = 24
+
 export const MessageReadReceiptsScreenOptions = getFormSheetScreenOptions({
   sheetAllowedDetents: Platform.select({
     android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android
@@ -25,6 +27,8 @@ export type MessageReadReceiptsScreenProps = StaticScreenProps<{
 export function MessageReadReceiptsScreen({ route }: MessageReadReceiptsScreenProps) {
   const styles = useStyles()
   const navigation = useNavigation()
+  const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(0)
+  const { bottom } = useSafeAreaInsets()
 
   const { conversation_id, message_id } = route.params
   const {
@@ -33,19 +37,35 @@ export function MessageReadReceiptsScreen({ route }: MessageReadReceiptsScreenPr
     fetchNextPage,
   } = useReadReceipts({ conversation_id, message_id })
 
+  const contentContainerPaddingBottomStyles = useMemo(() => {
+    return Platform.select({
+      android: { paddingBottom: bottom + LIST_BOTTOM_PADDING },
+      default: { paddingBottom: bottom + formSheetHeaderHeight + LIST_BOTTOM_PADDING },
+    })
+  }, [bottom, formSheetHeaderHeight])
+
+  const handleFormSheetHeaderLayout = useCallback(
+    (event: LayoutChangeEvent) => {
+      setFormSheetHeaderHeight(event.nativeEvent.layout.height)
+    },
+    [setFormSheetHeaderHeight]
+  )
+
   return (
     <FormSheet.Root>
-      <FormSheet.Header>
-        <FormSheet.HeaderTitle>Read receipts ({totalCount})</FormSheet.HeaderTitle>
-        <FormSheet.HeaderActions>
-          <FormSheet.HeaderTextButton onPress={() => navigation.goBack()}>
-            Close
-          </FormSheet.HeaderTextButton>
-        </FormSheet.HeaderActions>
-      </FormSheet.Header>
+      <View onLayout={handleFormSheetHeaderLayout}>
+        <FormSheet.Header>
+          <FormSheet.HeaderTitle>Read receipts ({totalCount})</FormSheet.HeaderTitle>
+          <FormSheet.HeaderActions>
+            <FormSheet.HeaderTextButton onPress={() => navigation.goBack()}>
+              Close
+            </FormSheet.HeaderTextButton>
+          </FormSheet.HeaderActions>
+        </FormSheet.Header>
+      </View>
       <FlatList
         data={receipts}
-        contentContainerStyle={styles.contentContainer}
+        contentContainerStyle={[styles.contentContainer, contentContainerPaddingBottomStyles]}
         keyExtractor={item => item.id.toString()}
         renderItem={({ item }) => <Receipt receipt={item} />}
         nestedScrollEnabled
@@ -71,14 +91,11 @@ const Receipt = memo(({ receipt }: { receipt: ReadReceiptResource }) => {
 })
 
 const useStyles = () => {
-  const { bottom } = useSafeAreaInsets()
   const { colors } = useTheme()
-
   return StyleSheet.create({
     contentContainer: {
       paddingHorizontal: 16,
       paddingTop: 8,
-      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
     },
     receiptRow: {
       flexDirection: 'row',

package/src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx

@@ -16,6 +16,7 @@ import { ConversationFilterRecipientsScreenProps, SectionTypes, TeamFilterTypes
 import { DefaultLoading } from '../../components/page/loading'
 
 const SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-'
+const SPACE_UNDER_ROW = 16
 
 export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({
   sheetAllowedDetents: Platform.select({
@@ -31,11 +32,14 @@ export const ConversationFilterRecipientsScreen = ({
   const styles = useStyles()
 
   // Set the height of the container to accommodate the team filters
-  const [teamFiltersHeight, setTeamFiltersHeight] = useState(200)
-  const { top, bottom } = useSafeAreaInsets()
+  const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(200)
+  const { bottom } = useSafeAreaInsets()
   const listContainerStyle = useMemo(
-    () => Platform.select({ ios: { paddingBottom: teamFiltersHeight + bottom + top } }),
-    [teamFiltersHeight, bottom, top]
+    () =>
+      Platform.select({
+        ios: { paddingBottom: formSheetHeaderHeight + bottom + SPACE_UNDER_ROW },
+      }),
+    [formSheetHeaderHeight, bottom]
   )
 
   const navigation =
@@ -77,30 +81,32 @@ export const ConversationFilterRecipientsScreen = ({
     navigation.dispatch(StackActions.popTo('ConversationNew', params))
   }, [navigation, params])
 
-  const handleTeamFiltersLayout = useCallback((event: LayoutChangeEvent) => {
-    setTeamFiltersHeight(event.nativeEvent.layout.height)
+  const handleFormSheetHeaderLayout = useCallback((event: LayoutChangeEvent) => {
+    setFormSheetHeaderHeight(event.nativeEvent.layout.height)
   }, [])
 
   return (
     <FormSheet.Root style={styles.root}>
-      <FormSheet.Header style={styles.header}>
-        <FormSheet.HeaderTitle>{headerTitle}</FormSheet.HeaderTitle>
-        <FormSheet.HeaderActions>
-          <FormSheet.HeaderTextButton
-            onPress={resetTeamFilters}
-            accessibilityHint="Cancels any selected teams and closes this modal."
-          >
-            Cancel
-          </FormSheet.HeaderTextButton>
-          <FormSheet.HeaderButton
-            title="Apply"
-            accessibilityHint={applyButtonAccessibilityHint}
-            onPress={applyTeamFilters}
-            disabled={noTeamsSelected}
-          />
-        </FormSheet.HeaderActions>
-      </FormSheet.Header>
-      <TeamFilters onLayout={handleTeamFiltersLayout} />
+      <View onLayout={handleFormSheetHeaderLayout}>
+        <FormSheet.Header style={styles.header}>
+          <FormSheet.HeaderTitle>{headerTitle}</FormSheet.HeaderTitle>
+          <FormSheet.HeaderActions>
+            <FormSheet.HeaderTextButton
+              onPress={resetTeamFilters}
+              accessibilityHint="Cancels any selected teams and closes this modal."
+            >
+              Cancel
+            </FormSheet.HeaderTextButton>
+            <FormSheet.HeaderButton
+              title="Apply"
+              accessibilityHint={applyButtonAccessibilityHint}
+              onPress={applyTeamFilters}
+              disabled={noTeamsSelected}
+            />
+          </FormSheet.HeaderActions>
+        </FormSheet.Header>
+        <TeamFilters />
+      </View>
       <FlatList
         data={data}
         ListHeaderComponent={
@@ -224,7 +230,7 @@ const useStyles = () => {
     lastRow: {
       borderBottomStartRadius: tokens.borderRadiusLg,
       borderBottomEndRadius: tokens.borderRadiusLg,
-      marginBottom: 16,
+      marginBottom: SPACE_UNDER_ROW,
     },
     teamFiltersContainer: {
       gap: 12,

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

@@ -1,10 +1,9 @@
 import React, { useContext, useMemo } from 'react'
-import { Platform, StyleSheet, View, ViewStyle } from 'react-native'
+import { StyleSheet, View, ViewStyle } from 'react-native'
 import { FlatList } from 'react-native-gesture-handler'
-import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { Heading } from '../../../components'
 import { useTheme } from '../../../hooks'
-import { FilterContext } from '../context/conversation_filter_context'
+import { FilterContext, useFilterContext } from '../context/conversation_filter_context'
 import { FilterTypes } from '../filter_types'
 import { useGroupsToFilter, useTeamsToFilter } from '../hooks/filters'
 import {
@@ -165,15 +164,12 @@ export const ConversationFilters = () => {
 }
 
 const useStyles = () => {
-  const { bottom } = useSafeAreaInsets()
+  const { platformListPaddingBottom } = useFilterContext()
   const theme = useTheme()
 
   return StyleSheet.create({
     flatlistContainer: {
-      paddingBottom: Platform.select({
-        ios: 64 + bottom,
-        android: 16 + bottom,
-      }),
+      paddingBottom: platformListPaddingBottom,
     },
     section: {},
     sectionHeader: {

package/src/screens/conversation_filters/context/conversation_filter_context.tsx

@@ -2,15 +2,21 @@ import React from 'react'
 import { createContext, PropsWithChildren, useState } from 'react'
 import { ConversationFiltersParams, ConversationFiltersScreenProps } from '../screen_props'
 import { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
+import { Platform } from 'react-native'
+
+const DEFAULT_LIST_PADDING_BOTTOM = 64
 
 export const FilterContext = createContext<{
   params: ConversationFiltersParams
   scrollOffset: number
   setScrollOffset: (offset: number) => void
+  setFormSheetHeaderHeight: (height: number) => void
   resetFilter: () => void
   setGroupFilter: (params: ConversationFiltersParams) => void
   setAppFilter: (params: ConversationFiltersParams) => void
   applyFilters: (params: ConversationFiltersParams) => void
+  platformListPaddingBottom: number | undefined
 }>({
   params: {
     chat_group_graph_id: undefined,
@@ -18,20 +24,32 @@ export const FilterContext = createContext<{
   },
   scrollOffset: 0,
   setScrollOffset: () => {},
+  setFormSheetHeaderHeight: () => {},
   resetFilter: () => {},
   setGroupFilter: () => {},
   setAppFilter: () => {},
   applyFilters: () => {},
+  platformListPaddingBottom: DEFAULT_LIST_PADDING_BOTTOM,
 })
 
 export const FilterProvider = ({ children }: PropsWithChildren) => {
   const [scrollOffset, setScrollOffset] = useState(0)
+  const [formSheetHeaderHeight, setFormSheetHeaderHeight] = useState(56)
   const navigation = useNavigation()
   const route = useRoute<RouteProp<ConversationFiltersScreenProps['route']>>()
+  const { bottom } = useSafeAreaInsets()
+
+  const platformListPaddingBottom = Platform.select({
+    ios: bottom + formSheetHeaderHeight,
+    android: bottom + 12,
+  })
+
   const filterContextValue = {
     params: route.params,
     scrollOffset,
     setScrollOffset,
+    platformListPaddingBottom,
+    setFormSheetHeaderHeight,
     resetFilter: () => {
       navigation.dispatch(
         StackActions.popTo('Conversations', {

package/src/screens/conversation_filters/group_filters.tsx

@@ -7,7 +7,6 @@ import { StaticScreenProps } from '@react-navigation/native'
 import { useGroupsToFilter } from './hooks/filters'
 import { GroupRow } from './components/rows'
 import { useFilterContext } from './context/conversation_filter_context'
-import { useSafeAreaInsets } from 'react-native-safe-area-context'
 
 export type GroupFiltersScreenProps = StaticScreenProps<ConversationFiltersParams>
 
@@ -32,10 +31,10 @@ export const GroupFilters = () => {
 }
 
 const useStyles = () => {
-  const { bottom } = useSafeAreaInsets()
+  const { platformListPaddingBottom } = useFilterContext()
   return StyleSheet.create({
     container: {
-      paddingBottom: bottom + 12,
+      paddingBottom: platformListPaddingBottom,
     },
   })
 }

package/src/screens/conversation_filters/team_filters.tsx

@@ -7,7 +7,6 @@ import { TeamRow } from './components/rows'
 import { useFilterContext } from './context/conversation_filter_context'
 import { useTeamsToFilter } from './hooks/filters'
 import { ConversationFiltersParams } from './screen_props'
-import { useSafeAreaInsets } from 'react-native-safe-area-context'
 
 export type GroupFiltersScreenProps = StaticScreenProps<ConversationFiltersParams>
 
@@ -32,10 +31,11 @@ export const TeamFilters = () => {
 }
 
 const useStyles = () => {
-  const { bottom } = useSafeAreaInsets()
+  const { platformListPaddingBottom } = useFilterContext()
+
   return StyleSheet.create({
     container: {
-      paddingBottom: bottom + 12,
+      paddingBottom: platformListPaddingBottom,
     },
   })
 }

package/src/screens/conversation_filters_screen.tsx

@@ -1,8 +1,8 @@
 import { useHeaderHeight } from '@react-navigation/elements'
 import { createComponentForStaticNavigation, RouteProp, useRoute } from '@react-navigation/native'
 import { createNativeStackNavigator } from '@react-navigation/native-stack'
-import React from 'react'
-import { Platform, StyleSheet, useWindowDimensions } from 'react-native'
+import React, { useCallback } from 'react'
+import { LayoutChangeEvent, Platform, StyleSheet, useWindowDimensions, View } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import {
   FilterProvider,
@@ -74,18 +74,27 @@ export const ConversationFiltersScreen = (_props: ConversationFiltersScreenProps
 }
 
 const FormSheetHeaderWithContext = () => {
-  const { resetFilter, applyFilters } = useFilterContext()
+  const { resetFilter, applyFilters, setFormSheetHeaderHeight } = useFilterContext()
   const route = useRoute<RouteProp<ConversationFiltersScreenProps['route']>>()
   const styles = useStyles()
 
+  const handleFormSheetHeaderLayout = useCallback(
+    (event: LayoutChangeEvent) => {
+      setFormSheetHeaderHeight(event.nativeEvent.layout.height)
+    },
+    [setFormSheetHeaderHeight]
+  )
+
   return (
-    <FormSheet.Header style={styles.header}>
-      <FormSheet.HeaderTitle>Filters</FormSheet.HeaderTitle>
-      <FormSheet.HeaderActions>
-        <FormSheet.HeaderTextButton onPress={resetFilter}>Reset</FormSheet.HeaderTextButton>
-        <FormSheet.HeaderButton title="Apply" onPress={() => applyFilters(route.params)} />
-      </FormSheet.HeaderActions>
-    </FormSheet.Header>
+    <View onLayout={handleFormSheetHeaderLayout}>
+      <FormSheet.Header style={styles.header}>
+        <FormSheet.HeaderTitle>Filters</FormSheet.HeaderTitle>
+        <FormSheet.HeaderActions>
+          <FormSheet.HeaderTextButton onPress={resetFilter}>Reset</FormSheet.HeaderTextButton>
+          <FormSheet.HeaderButton title="Apply" onPress={() => applyFilters(route.params)} />
+        </FormSheet.HeaderActions>
+      </FormSheet.Header>
+    </View>
   )
 }
 

package/src/screens/reactions_screen.tsx

@@ -120,6 +120,8 @@ const Author = memo(({ author }: { author: AuthorProps }) => {
   )
 })
 
+const TABS_HEIGHT = 67
+
 const useStyles = () => {
   const { colors } = useTheme()
   const { bottom } = useSafeAreaInsets()
@@ -131,7 +133,7 @@ const useStyles = () => {
     },
     contentContainer: {
       paddingTop: 8,
-      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
+      paddingBottom: bottom + Platform.select({ android: 24, default: TABS_HEIGHT + 24 }),
     },
     authorRow: {
       flexDirection: 'row',