Differential D5498 Diff 18012 native/profile/profile-screen.react.js

Changeset View

Standalone View

native/profile/profile-screen.react.js

// @flow		// @flow

import * as React from 'react';		import * as React from 'react';
import { View, Text, Alert, Platform, ScrollView } from 'react-native';		import { View, Text, Alert, Platform, ScrollView } from 'react-native';

import { logOutActionTypes, logOut } from 'lib/actions/user-actions';		import { logOutActionTypes, logOut } from 'lib/actions/user-actions';
import { preRequestUserStateSelector } from 'lib/selectors/account-selectors';		import { preRequestUserStateSelector } from 'lib/selectors/account-selectors';
import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors';		import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors';
import { isStaff } from 'lib/shared/user-utils';
import type { LogOutResult } from 'lib/types/account-types';		import type { LogOutResult } from 'lib/types/account-types';
import { type PreRequestUserState } from 'lib/types/session-types';		import { type PreRequestUserState } from 'lib/types/session-types';
import { type CurrentUserInfo } from 'lib/types/user-types';		import { type CurrentUserInfo } from 'lib/types/user-types';
import {		import {
type DispatchActionPromise,		type DispatchActionPromise,
useDispatchActionPromise,		useDispatchActionPromise,
useServerCall,		useServerCall,
} from 'lib/utils/action-utils';		} from 'lib/utils/action-utils';
Show All 12 Lines	import {
AppearancePreferencesRouteName,		AppearancePreferencesRouteName,
FriendListRouteName,		FriendListRouteName,
BlockListRouteName,		BlockListRouteName,
PrivacyPreferencesRouteName,		PrivacyPreferencesRouteName,
DefaultNotificationsPreferencesRouteName,		DefaultNotificationsPreferencesRouteName,
} from '../navigation/route-names';		} from '../navigation/route-names';
import { useSelector } from '../redux/redux-utils';		import { useSelector } from '../redux/redux-utils';
import { type Colors, useColors, useStyles } from '../themes/colors';		import { type Colors, useColors, useStyles } from '../themes/colors';
		import { useStaffCanSee } from '../utils/staff-utils';
import type { ProfileNavigationProp } from './profile.react';		import type { ProfileNavigationProp } from './profile.react';

type BaseProps = {
+navigation: ProfileNavigationProp<'ProfileScreen'>,
+route: NavigationRoute<'ProfileScreen'>,
};
type Props = {
...BaseProps,
+currentUserInfo: ?CurrentUserInfo,
+preRequestUserState: PreRequestUserState,
+logOutLoading: boolean,
+colors: Colors,
+styles: typeof unboundStyles,
+dispatchActionPromise: DispatchActionPromise,
+logOut: (preRequestUserState: PreRequestUserState) => Promise<LogOutResult>,
};

type ProfileRowProps = {		type ProfileRowProps = {
+content: string,		+content: string,
+onPress: () => void,		+onPress: () => void,
+danger?: boolean,		+danger?: boolean,
};		};

function ProfileRow(props: ProfileRowProps): React.Node {		function ProfileRow(props: ProfileRowProps): React.Node {
const { content, onPress, danger } = props;		const { content, onPress, danger } = props;
return (		return (
<Action.Row onPress={onPress}>		<Action.Row onPress={onPress}>
<Action.Text danger={danger} content={content} />		<Action.Text danger={danger} content={content} />
<Action.Icon name="ios-arrow-forward" />		<Action.Icon name="ios-arrow-forward" />
</Action.Row>		</Action.Row>
);		);
}		}

		type BaseProps = {
		+navigation: ProfileNavigationProp<'ProfileScreen'>,
		+route: NavigationRoute<'ProfileScreen'>,
		};
		type Props = {
		...BaseProps,
		+currentUserInfo: ?CurrentUserInfo,
		+preRequestUserState: PreRequestUserState,
		+logOutLoading: boolean,
		+colors: Colors,
		+styles: typeof unboundStyles,
		+dispatchActionPromise: DispatchActionPromise,
		+logOut: (preRequestUserState: PreRequestUserState) => Promise<LogOutResult>,
		+staffCanSee: boolean,
		};

class ProfileScreen extends React.PureComponent<Props> {		class ProfileScreen extends React.PureComponent<Props> {
get username() {		get username() {
return this.props.currentUserInfo && !this.props.currentUserInfo.anonymous		return this.props.currentUserInfo && !this.props.currentUserInfo.anonymous
? this.props.currentUserInfo.username		? this.props.currentUserInfo.username
: undefined;		: undefined;
}		}

get loggedOutOrLoggingOut() {		get loggedOutOrLoggingOut() {
return (		return (
!this.props.currentUserInfo \|\|		!this.props.currentUserInfo \|\|
this.props.currentUserInfo.anonymous \|\|		this.props.currentUserInfo.anonymous \|\|
this.props.logOutLoading		this.props.logOutLoading
);		);
}		}

render() {		render() {
let appearancePreferences, developerTools, defaultNotifications;		let appearancePreferences, developerTools, defaultNotifications;
if (		const { staffCanSee } = this.props;
(this.props.currentUserInfo && isStaff(this.props.currentUserInfo.id)) \|\|		if (staffCanSee) {
__DEV__
) {
appearancePreferences = (		appearancePreferences = (
<ProfileRow content="Appearance" onPress={this.onPressAppearance} />		<ProfileRow content="Appearance" onPress={this.onPressAppearance} />
);		);
developerTools = (		developerTools = (
<ProfileRow content="Developer tools" onPress={this.onPressDevTools} />		<ProfileRow content="Developer tools" onPress={this.onPressDevTools} />
);		);

defaultNotifications = (		defaultNotifications = (
▲ Show 20 Lines • Show All 250 Lines • ▼ Show 20 Lines	function ConnectedProfileScreen(props: BaseProps) {
const currentUserInfo = useSelector(state => state.currentUserInfo);		const currentUserInfo = useSelector(state => state.currentUserInfo);
const preRequestUserState = useSelector(preRequestUserStateSelector);		const preRequestUserState = useSelector(preRequestUserStateSelector);
const logOutLoading =		const logOutLoading =
useSelector(logOutLoadingStatusSelector) === 'loading';		useSelector(logOutLoadingStatusSelector) === 'loading';
const colors = useColors();		const colors = useColors();
const styles = useStyles(unboundStyles);		const styles = useStyles(unboundStyles);
const callLogOut = useServerCall(logOut);		const callLogOut = useServerCall(logOut);
const dispatchActionPromise = useDispatchActionPromise();		const dispatchActionPromise = useDispatchActionPromise();
		const staffCanSee = useStaffCanSee();

return (		return (
<ProfileScreen		<ProfileScreen
{...props}		{...props}
currentUserInfo={currentUserInfo}		currentUserInfo={currentUserInfo}
preRequestUserState={preRequestUserState}		preRequestUserState={preRequestUserState}
logOutLoading={logOutLoading}		logOutLoading={logOutLoading}
colors={colors}		colors={colors}
styles={styles}		styles={styles}
logOut={callLogOut}		logOut={callLogOut}
dispatchActionPromise={dispatchActionPromise}		dispatchActionPromise={dispatchActionPromise}
		staffCanSee={staffCanSee}
/>		/>
);		);
},		},
);		);

export default ConnectedProfileScreen;		export default ConnectedProfileScreen;