toki/mattermost-mobile
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add ellipsis to server displayName & url (#6223)

Browse source
This commit is contained in:
Elias Nahum 2022-05-04 12:15:13 -04:00 committed by GitHub
parent abc5dc4bc3
commit 32fd8e3cda
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 29 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/screens/home/channel_list/categories_list/__snapshots__/index.test.tsx.snap
View file

@ -149,6 +149,8 @@ exports[`components/categories_list should render channels error 1`] = `
</View>
</View>
<Text
ellipsizeMode="tail"
numberOfLines={1}
style={
Object {
"color": "rgba(255,255,255,0.64)",
@ -156,6 +158,7 @@ exports[`components/categories_list should render channels error 1`] = `
"fontSize": 11,
"fontWeight": "600",
"lineHeight": 16,
"paddingRight": 30,
}
}
testID="channel_list_header.server_display_name"
@ -346,6 +349,8 @@ exports[`components/categories_list should render team error 1`] = `
}
>
<Text
ellipsizeMode="tail"
numberOfLines={1}
style={
Object {
"color": "rgba(255,255,255,0.64)",

3
app/screens/home/channel_list/categories_list/header/__snapshots__/header.test.tsx.snap
View file

@ -129,6 +129,8 @@ exports[`components/channel_list/header Channel List Header Component should mat
</View>
</View>
<Text
ellipsizeMode="tail"
numberOfLines={1}
style={
Object {
"color": "rgba(255,255,255,0.64)",
@ -136,6 +138,7 @@ exports[`components/channel_list/header Channel List Header Component should mat
"fontSize": 11,
"fontWeight": "600",
"lineHeight": 16,
"paddingRight": 30,
}
}
testID="channel_list_header.server_display_name"

5
app/screens/home/channel_list/categories_list/header/header.tsx
View file

@ -37,6 +37,7 @@ const getStyles = makeStyleSheetFromTheme((theme: Theme) => ({
},
subHeadingStyles: {
color: changeOpacity(theme.sidebarText, 0.64),
paddingRight: 30,
...typography('Heading', 50),
},
headerRow: {
@ -168,6 +169,8 @@ const ChannelListHeader = ({canCreateChannels, canJoinChannels, displayName, ico
</TouchableWithFeedback>
</View>
<Text
numberOfLines={1}
ellipsizeMode='tail'
style={styles.subHeadingStyles}
testID='channel_list_header.server_display_name'
>
@ -180,6 +183,8 @@ const ChannelListHeader = ({canCreateChannels, canJoinChannels, displayName, ico
<View style={styles.noTeamHeaderRow}>
<View style={styles.noTeamHeaderRow}>
<Text
numberOfLines={1}
ellipsizeMode='tail'
style={styles.noTeamHeadingStyles}
testID='channel_list_header.team_display_name'
>

19
app/screens/home/channel_list/servers/servers_list/server_item/server_item.tsx
View file

@ -60,7 +60,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => ({
flex: 1,
height: 72,
justifyContent: 'center',
paddingHorizontal: 18,
paddingLeft: 18,
},
container: {
alignItems: 'center',
@ -72,6 +72,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => ({
},
details: {
marginLeft: 14,
flex: 1,
},
logout: {
backgroundColor: theme.centerChannelBg,
@ -354,8 +355,20 @@ const ServerItem = ({highlight, isActive, server, tutorialWatched}: Props) => {
/>
}
<View style={styles.details}>
<Text style={styles.name}>{displayName}</Text>
<Text style={styles.url}>{removeProtocol(stripTrailingSlashes(server.url))}</Text>
<Text
numberOfLines={1}
ellipsizeMode='tail'
style={styles.name}
>
{displayName}
</Text>
<Text
numberOfLines={1}
ellipsizeMode='tail'
style={styles.url}
>
{removeProtocol(stripTrailingSlashes(server.url))}
</Text>
</View>
</View>
{!server.lastActiveAt && !switching &&