Skip to content

Commit dee58ef

Browse files
committed
Merge branch 'develop' into feat.abac
2 parents bfa0e07 + d019d4b commit dee58ef

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

52 files changed

+2165
-166
lines changed

app/containers/Chip/Chip.stories.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@ export default {
1515
title: 'Chip'
1616
};
1717

18-
const ChipWrapped = ({ avatar, text, onPress, testID, style }: IChip) => (
18+
const ChipWrapped = ({ avatar, text, onPress, testID, style, fullWidth }: IChip) => (
1919
<View style={styles.container}>
20-
<Chip avatar={avatar} text={text} onPress={onPress} testID={testID} style={style} />
20+
<Chip avatar={avatar} text={text} onPress={onPress} testID={testID} style={style} fullWidth={fullWidth} />
2121
</View>
2222
);
2323

@@ -30,3 +30,5 @@ export const ChipWithoutAvatar = () => <ChipWrapped text={'Without Avatar'} onPr
3030
export const ChipWithoutIcon = () => <ChipWrapped avatar='rocket.cat' text='Without Icon' />;
3131

3232
export const ChipWithoutAvatarAndIcon = () => <ChipWrapped text='Without Avatar and Icon' />;
33+
34+
export const ChipFullWidth = () => <ChipWrapped text='Full Width Text With Long Text That Should Be Wrapped' fullWidth />;

app/containers/Chip/__snapshots__/Chip.test.tsx.snap

Lines changed: 143 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,108 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3+
exports[`Story Snapshots: ChipFullWidth should match snapshot 1`] = `
4+
<View
5+
style={
6+
{
7+
"alignItems": "flex-start",
8+
"flex": 1,
9+
"padding": 16,
10+
}
11+
}
12+
>
13+
<View
14+
accessibilityState={
15+
{
16+
"busy": undefined,
17+
"checked": undefined,
18+
"disabled": true,
19+
"expanded": undefined,
20+
"selected": undefined,
21+
}
22+
}
23+
accessibilityValue={
24+
{
25+
"max": undefined,
26+
"min": undefined,
27+
"now": undefined,
28+
"text": undefined,
29+
}
30+
}
31+
accessible={true}
32+
collapsable={false}
33+
focusable={true}
34+
onBlur={[Function]}
35+
onClick={[Function]}
36+
onFocus={[Function]}
37+
onResponderGrant={[Function]}
38+
onResponderMove={[Function]}
39+
onResponderRelease={[Function]}
40+
onResponderTerminate={[Function]}
41+
onResponderTerminationRequest={[Function]}
42+
onStartShouldSetResponder={[Function]}
43+
style={
44+
[
45+
{
46+
"borderRadius": 4,
47+
"justifyContent": "center",
48+
"marginRight": 8,
49+
"maxWidth": 192,
50+
"paddingHorizontal": 8,
51+
},
52+
{
53+
"backgroundColor": "#F2F3F5",
54+
"maxWidth": undefined,
55+
},
56+
undefined,
57+
]
58+
}
59+
>
60+
<View
61+
style={
62+
{
63+
"alignItems": "center",
64+
"flexDirection": "row",
65+
}
66+
}
67+
>
68+
<View
69+
style={
70+
[
71+
{
72+
"marginRight": 8,
73+
"maxWidth": 120,
74+
},
75+
{
76+
"maxWidth": undefined,
77+
},
78+
]
79+
}
80+
>
81+
<Text
82+
numberOfLines={1}
83+
style={
84+
[
85+
{
86+
"backgroundColor": "transparent",
87+
"fontFamily": "Inter",
88+
"fontSize": 16,
89+
"fontWeight": "500",
90+
"textAlign": "left",
91+
},
92+
{
93+
"color": "#2F343D",
94+
},
95+
]
96+
}
97+
>
98+
Full Width Text With Long Text That Should Be Wrapped
99+
</Text>
100+
</View>
101+
</View>
102+
</View>
103+
</View>
104+
`;
105+
3106
exports[`Story Snapshots: ChipText should match snapshot 1`] = `
4107
<View
5108
style={
@@ -51,6 +154,7 @@ exports[`Story Snapshots: ChipText should match snapshot 1`] = `
51154
},
52155
{
53156
"backgroundColor": "#F2F3F5",
157+
"maxWidth": 192,
54158
},
55159
undefined,
56160
]
@@ -121,10 +225,13 @@ exports[`Story Snapshots: ChipText should match snapshot 1`] = `
121225
</View>
122226
<View
123227
style={
124-
{
125-
"marginRight": 8,
126-
"maxWidth": 120,
127-
}
228+
[
229+
{
230+
"marginRight": 8,
231+
"maxWidth": 120,
232+
},
233+
undefined,
234+
]
128235
}
129236
>
130237
<Text
@@ -229,6 +336,7 @@ exports[`Story Snapshots: ChipWithShortText should match snapshot 1`] = `
229336
},
230337
{
231338
"backgroundColor": "#F2F3F5",
339+
"maxWidth": 192,
232340
},
233341
undefined,
234342
]
@@ -299,10 +407,13 @@ exports[`Story Snapshots: ChipWithShortText should match snapshot 1`] = `
299407
</View>
300408
<View
301409
style={
302-
{
303-
"marginRight": 8,
304-
"maxWidth": 120,
305-
}
410+
[
411+
{
412+
"marginRight": 8,
413+
"maxWidth": 120,
414+
},
415+
undefined,
416+
]
306417
}
307418
>
308419
<Text
@@ -407,6 +518,7 @@ exports[`Story Snapshots: ChipWithoutAvatar should match snapshot 1`] = `
407518
},
408519
{
409520
"backgroundColor": "#F2F3F5",
521+
"maxWidth": 192,
410522
},
411523
undefined,
412524
]
@@ -422,10 +534,13 @@ exports[`Story Snapshots: ChipWithoutAvatar should match snapshot 1`] = `
422534
>
423535
<View
424536
style={
425-
{
426-
"marginRight": 8,
427-
"maxWidth": 120,
428-
}
537+
[
538+
{
539+
"marginRight": 8,
540+
"maxWidth": 120,
541+
},
542+
undefined,
543+
]
429544
}
430545
>
431546
<Text
@@ -530,6 +645,7 @@ exports[`Story Snapshots: ChipWithoutAvatarAndIcon should match snapshot 1`] = `
530645
},
531646
{
532647
"backgroundColor": "#F2F3F5",
648+
"maxWidth": 192,
533649
},
534650
undefined,
535651
]
@@ -545,10 +661,13 @@ exports[`Story Snapshots: ChipWithoutAvatarAndIcon should match snapshot 1`] = `
545661
>
546662
<View
547663
style={
548-
{
549-
"marginRight": 8,
550-
"maxWidth": 120,
551-
}
664+
[
665+
{
666+
"marginRight": 8,
667+
"maxWidth": 120,
668+
},
669+
undefined,
670+
]
552671
}
553672
>
554673
<Text
@@ -627,6 +746,7 @@ exports[`Story Snapshots: ChipWithoutIcon should match snapshot 1`] = `
627746
},
628747
{
629748
"backgroundColor": "#F2F3F5",
749+
"maxWidth": 192,
630750
},
631751
undefined,
632752
]
@@ -697,10 +817,13 @@ exports[`Story Snapshots: ChipWithoutIcon should match snapshot 1`] = `
697817
</View>
698818
<View
699819
style={
700-
{
701-
"marginRight": 8,
702-
"maxWidth": 120,
703-
}
820+
[
821+
{
822+
"marginRight": 8,
823+
"maxWidth": 120,
824+
},
825+
undefined,
826+
]
704827
}
705828
>
706829
<Text

app/containers/Chip/index.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,10 @@ export interface IChip {
3838
onPress?: Function;
3939
testID?: string;
4040
style?: StyleProp<ViewStyle>;
41+
fullWidth?: boolean;
4142
}
4243

43-
const Chip = ({ avatar, text, onPress, testID, style }: IChip) => {
44+
const Chip = ({ avatar, text, onPress, testID, style, fullWidth }: IChip) => {
4445
const { colors } = useTheme();
4546

4647
return (
@@ -49,7 +50,8 @@ const Chip = ({ avatar, text, onPress, testID, style }: IChip) => {
4950
style={({ pressed }) => [
5051
styles.pressable,
5152
{
52-
backgroundColor: pressed ? colors.surfaceNeutral : colors.surfaceHover
53+
backgroundColor: pressed ? colors.surfaceNeutral : colors.surfaceHover,
54+
maxWidth: fullWidth ? undefined : styles.pressable.maxWidth
5355
},
5456
style
5557
]}
@@ -60,7 +62,7 @@ const Chip = ({ avatar, text, onPress, testID, style }: IChip) => {
6062
}}>
6163
<View style={styles.container}>
6264
{avatar ? <Avatar text={avatar} size={28} style={styles.avatar} /> : null}
63-
<View style={styles.textContainer}>
65+
<View style={[styles.textContainer, fullWidth && { maxWidth: undefined }]}>
6466
<Text style={[styles.name, { color: colors.fontDefault }]} numberOfLines={1}>
6567
{text}
6668
</Text>

app/containers/RoomItem/RoomItem.stories.tsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -191,3 +191,10 @@ export const OmnichannelIcon = () => (
191191
<RoomItem type='l' sourceType={{ type: 'other' }} />
192192
</>
193193
);
194+
195+
export const InvitedRoom = () => (
196+
<>
197+
<RoomItem isInvited />
198+
<RoomItem isInvited displayMode={DisplayMode.Condensed} />
199+
</>
200+
);

app/containers/RoomItem/RoomItem.tsx

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@ import { type IRoomItemProps } from './interfaces';
1616
import { formatLastMessage } from '../../lib/methods/formatLastMessage';
1717
import useStatusAccessibilityLabel from '../../lib/hooks/useStatusAccessibilityLabel';
1818
import { useResponsiveLayout } from '../../lib/hooks/useResponsiveLayout/useResponsiveLayout';
19+
import { CustomIcon } from '../CustomIcon';
20+
import { useTheme } from '../../theme';
1921

2022
const RoomItem = ({
2123
rid,
@@ -54,10 +56,12 @@ const RoomItem = ({
5456
sourceType,
5557
hideMentionStatus,
5658
accessibilityDate,
57-
abacAttributes
59+
abacAttributes,
60+
isInvited
5861
}: IRoomItemProps) => {
5962
'use memo';
6063

64+
const { colors } = useTheme();
6165
const { isLargeFontScale } = useResponsiveLayout();
6266
const memoizedMessage = useMemo(
6367
() => formatLastMessage({ lastMessage, username, useRealName, showLastMessage, alert, type }),
@@ -139,6 +143,15 @@ const RoomItem = ({
139143
hideMentionStatus={hideMentionStatus}
140144
hideUnreadStatus={hideUnreadStatus}
141145
/>
146+
{isInvited ? (
147+
<CustomIcon
148+
size={24}
149+
name='mail'
150+
role='status'
151+
accessibilityLabel={I18n.t('Invited')}
152+
color={colors.badgeBackgroundLevel2}
153+
/>
154+
) : null}
142155
</View>
143156
{isLargeFontScale ? <UpdatedAt date={date} hideUnreadStatus={hideUnreadStatus} alert={alert} /> : null}
144157
</>
@@ -159,6 +172,15 @@ const RoomItem = ({
159172
/>
160173
<Title name={name} hideUnreadStatus={hideUnreadStatus} alert={alert} />
161174
{autoJoin ? <Tag name={I18n.t('Auto-join')} /> : null}
175+
{isInvited ? (
176+
<CustomIcon
177+
size={24}
178+
name='mail'
179+
role='status'
180+
accessibilityLabel={I18n.t('Invited')}
181+
color={colors.badgeBackgroundLevel2}
182+
/>
183+
) : null}
162184

163185
<View style={styles.wrapUpdatedAndBadge}>
164186
{isLargeFontScale ? null : <UpdatedAt date={date} hideUnreadStatus={hideUnreadStatus} alert={alert} />}

0 commit comments

Comments
 (0)