@planningcenter/chat-react-native 3.7.1-rc.1 → 3.7.1-rc.3
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/components/display/badge.d.ts.map +1 -1
- package/build/components/display/badge.js +2 -4
- package/build/components/display/badge.js.map +1 -1
- 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/components/display/badge.tsx +12 -4
- 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
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAClC,OAAO,KAAK,EAAwB,SAAS,EAAE,MAAM,cAAc,CAAA;AAMnE,OAAO,EAAQ,UAAU,EAAE,MAAM,QAAQ,CAAA;AAEzC,OAAO,EAA+B,KAAK,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAM/F,QAAA,MAAM,QAAQ;;;;CAIJ,CAAA;AAEV,KAAK,YAAY,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAA;AAiB5D,KAAK,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAA;AAcpE,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAA;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,UAAU,CAAA;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,wBAAgB,KAAK,CAAC,EACpB,UAAsB,EACtB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,aAAa,EACb,KAAK,EACL,eAAe,EACf,OAAmB,EACnB,qBAAqB,EACrB,OAAO,GACR,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAClC,OAAO,KAAK,EAAwB,SAAS,EAAE,MAAM,cAAc,CAAA;AAMnE,OAAO,EAAQ,UAAU,EAAE,MAAM,QAAQ,CAAA;AAEzC,OAAO,EAA+B,KAAK,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAM/F,QAAA,MAAM,QAAQ;;;;CAIJ,CAAA;AAEV,KAAK,YAAY,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAA;AAiB5D,KAAK,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAA;AAcpE,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAA;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,UAAU,CAAA;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,wBAAgB,KAAK,CAAC,EACpB,UAAsB,EACtB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,aAAa,EACb,KAAK,EACL,eAAe,EACf,OAAmB,EACnB,qBAAqB,EACrB,OAAO,GACR,EAAE,UAAU,eAsCZ"}
|
|
@@ -33,12 +33,12 @@ export function Badge({ appearance = 'neutral', metaLabel, style, iconName, icon
|
|
|
33
33
|
<View style={styles.badge}>
|
|
34
34
|
{showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize}/>}
|
|
35
35
|
{iconName && <Icon name={iconName} style={styles.icon}/>}
|
|
36
|
-
<Text variant="footnote" style={styles.label} numberOfLines={1}>
|
|
36
|
+
<Text variant="footnote" style={styles.label} numberOfLines={1} maxFontSizeMultiplier={maxFontSizeMultiplier}>
|
|
37
37
|
{badgeLabel}
|
|
38
38
|
</Text>
|
|
39
39
|
{iconNameRight && <Icon name={iconNameRight} style={styles.iconRight}/>}
|
|
40
40
|
</View>
|
|
41
|
-
{hasMetaLabel && (<Text variant="footnote" style={styles.metaLabel} numberOfLines={1}>
|
|
41
|
+
{hasMetaLabel && (<Text variant="footnote" style={styles.metaLabel} numberOfLines={1} maxFontSizeMultiplier={maxFontSizeMultiplier}>
|
|
42
42
|
{metaLabel}
|
|
43
43
|
</Text>)}
|
|
44
44
|
</BadgeWrapper>);
|
|
@@ -131,7 +131,6 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
|
|
|
131
131
|
color: variantStylesMap[variant].textColor,
|
|
132
132
|
fontWeight: variantStylesMap[variant].fontWeight,
|
|
133
133
|
fontSize: badgeFontSize,
|
|
134
|
-
lineHeight: 15 * fontScale,
|
|
135
134
|
flexShrink: 1,
|
|
136
135
|
},
|
|
137
136
|
metaLabel: {
|
|
@@ -139,7 +138,6 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
|
|
|
139
138
|
fontSize: badgeFontSize,
|
|
140
139
|
flexShrink: 1,
|
|
141
140
|
paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,
|
|
142
|
-
lineHeight: 15 * fontScale,
|
|
143
141
|
},
|
|
144
142
|
});
|
|
145
143
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { JSX } from 'react'\nimport type { TextStyle, ViewProps, ViewStyle } from 'react-native'\nimport { Pressable, StyleSheet, View } from 'react-native'\nimport Svg, { Defs, LinearGradient, Path, Stop } from 'react-native-svg'\nimport { useFontScale, useTheme } from '../../hooks'\nimport { platformFontWeightMedium, space } from '../../utils'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { Icon, IconString } from './icon'\nimport { Text } from './text'\nimport { useStatusColorAppearanceMap, type StatusAppearanceUnion } from './utils/status_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst VARIANTS = {\n default: 'default',\n meta: 'meta',\n metaSubtle: 'metaSubtle',\n} as const\n\ntype VariantUnion = (typeof VARIANTS)[keyof typeof VARIANTS]\n\ntype VariantStyles = Record<\n VariantUnion,\n {\n backgroundColor: string\n paddingHorizontal: number\n paddingVertical: number\n borderWidth: number\n borderRadius: number\n textColor: string\n gap: number\n metaLabelPaddingLeft: number\n fontWeight: TextStyle['fontWeight']\n }\n>\n\ntype ProductLogoName = 'Groups' | 'Services' | 'groups' | 'services'\ntype ProductLogoComponent = ({ logoSize }: { logoSize: number }) => JSX.Element\n\nconst PRODUCT_LOGO_COMPONENT_MAP: Record<ProductLogoName, ProductLogoComponent> = {\n Groups: GroupsLogo,\n groups: GroupsLogo,\n services: ServicesIcon,\n Services: ServicesIcon,\n}\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport interface BadgeProps {\n /**\n * Renders the main text.\n */\n label: string\n /**\n * Renders secondary meta text to the right of the label.\n */\n metaLabel?: string\n /**\n * Changes the status color for the badge and icon.\n */\n appearance?: StatusAppearanceUnion\n /**\n * Changes form of the logo to support a meta label and badge\n */\n variant?: VariantUnion\n /**\n * Adds a product logo to the left of the text.\n */\n productLogoName?: ProductLogoName\n /**\n * Shows an icon of the user choice to the left of the text.\n */\n iconName?: IconString\n /**\n * Shows an icon of the user choice to the right of the text.\n */\n iconNameRight?: IconString\n /**\n * Styles badge wrapper.\n */\n style?: ViewStyle\n /**\n * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n */\n maxFontSizeMultiplier?: number\n /**\n * Callback function when the badge is pressed.\n */\n onPress?: () => void\n}\n\nexport function Badge({\n appearance = 'neutral',\n metaLabel,\n style,\n iconName,\n iconNameRight,\n label,\n productLogoName,\n variant = 'default',\n maxFontSizeMultiplier,\n onPress,\n}: BadgeProps) {\n const styles = useStyles({ appearance, maxFontSizeMultiplier, variant })\n const { showBadgeProductLogo } = useTheme()\n\n const isMetaSubtle = variant === 'metaSubtle'\n const hasMetaLabel = Boolean(metaLabel)\n\n const showLogo = showBadgeProductLogo && productLogoName\n const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName]\n const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label\n\n return (\n <BadgeWrapper style={[styles.badgeWrapper, style]} onPress={onPress} accessibilityRole=\"button\">\n <View style={styles.badge}>\n {showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}\n {iconName && <Icon name={iconName} style={styles.icon} />}\n <Text variant=\"footnote\" style={styles.label} numberOfLines={1}>\n {badgeLabel}\n </Text>\n {iconNameRight && <Icon name={iconNameRight} style={styles.iconRight} />}\n </View>\n {hasMetaLabel && (\n <Text variant=\"footnote\" style={styles.metaLabel} numberOfLines={1}>\n {metaLabel}\n </Text>\n )}\n </BadgeWrapper>\n )\n}\n\nconst BadgeWrapper = ({\n children,\n onPress,\n accessibilityRole,\n ...restProps\n}: ViewProps & Pick<BadgeProps, 'onPress'>) => {\n if (onPress) {\n return (\n <Pressable accessibilityRole={accessibilityRole} onPress={onPress} {...restProps}>\n {children}\n </Pressable>\n )\n }\n\n return <View {...restProps}>{children}</View>\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n appearance = 'neutral',\n maxFontSizeMultiplier,\n variant = 'default',\n}: Partial<BadgeProps>) => {\n const { colors } = useTheme()\n const fontScale = useFontScale({ maxFontSizeMultiplier })\n\n const statusColorMap = useStatusColorAppearanceMap()\n\n const badgePaddingHorizontal = space(1) * fontScale\n const badgePaddingVertical = space(0.5) * fontScale\n const badgeGap = space(0.5) * fontScale\n const badgeFontSize = 12\n\n const variantStylesMap: VariantStyles = {\n default: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd,\n textColor: statusColorMap[appearance].text,\n fontWeight: 'normal',\n },\n meta: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd,\n textColor: statusColorMap[appearance].text,\n fontWeight: platformFontWeightMedium,\n },\n metaSubtle: {\n gap: badgeGap,\n backgroundColor: 'transparent',\n metaLabelPaddingLeft: badgeGap,\n paddingHorizontal: 0,\n paddingVertical: 0,\n borderWidth: 0,\n borderRadius: 0,\n textColor: colors.textColorDefaultSecondary,\n fontWeight: platformFontWeightMedium,\n },\n }\n\n return StyleSheet.create({\n badgeWrapper: {\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n alignSelf: 'flex-start',\n borderRadius: variantStylesMap[variant].borderRadius,\n borderWidth: variantStylesMap[variant].borderWidth,\n borderColor: statusColorMap[appearance].background,\n },\n badge: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: variantStylesMap[variant].gap,\n paddingVertical: variantStylesMap[variant].paddingVertical,\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n backgroundColor: variantStylesMap[variant].backgroundColor,\n borderRadius: variantStylesMap[variant].borderRadius - 2,\n },\n icon: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize,\n },\n iconRight: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize - 2,\n },\n logo: {\n fontSize: badgeFontSize * fontScale,\n },\n label: {\n color: variantStylesMap[variant].textColor,\n fontWeight: variantStylesMap[variant].fontWeight,\n fontSize: badgeFontSize,\n lineHeight: 15 * fontScale,\n flexShrink: 1,\n },\n metaLabel: {\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n fontSize: badgeFontSize,\n flexShrink: 1,\n paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,\n lineHeight: 15 * fontScale,\n },\n })\n}\n\n// =================================\n// ====== Product Logos ============\n// =================================\n\ninterface ProductLogoProps {\n logoSize: number\n}\n\nfunction GroupsLogo({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n d=\"M9.06 6.14H6.94c-.152.36-.438.646-.797.798v2.12c.359.152.645.438.797.797h2.117c.152-.359.437-.645.796-.797V6.94a1.502 1.502 0 01-.793-.8zM8 0C1.6 0 0 1.595 0 8s1.6 8 8 8 8-1.595 8-8-1.595-8-8-8zm3.939 10.44a1.5 1.5 0 01-2.882.585H6.94a1.5 1.5 0 11-1.963-1.963v-2.12A1.501 1.501 0 116.94 4.98h2.12a1.5 1.5 0 111.963 1.968v2.11a1.501 1.501 0 01.916 1.383z\"\n fill=\"url(#paint0_linear_2632_26363)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_26363\"\n x1={-5.6338}\n y1={5.6338}\n x2={5.6338}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#FF962D\" />\n <Stop offset={1} stopColor=\"#FC7638\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n\nfunction ServicesIcon({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M.116 8c0-6.4 1.6-8 8-8s8 1.6 8 8-1.6 8-8 8-8-1.6-8-8zm4.123 3.464a.848.848 0 10.943-1.41.848.848 0 00-.943 1.41zm.001-2.76a.848.848 0 10.948-1.408.848.848 0 00-.948 1.407zm0-2.759a.849.849 0 10.948-1.408.849.849 0 00-.948 1.408zm8.1 5.34a.388.388 0 00.03-.149v-.755a.39.39 0 00-.39-.39H6.87a.39.39 0 00-.39.39v.755a.39.39 0 00.39.39h5.11a.39.39 0 00.36-.24zm0-2.758a.388.388 0 00.03-.149v-.757a.387.387 0 00-.39-.388H6.87a.388.388 0 00-.39.388v.757a.388.388 0 00.39.388h5.11a.388.388 0 00.36-.24zm0-2.76a.388.388 0 00.03-.148v-.754a.39.39 0 00-.39-.389H6.87a.39.39 0 00-.39.387v.756a.39.39 0 00.39.39h5.11a.389.389 0 00.36-.241z\"\n fill=\"url(#paint0_linear_2632_56586)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_56586\"\n x1={-5.51759}\n y1={5.6338}\n x2={5.75001}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#6BB23D\" />\n <Stop offset={1} stopColor=\"#659630\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n"]}
|
|
1
|
+
{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { JSX } from 'react'\nimport type { TextStyle, ViewProps, ViewStyle } from 'react-native'\nimport { Pressable, StyleSheet, View } from 'react-native'\nimport Svg, { Defs, LinearGradient, Path, Stop } from 'react-native-svg'\nimport { useFontScale, useTheme } from '../../hooks'\nimport { platformFontWeightMedium, space } from '../../utils'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { Icon, IconString } from './icon'\nimport { Text } from './text'\nimport { useStatusColorAppearanceMap, type StatusAppearanceUnion } from './utils/status_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst VARIANTS = {\n default: 'default',\n meta: 'meta',\n metaSubtle: 'metaSubtle',\n} as const\n\ntype VariantUnion = (typeof VARIANTS)[keyof typeof VARIANTS]\n\ntype VariantStyles = Record<\n VariantUnion,\n {\n backgroundColor: string\n paddingHorizontal: number\n paddingVertical: number\n borderWidth: number\n borderRadius: number\n textColor: string\n gap: number\n metaLabelPaddingLeft: number\n fontWeight: TextStyle['fontWeight']\n }\n>\n\ntype ProductLogoName = 'Groups' | 'Services' | 'groups' | 'services'\ntype ProductLogoComponent = ({ logoSize }: { logoSize: number }) => JSX.Element\n\nconst PRODUCT_LOGO_COMPONENT_MAP: Record<ProductLogoName, ProductLogoComponent> = {\n Groups: GroupsLogo,\n groups: GroupsLogo,\n services: ServicesIcon,\n Services: ServicesIcon,\n}\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport interface BadgeProps {\n /**\n * Renders the main text.\n */\n label: string\n /**\n * Renders secondary meta text to the right of the label.\n */\n metaLabel?: string\n /**\n * Changes the status color for the badge and icon.\n */\n appearance?: StatusAppearanceUnion\n /**\n * Changes form of the logo to support a meta label and badge\n */\n variant?: VariantUnion\n /**\n * Adds a product logo to the left of the text.\n */\n productLogoName?: ProductLogoName\n /**\n * Shows an icon of the user choice to the left of the text.\n */\n iconName?: IconString\n /**\n * Shows an icon of the user choice to the right of the text.\n */\n iconNameRight?: IconString\n /**\n * Styles badge wrapper.\n */\n style?: ViewStyle\n /**\n * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n */\n maxFontSizeMultiplier?: number\n /**\n * Callback function when the badge is pressed.\n */\n onPress?: () => void\n}\n\nexport function Badge({\n appearance = 'neutral',\n metaLabel,\n style,\n iconName,\n iconNameRight,\n label,\n productLogoName,\n variant = 'default',\n maxFontSizeMultiplier,\n onPress,\n}: BadgeProps) {\n const styles = useStyles({ appearance, maxFontSizeMultiplier, variant })\n const { showBadgeProductLogo } = useTheme()\n\n const isMetaSubtle = variant === 'metaSubtle'\n const hasMetaLabel = Boolean(metaLabel)\n\n const showLogo = showBadgeProductLogo && productLogoName\n const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName]\n const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label\n\n return (\n <BadgeWrapper style={[styles.badgeWrapper, style]} onPress={onPress} accessibilityRole=\"button\">\n <View style={styles.badge}>\n {showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}\n {iconName && <Icon name={iconName} style={styles.icon} />}\n <Text\n variant=\"footnote\"\n style={styles.label}\n numberOfLines={1}\n maxFontSizeMultiplier={maxFontSizeMultiplier}\n >\n {badgeLabel}\n </Text>\n {iconNameRight && <Icon name={iconNameRight} style={styles.iconRight} />}\n </View>\n {hasMetaLabel && (\n <Text\n variant=\"footnote\"\n style={styles.metaLabel}\n numberOfLines={1}\n maxFontSizeMultiplier={maxFontSizeMultiplier}\n >\n {metaLabel}\n </Text>\n )}\n </BadgeWrapper>\n )\n}\n\nconst BadgeWrapper = ({\n children,\n onPress,\n accessibilityRole,\n ...restProps\n}: ViewProps & Pick<BadgeProps, 'onPress'>) => {\n if (onPress) {\n return (\n <Pressable accessibilityRole={accessibilityRole} onPress={onPress} {...restProps}>\n {children}\n </Pressable>\n )\n }\n\n return <View {...restProps}>{children}</View>\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n appearance = 'neutral',\n maxFontSizeMultiplier,\n variant = 'default',\n}: Partial<BadgeProps>) => {\n const { colors } = useTheme()\n const fontScale = useFontScale({ maxFontSizeMultiplier })\n\n const statusColorMap = useStatusColorAppearanceMap()\n\n const badgePaddingHorizontal = space(1) * fontScale\n const badgePaddingVertical = space(0.5) * fontScale\n const badgeGap = space(0.5) * fontScale\n const badgeFontSize = 12\n\n const variantStylesMap: VariantStyles = {\n default: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd,\n textColor: statusColorMap[appearance].text,\n fontWeight: 'normal',\n },\n meta: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd,\n textColor: statusColorMap[appearance].text,\n fontWeight: platformFontWeightMedium,\n },\n metaSubtle: {\n gap: badgeGap,\n backgroundColor: 'transparent',\n metaLabelPaddingLeft: badgeGap,\n paddingHorizontal: 0,\n paddingVertical: 0,\n borderWidth: 0,\n borderRadius: 0,\n textColor: colors.textColorDefaultSecondary,\n fontWeight: platformFontWeightMedium,\n },\n }\n\n return StyleSheet.create({\n badgeWrapper: {\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n alignSelf: 'flex-start',\n borderRadius: variantStylesMap[variant].borderRadius,\n borderWidth: variantStylesMap[variant].borderWidth,\n borderColor: statusColorMap[appearance].background,\n },\n badge: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: variantStylesMap[variant].gap,\n paddingVertical: variantStylesMap[variant].paddingVertical,\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n backgroundColor: variantStylesMap[variant].backgroundColor,\n borderRadius: variantStylesMap[variant].borderRadius - 2,\n },\n icon: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize,\n },\n iconRight: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize - 2,\n },\n logo: {\n fontSize: badgeFontSize * fontScale,\n },\n label: {\n color: variantStylesMap[variant].textColor,\n fontWeight: variantStylesMap[variant].fontWeight,\n fontSize: badgeFontSize,\n flexShrink: 1,\n },\n metaLabel: {\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n fontSize: badgeFontSize,\n flexShrink: 1,\n paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,\n },\n })\n}\n\n// =================================\n// ====== Product Logos ============\n// =================================\n\ninterface ProductLogoProps {\n logoSize: number\n}\n\nfunction GroupsLogo({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n d=\"M9.06 6.14H6.94c-.152.36-.438.646-.797.798v2.12c.359.152.645.438.797.797h2.117c.152-.359.437-.645.796-.797V6.94a1.502 1.502 0 01-.793-.8zM8 0C1.6 0 0 1.595 0 8s1.6 8 8 8 8-1.595 8-8-1.595-8-8-8zm3.939 10.44a1.5 1.5 0 01-2.882.585H6.94a1.5 1.5 0 11-1.963-1.963v-2.12A1.501 1.501 0 116.94 4.98h2.12a1.5 1.5 0 111.963 1.968v2.11a1.501 1.501 0 01.916 1.383z\"\n fill=\"url(#paint0_linear_2632_26363)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_26363\"\n x1={-5.6338}\n y1={5.6338}\n x2={5.6338}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#FF962D\" />\n <Stop offset={1} stopColor=\"#FC7638\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n\nfunction ServicesIcon({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M.116 8c0-6.4 1.6-8 8-8s8 1.6 8 8-1.6 8-8 8-8-1.6-8-8zm4.123 3.464a.848.848 0 10.943-1.41.848.848 0 00-.943 1.41zm.001-2.76a.848.848 0 10.948-1.408.848.848 0 00-.948 1.407zm0-2.759a.849.849 0 10.948-1.408.849.849 0 00-.948 1.408zm8.1 5.34a.388.388 0 00.03-.149v-.755a.39.39 0 00-.39-.39H6.87a.39.39 0 00-.39.39v.755a.39.39 0 00.39.39h5.11a.39.39 0 00.36-.24zm0-2.758a.388.388 0 00.03-.149v-.757a.387.387 0 00-.39-.388H6.87a.388.388 0 00-.39.388v.757a.388.388 0 00.39.388h5.11a.388.388 0 00.36-.24zm0-2.76a.388.388 0 00.03-.148v-.754a.39.39 0 00-.39-.389H6.87a.39.39 0 00-.39.387v.756a.39.39 0 00.39.39h5.11a.389.389 0 00.36-.241z\"\n fill=\"url(#paint0_linear_2632_56586)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_56586\"\n x1={-5.51759}\n y1={5.6338}\n x2={5.75001}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#6BB23D\" />\n <Stop offset={1} stopColor=\"#659630\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n"]}
|
|
@@ -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.3",
|
|
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": "996a6fcea96e8f3613e67caf5df57120f66184d5"
|
|
59
59
|
}
|
|
@@ -120,13 +120,23 @@ export function Badge({
|
|
|
120
120
|
<View style={styles.badge}>
|
|
121
121
|
{showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}
|
|
122
122
|
{iconName && <Icon name={iconName} style={styles.icon} />}
|
|
123
|
-
<Text
|
|
123
|
+
<Text
|
|
124
|
+
variant="footnote"
|
|
125
|
+
style={styles.label}
|
|
126
|
+
numberOfLines={1}
|
|
127
|
+
maxFontSizeMultiplier={maxFontSizeMultiplier}
|
|
128
|
+
>
|
|
124
129
|
{badgeLabel}
|
|
125
130
|
</Text>
|
|
126
131
|
{iconNameRight && <Icon name={iconNameRight} style={styles.iconRight} />}
|
|
127
132
|
</View>
|
|
128
133
|
{hasMetaLabel && (
|
|
129
|
-
<Text
|
|
134
|
+
<Text
|
|
135
|
+
variant="footnote"
|
|
136
|
+
style={styles.metaLabel}
|
|
137
|
+
numberOfLines={1}
|
|
138
|
+
maxFontSizeMultiplier={maxFontSizeMultiplier}
|
|
139
|
+
>
|
|
130
140
|
{metaLabel}
|
|
131
141
|
</Text>
|
|
132
142
|
)}
|
|
@@ -240,7 +250,6 @@ const useStyles = ({
|
|
|
240
250
|
color: variantStylesMap[variant].textColor,
|
|
241
251
|
fontWeight: variantStylesMap[variant].fontWeight,
|
|
242
252
|
fontSize: badgeFontSize,
|
|
243
|
-
lineHeight: 15 * fontScale,
|
|
244
253
|
flexShrink: 1,
|
|
245
254
|
},
|
|
246
255
|
metaLabel: {
|
|
@@ -248,7 +257,6 @@ const useStyles = ({
|
|
|
248
257
|
fontSize: badgeFontSize,
|
|
249
258
|
flexShrink: 1,
|
|
250
259
|
paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,
|
|
251
|
-
lineHeight: 15 * fontScale,
|
|
252
260
|
},
|
|
253
261
|
})
|
|
254
262
|
}
|
|
@@ -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
|
-
}
|