@planningcenter/chat-react-native 3.24.0-rc.6 → 3.24.0-rc.8

package/build/screens/preferred_app/hooks/use_chat_types.d.ts

@@ -0,0 +1,39 @@
+import { ResourceObject } from '../../../types';
+export type SourceAppName = 'Services' | 'Church Center';
+export type PreferredApp = 'Services' | 'Church Center' | 'Chat' | 'None';
+export interface ChatTypeResource extends ResourceObject {
+    type: 'ChatType';
+    defaultPreferredApp: PreferredApp;
+    preferredApp: PreferredApp;
+    preferredAppOptions: PreferredApp[];
+    sourceAppName: SourceAppName;
+    title: string;
+}
+export declare const useChatTypes: () => {
+    error: import("../../../types").FailedResponse | null;
+    status: "success" | "error";
+    isError: boolean;
+    isPending: false;
+    isLoading: false;
+    isLoadingError: false;
+    isRefetchError: boolean;
+    isSuccess: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: import("../../../types").FailedResponse | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<import("../../../types").ApiResource<ChatTypeResource[]>, import("../../../types").FailedResponse>>;
+    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    data: ChatTypeResource[];
+    links: Record<string, string>;
+    meta: Record<string, unknown>;
+};
+//# sourceMappingURL=use_chat_types.d.ts.map

package/build/screens/preferred_app/hooks/use_chat_types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use_chat_types.d.ts","sourceRoot":"","sources":["../../../../src/screens/preferred_app/hooks/use_chat_types.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,eAAe,CAAA;AACxD,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG,eAAe,GAAG,MAAM,GAAG,MAAM,CAAA;AAEzE,MAAM,WAAW,gBAAiB,SAAQ,cAAc;IACtD,IAAI,EAAE,UAAU,CAAA;IAChB,mBAAmB,EAAE,YAAY,CAAA;IACjC,YAAY,EAAE,YAAY,CAAA;IAC1B,mBAAmB,EAAE,YAAY,EAAE,CAAA;IACnC,aAAa,EAAE,aAAa,CAAA;IAC5B,KAAK,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;CASxB,CAAA"}

package/build/screens/preferred_app/hooks/use_chat_types.js

@@ -0,0 +1,12 @@
+import { useSuspenseGet } from '../../../hooks';
+export const useChatTypes = () => {
+    return useSuspenseGet({
+        url: '/me/chat_types',
+        data: {
+            fields: {
+                ChatType: [],
+            },
+        },
+    });
+};
+//# sourceMappingURL=use_chat_types.js.map

package/build/screens/preferred_app/hooks/use_chat_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use_chat_types.js","sourceRoot":"","sources":["../../../../src/screens/preferred_app/hooks/use_chat_types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAe/C,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,OAAO,cAAc,CAAqB;QACxC,GAAG,EAAE,gBAAgB;QACrB,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,EAAE;aACb;SACF;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useSuspenseGet } from '../../../hooks'\nimport { ResourceObject } from '../../../types'\n\nexport type SourceAppName = 'Services' | 'Church Center'\nexport type PreferredApp = 'Services' | 'Church Center' | 'Chat' | 'None'\n\nexport interface ChatTypeResource extends ResourceObject {\n  type: 'ChatType'\n  defaultPreferredApp: PreferredApp\n  preferredApp: PreferredApp\n  preferredAppOptions: PreferredApp[]\n  sourceAppName: SourceAppName\n  title: string\n}\n\nexport const useChatTypes = () => {\n  return useSuspenseGet<ChatTypeResource[]>({\n    url: '/me/chat_types',\n    data: {\n      fields: {\n        ChatType: [],\n      },\n    },\n  })\n}\n"]}

package/build/screens/preferred_app_selection_screen.d.ts

@@ -0,0 +1,10 @@
+import { StaticScreenProps } from '@react-navigation/native';
+import React from 'react';
+import { PreferredApp } from './preferred_app/hooks/use_chat_types';
+export type PreferredAppSelectionScreenProps = StaticScreenProps<{
+    chatTypeId: number | string;
+    conversationType?: 'group' | 'team';
+    currentSelection?: PreferredApp;
+}>;
+export declare function PreferredAppSelectionScreen({ route }: PreferredAppSelectionScreenProps): React.JSX.Element;
+//# sourceMappingURL=preferred_app_selection_screen.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"preferred_app_selection_screen.d.ts","sourceRoot":"","sources":["../../src/screens/preferred_app_selection_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAE5D,OAAO,KAAiC,MAAM,OAAO,CAAA;AAOrD,OAAO,EAAE,YAAY,EAAgB,MAAM,sCAAsC,CAAA;AAIjF,MAAM,MAAM,gCAAgC,GAAG,iBAAiB,CAAC;IAC/D,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,gBAAgB,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IACnC,gBAAgB,CAAC,EAAE,YAAY,CAAA;CAChC,CAAC,CAAA;AAEF,wBAAgB,2BAA2B,CAAC,EAAE,KAAK,EAAE,EAAE,gCAAgC,qBAkDtF"}

package/build/screens/preferred_app_selection_screen.js

@@ -0,0 +1,128 @@
+import { PlatformPressable } from '@react-navigation/elements';
+import { useMutation } from '@tanstack/react-query';
+import React from 'react';
+import { Image, StyleSheet, View } from 'react-native';
+import churchCenterLogo from '../../assets/churchCenter.png';
+import servicesLogo from '../../assets/servicesApp.png';
+import chatLogo from '../../assets/chatLogo.png';
+import { Heading, Icon, Text } from '../components';
+import { useApiClient, useTheme } from '../hooks';
+import { useChatTypes } from './preferred_app/hooks/use_chat_types';
+import { useAppName } from '../hooks/use_app_name';
+import { throwResponseError } from '../utils/response_error';
+export function PreferredAppSelectionScreen({ route }) {
+    const { chatTypeId } = route.params;
+    const { data: chatTypes, refetch: refetchChatTypes } = useChatTypes();
+    const appName = useAppName();
+    const apiClient = useApiClient();
+    const { mutate: updateChatType } = useMutation({
+        throwOnError: true,
+        onSuccess: () => refetchChatTypes(),
+        mutationFn: (app) => {
+            return apiClient.chat
+                .post({
+                url: `/me/chat_types/${chatTypeId}/set_preferred_appz`,
+                data: { data: { type: 'ChatType', attributes: { app } } },
+            })
+                .catch(throwResponseError);
+        },
+    });
+    const chatType = chatTypes.find(t => t.id === chatTypeId);
+    const { preferredAppOptions } = chatType || {};
+    const handleSelection = (app) => {
+        updateChatType(app);
+    };
+    const sectionTitle = `${chatType?.title} Conversations`;
+    return (<View style={styles.container}>
+      <View style={styles.section}>
+        <Heading variant="h3" style={styles.sectionHeading}>
+          {sectionTitle}
+        </Heading>
+        {preferredAppOptions?.sort(sortPreferredApp('asc')).map((option, key) => (<PressableRow key={`${key}-${option}`} isActive={chatType?.preferredApp === option} onPress={() => handleSelection(option)}>
+            <Image source={getAppImage(option)} style={styles.logo}/>
+            <Text>
+              {option}
+              {appName.includes(option.replace(/\s/, '').toLowerCase()) ? ' ( current )' : ''}
+            </Text>
+          </PressableRow>))}
+      </View>
+    </View>);
+}
+const sortPreferredApp = (dir) => (a, b) => {
+    if (a === 'None')
+        return 1;
+    if (a > b)
+        return dir === 'asc' ? 1 : -1;
+    if (b > a)
+        return dir === 'asc' ? -1 : 1;
+    return 0;
+};
+const getAppImage = (option) => {
+    switch (option) {
+        case 'Church Center':
+            return churchCenterLogo;
+        case 'Services':
+            return servicesLogo;
+        case 'Chat':
+            return chatLogo;
+        default:
+            return undefined;
+    }
+};
+const PressableRow = ({ children, isActive, onPress, style, }) => {
+    const styles = useRowStyles({ isActive });
+    return (<PlatformPressable style={styles.pressable} onPress={onPress} accessibilityRole="radio" accessibilityState={{ selected: isActive }}>
+      <View style={styles.row}>
+        <View style={[styles.rowInner, style]}>{children}</View>
+        <Icon name="general.check" style={styles.rowIconRight} accessibilityElementsHidden maxFontSizeMultiplier={2.5}/>
+      </View>
+    </PlatformPressable>);
+};
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    section: {
+        paddingTop: 16,
+    },
+    sectionHeading: {
+        paddingHorizontal: 16,
+        paddingBottom: 4,
+    },
+    logo: {
+        width: 32,
+        height: 32,
+        borderRadius: 8,
+    },
+});
+const useRowStyles = ({ isActive = false } = {}) => {
+    const theme = useTheme();
+    return StyleSheet.create({
+        pressable: {
+            paddingLeft: 16,
+            backgroundColor: theme.colors.surfaceColor100,
+        },
+        row: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            gap: 12,
+            borderBottomWidth: 1,
+            borderBottomColor: theme.colors.borderColorDefaultBase,
+            paddingVertical: 12,
+            paddingRight: 16,
+        },
+        rowInner: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: 12,
+            flexShrink: 1,
+        },
+        rowIconRight: {
+            fontSize: 16,
+            color: theme.colors.statusSuccessIcon,
+            opacity: isActive ? 1 : 0,
+        },
+    });
+};
+//# sourceMappingURL=preferred_app_selection_screen.js.map

package/build/screens/preferred_app_selection_screen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preferred_app_selection_screen.js","sourceRoot":"","sources":["../../src/screens/preferred_app_selection_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport { StaticScreenProps } from '@react-navigation/native'\nimport { useMutation } from '@tanstack/react-query'\nimport React, { type PropsWithChildren } from 'react'\nimport { Image, StyleSheet, View, type ViewStyle } from 'react-native'\nimport churchCenterLogo from '../../assets/churchCenter.png'\nimport servicesLogo from '../../assets/servicesApp.png'\nimport chatLogo from '../../assets/chatLogo.png'\nimport { Heading, Icon, Text } from '../components'\nimport { useApiClient, useTheme } from '../hooks'\nimport { PreferredApp, useChatTypes } from './preferred_app/hooks/use_chat_types'\nimport { useAppName } from '../hooks/use_app_name'\nimport { throwResponseError } from '../utils/response_error'\n\nexport type PreferredAppSelectionScreenProps = StaticScreenProps<{\n  chatTypeId: number | string\n  conversationType?: 'group' | 'team'\n  currentSelection?: PreferredApp\n}>\n\nexport function PreferredAppSelectionScreen({ route }: PreferredAppSelectionScreenProps) {\n  const { chatTypeId } = route.params\n  const { data: chatTypes, refetch: refetchChatTypes } = useChatTypes()\n  const appName = useAppName()\n\n  const apiClient = useApiClient()\n\n  const { mutate: updateChatType } = useMutation({\n    throwOnError: true,\n    onSuccess: () => refetchChatTypes(),\n    mutationFn: (app: PreferredApp) => {\n      return apiClient.chat\n        .post({\n          url: `/me/chat_types/${chatTypeId}/set_preferred_appz`,\n          data: { data: { type: 'ChatType', attributes: { app } } },\n        })\n        .catch(throwResponseError)\n    },\n  })\n  const chatType = chatTypes.find(t => t.id === chatTypeId)\n  const { preferredAppOptions } = chatType || {}\n\n  const handleSelection = (app: PreferredApp) => {\n    updateChatType(app)\n  }\n\n  const sectionTitle = `${chatType?.title} Conversations`\n\n  return (\n    <View style={styles.container}>\n      <View style={styles.section}>\n        <Heading variant=\"h3\" style={styles.sectionHeading}>\n          {sectionTitle}\n        </Heading>\n        {preferredAppOptions?.sort(sortPreferredApp('asc')).map((option, key) => (\n          <PressableRow\n            key={`${key}-${option}`}\n            isActive={chatType?.preferredApp === option}\n            onPress={() => handleSelection(option)}\n          >\n            <Image source={getAppImage(option)} style={styles.logo} />\n            <Text>\n              {option}\n              {appName.includes(option.replace(/\\s/, '').toLowerCase()) ? ' ( current )' : ''}\n            </Text>\n          </PressableRow>\n        ))}\n      </View>\n    </View>\n  )\n}\n\nconst sortPreferredApp = (dir?: 'asc' | 'desc') => (a: PreferredApp, b: PreferredApp) => {\n  if (a === 'None') return 1\n  if (a > b) return dir === 'asc' ? 1 : -1\n  if (b > a) return dir === 'asc' ? -1 : 1\n\n  return 0\n}\n\nconst getAppImage = (option: PreferredApp) => {\n  switch (option) {\n    case 'Church Center':\n      return churchCenterLogo\n    case 'Services':\n      return servicesLogo\n    case 'Chat':\n      return chatLogo\n    default:\n      return undefined\n  }\n}\n\nconst PressableRow = ({\n  children,\n  isActive,\n  onPress,\n  style,\n}: PropsWithChildren<{ isActive: boolean; onPress: () => void; style?: ViewStyle }>) => {\n  const styles = useRowStyles({ isActive })\n  return (\n    <PlatformPressable\n      style={styles.pressable}\n      onPress={onPress}\n      accessibilityRole=\"radio\"\n      accessibilityState={{ selected: isActive }}\n    >\n      <View style={styles.row}>\n        <View style={[styles.rowInner, style]}>{children}</View>\n        <Icon\n          name=\"general.check\"\n          style={styles.rowIconRight}\n          accessibilityElementsHidden\n          maxFontSizeMultiplier={2.5}\n        />\n      </View>\n    </PlatformPressable>\n  )\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  section: {\n    paddingTop: 16,\n  },\n  sectionHeading: {\n    paddingHorizontal: 16,\n    paddingBottom: 4,\n  },\n  logo: {\n    width: 32,\n    height: 32,\n    borderRadius: 8,\n  },\n})\n\nconst useRowStyles = ({ isActive = false }: { isActive?: boolean } = {}) => {\n  const theme = useTheme()\n\n  return StyleSheet.create({\n    pressable: {\n      paddingLeft: 16,\n      backgroundColor: theme.colors.surfaceColor100,\n    },\n    row: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 12,\n      borderBottomWidth: 1,\n      borderBottomColor: theme.colors.borderColorDefaultBase,\n      paddingVertical: 12,\n      paddingRight: 16,\n    },\n    rowInner: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n      flexShrink: 1,\n    },\n    rowIconRight: {\n      fontSize: 16,\n      color: theme.colors.statusSuccessIcon,\n      opacity: isActive ? 1 : 0,\n    },\n  })\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "3.24.0-rc.6",
+  "version": "3.24.0-rc.8",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -58,5 +58,5 @@
     "react-native-url-polyfill": "^2.0.0",
     "typescript": "<5.6.0"
   },
-  "gitHead": "4e06a11b6a26164c5ec2792c2c81f84e5402fab6"
+  "gitHead": "6259e50e7b8ca70aee8b50cc641bc3a6c2d6c11a"
 }

package/src/navigation/index.tsx

@@ -49,6 +49,8 @@ import {
 } from '../screens/message_actions_screen'
 import { MessageReportScreen, MessageReportScreenOptions } from '../screens/message_report_screen'
 import { NotFound } from '../screens/not_found'
+import { NotificationSettingsScreen } from '../screens/notification_settings_screen'
+import { PreferredAppSelectionScreen } from '../screens/preferred_app_selection_screen'
 import { ReactionsScreen, ReactionsScreenOptions } from '../screens/reactions_screen'
 import { ScreenLayoutWithChatAccessGate } from './screenLayout'
 import { SendGiphyScreen, SendGiphyScreenOptions } from '../screens/send_giphy_screen'
@@ -124,6 +126,32 @@ export const NewConversationStack = createNativeStackNavigator({
   },
 })
 
+export const NotificationSettingsStack = createNativeStackNavigator({
+  initialRouteName: 'NotificationSettings',
+  screenOptions: {
+    headerBackButtonDisplayMode: 'minimal',
+  },
+  screenLayout: ScreenLayoutWithChatAccessGate,
+  screens: {
+    NotificationSettings: {
+      screen: NotificationSettingsScreen,
+      options: ({ navigation }) => ({
+        title: 'Chat',
+        headerRight: (props: NativeStackHeaderRightProps) => (
+          <HeaderTextButton {...props} onPress={navigation.goBack} title="Done" />
+        ),
+        headerBackVisible: false,
+      }),
+    },
+    PreferredAppSelection: {
+      screen: PreferredAppSelectionScreen,
+      options: {
+        title: 'Preferred app',
+      },
+    },
+  },
+})
+
 export const ChatStack = createNativeStackNavigator({
   screenOptions: {
     headerBackButtonDisplayMode: 'minimal',
@@ -223,6 +251,13 @@ export const ChatStack = createNativeStackNavigator({
         ),
       }),
     },
+    NotificationSettingsStack: {
+      screen: NotificationSettingsStack,
+      options: {
+        headerShown: false,
+        presentation: 'modal',
+      },
+    },
     New: {
       screen: NewConversationStack,
       if: useQualifiedByAge,

package/src/screens/conversation_select_type_screen.tsx

@@ -19,17 +19,23 @@ export function ConversationSelectTypeScreen({ route }: ConversationSelectTypeSc
 
   const handleGroupPress = () => {
     Haptic.impactLight()
-    navigation.navigate('New', {
-      screen: 'ConversationSelectGroupRecipients',
-      params: { ...route.params },
+    navigation.goBack()
+    requestAnimationFrame(() => {
+      navigation.navigate('New', {
+        screen: 'ConversationSelectGroupRecipients',
+        params: { ...route.params },
+      })
     })
   }
 
   const handleTeamPress = () => {
     Haptic.impactLight()
-    navigation.navigate('New', {
-      screen: 'ConversationSelectTeamsILeadRecipients',
-      params: { ...route.params },
+    navigation.goBack()
+    requestAnimationFrame(() => {
+      navigation.navigate('New', {
+        screen: 'ConversationSelectTeamsILeadRecipients',
+        params: { ...route.params },
+      })
     })
   }
 

package/src/screens/index.ts

@@ -2,6 +2,8 @@ export * from './design_system_screen'
 export * from './conversation_details_screen'
 export * from './conversation_screen'
 export * from './conversation_new/conversation_new_screen'
+export * from './notification_settings_screen'
+export * from './preferred_app_selection_screen'
 export * from './conversation_filter_recipients/conversation_filter_recipients_screen'
 export * from './message_actions_screen'
 export * from './message_report_screen'