Page MenuHomePhabricator
Differential D3344

[web] Render AppSwitcher or SettingsSwitcher depending on the navigation
ClosedPublic
Actions

Authored by tomek on Mar 4 2022, 9:26 AM.
Tags
None
Referenced Files
Unknown Object (File)
Wed, Apr 16, 10:32 PM
Unknown Object (File)
Sat, Apr 12, 3:10 AM
Unknown Object (File)
Tue, Apr 8, 6:05 PM
Unknown Object (File)
Tue, Apr 8, 5:58 PM
Unknown Object (File)
Tue, Apr 8, 7:13 AM
Unknown Object (File)
Tue, Apr 8, 6:15 AM
Unknown Object (File)
Tue, Apr 1, 6:53 AM
Unknown Object (File)
Sun, Mar 30, 9:38 PM
View All Files
Subscribers
• adrian
ashoat
• karol

Details

Reviewers
• benschac
atul
• jacek
Commits
rCOMMc99c887f1b8b: [web] Render AppSwitcher or SettingsSwitcher depending on the navigation
Summary

When we're in settings route, we need to display SettingsSwitcher. In all the other cases, we should do what we were doing up to this point: render the AppSwitcher.
Depends on D3343

Test Plan

Open chat and check if AppSwitcher is rendered. Change path to settings/account and check if SettingsSwitcher is displayed instead.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Revision Contents
Changeset List

PathSize
web/
sidebar/
11 lines

Diff 10297

View Options

web/sidebar/left-layout-aside.react.js

// @flow // @flow
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import * as React from 'react'; import * as React from 'react';
import { View, Text, TouchableOpacity } from 'react-native'; import { View, Text, TouchableOpacity } from 'react-native';
import type { AccountUserInfo } from 'lib/types/user-types'; import type { AccountUserInfo } from 'lib/types/user-types';
import sleep from 'lib/utils/sleep.js'; import sleep from 'lib/utils/sleep.js';
import SWMansionIcon from './swmansion-icon.react.js'; import SWMansionIcon from './swmansion-icon.react.js';
import UserAvatar from '../avatars/user-avatar.react.js'; import UserAvatar from '../avatars/user-avatar.react.js';
import { SingleLine } from '../components/single-line.react.js';
import { useStyles } from '../themes/colors.js'; import { useStyles } from '../themes/colors.js';
type Props = { type Props = {
+userInfo: AccountUserInfo, +userInfo: AccountUserInfo,
}; };
function UserProfile(props: Props): React.Node { function UserProfile(props: Props): React.Node {
const { userInfo } = props; const { userInfo } = props;
▲ Show 20 Lines • Show All 41 Lines • ▼ Show 20 Linesfunction UserProfile(props: Props): React.Node {
]); ]);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} /> <SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} />
<View style={styles.userInfoContainer}> <View style={styles.userInfoContainer}>
<UserAvatar size="profile" userID={userInfo.id} /> <UserAvatar size="profile" userID={userInfo.id} />
<View style={styles.usernameContainer}> <View style={styles.usernameContainer}>
<Text style={styles.usernameText}>{userInfo.username}</Text> <SingleLine style={styles.usernameText}>
{userInfo.username}
</SingleLine>
{copyUsernameButton} {copyUsernameButton}
</View> </View>
</View> </View>
</View> </View>
); );
} }
const unboundStyles = { const unboundStyles = {
container: { container: {
paddingHorizontal: 16, paddingHorizontal: 16,
}, },
moreIcon: { moreIcon: {
color: 'modalButtonLabel', color: 'modalButtonLabel',
alignSelf: 'flex-end', alignSelf: 'flex-end',
}, },
userInfoContainer: { userInfoContainer: {
flexDirection: 'row', flexDirection: 'row',
}, },
usernameContainer: { usernameContainer: {
flex: 1,
justifyContent: 'center', justifyContent: 'center',
alignItems: 'flex-start',
paddingLeft: 16, paddingLeft: 16,
}, },
usernameText: { usernameText: {
color: 'modalForegroundLabel', color: 'modalForegroundLabel',
fontSize: 18, fontSize: 18,
fontWeight: '500', fontWeight: '500',
}, },
copyUsernameContainer: { copyUsernameContainer: {
Show All 15 Lines