Page MenuHomePhabricator

D5559.id18217.diff
No OneTemporary

D5559.id18217.diff

diff --git a/native/account/logged-out-modal.react.js b/native/account/logged-out-modal.react.js
--- a/native/account/logged-out-modal.react.js
+++ b/native/account/logged-out-modal.react.js
@@ -58,6 +58,7 @@
import { splashBackgroundURI } from './background-info';
import LogInPanel from './log-in-panel.react';
import type { LogInState } from './log-in-panel.react';
+import LoggedOutStaffInfo from './logged-out-staff-info.react';
import RegisterPanel from './register-panel.react';
import type { RegisterState } from './register-panel.react';
import SIWEPanel from './siwe-panel.react';
@@ -468,13 +469,9 @@
</TouchableOpacity>
);
}
- let staffUserHasBeenLoggedInIndicator = null;
- if (this.props.staffCanSee && this.props.staffUserHasBeenLoggedIn) {
- staffUserHasBeenLoggedInIndicator = (
- <TouchableOpacity style={styles.button} activeOpacity={0.6}>
- <Text style={styles.buttonText}>STAFF HAS BEEN LOGGED IN</Text>
- </TouchableOpacity>
- );
+ let loggedOutStaffInfoCard = null;
+ if (this.props.staffCanSee || this.props.staffUserHasBeenLoggedIn) {
+ loggedOutStaffInfoCard = <LoggedOutStaffInfo />;
}
if (this.state.mode === 'siwe') {
@@ -504,7 +501,7 @@
const opacityStyle = { opacity: this.buttonOpacity };
buttons = (
<Animated.View style={[styles.buttonContainer, opacityStyle]}>
- {staffUserHasBeenLoggedInIndicator}
+ {loggedOutStaffInfoCard}
{siweButton}
<TouchableOpacity
onPress={this.onPressLogIn}
diff --git a/native/account/logged-out-staff-info.react.js b/native/account/logged-out-staff-info.react.js
new file mode 100644
--- /dev/null
+++ b/native/account/logged-out-staff-info.react.js
@@ -0,0 +1,116 @@
+// @flow
+
+import * as React from 'react';
+import { useContext } from 'react';
+import { Text, View } from 'react-native';
+
+import SWMansionIcon from '../components/swmansion-icon.react';
+import { StaffContext } from '../staff/staff-context';
+import { useStyles, useColors } from '../themes/colors';
+import { isStaffRelease } from '../utils/staff-utils';
+
+function LoggedOutStaffInfo(): React.Node {
+ const { staffUserHasBeenLoggedIn } = useContext(StaffContext);
+ const styles = useStyles(unboundStyles);
+ const colors = useColors();
+
+ const checkIcon = React.useMemo(
+ () => (
+ <SWMansionIcon
+ name="check-circle"
+ size={20}
+ color={colors.vibrantGreenButton}
+ />
+ ),
+ [colors.vibrantGreenButton],
+ );
+ const crossIcon = React.useMemo(
+ () => (
+ <SWMansionIcon
+ name="cross-circle"
+ size={20}
+ color={colors.vibrantRedButton}
+ />
+ ),
+ [colors.vibrantRedButton],
+ );
+
+ const isDevBuildStyle = React.useMemo(() => {
+ return [
+ styles.infoText,
+ __DEV__ ? styles.infoTextTrue : styles.infoTextFalse,
+ ];
+ }, [styles.infoText, styles.infoTextFalse, styles.infoTextTrue]);
+
+ const isStaffReleaseStyle = React.useMemo(() => {
+ return [
+ styles.infoText,
+ isStaffRelease ? styles.infoTextTrue : styles.infoTextFalse,
+ ];
+ }, [styles.infoText, styles.infoTextFalse, styles.infoTextTrue]);
+
+ const hasStaffUserLoggedInStyle = React.useMemo(() => {
+ return [
+ styles.infoText,
+ staffUserHasBeenLoggedIn ? styles.infoTextTrue : styles.infoTextFalse,
+ ];
+ }, [
+ staffUserHasBeenLoggedIn,
+ styles.infoText,
+ styles.infoTextFalse,
+ styles.infoTextTrue,
+ ]);
+
+ return (
+ <View>
+ <View style={styles.infoBadge}>
+ <View style={styles.cell}>
+ {__DEV__ ? checkIcon : crossIcon}
+ <Text style={isDevBuildStyle}>__DEV__</Text>
+ </View>
+ <View style={styles.cell}>
+ {isStaffRelease ? checkIcon : crossIcon}
+ <Text style={isStaffReleaseStyle}>isStaffRelease</Text>
+ </View>
+ <View style={styles.cell}>
+ {staffUserHasBeenLoggedIn ? checkIcon : crossIcon}
+ <Text style={hasStaffUserLoggedInStyle}>
+ staffUserHasBeenLoggedIn
+ </Text>
+ </View>
+ </View>
+ </View>
+ );
+}
+
+const unboundStyles = {
+ cell: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ },
+ infoBadge: {
+ backgroundColor: 'codeBackground',
+ borderRadius: 6,
+ justifyContent: 'flex-start',
+ marginBottom: 10,
+ marginLeft: 40,
+ marginRight: 40,
+ marginTop: 10,
+ padding: 8,
+ },
+ infoText: {
+ fontFamily: 'OpenSans-Semibold',
+ fontSize: 14,
+ lineHeight: 24,
+ paddingLeft: 4,
+ textAlign: 'left',
+ },
+ infoTextFalse: {
+ color: 'vibrantRedButton',
+ },
+ infoTextTrue: {
+ color: 'vibrantGreenButton',
+ },
+};
+
+export default LoggedOutStaffInfo;

File Metadata

Mime Type
text/plain
Expires
Fri, Nov 29, 11:49 AM (21 h, 19 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2596883
Default Alt Text
D5559.id18217.diff (4 KB)

Event Timeline