@planningcenter/chat-react-native 4.4.1-qa-staging.15 → 4.4.1-qa-staging.17

package/build/screens/conversation_filters_screen.js

@@ -7,6 +7,7 @@ import React, { useCallback } from 'react';
 import { Platform, StyleSheet, useWindowDimensions, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet';
+import { useFilterDropdownEnabled } from '../hooks/use_filter_dropdown_enabled';
 import { ConversationFilters } from './conversation_filters/components/conversation_filters';
 import { FilterProvider, useFilterContext } from './conversation_filters/context/conversation_filter_context';
 import { GroupFilters } from './conversation_filters/group_filters';
@@ -100,13 +101,14 @@ export const ConversationFiltersScreen = _props => {
   return t2;
 };
 const FormSheetHeaderWithContext = () => {
-  const $ = _c(17);
+  const $ = _c(19);
   const {
     resetFilter,
     applyFilters,
     setFormSheetHeaderHeight
   } = useFilterContext();
   const route = useRoute();
+  const filterDropdownEnabled = useFilterDropdownEnabled();
   const styles = useStyles();
   let t0;
   if ($[0] !== setFormSheetHeaderHeight) {
@@ -119,74 +121,77 @@ const FormSheetHeaderWithContext = () => {
     t0 = $[1];
   }
   const handleFormSheetHeaderLayout = t0;
-  let t1;
-  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-    t1 = /*#__PURE__*/_jsx(FormSheet.HeaderTitle, {
-      children: "Filters"
+  const t1 = filterDropdownEnabled ? "More filters" : "Filters";
+  let t2;
+  if ($[2] !== t1) {
+    t2 = /*#__PURE__*/_jsx(FormSheet.HeaderTitle, {
+      children: t1
     });
     $[2] = t1;
+    $[3] = t2;
   } else {
-    t1 = $[2];
+    t2 = $[3];
   }
-  let t2;
-  if ($[3] !== resetFilter) {
-    t2 = /*#__PURE__*/_jsx(FormSheet.HeaderTextButton, {
+  let t3;
+  if ($[4] !== resetFilter) {
+    t3 = /*#__PURE__*/_jsx(FormSheet.HeaderTextButton, {
       onPress: resetFilter,
       children: "Reset"
     });
-    $[3] = resetFilter;
-    $[4] = t2;
+    $[4] = resetFilter;
+    $[5] = t3;
   } else {
-    t2 = $[4];
+    t3 = $[5];
   }
-  let t3;
-  if ($[5] !== applyFilters || $[6] !== route.params) {
-    t3 = /*#__PURE__*/_jsx(FormSheet.HeaderButton, {
+  let t4;
+  if ($[6] !== applyFilters || $[7] !== route.params) {
+    t4 = /*#__PURE__*/_jsx(FormSheet.HeaderButton, {
       title: "Apply",
       onPress: () => applyFilters(route.params)
     });
-    $[5] = applyFilters;
-    $[6] = route.params;
-    $[7] = t3;
+    $[6] = applyFilters;
+    $[7] = route.params;
+    $[8] = t4;
   } else {
-    t3 = $[7];
+    t4 = $[8];
   }
-  let t4;
-  if ($[8] !== t2 || $[9] !== t3) {
-    t4 = /*#__PURE__*/_jsxs(FormSheet.HeaderActions, {
-      children: [t2, t3]
+  let t5;
+  if ($[9] !== t3 || $[10] !== t4) {
+    t5 = /*#__PURE__*/_jsxs(FormSheet.HeaderActions, {
+      children: [t3, t4]
     });
-    $[8] = t2;
     $[9] = t3;
     $[10] = t4;
+    $[11] = t5;
   } else {
-    t4 = $[10];
+    t5 = $[11];
   }
-  let t5;
-  if ($[11] !== styles.header || $[12] !== t4) {
-    t5 = /*#__PURE__*/_jsxs(FormSheet.Header, {
+  let t6;
+  if ($[12] !== styles.header || $[13] !== t2 || $[14] !== t5) {
+    t6 = /*#__PURE__*/_jsxs(FormSheet.Header, {
       style: styles.header,
-      children: [t1, t4]
+      children: [t2, t5]
     });
-    $[11] = styles.header;
-    $[12] = t4;
-    $[13] = t5;
+    $[12] = styles.header;
+    $[13] = t2;
+    $[14] = t5;
+    $[15] = t6;
   } else {
-    t5 = $[13];
+    t6 = $[15];
   }
-  let t6;
-  if ($[14] !== handleFormSheetHeaderLayout || $[15] !== t5) {
-    t6 = /*#__PURE__*/_jsx(View, {
+  let t7;
+  if ($[16] !== handleFormSheetHeaderLayout || $[17] !== t6) {
+    t7 = /*#__PURE__*/_jsx(View, {
       onLayout: handleFormSheetHeaderLayout,
-      children: t5
+      children: t6
     });
-    $[14] = handleFormSheetHeaderLayout;
-    $[15] = t5;
-    $[16] = t6;
+    $[16] = handleFormSheetHeaderLayout;
+    $[17] = t6;
+    $[18] = t7;
   } else {
-    t6 = $[16];
+    t7 = $[18];
   }
-  return t6;
+  return t7;
 };
 const useStyles = () => {
   const $ = _c(4);

package/build/screens/conversation_filters_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filters_screen.js","names":["useHeaderHeight","ReactNavigationNative","useRoute","createNativeStackNavigator","React","useCallback","Platform","StyleSheet","useWindowDimensions","View","useSafeAreaInsets","FormSheet","getFormSheetScreenOptions","ConversationFilters","FilterProvider","useFilterContext","GroupFilters","TeamFilters","jsx","_jsx","jsxs","_jsxs","ConversationFiltersScreenOptions","presentation","select","android","ios","sheetAllowedDetents","default","headerTitle","FilterNavigator","initialRouteName","screens","Filters","screen","options","headerShown","headerBackTitle","createStaticNavigationComponent","tree","name","getComponent","createComponentForStaticNavigation","ConversationFiltersScreen","_props","$","_c","styles","useStyles","t0","t1","Symbol","for","FormSheetHeaderWithContext","t2","contentContainer","children","Root","contentStyle","showAndroidSheetGrabber","resetFilter","applyFilters","setFormSheetHeaderHeight","route","event","nativeEvent","layout","height","handleFormSheetHeaderLayout","HeaderTitle","HeaderTextButton","t3","params","HeaderButton","title","onPress","t4","HeaderActions","t5","header","Header","style","t6","top","headerHeight","containerHeight","create","paddingTop","borderBottomWidth"],"sources":["../../src/screens/conversation_filters_screen.tsx"],"sourcesContent":["import { useHeaderHeight } from '@react-navigation/elements'\nimport * as ReactNavigationNative from '@react-navigation/native'\nimport { 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 FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { ConversationFilters } from './conversation_filters/components/conversation_filters'\nimport {\n  FilterProvider,\n  useFilterContext,\n} from './conversation_filters/context/conversation_filter_context'\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'\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\n// tree.getComponent() doesn't exist on every host's installed\n// react-navigation/core — hosts on an older version would throw here.\n// Where it does exist, it's the real implementation (the \"deprecated\"\n// createComponentForStaticNavigation is just a console.warn wrapper around\n// the same call on current versions), so prefer it and only reach for the\n// old function on cores where getComponent() genuinely isn't there yet.\nfunction createStaticNavigationComponent<P extends object>(\n  tree: { getComponent?: () => React.ComponentType<P> },\n  name: string\n): React.ComponentType<P> {\n  if (typeof tree.getComponent === 'function') return tree.getComponent()\n\n  const { createComponentForStaticNavigation } = ReactNavigationNative as {\n    createComponentForStaticNavigation: (tree: unknown, name: string) => React.ComponentType<P>\n  }\n\n  return createComponentForStaticNavigation(tree, name)\n}\n\nconst Filters = createStaticNavigationComponent(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      // The filter list scrolls under it, so the sheet header doesn't need a\n      // separator the way the non-scrolling reaction sheet does.\n      borderBottomWidth: 0,\n    },\n  })\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"conversation_filters_screen.js","names":["useHeaderHeight","ReactNavigationNative","useRoute","createNativeStackNavigator","React","useCallback","Platform","StyleSheet","useWindowDimensions","View","useSafeAreaInsets","FormSheet","getFormSheetScreenOptions","useFilterDropdownEnabled","ConversationFilters","FilterProvider","useFilterContext","GroupFilters","TeamFilters","jsx","_jsx","jsxs","_jsxs","ConversationFiltersScreenOptions","presentation","select","android","ios","sheetAllowedDetents","default","headerTitle","FilterNavigator","initialRouteName","screens","Filters","screen","options","headerShown","headerBackTitle","createStaticNavigationComponent","tree","name","getComponent","createComponentForStaticNavigation","ConversationFiltersScreen","_props","$","_c","styles","useStyles","t0","t1","Symbol","for","FormSheetHeaderWithContext","t2","contentContainer","children","Root","contentStyle","showAndroidSheetGrabber","resetFilter","applyFilters","setFormSheetHeaderHeight","route","filterDropdownEnabled","event","nativeEvent","layout","height","handleFormSheetHeaderLayout","HeaderTitle","t3","HeaderTextButton","t4","params","HeaderButton","title","onPress","t5","HeaderActions","t6","header","Header","style","t7","top","headerHeight","containerHeight","create","paddingTop","borderBottomWidth"],"sources":["../../src/screens/conversation_filters_screen.tsx"],"sourcesContent":["import { useHeaderHeight } from '@react-navigation/elements'\nimport * as ReactNavigationNative from '@react-navigation/native'\nimport { 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 FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useFilterDropdownEnabled } from '../hooks/use_filter_dropdown_enabled'\nimport { ConversationFilters } from './conversation_filters/components/conversation_filters'\nimport {\n  FilterProvider,\n  useFilterContext,\n} from './conversation_filters/context/conversation_filter_context'\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'\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\n// tree.getComponent() doesn't exist on every host's installed\n// react-navigation/core — hosts on an older version would throw here.\n// Where it does exist, it's the real implementation (the \"deprecated\"\n// createComponentForStaticNavigation is just a console.warn wrapper around\n// the same call on current versions), so prefer it and only reach for the\n// old function on cores where getComponent() genuinely isn't there yet.\nfunction createStaticNavigationComponent<P extends object>(\n  tree: { getComponent?: () => React.ComponentType<P> },\n  name: string\n): React.ComponentType<P> {\n  if (typeof tree.getComponent === 'function') return tree.getComponent()\n\n  const { createComponentForStaticNavigation } = ReactNavigationNative as {\n    createComponentForStaticNavigation: (tree: unknown, name: string) => React.ComponentType<P>\n  }\n\n  return createComponentForStaticNavigation(tree, name)\n}\n\nconst Filters = createStaticNavigationComponent(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 filterDropdownEnabled = useFilterDropdownEnabled()\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>\n          {filterDropdownEnabled ? 'More filters' : 'Filters'}\n        </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      // The filter list scrolls under it, so the sheet header doesn't need a\n      // separator the way the non-scrolling reaction sheet does.\n      borderBottomWidth: 0,\n    },\n  })\n}\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "4.4.1-qa-staging.15",
+  "version": "4.4.1-qa-staging.17",
   "description": "",
   "repository": {
     "type": "git",
@@ -33,7 +33,7 @@
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^7.2.0",
     "@fortawesome/react-native-fontawesome": "^0.3.2",
-    "@planningcenter/emoji-keyboard": "4.4.1-qa-staging.15",
+    "@planningcenter/emoji-keyboard": "4.4.1-qa-staging.17",
     "lodash-inflection": "^1.5.0"
   },
   "peerDependencies": {
@@ -84,5 +84,5 @@
     "sf-symbols-typescript": "^2.2.0",
     "typescript": "~6.0.3"
   },
-  "gitHead": "810a097ac7d4e1d4eeb6ea64a0516e62dd8e0a2c"
+  "gitHead": "3f42f16e64f443ba3e1b2c24298954ecc380b52a"
 }

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

@@ -0,0 +1,129 @@
+import { DefaultTheme, ThemeProvider } from '@react-navigation/native'
+import { render } from '@testing-library/react-native'
+import React from 'react'
+import { SafeAreaProvider } from 'react-native-safe-area-context'
+import { useFilterDropdownEnabled } from '../../../../hooks/use_filter_dropdown_enabled'
+import { ConversationFilters } from '../../../../screens/conversation_filters/components/conversation_filters'
+import { FilterContext } from '../../../../screens/conversation_filters/context/conversation_filter_context'
+import { FilterTypes } from '../../../../screens/conversation_filters/filter_types'
+import { GroupResource } from '../../../../types/resources/group_resource'
+
+jest.mock('react-native-gesture-handler', () => {
+  const { FlatList } = jest.requireActual('react-native')
+  const ReactActual = jest.requireActual('react')
+
+  return {
+    FlatList: (props: object) =>
+      ReactActual.createElement(FlatList, { ...props, initialNumToRender: 50 }),
+  }
+})
+jest.mock('@react-navigation/native', () => ({
+  ...jest.requireActual('@react-navigation/native'),
+  useNavigation: () => ({ navigate: jest.fn(), dispatch: jest.fn(), setParams: jest.fn() }),
+}))
+jest.mock('../../../../hooks/use_api_client', () => ({ useApiClient: () => ({}) }))
+jest.mock('../../../../hooks/use_filter_dropdown_enabled', () => ({
+  useFilterDropdownEnabled: jest.fn(() => false),
+}))
+jest.mock('../../../../hooks/use_direct_messages_eligible', () => ({
+  useDirectMessagesEligible: () => true,
+}))
+jest.mock('../../../../hooks/use_has_direct_messages', () => ({
+  useHasDirectMessages: () => true,
+}))
+jest.mock('../../../../hooks/services/use_services_team', () => ({
+  useServicesTeamsMap: () => ({}),
+}))
+jest.mock('../../../../screens/conversation_filters/hooks/filters', () => ({
+  useGroupsToFilter: () => ({ groups: mockGroups }),
+  useTeamsToFilter: () => ({ teams: mockTeams }),
+}))
+
+const buildGroup = (id: number, name: string): GroupResource => ({
+  id: `Groups-Group-${id}`,
+  type: 'Group',
+  links: { self: '' },
+  name,
+  sourceAppName: 'Groups',
+  sourceType: 'Group',
+})
+
+const buildTeam = (id: number, name: string): GroupResource => ({
+  id: `Services-Team-${id}`,
+  type: 'Group',
+  links: { self: '' },
+  name,
+  sourceAppName: 'Services',
+  sourceType: 'Team',
+})
+
+const mockGroups = Array.from({ length: 6 }, (_, i) => buildGroup(i + 1, `Group ${i + 1}`))
+const mockTeams = [buildTeam(1, 'Worship Team')]
+
+const mockedFilterDropdownEnabled = jest.mocked(useFilterDropdownEnabled)
+
+const safeAreaMetrics = {
+  frame: { x: 0, y: 0, width: 390, height: 844 },
+  insets: { top: 0, right: 0, bottom: 0, left: 0 },
+}
+
+const renderFilters = () =>
+  render(
+    <SafeAreaProvider initialMetrics={safeAreaMetrics}>
+      <ThemeProvider value={DefaultTheme}>
+        <FilterContext.Provider
+          value={{
+            params: {},
+            scrollOffset: 0,
+            setScrollOffset: jest.fn(),
+            setFormSheetHeaderHeight: jest.fn(),
+            resetFilter: jest.fn(),
+            setGroupFilter: jest.fn(),
+            setAppFilter: jest.fn(),
+            applyFilters: jest.fn(),
+            platformListPaddingBottom: 0,
+          }}
+        >
+          <ConversationFilters />
+        </FilterContext.Provider>
+      </ThemeProvider>
+    </SafeAreaProvider>
+  )
+
+const generalFilterLabels = [
+  'General Filters',
+  FilterTypes.All,
+  FilterTypes.Groups,
+  FilterTypes.Teams,
+  FilterTypes.DirectMessages,
+]
+
+describe('ConversationFilters', () => {
+  beforeEach(() => {
+    jest.clearAllMocks()
+  })
+
+  it('renders the General Filters section when the filter dropdown is off', () => {
+    mockedFilterDropdownEnabled.mockReturnValue(false)
+
+    const { getByText } = renderFilters()
+
+    generalFilterLabels.forEach(label => expect(getByText(label)).toBeTruthy())
+    expect(getByText('Groups')).toBeTruthy()
+    expect(getByText('Teams')).toBeTruthy()
+  })
+
+  it('hides the General Filters section but keeps Groups and Teams when the filter dropdown is on', () => {
+    mockedFilterDropdownEnabled.mockReturnValue(true)
+
+    const { getByText, queryByText, getAllByText } = renderFilters()
+
+    generalFilterLabels.forEach(label => expect(queryByText(label)).toBeNull())
+    expect(getByText('Groups')).toBeTruthy()
+    expect(getByText('Teams')).toBeTruthy()
+    expect(getByText('Group 1')).toBeTruthy()
+    expect(queryByText('Group 6')).toBeNull()
+    expect(getByText('Worship Team')).toBeTruthy()
+    expect(getAllByText('View more')).toHaveLength(1)
+  })
+})

package/src/__tests__/screens/conversation_new/components/services_form.test.tsx

@@ -9,6 +9,7 @@ import { ServicesForm } from '../../../../screens/conversation_new/components/se
 jest.mock('react-native-reanimated', () => ({
   ...jest.requireActual('react-native-reanimated/mock'),
   LayoutAnimationConfig: ({ children }: { children: React.ReactNode }) => children,
+  useReducedMotion: () => false,
 }))
 jest.mock('@react-navigation/native', () => ({
   ...jest.requireActual('@react-navigation/native'),

package/src/components/conversation/reply_shadow_message.tsx

@@ -110,7 +110,7 @@ function ShadowMessageContent({ conversation_id, ...message }: ShadowMessageCont
       accessibilityRole="link"
     >
       <Animated.View style={[StyleSheet.absoluteFill, animatedBackgroundColor]} />
-      <View style={styles.message}>
+      <View style={[styles.message, { marginBottom: -SPACE_BELOW_PRESSABLE }]}>
         {!message.mine && (
           <View>
             <View style={[styles.avatarWrapper, !isDeleted && styles.avatarOpacity]}>
@@ -297,7 +297,6 @@ const useStyles = ({ mine, imageWidth = 32, imageHeight = 32 }: StylesProps = {}
       gap: 8,
       flexDirection: mine ? 'row-reverse' : 'row',
       paddingHorizontal: CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,
-      marginBottom: -SPACE_BELOW_PRESSABLE,
     },
     messageContent: {
       flex: 1,

package/src/components/conversations/__tests__/conversations_blank_state.test.tsx

@@ -0,0 +1,72 @@
+import { fireEvent, render } from '@testing-library/react-native'
+import React from 'react'
+import { ConversationsBlankState } from '../conversations_blank_state'
+
+const mockSetParams = jest.fn()
+const mockUseFilterDropdownEnabled = jest.fn()
+
+jest.mock('@react-navigation/native', () => ({
+  ...jest.requireActual('@react-navigation/native'),
+  useNavigation: () => ({ setParams: mockSetParams }),
+}))
+
+jest.mock('../../../hooks/use_filter_dropdown_enabled', () => ({
+  useFilterDropdownEnabled: () => mockUseFilterDropdownEnabled(),
+}))
+
+describe('ConversationsBlankState', () => {
+  beforeEach(() => {
+    mockSetParams.mockClear()
+  })
+
+  describe('with the filter dropdown on', () => {
+    beforeEach(() => {
+      mockUseFilterDropdownEnabled.mockReturnValue(true)
+    })
+
+    it('offers to view all conversations when a filter is applied', () => {
+      const view = render(
+        <ConversationsBlankState isFilterApplied={true} canCreateConversations={true} />
+      )
+
+      expect(view.getByText('No matches')).toBeTruthy()
+      expect(view.queryByText('No conversations yet.')).toBeNull()
+
+      fireEvent.press(view.getByText('View all conversations'))
+
+      expect(mockSetParams).toHaveBeenCalledTimes(1)
+      expect(mockSetParams.mock.calls[0][0]).toStrictEqual({
+        title: undefined,
+        chat_group_graph_id: undefined,
+        group_source_app_name: undefined,
+        show_direct_messages: undefined,
+      })
+    })
+
+    it('keeps the compose prompt when no filter is applied', () => {
+      const view = render(
+        <ConversationsBlankState isFilterApplied={false} canCreateConversations={true} />
+      )
+
+      expect(view.getByText('No conversations yet.')).toBeTruthy()
+      expect(view.getByText('Tap the compose button to get started.')).toBeTruthy()
+      expect(view.queryByText('View all conversations')).toBeNull()
+    })
+  })
+
+  describe('with the filter dropdown off', () => {
+    beforeEach(() => {
+      mockUseFilterDropdownEnabled.mockReturnValue(false)
+    })
+
+    it('keeps the adjust-your-filters copy when a filter is applied', () => {
+      const view = render(
+        <ConversationsBlankState isFilterApplied={true} canCreateConversations={true} />
+      )
+
+      expect(view.getByText('No conversations yet.')).toBeTruthy()
+      expect(view.getByText('Adjust your filters to find conversations.')).toBeTruthy()
+      expect(view.queryByText('View all conversations')).toBeNull()
+    })
+  })
+})

package/src/components/conversations/conversations.tsx

@@ -5,9 +5,11 @@ import { useConversationsContext } from '../../contexts/conversations_context'
 import { useTheme } from '../../hooks'
 import { useCanCreateConversations } from '../../hooks/use_chat_permissions'
 import { useConversationsJoltEvents } from '../../hooks/use_conversations_jolt_events'
+import { useFilterDropdownEnabled } from '../../hooks/use_filter_dropdown_enabled'
 import { ConversationResource } from '../../types'
 import { ConversationPreview, ConversationPreviewSkeleton } from './conversation_preview'
 import { ConversationsBlankState } from './conversations_blank_state'
+import { FilteredResultsFooter } from './filtered_results_footer'
 
 interface ConversationsProps {
   ListHeaderComponent?:
@@ -26,11 +28,19 @@ export const Conversations = ({ ListHeaderComponent }: ConversationsProps) => {
     refetch,
     isRefetching,
     isFetched,
-    args: { chat_group_graph_id, group_source_app_name },
+    hasNextPage,
+    args: { chat_group_graph_id, group_source_app_name, show_direct_messages },
   } = useConversationsContext()
   const navigation = useNavigation()
   const canCreateConversations = useCanCreateConversations()
-  const isFilterApplied = !!chat_group_graph_id || !!group_source_app_name
+  const filterDropdownEnabled = useFilterDropdownEnabled()
+  const isFilterApplied = !!chat_group_graph_id || !!group_source_app_name || !!show_direct_messages
+  const showFilteredResultsFooter =
+    filterDropdownEnabled &&
+    isFilterApplied &&
+    !hasNextPage &&
+    !isLoading &&
+    conversations.length > 0
 
   const showBadges = !chat_group_graph_id
 
@@ -62,6 +72,7 @@ export const Conversations = ({ ListHeaderComponent }: ConversationsProps) => {
             canCreateConversations={canCreateConversations}
           />
         }
+        ListFooterComponent={showFilteredResultsFooter ? <FilteredResultsFooter /> : null}
         renderItem={({ item }) => {
           if (item.type === 'loading') {
             return <ConversationPreviewSkeleton />

package/src/components/conversations/conversations_blank_state.tsx

@@ -1,5 +1,7 @@
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
+import { useClearConversationFilters } from '../../hooks/use_clear_conversation_filters'
+import { useFilterDropdownEnabled } from '../../hooks/use_filter_dropdown_enabled'
 import BlankState from '../primitive/blank_state_primitive'
 
 interface ConversationsBlankStateProps {
@@ -11,6 +13,25 @@ export function ConversationsBlankState({
   isFilterApplied,
   canCreateConversations,
 }: ConversationsBlankStateProps) {
+  const filterDropdownEnabled = useFilterDropdownEnabled()
+  const clearFilters = useClearConversationFilters()
+
+  if (filterDropdownEnabled && isFilterApplied) {
+    return (
+      <View style={styles.container}>
+        <BlankState.Root>
+          <BlankState.Imagery name="general.outlinedTextMessage" />
+          <BlankState.Content>
+            <BlankState.Heading>No matches</BlankState.Heading>
+          </BlankState.Content>
+          <BlankState.TextButton onPress={clearFilters}>
+            View all conversations
+          </BlankState.TextButton>
+        </BlankState.Root>
+      </View>
+    )
+  }
+
   return (
     <View style={styles.container}>
       <BlankState.Root>

package/src/components/conversations/filtered_results_footer.tsx

@@ -0,0 +1,38 @@
+import React from 'react'
+import { StyleSheet, View } from 'react-native'
+import { useTheme } from '../../hooks'
+import { useClearConversationFilters } from '../../hooks/use_clear_conversation_filters'
+import { Text, TextButton } from '../display'
+
+export function FilteredResultsFooter() {
+  const styles = useStyles()
+  const clearFilters = useClearConversationFilters()
+
+  return (
+    <View style={styles.container}>
+      <Text variant="tertiary" style={styles.text}>
+        You&rsquo;re viewing filtered results
+      </Text>
+      <TextButton variant="tertiary" onPress={clearFilters}>
+        View all conversations
+      </TextButton>
+    </View>
+  )
+}
+
+const useStyles = () => {
+  const { colors } = useTheme()
+
+  return StyleSheet.create({
+    container: {
+      alignItems: 'center',
+      gap: 8,
+      paddingHorizontal: 16,
+      paddingVertical: 24,
+    },
+    text: {
+      textAlign: 'center',
+      color: colors.textColorDefaultSecondary,
+    },
+  })
+}

package/src/hooks/__tests__/use_reduce_motion.test.tsx

@@ -1,5 +1,6 @@
 import { act, renderHook, waitFor } from '@testing-library/react-native'
 import { AccessibilityInfo, EmitterSubscription } from 'react-native'
+import * as Reanimated from 'react-native-reanimated'
 import { useReduceMotion } from '../use_reduce_motion'
 
 type ReduceMotionListener = (enabled: boolean) => void
@@ -11,6 +12,7 @@ describe('useReduceMotion', () => {
   beforeEach(() => {
     listener = undefined
     remove.mockClear()
+    jest.spyOn(Reanimated, 'useReducedMotion').mockReturnValue(false)
     jest.spyOn(AccessibilityInfo, 'isReduceMotionEnabled').mockResolvedValue(true)
     const addEventListener: typeof AccessibilityInfo.addEventListener = (_event, handler) => {
       listener = handler as ReduceMotionListener
@@ -21,7 +23,17 @@ describe('useReduceMotion', () => {
 
   afterEach(() => jest.restoreAllMocks())
 
-  it('seeds from the system setting', async () => {
+  it('seeds synchronously from the launch-time setting', async () => {
+    jest.spyOn(Reanimated, 'useReducedMotion').mockReturnValue(true)
+    jest.mocked(AccessibilityInfo.isReduceMotionEnabled).mockResolvedValue(false)
+
+    const { result } = renderHook(() => useReduceMotion())
+
+    expect(result.current).toBe(true)
+    await waitFor(() => expect(result.current).toBe(false))
+  })
+
+  it('updates to the live setting once it resolves', async () => {
     const { result } = renderHook(() => useReduceMotion())
 
     expect(result.current).toBe(false)

package/src/hooks/use_clear_conversation_filters.ts

@@ -0,0 +1,15 @@
+import { useNavigation } from '@react-navigation/native'
+import { useCallback } from 'react'
+
+export function useClearConversationFilters() {
+  const navigation = useNavigation()
+
+  return useCallback(() => {
+    navigation.setParams({
+      title: undefined,
+      chat_group_graph_id: undefined,
+      group_source_app_name: undefined,
+      show_direct_messages: undefined,
+    })
+  }, [navigation])
+}

package/src/hooks/use_reduce_motion.ts

@@ -1,8 +1,9 @@
 import { useEffect, useState } from 'react'
 import { AccessibilityInfo } from 'react-native'
+import { useReducedMotion } from 'react-native-reanimated'
 
 export const useReduceMotion = () => {
-  const [reduceMotion, setReduceMotion] = useState(false)
+  const [reduceMotion, setReduceMotion] = useState(useReducedMotion())
 
   useEffect(() => {
     AccessibilityInfo.isReduceMotionEnabled().then(setReduceMotion)