@planningcenter/chat-react-native 3.7.1-rc.1 → 3.7.1-rc.2
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/build/navigation/index.d.ts +2 -2
- package/build/screens/conversation_filter_recipients/components/checkbox_row.d.ts +3 -2
- package/build/screens/conversation_filter_recipients/components/checkbox_row.d.ts.map +1 -1
- package/build/screens/conversation_filter_recipients/components/checkbox_row.js +1 -3
- package/build/screens/conversation_filter_recipients/components/checkbox_row.js.map +1 -1
- package/build/screens/conversation_filter_recipients/components/header_row.d.ts +3 -2
- package/build/screens/conversation_filter_recipients/components/header_row.d.ts.map +1 -1
- package/build/screens/conversation_filter_recipients/components/header_row.js +1 -3
- package/build/screens/conversation_filter_recipients/components/header_row.js.map +1 -1
- package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.d.ts +2 -3
- package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.d.ts.map +1 -1
- package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js +40 -39
- package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js.map +1 -1
- package/build/screens/conversation_filter_recipients/types.d.ts +3 -0
- package/build/screens/conversation_filter_recipients/types.d.ts.map +1 -1
- package/build/screens/conversation_filter_recipients/types.js.map +1 -1
- package/package.json +2 -2
- package/src/screens/conversation_filter_recipients/components/checkbox_row.tsx +8 -4
- package/src/screens/conversation_filter_recipients/components/header_row.tsx +7 -4
- package/src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx +97 -70
- package/src/screens/conversation_filter_recipients/types.tsx +2 -0
- package/build/screens/conversation_filter_recipients/components/navigation_header.d.ts +0 -5
- package/build/screens/conversation_filter_recipients/components/navigation_header.d.ts.map +0 -1
- package/build/screens/conversation_filter_recipients/components/navigation_header.js +0 -46
- package/build/screens/conversation_filter_recipients/components/navigation_header.js.map +0 -1
- package/build/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.d.ts +0 -17
- package/build/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.d.ts.map +0 -1
- package/build/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.js +0 -37
- package/build/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.js.map +0 -1
- package/src/screens/conversation_filter_recipients/components/navigation_header.tsx +0 -68
- package/src/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.tsx +0 -53
|
@@ -64,7 +64,7 @@ export declare const NewConversationStack: import("@react-navigation/native").Ty
|
|
|
64
64
|
};
|
|
65
65
|
};
|
|
66
66
|
readonly ConversationFilterRecipients: {
|
|
67
|
-
readonly screen: ({}: import("../screens/conversation_filter_recipients/types").ConversationFilterRecipientsScreenProps) => React.JSX.Element;
|
|
67
|
+
readonly screen: ({ route, }: import("../screens/conversation_filter_recipients/types").ConversationFilterRecipientsScreenProps) => React.JSX.Element;
|
|
68
68
|
readonly options: import("@react-navigation/native-stack").NativeStackNavigationOptions;
|
|
69
69
|
};
|
|
70
70
|
readonly ConversationNew: {
|
|
@@ -201,7 +201,7 @@ export declare const ChatStack: import("@react-navigation/native").TypedNavigato
|
|
|
201
201
|
};
|
|
202
202
|
};
|
|
203
203
|
readonly ConversationFilterRecipients: {
|
|
204
|
-
readonly screen: ({}: import("../screens/conversation_filter_recipients/types").ConversationFilterRecipientsScreenProps) => React.JSX.Element;
|
|
204
|
+
readonly screen: ({ route, }: import("../screens/conversation_filter_recipients/types").ConversationFilterRecipientsScreenProps) => React.JSX.Element;
|
|
205
205
|
readonly options: import("@react-navigation/native-stack").NativeStackNavigationOptions;
|
|
206
206
|
};
|
|
207
207
|
readonly ConversationNew: {
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { type ViewStyle } from 'react-native';
|
|
2
|
-
import { TeamProps } from '../types';
|
|
2
|
+
import { SetTeamFilters, TeamProps } from '../types';
|
|
3
3
|
interface TeamRowProps {
|
|
4
4
|
data: TeamProps;
|
|
5
5
|
style?: ViewStyle;
|
|
6
6
|
accessibilityLabelledBy: string;
|
|
7
|
+
setTeamFilters: SetTeamFilters;
|
|
7
8
|
}
|
|
8
|
-
export declare const CheckboxRow: ({ data, style, accessibilityLabelledBy }: TeamRowProps) => import("react").JSX.Element;
|
|
9
|
+
export declare const CheckboxRow: ({ data, style, accessibilityLabelledBy, setTeamFilters, }: TeamRowProps) => import("react").JSX.Element;
|
|
9
10
|
export {};
|
|
10
11
|
//# sourceMappingURL=checkbox_row.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox_row.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/checkbox_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAI1E,OAAO,EAA2C,SAAS,EAAE,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"checkbox_row.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/checkbox_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAI1E,OAAO,EAA2C,cAAc,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAG7F,UAAU,YAAY;IACpB,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,uBAAuB,EAAE,MAAM,CAAA;IAC/B,cAAc,EAAE,cAAc,CAAA;CAC/B;AAED,eAAO,MAAM,WAAW,8DAKrB,YAAY,gCAgCd,CAAA"}
|
|
@@ -3,11 +3,9 @@ import { useTheme } from '../../../hooks';
|
|
|
3
3
|
import { Icon, Text } from '../../../components';
|
|
4
4
|
import { tokens } from '../../../vendor/tapestry/tokens';
|
|
5
5
|
import { useRoute } from '@react-navigation/native';
|
|
6
|
-
|
|
7
|
-
export const CheckboxRow = ({ data, style, accessibilityLabelledBy }) => {
|
|
6
|
+
export const CheckboxRow = ({ data, style, accessibilityLabelledBy, setTeamFilters, }) => {
|
|
8
7
|
const styles = useStyles();
|
|
9
8
|
const route = useRoute();
|
|
10
|
-
const { setTeamFilters } = useFilterRecipientsContext();
|
|
11
9
|
const { teamId, teamName } = data;
|
|
12
10
|
const { team_ids: currentTeamIds } = route.params;
|
|
13
11
|
const checked = currentTeamIds?.includes(teamId) ?? false;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox_row.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/checkbox_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,cAAc,CAAA;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAA;AAExD,OAAO,EAAkB,QAAQ,EAAE,MAAM,0BAA0B,CAAA;
|
|
1
|
+
{"version":3,"file":"checkbox_row.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/checkbox_row.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Pressable, View, StyleSheet, type ViewStyle } from 'react-native'\nimport { useTheme } from '../../../hooks'\nimport { Icon, Text } from '../../../components'\nimport { tokens } from '../../../vendor/tapestry/tokens'\nimport { ConversationFilterRecipientsScreenProps, SetTeamFilters, TeamProps } from '../types'\nimport { type RouteProp, useRoute } from '@react-navigation/native'\n\ninterface TeamRowProps {\n data: TeamProps\n style?: ViewStyle\n accessibilityLabelledBy: string\n setTeamFilters: SetTeamFilters\n}\n\nexport const CheckboxRow = ({\n data,\n style,\n accessibilityLabelledBy,\n setTeamFilters,\n}: TeamRowProps) => {\n const styles = useStyles()\n const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()\n\n const { teamId, teamName } = data\n const { team_ids: currentTeamIds } = route.params\n\n const checked = currentTeamIds?.includes(teamId) ?? false\n const newTeamIdAdded = [...(currentTeamIds ?? []), teamId]\n const newTeamIdRemoved = (currentTeamIds ?? []).filter(currentId => currentId !== teamId)\n\n const handlePress = () => {\n setTeamFilters({\n team_ids: checked ? newTeamIdRemoved : newTeamIdAdded,\n })\n }\n\n return (\n <Pressable\n style={({ pressed }) => [styles.checkboxRow, pressed && styles.checkboxRowPressed, style]}\n onPress={handlePress}\n accessibilityRole=\"checkbox\"\n accessibilityState={{ checked }}\n accessibilityLabelledBy={accessibilityLabelledBy}\n accessibilityLabel={`${teamName} team`}\n >\n <CheckboxIcon checked={checked} />\n <Text style={styles.label} numberOfLines={2}>\n {teamName}\n </Text>\n </Pressable>\n )\n}\n\nfunction CheckboxIcon({ checked }: { checked: boolean }) {\n const styles = useStyles()\n const checkedStyle = checked ? styles.checkedContainer : styles.uncheckedContainer\n\n return (\n <View style={checkedStyle}>\n {checked && <Icon name=\"general.thickCheckmark\" style={styles.checkedIcon} />}\n </View>\n )\n}\n\nconst useStyles = () => {\n const { colors } = useTheme()\n\n const baseCheckboxStyles: ViewStyle = {\n width: 20,\n height: 20,\n borderRadius: 40,\n alignItems: 'center',\n justifyContent: 'center',\n }\n\n return StyleSheet.create({\n checkboxRow: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: 12,\n padding: 16,\n borderTopWidth: 1,\n borderTopColor: colors.borderColorDefaultDim,\n backgroundColor: colors.surfaceColor100,\n },\n checkboxRowPressed: {\n opacity: 0.5,\n },\n label: {\n flex: 1,\n },\n checkedContainer: {\n ...baseCheckboxStyles,\n backgroundColor: colors.statusSuccessIcon,\n },\n uncheckedContainer: {\n ...baseCheckboxStyles,\n borderWidth: 2,\n borderColor: colors.borderColorDefaultDarker,\n },\n checkedIcon: {\n color: tokens.colorNeutral100White,\n },\n })\n}\n"]}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { type ViewStyle } from 'react-native';
|
|
2
|
-
import type { ServiceTypeProps } from '../types';
|
|
2
|
+
import type { ServiceTypeProps, SetTeamFilters } from '../types';
|
|
3
3
|
interface HeaderRowProps {
|
|
4
4
|
data: ServiceTypeProps;
|
|
5
5
|
nativeID: string;
|
|
6
6
|
style?: ViewStyle;
|
|
7
|
+
setTeamFilters: SetTeamFilters;
|
|
7
8
|
}
|
|
8
|
-
export declare const HeaderRow: ({ data, nativeID, style }: HeaderRowProps) => import("react").JSX.Element;
|
|
9
|
+
export declare const HeaderRow: ({ data, nativeID, style, setTeamFilters }: HeaderRowProps) => import("react").JSX.Element;
|
|
9
10
|
export {};
|
|
10
11
|
//# sourceMappingURL=header_row.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header_row.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/header_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAG/D,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"header_row.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/header_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAG/D,OAAO,KAAK,EAEV,gBAAgB,EAChB,cAAc,EACf,MAAM,UAAU,CAAA;AAOjB,UAAU,cAAc;IACtB,IAAI,EAAE,gBAAgB,CAAA;IACtB,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,cAAc,EAAE,cAAc,CAAA;CAC/B;AAED,eAAO,MAAM,SAAS,8CAA+C,cAAc,gCAiDlF,CAAA"}
|
|
@@ -4,11 +4,9 @@ import { Icon, Heading, TextButton } from '../../../components';
|
|
|
4
4
|
import { tokens } from '../../../vendor/tapestry/tokens';
|
|
5
5
|
import { pluralize } from '../../../utils';
|
|
6
6
|
import { useRoute } from '@react-navigation/native';
|
|
7
|
-
import { useFilterRecipientsContext } from '../context/conversation_filter_recipients_context';
|
|
8
7
|
const BULK_SELECT_LIMIT = 10;
|
|
9
|
-
export const HeaderRow = ({ data, nativeID, style }) => {
|
|
8
|
+
export const HeaderRow = ({ data, nativeID, style, setTeamFilters }) => {
|
|
10
9
|
const styles = useStyles();
|
|
11
|
-
const { setTeamFilters } = useFilterRecipientsContext();
|
|
12
10
|
const route = useRoute();
|
|
13
11
|
const { serviceTypeName, teamIdsForServiceType } = data;
|
|
14
12
|
const { team_ids: currentTeamIds = [] } = route.params;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header_row.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/header_row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;
|
|
1
|
+
{"version":3,"file":"header_row.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/header_row.tsx"],"names":[],"mappings":"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","sourcesContent":["import { View, StyleSheet, type ViewStyle } from 'react-native'\nimport { useTheme } from '../../../hooks'\nimport { Icon, Heading, TextButton } from '../../../components'\nimport type {\n ConversationFilterRecipientsScreenProps,\n ServiceTypeProps,\n SetTeamFilters,\n} from '../types'\nimport { tokens } from '../../../vendor/tapestry/tokens'\nimport { pluralize } from '../../../utils'\nimport { useRoute, type RouteProp } from '@react-navigation/native'\n\nconst BULK_SELECT_LIMIT = 10\n\ninterface HeaderRowProps {\n data: ServiceTypeProps\n nativeID: string\n style?: ViewStyle\n setTeamFilters: SetTeamFilters\n}\n\nexport const HeaderRow = ({ data, nativeID, style, setTeamFilters }: HeaderRowProps) => {\n const styles = useStyles()\n const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()\n\n const { serviceTypeName, teamIdsForServiceType } = data\n const { team_ids: currentTeamIds = [] } = route.params\n\n const newTeamIdsAdded = [...new Set([...currentTeamIds, ...teamIdsForServiceType])]\n const newTeamIdsRemoved = currentTeamIds.filter(id => !teamIdsForServiceType.includes(id))\n\n const allTeamsSelected = teamIdsForServiceType.every(id => currentTeamIds.includes(id))\n const showSelectAll = teamIdsForServiceType.length <= BULK_SELECT_LIMIT\n const selectLabel = allTeamsSelected ? 'Deselect' : 'Select'\n\n const headingAccessibilityHint = `${pluralize(teamIdsForServiceType.length, 'team')} available to select`\n const selectAllAccessibilityLabel = `${selectLabel} ${pluralize(teamIdsForServiceType.length, 'team')} for ${serviceTypeName}`\n\n const handleSelectAll = () => {\n setTeamFilters({\n team_ids: allTeamsSelected ? newTeamIdsRemoved : newTeamIdsAdded,\n })\n }\n\n return (\n <View style={[styles.headerRow, style]}>\n <View style={styles.headerContent}>\n <Icon name=\"services.folderClosed\" style={styles.headerIcon} />\n <Heading\n variant=\"h3\"\n style={styles.headerText}\n numberOfLines={2}\n nativeID={nativeID}\n accessibilityHint={headingAccessibilityHint}\n >\n {serviceTypeName}\n </Heading>\n </View>\n\n {showSelectAll && (\n <TextButton\n variant=\"tertiary\"\n onPress={handleSelectAll}\n accessibilityLabel={selectAllAccessibilityLabel}\n >\n {selectLabel} all\n </TextButton>\n )}\n </View>\n )\n}\n\nconst useStyles = () => {\n const { colors } = useTheme()\n\n return StyleSheet.create({\n headerRow: {\n flexDirection: 'row',\n justifyContent: 'space-between',\n alignItems: 'center',\n padding: 16,\n gap: 12,\n backgroundColor: colors.surfaceColor100,\n },\n headerText: {\n fontWeight: 'normal',\n flex: 1,\n color: colors.textColorDefaultPrimary,\n fontSize: tokens.fontSizeSm,\n },\n headerContent: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: 12,\n flex: 1,\n },\n headerIcon: {\n color: colors.interaction,\n fontSize: tokens.fontSizeMd,\n },\n })\n}\n"]}
|
package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { NativeStackNavigationOptions } from '@react-navigation/native-stack';
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { ConversationFilterRecipientsScreenProps } from './types';
|
|
4
|
-
export declare const ConversationFilterReceipientsScreenOptions: NativeStackNavigationOptions;
|
|
5
|
-
export declare const ConversationFilterRecipientsScreen: ({}: ConversationFilterRecipientsScreenProps) => React.JSX.Element;
|
|
3
|
+
export declare const ConversationFilterReceipientsScreenOptions: import("@react-navigation/native-stack").NativeStackNavigationOptions;
|
|
4
|
+
export declare const ConversationFilterRecipientsScreen: ({ route, }: ConversationFilterRecipientsScreenProps) => React.JSX.Element;
|
|
6
5
|
//# sourceMappingURL=conversation_filter_recipients_screen.d.ts.map
|
package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.d.ts.map
CHANGED
|
@@ -1 +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":"
|
|
1
|
+
{"version":3,"file":"conversation_filter_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,OAAO,EAAE,uCAAuC,EAAgB,MAAM,SAAS,CAAA;AAU/E,eAAO,MAAM,0CAA0C,uEAMrD,CAAA;AAEF,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBA8FzC,CAAA"}
|
package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js
CHANGED
|
@@ -1,75 +1,76 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Platform, StyleSheet
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import { Platform, StyleSheet } from 'react-native';
|
|
3
3
|
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
4
|
-
import {
|
|
5
|
-
import { Heading } from '../../components';
|
|
4
|
+
import { FlatList } from 'react-native-gesture-handler';
|
|
5
|
+
import { Button, Heading, TextButton } from '../../components';
|
|
6
6
|
import { useTheme } from '../../hooks';
|
|
7
7
|
import { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams';
|
|
8
8
|
import { SectionTypes } from './types';
|
|
9
9
|
import { HeaderRow } from './components/header_row';
|
|
10
10
|
import { tokens } from '../../vendor/tapestry/tokens';
|
|
11
11
|
import { CheckboxRow } from './components/checkbox_row';
|
|
12
|
-
import { useHeaderHeight } from '@react-navigation/elements';
|
|
13
|
-
import { FilterRecipientsProvider } from './context/conversation_filter_recipients_context';
|
|
14
|
-
import { HeaderRightWithContext, FilterHeaderTitle } from './components/navigation_header';
|
|
15
12
|
import { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams';
|
|
13
|
+
import { StackActions, useNavigation } from '@react-navigation/native';
|
|
14
|
+
import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet';
|
|
16
15
|
const SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-';
|
|
17
|
-
export const ConversationFilterReceipientsScreenOptions = {
|
|
18
|
-
presentation: Platform.select({ android: 'modal', ios: 'formSheet' }),
|
|
16
|
+
export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({
|
|
19
17
|
sheetAllowedDetents: Platform.select({
|
|
20
18
|
android: [0.75, 0.94],
|
|
21
19
|
default: [0.75, 1],
|
|
22
20
|
}),
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
headerTitle: FilterHeaderTitle,
|
|
27
|
-
headerTitleAlign: 'left',
|
|
28
|
-
sheetCornerRadius: 16,
|
|
29
|
-
};
|
|
30
|
-
export const ConversationFilterRecipientsScreen = ({}) => {
|
|
21
|
+
headerTitle: 'Teams I lead',
|
|
22
|
+
});
|
|
23
|
+
export const ConversationFilterRecipientsScreen = ({ route, }) => {
|
|
31
24
|
const styles = useStyles();
|
|
25
|
+
const navigation = useNavigation();
|
|
32
26
|
const { serviceTypes } = useServiceTypesWithTeams();
|
|
33
27
|
const data = useFlattenedArrayOfServiceTypesWithTeams({
|
|
34
28
|
data: serviceTypes,
|
|
35
29
|
firstRowStyle: styles.firstRow,
|
|
36
30
|
lastRowStyle: styles.lastRow,
|
|
37
31
|
});
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
32
|
+
const { params } = route;
|
|
33
|
+
const noTeamsSelected = params.team_ids?.length === 0 || !params.team_ids;
|
|
34
|
+
const applyButtonAccessibilityHint = noTeamsSelected
|
|
35
|
+
? 'Select at least one team to navigate to the final step in creating your conversation.'
|
|
36
|
+
: 'Saves selected teams and navigates to the final step to create your conversation.';
|
|
37
|
+
const setTeamFilters = useCallback(({ team_ids }) => {
|
|
38
|
+
navigation.setParams({
|
|
39
|
+
team_ids,
|
|
40
|
+
});
|
|
41
|
+
}, [navigation]);
|
|
42
|
+
const resetTeamFilters = useCallback(() => {
|
|
43
|
+
navigation.goBack();
|
|
44
|
+
}, [navigation]);
|
|
45
|
+
const applyTeamFilters = useCallback(() => {
|
|
46
|
+
navigation.dispatch(StackActions.popTo('ConversationNew', params));
|
|
47
|
+
}, [navigation, params]);
|
|
48
|
+
return (<FormSheet.Root>
|
|
49
|
+
<FormSheet.Header title="Teams I lead" secondaryButton={<TextButton onPress={resetTeamFilters} accessibilityHint="Cancels any selected teams and closes this modal.">
|
|
50
|
+
Cancel
|
|
51
|
+
</TextButton>} primaryButton={<Button title="Apply" accessibilityHint={applyButtonAccessibilityHint} onPress={applyTeamFilters} disabled={noTeamsSelected}/>}/>
|
|
52
|
+
<FlatList data={data} ListHeaderComponent={<Heading variant="h3" style={styles.listHeader}>
|
|
53
|
+
Service Types
|
|
54
|
+
</Heading>} contentContainerStyle={styles.listContentContainer} keyExtractor={item => `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`} renderItem={({ item }) => {
|
|
43
55
|
switch (item.type) {
|
|
44
56
|
case SectionTypes.header:
|
|
45
|
-
return (<HeaderRow data={item.data} style={item.sectionStyle} nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}/>);
|
|
57
|
+
return (<HeaderRow data={item.data} style={item.sectionStyle} nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`} setTeamFilters={setTeamFilters}/>);
|
|
46
58
|
case SectionTypes.team:
|
|
47
|
-
return (<CheckboxRow data={item.data} style={item.sectionStyle} accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}/>);
|
|
59
|
+
return (<CheckboxRow data={item.data} style={item.sectionStyle} accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`} setTeamFilters={setTeamFilters}/>);
|
|
48
60
|
default:
|
|
49
61
|
return null;
|
|
50
62
|
}
|
|
51
63
|
}}/>
|
|
52
|
-
|
|
53
|
-
</FilterRecipientsProvider>);
|
|
64
|
+
</FormSheet.Root>);
|
|
54
65
|
};
|
|
55
66
|
const useStyles = () => {
|
|
56
67
|
const { colors } = useTheme();
|
|
57
|
-
const {
|
|
58
|
-
const { height } = useWindowDimensions();
|
|
59
|
-
const headerHeight = useHeaderHeight();
|
|
60
|
-
const containerHeight = Platform.select({
|
|
61
|
-
android: height,
|
|
62
|
-
ios: height - top - headerHeight,
|
|
63
|
-
});
|
|
68
|
+
const { bottom } = useSafeAreaInsets();
|
|
64
69
|
return StyleSheet.create({
|
|
65
|
-
listWrapper: {
|
|
66
|
-
flex: 1,
|
|
67
|
-
height: containerHeight,
|
|
68
|
-
backgroundColor: colors.surfaceColor080,
|
|
69
|
-
},
|
|
70
70
|
listContentContainer: {
|
|
71
|
+
backgroundColor: colors.surfaceColor080,
|
|
71
72
|
padding: 16,
|
|
72
|
-
paddingBottom: bottom,
|
|
73
|
+
paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
|
|
73
74
|
},
|
|
74
75
|
listHeader: {
|
|
75
76
|
paddingBottom: 16,
|
package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"conversation_filter_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
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 { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { useCallback } from 'react'\nimport { Platform, StyleSheet } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Button, Heading, TextButton } from '../../components'\nimport { useTheme } from '../../hooks'\nimport { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams'\nimport { ConversationFilterRecipientsScreenProps, SectionTypes } from './types'\nimport { HeaderRow } from './components/header_row'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { CheckboxRow } from './components/checkbox_row'\nimport { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams'\nimport { StackActions, useNavigation } from '@react-navigation/native'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\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 const navigation =\n useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n\n const { serviceTypes } = useServiceTypesWithTeams()\n const data = useFlattenedArrayOfServiceTypesWithTeams({\n data: serviceTypes,\n firstRowStyle: styles.firstRow,\n lastRowStyle: styles.lastRow,\n })\n\n const { params } = route\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({\n team_ids,\n })\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 return (\n <FormSheet.Root>\n <FormSheet.Header\n title=\"Teams I lead\"\n secondaryButton={\n <TextButton\n onPress={resetTeamFilters}\n accessibilityHint=\"Cancels any selected teams and closes this modal.\"\n >\n Cancel\n </TextButton>\n }\n primaryButton={\n <Button\n title=\"Apply\"\n accessibilityHint={applyButtonAccessibilityHint}\n onPress={applyTeamFilters}\n disabled={noTeamsSelected}\n />\n }\n />\n <FlatList\n data={data}\n ListHeaderComponent={\n <Heading variant=\"h3\" style={styles.listHeader}>\n Service Types\n </Heading>\n }\n contentContainerStyle={styles.listContentContainer}\n keyExtractor={item =>\n `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`\n }\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 useStyles = () => {\n const { colors } = useTheme()\n const { bottom } = useSafeAreaInsets()\n\n return StyleSheet.create({\n listContentContainer: {\n backgroundColor: colors.surfaceColor080,\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 })\n}\n"]}
|
|
@@ -34,5 +34,8 @@ export type ConversationFilterRecipientsParams = {
|
|
|
34
34
|
team_ids?: number[];
|
|
35
35
|
};
|
|
36
36
|
export type ConversationFilterRecipientsScreenProps = StaticScreenProps<ConversationFilterRecipientsParams>;
|
|
37
|
+
export type SetTeamFilters = ({ team_ids }: {
|
|
38
|
+
team_ids: number[];
|
|
39
|
+
}) => void;
|
|
37
40
|
export {};
|
|
38
41
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAE5D,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE;QACL,EAAE,EAAE,MAAM,CAAA;QACV,IAAI,EAAE,MAAM,CAAA;KACb,EAAE,CAAA;CACJ;AAED,oBAAY,YAAY;IACtB,MAAM,IAAA;IACN,IAAI,IAAA;CACL;AAED,MAAM,WAAW,gBAAgB;IAC/B,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,EAAE,MAAM,CAAA;IACrB,qBAAqB,EAAE,MAAM,EAAE,CAAA;CAChC;AAED,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,aAAa,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CACjC,QAAQ,CAAC,gBAAgB,EAAE,YAAY,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,CACzF,CAAA;AAED,UAAU,QAAQ,CAAC,CAAC,EAAE,KAAK,SAAS,YAAY;IAC9C,IAAI,EAAE,KAAK,CAAA;IACX,IAAI,EAAE,CAAC,CAAA;IACP,YAAY,CAAC,EAAE,SAAS,CAAA;CACzB;AAED,MAAM,MAAM,kCAAkC,GAAG;IAC/C,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,uCAAuC,GACjD,iBAAiB,CAAC,kCAAkC,CAAC,CAAA"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAE5D,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE;QACL,EAAE,EAAE,MAAM,CAAA;QACV,IAAI,EAAE,MAAM,CAAA;KACb,EAAE,CAAA;CACJ;AAED,oBAAY,YAAY;IACtB,MAAM,IAAA;IACN,IAAI,IAAA;CACL;AAED,MAAM,WAAW,gBAAgB;IAC/B,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,EAAE,MAAM,CAAA;IACrB,qBAAqB,EAAE,MAAM,EAAE,CAAA;CAChC;AAED,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,aAAa,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CACjC,QAAQ,CAAC,gBAAgB,EAAE,YAAY,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,CACzF,CAAA;AAED,UAAU,QAAQ,CAAC,CAAC,EAAE,KAAK,SAAS,YAAY;IAC9C,IAAI,EAAE,KAAK,CAAA;IACX,IAAI,EAAE,CAAC,CAAA;IACP,YAAY,CAAC,EAAE,SAAS,CAAA;CACzB;AAED,MAAM,MAAM,kCAAkC,GAAG;IAC/C,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,uCAAuC,GACjD,iBAAiB,CAAC,kCAAkC,CAAC,CAAA;AAEvD,MAAM,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,MAAM,EAAE,CAAA;CAAE,KAAK,IAAI,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/types.tsx"],"names":[],"mappings":"AAaA,MAAM,CAAN,IAAY,YAGX;AAHD,WAAY,YAAY;IACtB,mDAAM,CAAA;IACN,+CAAI,CAAA;AACN,CAAC,EAHW,YAAY,KAAZ,YAAY,QAGvB","sourcesContent":["import { type ViewStyle } from 'react-native'\nimport { AppName } from '../../types/resources/app_name'\nimport { StaticScreenProps } from '@react-navigation/native'\n\nexport interface ServiceTypeWithTeams {\n id: number\n name: string\n teams: {\n id: number\n name: string\n }[]\n}\n\nexport enum SectionTypes {\n header,\n team,\n}\n\nexport interface ServiceTypeProps {\n serviceTypeName: string\n serviceTypeId: number\n teamIdsForServiceType: number[]\n}\n\nexport interface TeamProps {\n teamName: string\n teamId: number\n serviceTypeId: number\n}\n\nexport type SectionListData = Array<\n DataItem<ServiceTypeProps, SectionTypes.header> | DataItem<TeamProps, SectionTypes.team>\n>\n\ninterface DataItem<T, TName extends SectionTypes> {\n type: TName\n data: T\n sectionStyle?: ViewStyle\n}\n\nexport type ConversationFilterRecipientsParams = {\n source_app_name?: AppName\n team_ids?: number[]\n}\n\nexport type ConversationFilterRecipientsScreenProps =\n StaticScreenProps<ConversationFilterRecipientsParams>\n"]}
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/types.tsx"],"names":[],"mappings":"AAaA,MAAM,CAAN,IAAY,YAGX;AAHD,WAAY,YAAY;IACtB,mDAAM,CAAA;IACN,+CAAI,CAAA;AACN,CAAC,EAHW,YAAY,KAAZ,YAAY,QAGvB","sourcesContent":["import { type ViewStyle } from 'react-native'\nimport { AppName } from '../../types/resources/app_name'\nimport { StaticScreenProps } from '@react-navigation/native'\n\nexport interface ServiceTypeWithTeams {\n id: number\n name: string\n teams: {\n id: number\n name: string\n }[]\n}\n\nexport enum SectionTypes {\n header,\n team,\n}\n\nexport interface ServiceTypeProps {\n serviceTypeName: string\n serviceTypeId: number\n teamIdsForServiceType: number[]\n}\n\nexport interface TeamProps {\n teamName: string\n teamId: number\n serviceTypeId: number\n}\n\nexport type SectionListData = Array<\n DataItem<ServiceTypeProps, SectionTypes.header> | DataItem<TeamProps, SectionTypes.team>\n>\n\ninterface DataItem<T, TName extends SectionTypes> {\n type: TName\n data: T\n sectionStyle?: ViewStyle\n}\n\nexport type ConversationFilterRecipientsParams = {\n source_app_name?: AppName\n team_ids?: number[]\n}\n\nexport type ConversationFilterRecipientsScreenProps =\n StaticScreenProps<ConversationFilterRecipientsParams>\n\nexport type SetTeamFilters = ({ team_ids }: { team_ids: number[] }) => void\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@planningcenter/chat-react-native",
|
|
3
|
-
"version": "3.7.1-rc.
|
|
3
|
+
"version": "3.7.1-rc.2",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "build/index.js",
|
|
6
6
|
"types": "build/index.d.ts",
|
|
@@ -55,5 +55,5 @@
|
|
|
55
55
|
"prettier": "^3.4.2",
|
|
56
56
|
"typescript": "<5.6.0"
|
|
57
57
|
},
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "77bc347b971eb160e5f56a026899e1633e3113d1"
|
|
59
59
|
}
|
|
@@ -2,20 +2,24 @@ import { Pressable, View, StyleSheet, type ViewStyle } from 'react-native'
|
|
|
2
2
|
import { useTheme } from '../../../hooks'
|
|
3
3
|
import { Icon, Text } from '../../../components'
|
|
4
4
|
import { tokens } from '../../../vendor/tapestry/tokens'
|
|
5
|
-
import { ConversationFilterRecipientsScreenProps, TeamProps } from '../types'
|
|
5
|
+
import { ConversationFilterRecipientsScreenProps, SetTeamFilters, TeamProps } from '../types'
|
|
6
6
|
import { type RouteProp, useRoute } from '@react-navigation/native'
|
|
7
|
-
import { useFilterRecipientsContext } from '../context/conversation_filter_recipients_context'
|
|
8
7
|
|
|
9
8
|
interface TeamRowProps {
|
|
10
9
|
data: TeamProps
|
|
11
10
|
style?: ViewStyle
|
|
12
11
|
accessibilityLabelledBy: string
|
|
12
|
+
setTeamFilters: SetTeamFilters
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
export const CheckboxRow = ({
|
|
15
|
+
export const CheckboxRow = ({
|
|
16
|
+
data,
|
|
17
|
+
style,
|
|
18
|
+
accessibilityLabelledBy,
|
|
19
|
+
setTeamFilters,
|
|
20
|
+
}: TeamRowProps) => {
|
|
16
21
|
const styles = useStyles()
|
|
17
22
|
const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()
|
|
18
|
-
const { setTeamFilters } = useFilterRecipientsContext()
|
|
19
23
|
|
|
20
24
|
const { teamId, teamName } = data
|
|
21
25
|
const { team_ids: currentTeamIds } = route.params
|
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import { View, StyleSheet, type ViewStyle } from 'react-native'
|
|
2
2
|
import { useTheme } from '../../../hooks'
|
|
3
3
|
import { Icon, Heading, TextButton } from '../../../components'
|
|
4
|
-
import type {
|
|
4
|
+
import type {
|
|
5
|
+
ConversationFilterRecipientsScreenProps,
|
|
6
|
+
ServiceTypeProps,
|
|
7
|
+
SetTeamFilters,
|
|
8
|
+
} from '../types'
|
|
5
9
|
import { tokens } from '../../../vendor/tapestry/tokens'
|
|
6
10
|
import { pluralize } from '../../../utils'
|
|
7
11
|
import { useRoute, type RouteProp } from '@react-navigation/native'
|
|
8
|
-
import { useFilterRecipientsContext } from '../context/conversation_filter_recipients_context'
|
|
9
12
|
|
|
10
13
|
const BULK_SELECT_LIMIT = 10
|
|
11
14
|
|
|
@@ -13,11 +16,11 @@ interface HeaderRowProps {
|
|
|
13
16
|
data: ServiceTypeProps
|
|
14
17
|
nativeID: string
|
|
15
18
|
style?: ViewStyle
|
|
19
|
+
setTeamFilters: SetTeamFilters
|
|
16
20
|
}
|
|
17
21
|
|
|
18
|
-
export const HeaderRow = ({ data, nativeID, style }: HeaderRowProps) => {
|
|
22
|
+
export const HeaderRow = ({ data, nativeID, style, setTeamFilters }: HeaderRowProps) => {
|
|
19
23
|
const styles = useStyles()
|
|
20
|
-
const { setTeamFilters } = useFilterRecipientsContext()
|
|
21
24
|
const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()
|
|
22
25
|
|
|
23
26
|
const { serviceTypeName, teamIdsForServiceType } = data
|
package/src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx
CHANGED
|
@@ -1,38 +1,35 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import React from 'react'
|
|
3
|
-
import { Platform, StyleSheet
|
|
1
|
+
import { NativeStackNavigationProp } from '@react-navigation/native-stack'
|
|
2
|
+
import React, { useCallback } from 'react'
|
|
3
|
+
import { Platform, StyleSheet } from 'react-native'
|
|
4
4
|
import { useSafeAreaInsets } from 'react-native-safe-area-context'
|
|
5
|
-
import {
|
|
6
|
-
import { Heading } from '../../components'
|
|
5
|
+
import { FlatList } from 'react-native-gesture-handler'
|
|
6
|
+
import { Button, Heading, TextButton } from '../../components'
|
|
7
7
|
import { useTheme } from '../../hooks'
|
|
8
8
|
import { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams'
|
|
9
9
|
import { ConversationFilterRecipientsScreenProps, SectionTypes } from './types'
|
|
10
10
|
import { HeaderRow } from './components/header_row'
|
|
11
11
|
import { tokens } from '../../vendor/tapestry/tokens'
|
|
12
12
|
import { CheckboxRow } from './components/checkbox_row'
|
|
13
|
-
import { useHeaderHeight } from '@react-navigation/elements'
|
|
14
|
-
import { FilterRecipientsProvider } from './context/conversation_filter_recipients_context'
|
|
15
|
-
import { HeaderRightWithContext, FilterHeaderTitle } from './components/navigation_header'
|
|
16
13
|
import { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams'
|
|
14
|
+
import { StackActions, useNavigation } from '@react-navigation/native'
|
|
15
|
+
import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'
|
|
17
16
|
|
|
18
17
|
const SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-'
|
|
19
18
|
|
|
20
|
-
export const ConversationFilterReceipientsScreenOptions
|
|
21
|
-
presentation: Platform.select({ android: 'modal', ios: 'formSheet' }),
|
|
19
|
+
export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({
|
|
22
20
|
sheetAllowedDetents: Platform.select({
|
|
23
21
|
android: [0.75, 0.94],
|
|
24
22
|
default: [0.75, 1],
|
|
25
23
|
}),
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
headerRight: HeaderRightWithContext,
|
|
29
|
-
headerTitle: FilterHeaderTitle,
|
|
30
|
-
headerTitleAlign: 'left',
|
|
31
|
-
sheetCornerRadius: 16,
|
|
32
|
-
}
|
|
24
|
+
headerTitle: 'Teams I lead',
|
|
25
|
+
})
|
|
33
26
|
|
|
34
|
-
export const ConversationFilterRecipientsScreen = ({
|
|
27
|
+
export const ConversationFilterRecipientsScreen = ({
|
|
28
|
+
route,
|
|
29
|
+
}: ConversationFilterRecipientsScreenProps) => {
|
|
35
30
|
const styles = useStyles()
|
|
31
|
+
const navigation =
|
|
32
|
+
useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()
|
|
36
33
|
|
|
37
34
|
const { serviceTypes } = useServiceTypesWithTeams()
|
|
38
35
|
const data = useFlattenedArrayOfServiceTypesWithTeams({
|
|
@@ -41,69 +38,99 @@ export const ConversationFilterRecipientsScreen = ({}: ConversationFilterRecipie
|
|
|
41
38
|
lastRowStyle: styles.lastRow,
|
|
42
39
|
})
|
|
43
40
|
|
|
41
|
+
const { params } = route
|
|
42
|
+
const noTeamsSelected = params.team_ids?.length === 0 || !params.team_ids
|
|
43
|
+
const applyButtonAccessibilityHint = noTeamsSelected
|
|
44
|
+
? 'Select at least one team to navigate to the final step in creating your conversation.'
|
|
45
|
+
: 'Saves selected teams and navigates to the final step to create your conversation.'
|
|
46
|
+
|
|
47
|
+
const setTeamFilters = useCallback(
|
|
48
|
+
({ team_ids }: { team_ids: number[] }) => {
|
|
49
|
+
navigation.setParams({
|
|
50
|
+
team_ids,
|
|
51
|
+
})
|
|
52
|
+
},
|
|
53
|
+
[navigation]
|
|
54
|
+
)
|
|
55
|
+
|
|
56
|
+
const resetTeamFilters = useCallback(() => {
|
|
57
|
+
navigation.goBack()
|
|
58
|
+
}, [navigation])
|
|
59
|
+
|
|
60
|
+
const applyTeamFilters = useCallback(() => {
|
|
61
|
+
navigation.dispatch(StackActions.popTo('ConversationNew', params))
|
|
62
|
+
}, [navigation, params])
|
|
63
|
+
|
|
44
64
|
return (
|
|
45
|
-
<
|
|
46
|
-
<
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
65
|
+
<FormSheet.Root>
|
|
66
|
+
<FormSheet.Header
|
|
67
|
+
title="Teams I lead"
|
|
68
|
+
secondaryButton={
|
|
69
|
+
<TextButton
|
|
70
|
+
onPress={resetTeamFilters}
|
|
71
|
+
accessibilityHint="Cancels any selected teams and closes this modal."
|
|
72
|
+
>
|
|
73
|
+
Cancel
|
|
74
|
+
</TextButton>
|
|
75
|
+
}
|
|
76
|
+
primaryButton={
|
|
77
|
+
<Button
|
|
78
|
+
title="Apply"
|
|
79
|
+
accessibilityHint={applyButtonAccessibilityHint}
|
|
80
|
+
onPress={applyTeamFilters}
|
|
81
|
+
disabled={noTeamsSelected}
|
|
82
|
+
/>
|
|
83
|
+
}
|
|
84
|
+
/>
|
|
85
|
+
<FlatList
|
|
86
|
+
data={data}
|
|
87
|
+
ListHeaderComponent={
|
|
88
|
+
<Heading variant="h3" style={styles.listHeader}>
|
|
89
|
+
Service Types
|
|
90
|
+
</Heading>
|
|
91
|
+
}
|
|
92
|
+
contentContainerStyle={styles.listContentContainer}
|
|
93
|
+
keyExtractor={item =>
|
|
94
|
+
`${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`
|
|
95
|
+
}
|
|
96
|
+
renderItem={({ item }) => {
|
|
97
|
+
switch (item.type) {
|
|
98
|
+
case SectionTypes.header:
|
|
99
|
+
return (
|
|
100
|
+
<HeaderRow
|
|
101
|
+
data={item.data}
|
|
102
|
+
style={item.sectionStyle}
|
|
103
|
+
nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}
|
|
104
|
+
setTeamFilters={setTeamFilters}
|
|
105
|
+
/>
|
|
106
|
+
)
|
|
107
|
+
case SectionTypes.team:
|
|
108
|
+
return (
|
|
109
|
+
<CheckboxRow
|
|
110
|
+
data={item.data}
|
|
111
|
+
style={item.sectionStyle}
|
|
112
|
+
accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}
|
|
113
|
+
setTeamFilters={setTeamFilters}
|
|
114
|
+
/>
|
|
115
|
+
)
|
|
116
|
+
default:
|
|
117
|
+
return null
|
|
53
118
|
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
`${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`
|
|
58
|
-
}
|
|
59
|
-
renderItem={({ item }) => {
|
|
60
|
-
switch (item.type) {
|
|
61
|
-
case SectionTypes.header:
|
|
62
|
-
return (
|
|
63
|
-
<HeaderRow
|
|
64
|
-
data={item.data}
|
|
65
|
-
style={item.sectionStyle}
|
|
66
|
-
nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}
|
|
67
|
-
/>
|
|
68
|
-
)
|
|
69
|
-
case SectionTypes.team:
|
|
70
|
-
return (
|
|
71
|
-
<CheckboxRow
|
|
72
|
-
data={item.data}
|
|
73
|
-
style={item.sectionStyle}
|
|
74
|
-
accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}
|
|
75
|
-
/>
|
|
76
|
-
)
|
|
77
|
-
default:
|
|
78
|
-
return null
|
|
79
|
-
}
|
|
80
|
-
}}
|
|
81
|
-
/>
|
|
82
|
-
</View>
|
|
83
|
-
</FilterRecipientsProvider>
|
|
119
|
+
}}
|
|
120
|
+
/>
|
|
121
|
+
</FormSheet.Root>
|
|
84
122
|
)
|
|
85
123
|
}
|
|
86
124
|
|
|
87
125
|
const useStyles = () => {
|
|
88
126
|
const { colors } = useTheme()
|
|
89
|
-
const {
|
|
90
|
-
const { height } = useWindowDimensions()
|
|
91
|
-
const headerHeight = useHeaderHeight()
|
|
92
|
-
|
|
93
|
-
const containerHeight = Platform.select({
|
|
94
|
-
android: height,
|
|
95
|
-
ios: height - top - headerHeight,
|
|
96
|
-
})
|
|
127
|
+
const { bottom } = useSafeAreaInsets()
|
|
97
128
|
|
|
98
129
|
return StyleSheet.create({
|
|
99
|
-
listWrapper: {
|
|
100
|
-
flex: 1,
|
|
101
|
-
height: containerHeight,
|
|
102
|
-
backgroundColor: colors.surfaceColor080,
|
|
103
|
-
},
|
|
104
130
|
listContentContainer: {
|
|
131
|
+
backgroundColor: colors.surfaceColor080,
|
|
105
132
|
padding: 16,
|
|
106
|
-
paddingBottom: bottom,
|
|
133
|
+
paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
|
|
107
134
|
},
|
|
108
135
|
listHeader: {
|
|
109
136
|
paddingBottom: 16,
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { HeaderTitleProps } from '@react-navigation/elements';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export declare const FilterHeaderTitle: ({ tintColor }: HeaderTitleProps) => React.JSX.Element;
|
|
4
|
-
export declare const HeaderRightWithContext: () => React.JSX.Element;
|
|
5
|
-
//# sourceMappingURL=navigation_header.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"navigation_header.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/navigation_header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC1E,OAAO,KAAK,MAAM,OAAO,CAAA;AAWzB,eAAO,MAAM,iBAAiB,kBAAmB,gBAAgB,sBAIhE,CAAA;AA+BD,eAAO,MAAM,sBAAsB,yBAMlC,CAAA"}
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { HeaderTitle } from '@react-navigation/elements';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import { StyleSheet, View } from 'react-native';
|
|
4
|
-
import { Button, TextButton } from '../../../components';
|
|
5
|
-
import { useRoute } from '@react-navigation/native';
|
|
6
|
-
import { tokens } from '../../../vendor/tapestry/tokens';
|
|
7
|
-
import { FilterRecipientsProvider, useFilterRecipientsContext, } from '../context/conversation_filter_recipients_context';
|
|
8
|
-
export const FilterHeaderTitle = ({ tintColor }) => {
|
|
9
|
-
const styles = useStyles();
|
|
10
|
-
return <HeaderTitle style={[styles.headerTitle, { color: tintColor }]}>Teams I lead</HeaderTitle>;
|
|
11
|
-
};
|
|
12
|
-
const HeaderRight = () => {
|
|
13
|
-
const styles = useStyles();
|
|
14
|
-
const route = useRoute();
|
|
15
|
-
const { resetTeamFilters, applyTeamFilters } = useFilterRecipientsContext();
|
|
16
|
-
const { team_ids } = route.params;
|
|
17
|
-
const noTeamsSelected = team_ids?.length === 0 || !team_ids;
|
|
18
|
-
const applyButtonAccessibilityHint = noTeamsSelected
|
|
19
|
-
? 'Select at least one team to navigate to the final step in creating your conversation.'
|
|
20
|
-
: 'Saves selected teams and navigates to the final step to create your conversation.';
|
|
21
|
-
return (<View style={styles.headerRight}>
|
|
22
|
-
<TextButton onPress={resetTeamFilters} accessibilityHint="Cancels any selected teams and closes this modal.">
|
|
23
|
-
Cancel
|
|
24
|
-
</TextButton>
|
|
25
|
-
<Button title="Apply" accessibilityHint={applyButtonAccessibilityHint} onPress={() => applyTeamFilters(route.params)} disabled={noTeamsSelected}/>
|
|
26
|
-
</View>);
|
|
27
|
-
};
|
|
28
|
-
export const HeaderRightWithContext = () => {
|
|
29
|
-
return (<FilterRecipientsProvider>
|
|
30
|
-
<HeaderRight />
|
|
31
|
-
</FilterRecipientsProvider>);
|
|
32
|
-
};
|
|
33
|
-
const useStyles = () => {
|
|
34
|
-
return StyleSheet.create({
|
|
35
|
-
headerTitle: {
|
|
36
|
-
fontSize: tokens.fontSizeLg,
|
|
37
|
-
flex: 1,
|
|
38
|
-
},
|
|
39
|
-
headerRight: {
|
|
40
|
-
flexDirection: 'row',
|
|
41
|
-
gap: 16,
|
|
42
|
-
alignItems: 'center',
|
|
43
|
-
},
|
|
44
|
-
});
|
|
45
|
-
};
|
|
46
|
-
//# sourceMappingURL=navigation_header.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"navigation_header.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/components/navigation_header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAoB,MAAM,4BAA4B,CAAA;AAC1E,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AACxD,OAAO,EAAa,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAA;AACxD,OAAO,EACL,wBAAwB,EACxB,0BAA0B,GAC3B,MAAM,mDAAmD,CAAA;AAG1D,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,EAAE,SAAS,EAAoB,EAAE,EAAE;IACnE,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,WAAW,CAAC,CAAA;AACnG,CAAC,CAAA;AAED,MAAM,WAAW,GAAG,GAAG,EAAE;IACvB,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,KAAK,GAAG,QAAQ,EAA+D,CAAA;IACrF,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,GAAG,0BAA0B,EAAE,CAAA;IAE3E,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM,CAAA;IACjC,MAAM,eAAe,GAAG,QAAQ,EAAE,MAAM,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAA;IAC3D,MAAM,4BAA4B,GAAG,eAAe;QAClD,CAAC,CAAC,uFAAuF;QACzF,CAAC,CAAC,mFAAmF,CAAA;IAEvF,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAC9B;MAAA,CAAC,UAAU,CACT,OAAO,CAAC,CAAC,gBAAgB,CAAC,CAC1B,iBAAiB,CAAC,mDAAmD,CAErE;;MACF,EAAE,UAAU,CACZ;MAAA,CAAC,MAAM,CACL,KAAK,CAAC,OAAO,CACb,iBAAiB,CAAC,CAAC,4BAA4B,CAAC,CAChD,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAC9C,QAAQ,CAAC,CAAC,eAAe,CAAC,EAE9B;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,EAAE;IACzC,OAAO,CACL,CAAC,wBAAwB,CACvB;MAAA,CAAC,WAAW,CAAC,AAAD,EACd;IAAA,EAAE,wBAAwB,CAAC,CAC5B,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,WAAW,EAAE;YACX,QAAQ,EAAE,MAAM,CAAC,UAAU;YAC3B,IAAI,EAAE,CAAC;SACR;QACD,WAAW,EAAE;YACX,aAAa,EAAE,KAAK;YACpB,GAAG,EAAE,EAAE;YACP,UAAU,EAAE,QAAQ;SACrB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { HeaderTitle, HeaderTitleProps } from '@react-navigation/elements'\nimport React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { Button, TextButton } from '../../../components'\nimport { RouteProp, useRoute } from '@react-navigation/native'\nimport { tokens } from '../../../vendor/tapestry/tokens'\nimport {\n FilterRecipientsProvider,\n useFilterRecipientsContext,\n} from '../context/conversation_filter_recipients_context'\nimport { ConversationFilterRecipientsScreenProps } from '../types'\n\nexport const FilterHeaderTitle = ({ tintColor }: HeaderTitleProps) => {\n const styles = useStyles()\n\n return <HeaderTitle style={[styles.headerTitle, { color: tintColor }]}>Teams I lead</HeaderTitle>\n}\n\nconst HeaderRight = () => {\n const styles = useStyles()\n const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()\n const { resetTeamFilters, applyTeamFilters } = useFilterRecipientsContext()\n\n const { team_ids } = route.params\n const noTeamsSelected = team_ids?.length === 0 || !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 return (\n <View style={styles.headerRight}>\n <TextButton\n onPress={resetTeamFilters}\n accessibilityHint=\"Cancels any selected teams and closes this modal.\"\n >\n Cancel\n </TextButton>\n <Button\n title=\"Apply\"\n accessibilityHint={applyButtonAccessibilityHint}\n onPress={() => applyTeamFilters(route.params)}\n disabled={noTeamsSelected}\n />\n </View>\n )\n}\n\nexport const HeaderRightWithContext = () => {\n return (\n <FilterRecipientsProvider>\n <HeaderRight />\n </FilterRecipientsProvider>\n )\n}\n\nconst useStyles = () => {\n return StyleSheet.create({\n headerTitle: {\n fontSize: tokens.fontSizeLg,\n flex: 1,\n },\n headerRight: {\n flexDirection: 'row',\n gap: 16,\n alignItems: 'center',\n },\n })\n}\n"]}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { PropsWithChildren } from 'react';
|
|
3
|
-
import { ConversationFilterRecipientsParams } from '../types';
|
|
4
|
-
export declare const FilterRecipientsContext: React.Context<{
|
|
5
|
-
params: ConversationFilterRecipientsParams;
|
|
6
|
-
resetTeamFilters: () => void;
|
|
7
|
-
setTeamFilters: (params: ConversationFilterRecipientsParams) => void;
|
|
8
|
-
applyTeamFilters: (params: ConversationFilterRecipientsParams) => void;
|
|
9
|
-
}>;
|
|
10
|
-
export declare const FilterRecipientsProvider: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
11
|
-
export declare const useFilterRecipientsContext: () => {
|
|
12
|
-
params: ConversationFilterRecipientsParams;
|
|
13
|
-
resetTeamFilters: () => void;
|
|
14
|
-
setTeamFilters: (params: ConversationFilterRecipientsParams) => void;
|
|
15
|
-
applyTeamFilters: (params: ConversationFilterRecipientsParams) => void;
|
|
16
|
-
};
|
|
17
|
-
//# sourceMappingURL=conversation_filter_recipients_context.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"conversation_filter_recipients_context.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAExD,OAAO,EACL,kCAAkC,EAEnC,MAAM,UAAU,CAAA;AAGjB,eAAO,MAAM,uBAAuB;YAC1B,kCAAkC;sBACxB,MAAM,IAAI;oBACZ,CAAC,MAAM,EAAE,kCAAkC,KAAK,IAAI;sBAClD,CAAC,MAAM,EAAE,kCAAkC,KAAK,IAAI;EAStE,CAAA;AAEF,eAAO,MAAM,wBAAwB,iBAAkB,iBAAiB,sBAwBvE,CAAA;AAED,eAAO,MAAM,0BAA0B;YAxC7B,kCAAkC;sBACxB,MAAM,IAAI;oBACZ,CAAC,MAAM,EAAE,kCAAkC,KAAK,IAAI;sBAClD,CAAC,MAAM,EAAE,kCAAkC,KAAK,IAAI;CAuCvE,CAAA"}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { createContext } from 'react';
|
|
3
|
-
import { StackActions, useNavigation, useRoute } from '@react-navigation/native';
|
|
4
|
-
export const FilterRecipientsContext = createContext({
|
|
5
|
-
params: {
|
|
6
|
-
source_app_name: undefined,
|
|
7
|
-
team_ids: [],
|
|
8
|
-
},
|
|
9
|
-
resetTeamFilters: () => { },
|
|
10
|
-
setTeamFilters: () => { },
|
|
11
|
-
applyTeamFilters: () => { },
|
|
12
|
-
});
|
|
13
|
-
export const FilterRecipientsProvider = ({ children }) => {
|
|
14
|
-
const navigation = useNavigation();
|
|
15
|
-
const route = useRoute();
|
|
16
|
-
const filterContextValue = {
|
|
17
|
-
params: route.params,
|
|
18
|
-
resetTeamFilters: () => {
|
|
19
|
-
navigation.goBack();
|
|
20
|
-
},
|
|
21
|
-
setTeamFilters: (params) => {
|
|
22
|
-
navigation.setParams({
|
|
23
|
-
team_ids: params.team_ids,
|
|
24
|
-
});
|
|
25
|
-
},
|
|
26
|
-
applyTeamFilters: (params) => {
|
|
27
|
-
navigation.dispatch(StackActions.popTo('ConversationNew', params));
|
|
28
|
-
},
|
|
29
|
-
};
|
|
30
|
-
return (<FilterRecipientsContext.Provider value={filterContextValue}>
|
|
31
|
-
{children}
|
|
32
|
-
</FilterRecipientsContext.Provider>);
|
|
33
|
-
};
|
|
34
|
-
export const useFilterRecipientsContext = () => {
|
|
35
|
-
return React.useContext(FilterRecipientsContext);
|
|
36
|
-
};
|
|
37
|
-
//# sourceMappingURL=conversation_filter_recipients_context.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"conversation_filter_recipients_context.js","sourceRoot":"","sources":["../../../../src/screens/conversation_filter_recipients/context/conversation_filter_recipients_context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,aAAa,EAAqB,MAAM,OAAO,CAAA;AACxD,OAAO,EAAa,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAO3F,MAAM,CAAC,MAAM,uBAAuB,GAAG,aAAa,CAKjD;IACD,MAAM,EAAE;QACN,eAAe,EAAE,SAAS;QAC1B,QAAQ,EAAE,EAAE;KACb;IACD,gBAAgB,EAAE,GAAG,EAAE,GAAE,CAAC;IAC1B,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,gBAAgB,EAAE,GAAG,EAAE,GAAE,CAAC;CAC3B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,EAAE,QAAQ,EAAqB,EAAE,EAAE;IAC1E,MAAM,UAAU,GACd,aAAa,EAAsE,CAAA;IACrF,MAAM,KAAK,GAAG,QAAQ,EAA+D,CAAA;IACrF,MAAM,kBAAkB,GAAG;QACzB,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,gBAAgB,EAAE,GAAG,EAAE;YACrB,UAAU,CAAC,MAAM,EAAE,CAAA;QACrB,CAAC;QACD,cAAc,EAAE,CAAC,MAAmE,EAAE,EAAE;YACtF,UAAU,CAAC,SAAS,CAAC;gBACnB,QAAQ,EAAE,MAAM,CAAC,QAAQ;aAC1B,CAAC,CAAA;QACJ,CAAC;QACD,gBAAgB,EAAE,CAAC,MAA0C,EAAE,EAAE;YAC/D,UAAU,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC,CAAA;QACpE,CAAC;KACF,CAAA;IAED,OAAO,CACL,CAAC,uBAAuB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAC1D;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,uBAAuB,CAAC,QAAQ,CAAC,CACpC,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,EAAE;IAC7C,OAAO,KAAK,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAA;AAClD,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { createContext, PropsWithChildren } from 'react'\nimport { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'\nimport {\n ConversationFilterRecipientsParams,\n ConversationFilterRecipientsScreenProps,\n} from '../types'\nimport { NativeStackNavigationProp } from '@react-navigation/native-stack'\n\nexport const FilterRecipientsContext = createContext<{\n params: ConversationFilterRecipientsParams\n resetTeamFilters: () => void\n setTeamFilters: (params: ConversationFilterRecipientsParams) => void\n applyTeamFilters: (params: ConversationFilterRecipientsParams) => void\n}>({\n params: {\n source_app_name: undefined,\n team_ids: [],\n },\n resetTeamFilters: () => {},\n setTeamFilters: () => {},\n applyTeamFilters: () => {},\n})\n\nexport const FilterRecipientsProvider = ({ children }: PropsWithChildren) => {\n const navigation =\n useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()\n const filterContextValue = {\n params: route.params,\n resetTeamFilters: () => {\n navigation.goBack()\n },\n setTeamFilters: (params: Omit<ConversationFilterRecipientsParams, 'source_app_name'>) => {\n navigation.setParams({\n team_ids: params.team_ids,\n })\n },\n applyTeamFilters: (params: ConversationFilterRecipientsParams) => {\n navigation.dispatch(StackActions.popTo('ConversationNew', params))\n },\n }\n\n return (\n <FilterRecipientsContext.Provider value={filterContextValue}>\n {children}\n </FilterRecipientsContext.Provider>\n )\n}\n\nexport const useFilterRecipientsContext = () => {\n return React.useContext(FilterRecipientsContext)\n}\n"]}
|
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
import { HeaderTitle, HeaderTitleProps } from '@react-navigation/elements'
|
|
2
|
-
import React from 'react'
|
|
3
|
-
import { StyleSheet, View } from 'react-native'
|
|
4
|
-
import { Button, TextButton } from '../../../components'
|
|
5
|
-
import { RouteProp, useRoute } from '@react-navigation/native'
|
|
6
|
-
import { tokens } from '../../../vendor/tapestry/tokens'
|
|
7
|
-
import {
|
|
8
|
-
FilterRecipientsProvider,
|
|
9
|
-
useFilterRecipientsContext,
|
|
10
|
-
} from '../context/conversation_filter_recipients_context'
|
|
11
|
-
import { ConversationFilterRecipientsScreenProps } from '../types'
|
|
12
|
-
|
|
13
|
-
export const FilterHeaderTitle = ({ tintColor }: HeaderTitleProps) => {
|
|
14
|
-
const styles = useStyles()
|
|
15
|
-
|
|
16
|
-
return <HeaderTitle style={[styles.headerTitle, { color: tintColor }]}>Teams I lead</HeaderTitle>
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
const HeaderRight = () => {
|
|
20
|
-
const styles = useStyles()
|
|
21
|
-
const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()
|
|
22
|
-
const { resetTeamFilters, applyTeamFilters } = useFilterRecipientsContext()
|
|
23
|
-
|
|
24
|
-
const { team_ids } = route.params
|
|
25
|
-
const noTeamsSelected = team_ids?.length === 0 || !team_ids
|
|
26
|
-
const applyButtonAccessibilityHint = noTeamsSelected
|
|
27
|
-
? 'Select at least one team to navigate to the final step in creating your conversation.'
|
|
28
|
-
: 'Saves selected teams and navigates to the final step to create your conversation.'
|
|
29
|
-
|
|
30
|
-
return (
|
|
31
|
-
<View style={styles.headerRight}>
|
|
32
|
-
<TextButton
|
|
33
|
-
onPress={resetTeamFilters}
|
|
34
|
-
accessibilityHint="Cancels any selected teams and closes this modal."
|
|
35
|
-
>
|
|
36
|
-
Cancel
|
|
37
|
-
</TextButton>
|
|
38
|
-
<Button
|
|
39
|
-
title="Apply"
|
|
40
|
-
accessibilityHint={applyButtonAccessibilityHint}
|
|
41
|
-
onPress={() => applyTeamFilters(route.params)}
|
|
42
|
-
disabled={noTeamsSelected}
|
|
43
|
-
/>
|
|
44
|
-
</View>
|
|
45
|
-
)
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
export const HeaderRightWithContext = () => {
|
|
49
|
-
return (
|
|
50
|
-
<FilterRecipientsProvider>
|
|
51
|
-
<HeaderRight />
|
|
52
|
-
</FilterRecipientsProvider>
|
|
53
|
-
)
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
const useStyles = () => {
|
|
57
|
-
return StyleSheet.create({
|
|
58
|
-
headerTitle: {
|
|
59
|
-
fontSize: tokens.fontSizeLg,
|
|
60
|
-
flex: 1,
|
|
61
|
-
},
|
|
62
|
-
headerRight: {
|
|
63
|
-
flexDirection: 'row',
|
|
64
|
-
gap: 16,
|
|
65
|
-
alignItems: 'center',
|
|
66
|
-
},
|
|
67
|
-
})
|
|
68
|
-
}
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import { createContext, PropsWithChildren } from 'react'
|
|
3
|
-
import { RouteProp, StackActions, useNavigation, useRoute } from '@react-navigation/native'
|
|
4
|
-
import {
|
|
5
|
-
ConversationFilterRecipientsParams,
|
|
6
|
-
ConversationFilterRecipientsScreenProps,
|
|
7
|
-
} from '../types'
|
|
8
|
-
import { NativeStackNavigationProp } from '@react-navigation/native-stack'
|
|
9
|
-
|
|
10
|
-
export const FilterRecipientsContext = createContext<{
|
|
11
|
-
params: ConversationFilterRecipientsParams
|
|
12
|
-
resetTeamFilters: () => void
|
|
13
|
-
setTeamFilters: (params: ConversationFilterRecipientsParams) => void
|
|
14
|
-
applyTeamFilters: (params: ConversationFilterRecipientsParams) => void
|
|
15
|
-
}>({
|
|
16
|
-
params: {
|
|
17
|
-
source_app_name: undefined,
|
|
18
|
-
team_ids: [],
|
|
19
|
-
},
|
|
20
|
-
resetTeamFilters: () => {},
|
|
21
|
-
setTeamFilters: () => {},
|
|
22
|
-
applyTeamFilters: () => {},
|
|
23
|
-
})
|
|
24
|
-
|
|
25
|
-
export const FilterRecipientsProvider = ({ children }: PropsWithChildren) => {
|
|
26
|
-
const navigation =
|
|
27
|
-
useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()
|
|
28
|
-
const route = useRoute<RouteProp<ConversationFilterRecipientsScreenProps['route']>>()
|
|
29
|
-
const filterContextValue = {
|
|
30
|
-
params: route.params,
|
|
31
|
-
resetTeamFilters: () => {
|
|
32
|
-
navigation.goBack()
|
|
33
|
-
},
|
|
34
|
-
setTeamFilters: (params: Omit<ConversationFilterRecipientsParams, 'source_app_name'>) => {
|
|
35
|
-
navigation.setParams({
|
|
36
|
-
team_ids: params.team_ids,
|
|
37
|
-
})
|
|
38
|
-
},
|
|
39
|
-
applyTeamFilters: (params: ConversationFilterRecipientsParams) => {
|
|
40
|
-
navigation.dispatch(StackActions.popTo('ConversationNew', params))
|
|
41
|
-
},
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
return (
|
|
45
|
-
<FilterRecipientsContext.Provider value={filterContextValue}>
|
|
46
|
-
{children}
|
|
47
|
-
</FilterRecipientsContext.Provider>
|
|
48
|
-
)
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
export const useFilterRecipientsContext = () => {
|
|
52
|
-
return React.useContext(FilterRecipientsContext)
|
|
53
|
-
}
|