@planningcenter/chat-react-native 3.24.0-rc.9 → 3.24.1-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/chatLogo.png +0 -0
- package/assets/churchCenter.png +0 -0
- package/assets/servicesApp.png +0 -0
- package/build/screens/message_report/components/message_preview.d.ts.map +1 -1
- package/build/screens/message_report/components/message_preview.js +12 -19
- package/build/screens/message_report/components/message_preview.js.map +1 -1
- package/build/screens/preferred_app_selection_screen.d.ts.map +1 -1
- package/build/screens/preferred_app_selection_screen.js +3 -6
- package/build/screens/preferred_app_selection_screen.js.map +1 -1
- package/package.json +4 -3
- package/src/screens/message_report/components/message_preview.tsx +15 -22
- package/src/screens/preferred_app_selection_screen.tsx +3 -6
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"message_preview.d.ts","sourceRoot":"","sources":["../../../../src/screens/message_report/components/message_preview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAG1D,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD,UAAU,mBAAmB;IAC3B,OAAO,EAAE,eAAe,CAAA;IACxB,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"message_preview.d.ts","sourceRoot":"","sources":["../../../../src/screens/message_report/components/message_preview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAG1D,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD,UAAU,mBAAmB;IAC3B,OAAO,EAAE,eAAe,CAAA;IACxB,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,mBAAmB,qBAiCrE"}
|
|
@@ -3,31 +3,30 @@ import { View, StyleSheet } from 'react-native';
|
|
|
3
3
|
import { Avatar, Text, Icon } from '../../../components';
|
|
4
4
|
import { useTheme } from '../../../hooks';
|
|
5
5
|
export function MessagePreview({ message, style }) {
|
|
6
|
-
const styles = useStyles();
|
|
7
6
|
const hasImages = message.attachments.some(att => att.type === 'MessageAttachment' && att.attributes?.contentType?.startsWith('image/'));
|
|
7
|
+
const imageOnly = hasImages && !message.text;
|
|
8
|
+
const styles = useStyles({ imageOnly });
|
|
8
9
|
return (<View style={[styles.previewContainer, style]}>
|
|
9
10
|
<View style={styles.previewHeader}>
|
|
10
11
|
<Avatar sourceUri={message.author.avatar} size="md"/>
|
|
11
12
|
<Text style={styles.authorName}>{message.author.name}</Text>
|
|
12
13
|
</View>
|
|
13
14
|
|
|
14
|
-
<View style={styles.
|
|
15
|
-
{message.text && (<View style={styles.messageBubble}>
|
|
16
|
-
<Text style={styles.messageText} numberOfLines={5}>
|
|
17
|
-
{message.text}
|
|
18
|
-
</Text>
|
|
19
|
-
</View>)}
|
|
20
|
-
|
|
15
|
+
<View style={styles.messageBubble}>
|
|
21
16
|
{hasImages && (<View style={styles.imagePlaceholder}>
|
|
22
17
|
<Icon name="general.image" style={styles.placeholderIcon}/>
|
|
23
18
|
<Text variant="secondary" style={styles.placeholderText}>
|
|
24
19
|
Image hidden
|
|
25
20
|
</Text>
|
|
26
21
|
</View>)}
|
|
22
|
+
|
|
23
|
+
{message.text && (<Text style={styles.messageText} numberOfLines={5}>
|
|
24
|
+
{message.text}
|
|
25
|
+
</Text>)}
|
|
27
26
|
</View>
|
|
28
27
|
</View>);
|
|
29
28
|
}
|
|
30
|
-
const useStyles = () => {
|
|
29
|
+
const useStyles = ({ imageOnly }) => {
|
|
31
30
|
const { colors } = useTheme();
|
|
32
31
|
return StyleSheet.create({
|
|
33
32
|
previewContainer: {
|
|
@@ -43,31 +42,25 @@ const useStyles = () => {
|
|
|
43
42
|
fontWeight: '600',
|
|
44
43
|
color: colors.textColorDefaultPrimary,
|
|
45
44
|
},
|
|
46
|
-
messageBubbleContainer: {
|
|
47
|
-
gap: 8,
|
|
48
|
-
},
|
|
49
45
|
messageBubble: {
|
|
50
46
|
backgroundColor: colors.fillColorNeutral060,
|
|
51
47
|
borderRadius: 16,
|
|
52
|
-
|
|
53
|
-
paddingVertical: 12,
|
|
48
|
+
overflow: 'hidden',
|
|
54
49
|
alignSelf: 'flex-start',
|
|
55
|
-
maxWidth: '80%',
|
|
50
|
+
maxWidth: imageOnly ? '40%' : '80%',
|
|
56
51
|
},
|
|
57
52
|
messageText: {
|
|
58
53
|
fontSize: 14,
|
|
59
54
|
color: colors.textColorDefaultPrimary,
|
|
60
55
|
lineHeight: 20,
|
|
56
|
+
paddingHorizontal: 16,
|
|
57
|
+
paddingVertical: 12,
|
|
61
58
|
},
|
|
62
59
|
imagePlaceholder: {
|
|
63
60
|
height: 120,
|
|
64
|
-
backgroundColor: colors.fillColorNeutral060,
|
|
65
|
-
borderRadius: 16,
|
|
66
61
|
justifyContent: 'center',
|
|
67
62
|
alignItems: 'center',
|
|
68
63
|
gap: 8,
|
|
69
|
-
maxWidth: '80%',
|
|
70
|
-
alignSelf: 'flex-start',
|
|
71
64
|
},
|
|
72
65
|
placeholderIcon: {
|
|
73
66
|
fontSize: 32,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"message_preview.js","sourceRoot":"","sources":["../../../../src/screens/message_report/components/message_preview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAa,MAAM,cAAc,CAAA;AAC1D,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAQzC,MAAM,UAAU,cAAc,CAAC,EAAE,OAAO,EAAE,KAAK,EAAuB;IACpE,MAAM,
|
|
1
|
+
{"version":3,"file":"message_preview.js","sourceRoot":"","sources":["../../../../src/screens/message_report/components/message_preview.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { View, StyleSheet, ViewStyle } from 'react-native'\nimport { Avatar, Text, Icon } from '../../../components'\nimport { useTheme } from '../../../hooks'\nimport { MessageResource } from '../../../types'\n\ninterface MessagePreviewProps {\n message: MessageResource\n style?: ViewStyle\n}\n\nexport function MessagePreview({ message, style }: MessagePreviewProps) {\n const hasImages = message.attachments.some(\n att => att.type === 'MessageAttachment' && att.attributes?.contentType?.startsWith('image/')\n )\n\n const imageOnly = hasImages && !message.text\n const styles = useStyles({ imageOnly })\n\n return (\n <View style={[styles.previewContainer, style]}>\n <View style={styles.previewHeader}>\n <Avatar sourceUri={message.author.avatar} size=\"md\" />\n <Text style={styles.authorName}>{message.author.name}</Text>\n </View>\n\n <View style={styles.messageBubble}>\n {hasImages && (\n <View style={styles.imagePlaceholder}>\n <Icon name=\"general.image\" style={styles.placeholderIcon} />\n <Text variant=\"secondary\" style={styles.placeholderText}>\n Image hidden\n </Text>\n </View>\n )}\n\n {message.text && (\n <Text style={styles.messageText} numberOfLines={5}>\n {message.text}\n </Text>\n )}\n </View>\n </View>\n )\n}\n\nconst useStyles = ({ imageOnly }: { imageOnly: boolean }) => {\n const { colors } = useTheme()\n\n return StyleSheet.create({\n previewContainer: {\n gap: 12,\n },\n previewHeader: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: 12,\n },\n authorName: {\n fontSize: 14,\n fontWeight: '600',\n color: colors.textColorDefaultPrimary,\n },\n messageBubble: {\n backgroundColor: colors.fillColorNeutral060,\n borderRadius: 16,\n overflow: 'hidden',\n alignSelf: 'flex-start',\n maxWidth: imageOnly ? '40%' : '80%',\n },\n messageText: {\n fontSize: 14,\n color: colors.textColorDefaultPrimary,\n lineHeight: 20,\n paddingHorizontal: 16,\n paddingVertical: 12,\n },\n imagePlaceholder: {\n height: 120,\n justifyContent: 'center',\n alignItems: 'center',\n gap: 8,\n },\n placeholderIcon: {\n fontSize: 32,\n color: colors.iconColorDefaultSecondary,\n },\n placeholderText: {\n fontSize: 14,\n },\n })\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
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;
|
|
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;AAIrD,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"}
|
|
@@ -2,9 +2,6 @@ import { PlatformPressable } from '@react-navigation/elements';
|
|
|
2
2
|
import { useMutation } from '@tanstack/react-query';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import { Image, StyleSheet, View } from 'react-native';
|
|
5
|
-
import churchCenterLogo from '../../assets/churchCenter.png';
|
|
6
|
-
import servicesLogo from '../../assets/servicesApp.png';
|
|
7
|
-
import chatLogo from '../../assets/chatLogo.png';
|
|
8
5
|
import { Heading, Icon, Text } from '../components';
|
|
9
6
|
import { useApiClient, useTheme } from '../hooks';
|
|
10
7
|
import { useChatTypes } from './preferred_app/hooks/use_chat_types';
|
|
@@ -60,11 +57,11 @@ const sortPreferredApp = (dir) => (a, b) => {
|
|
|
60
57
|
const getAppImage = (option) => {
|
|
61
58
|
switch (option) {
|
|
62
59
|
case 'Church Center':
|
|
63
|
-
return
|
|
60
|
+
return require('../../assets/churchCenter.png');
|
|
64
61
|
case 'Services':
|
|
65
|
-
return
|
|
62
|
+
return require('../../assets/servicesApp.png');
|
|
66
63
|
case 'Chat':
|
|
67
|
-
return chatLogo;
|
|
64
|
+
return require('../../assets/chatLogo.png');
|
|
68
65
|
default:
|
|
69
66
|
return undefined;
|
|
70
67
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"preferred_app_selection_screen.js","sourceRoot":"","sources":["../../src/screens/preferred_app_selection_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAE9D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,KAAiC,MAAM,OAAO,CAAA;AACrD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAA;AACtE,OAAO,
|
|
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 { 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_app`,\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 require('../../assets/churchCenter.png')\n case 'Services':\n return require('../../assets/servicesApp.png')\n case 'Chat':\n return require('../../assets/chatLogo.png')\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
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@planningcenter/chat-react-native",
|
|
3
|
-
"version": "3.24.
|
|
3
|
+
"version": "3.24.1-rc.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "build/index.js",
|
|
6
6
|
"types": "build/index.d.ts",
|
|
7
7
|
"files": [
|
|
8
8
|
"build",
|
|
9
|
-
"src"
|
|
9
|
+
"src",
|
|
10
|
+
"assets"
|
|
10
11
|
],
|
|
11
12
|
"sideEffects": false,
|
|
12
13
|
"scripts": {
|
|
@@ -58,5 +59,5 @@
|
|
|
58
59
|
"react-native-url-polyfill": "^2.0.0",
|
|
59
60
|
"typescript": "<5.6.0"
|
|
60
61
|
},
|
|
61
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "beb84de7b8a12103cb6634fa27f0c7a036f2a67e"
|
|
62
63
|
}
|
|
@@ -10,12 +10,13 @@ interface MessagePreviewProps {
|
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
export function MessagePreview({ message, style }: MessagePreviewProps) {
|
|
13
|
-
const styles = useStyles()
|
|
14
|
-
|
|
15
13
|
const hasImages = message.attachments.some(
|
|
16
14
|
att => att.type === 'MessageAttachment' && att.attributes?.contentType?.startsWith('image/')
|
|
17
15
|
)
|
|
18
16
|
|
|
17
|
+
const imageOnly = hasImages && !message.text
|
|
18
|
+
const styles = useStyles({ imageOnly })
|
|
19
|
+
|
|
19
20
|
return (
|
|
20
21
|
<View style={[styles.previewContainer, style]}>
|
|
21
22
|
<View style={styles.previewHeader}>
|
|
@@ -23,15 +24,7 @@ export function MessagePreview({ message, style }: MessagePreviewProps) {
|
|
|
23
24
|
<Text style={styles.authorName}>{message.author.name}</Text>
|
|
24
25
|
</View>
|
|
25
26
|
|
|
26
|
-
<View style={styles.
|
|
27
|
-
{message.text && (
|
|
28
|
-
<View style={styles.messageBubble}>
|
|
29
|
-
<Text style={styles.messageText} numberOfLines={5}>
|
|
30
|
-
{message.text}
|
|
31
|
-
</Text>
|
|
32
|
-
</View>
|
|
33
|
-
)}
|
|
34
|
-
|
|
27
|
+
<View style={styles.messageBubble}>
|
|
35
28
|
{hasImages && (
|
|
36
29
|
<View style={styles.imagePlaceholder}>
|
|
37
30
|
<Icon name="general.image" style={styles.placeholderIcon} />
|
|
@@ -40,12 +33,18 @@ export function MessagePreview({ message, style }: MessagePreviewProps) {
|
|
|
40
33
|
</Text>
|
|
41
34
|
</View>
|
|
42
35
|
)}
|
|
36
|
+
|
|
37
|
+
{message.text && (
|
|
38
|
+
<Text style={styles.messageText} numberOfLines={5}>
|
|
39
|
+
{message.text}
|
|
40
|
+
</Text>
|
|
41
|
+
)}
|
|
43
42
|
</View>
|
|
44
43
|
</View>
|
|
45
44
|
)
|
|
46
45
|
}
|
|
47
46
|
|
|
48
|
-
const useStyles = () => {
|
|
47
|
+
const useStyles = ({ imageOnly }: { imageOnly: boolean }) => {
|
|
49
48
|
const { colors } = useTheme()
|
|
50
49
|
|
|
51
50
|
return StyleSheet.create({
|
|
@@ -62,31 +61,25 @@ const useStyles = () => {
|
|
|
62
61
|
fontWeight: '600',
|
|
63
62
|
color: colors.textColorDefaultPrimary,
|
|
64
63
|
},
|
|
65
|
-
messageBubbleContainer: {
|
|
66
|
-
gap: 8,
|
|
67
|
-
},
|
|
68
64
|
messageBubble: {
|
|
69
65
|
backgroundColor: colors.fillColorNeutral060,
|
|
70
66
|
borderRadius: 16,
|
|
71
|
-
|
|
72
|
-
paddingVertical: 12,
|
|
67
|
+
overflow: 'hidden',
|
|
73
68
|
alignSelf: 'flex-start',
|
|
74
|
-
maxWidth: '80%',
|
|
69
|
+
maxWidth: imageOnly ? '40%' : '80%',
|
|
75
70
|
},
|
|
76
71
|
messageText: {
|
|
77
72
|
fontSize: 14,
|
|
78
73
|
color: colors.textColorDefaultPrimary,
|
|
79
74
|
lineHeight: 20,
|
|
75
|
+
paddingHorizontal: 16,
|
|
76
|
+
paddingVertical: 12,
|
|
80
77
|
},
|
|
81
78
|
imagePlaceholder: {
|
|
82
79
|
height: 120,
|
|
83
|
-
backgroundColor: colors.fillColorNeutral060,
|
|
84
|
-
borderRadius: 16,
|
|
85
80
|
justifyContent: 'center',
|
|
86
81
|
alignItems: 'center',
|
|
87
82
|
gap: 8,
|
|
88
|
-
maxWidth: '80%',
|
|
89
|
-
alignSelf: 'flex-start',
|
|
90
83
|
},
|
|
91
84
|
placeholderIcon: {
|
|
92
85
|
fontSize: 32,
|
|
@@ -3,9 +3,6 @@ import { StaticScreenProps } from '@react-navigation/native'
|
|
|
3
3
|
import { useMutation } from '@tanstack/react-query'
|
|
4
4
|
import React, { type PropsWithChildren } from 'react'
|
|
5
5
|
import { Image, StyleSheet, View, type ViewStyle } from 'react-native'
|
|
6
|
-
import churchCenterLogo from '../../assets/churchCenter.png'
|
|
7
|
-
import servicesLogo from '../../assets/servicesApp.png'
|
|
8
|
-
import chatLogo from '../../assets/chatLogo.png'
|
|
9
6
|
import { Heading, Icon, Text } from '../components'
|
|
10
7
|
import { useApiClient, useTheme } from '../hooks'
|
|
11
8
|
import { PreferredApp, useChatTypes } from './preferred_app/hooks/use_chat_types'
|
|
@@ -81,11 +78,11 @@ const sortPreferredApp = (dir?: 'asc' | 'desc') => (a: PreferredApp, b: Preferre
|
|
|
81
78
|
const getAppImage = (option: PreferredApp) => {
|
|
82
79
|
switch (option) {
|
|
83
80
|
case 'Church Center':
|
|
84
|
-
return
|
|
81
|
+
return require('../../assets/churchCenter.png')
|
|
85
82
|
case 'Services':
|
|
86
|
-
return
|
|
83
|
+
return require('../../assets/servicesApp.png')
|
|
87
84
|
case 'Chat':
|
|
88
|
-
return chatLogo
|
|
85
|
+
return require('../../assets/chatLogo.png')
|
|
89
86
|
default:
|
|
90
87
|
return undefined
|
|
91
88
|
}
|