Merge pull request #8909 from Expensify/chirga-revert-3dots-change-st…

…yles Revert 3 dots and change flex styles
Expensify · May 10, 2022 · 1a772e1 · 1a772e1
2 parents 04afe44 + ff2636e
commit 1a772e1
Showing 1 changed file with 67 additions and 55 deletions.
diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js
@@ -120,75 +120,87 @@ class WorkspaceInitialPage extends React.Component {
                     shouldShowBackButton
                     onBackButtonPress={() => Navigation.navigate(ROUTES.SETTINGS)}
                     onCloseButtonPress={() => Navigation.dismissModal()}
+                    shouldShowThreeDotsButton
+                    shouldShowGetAssistanceButton
                     guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_INITIAL}
+                    threeDotsMenuItems={[
+                        {
+                            icon: Expensicons.Plus,
+                            text: this.props.translate('workspace.new.newWorkspace'),
+                            onSelected: () => PolicyActions.createAndNavigate(),
+                        }, {
+                            icon: Expensicons.Trashcan,
+                            text: this.props.translate('workspace.common.delete'),
+                            onSelected: () => this.setState({isDeleteModalOpen: true}),
+                        },
+                    ]}
+                    threeDotsAnchorPosition={styles.threeDotsPopoverOffset}
                 />
                 <ScrollView
                     contentContainerStyle={[
                         styles.flexGrow1,
                         styles.flexColumn,
-                        styles.justifyContentBetween,
+                        styles.w100,
                     ]}
                 >
-                    <View style={[styles.flex1]}>
-                        <View style={styles.pageWrapper}>
-                            <View style={[styles.settingsPageBody, styles.alignItemsCenter]}>
+                    <View style={styles.pageWrapper}>
+                        <View style={[styles.settingsPageBody, styles.alignItemsCenter]}>
+                            <Pressable
+                                style={[styles.pRelative, styles.avatarLarge]}
+                                onPress={this.openEditor}
+                            >
+                                {this.props.policy.avatarURL
+                                    ? (
+                                        <Avatar
+                                            containerStyles={styles.avatarLarge}
+                                            imageStyles={[styles.avatarLarge, styles.alignSelfCenter]}
+                                            source={this.props.policy.avatarURL}
+                                        />
+                                    )
+                                    : (
+                                        <Icon
+                                            src={Expensicons.Workspace}
+                                            height={80}
+                                            width={80}
+                                            fill={themedefault.iconSuccessFill}
+                                        />
+                                    )}
+                            </Pressable>
+                            {!_.isEmpty(this.props.policy.name) && (
                                 <Pressable
-                                    style={[styles.pRelative, styles.avatarLarge]}
+                                    style={[
+                                        styles.alignSelfCenter,
+                                        styles.mt4,
+                                        styles.mb6,
+                                        styles.w100,
+                                    ]}
                                     onPress={this.openEditor}
                                 >
-                                    {this.props.policy.avatarURL
-                                        ? (
-                                            <Avatar
-                                                containerStyles={styles.avatarLarge}
-                                                imageStyles={[styles.avatarLarge, styles.alignSelfCenter]}
-                                                source={this.props.policy.avatarURL}
-                                            />
-                                        )
-                                        : (
-                                            <Icon
-                                                src={Expensicons.Workspace}
-                                                height={80}
-                                                width={80}
-                                                fill={themedefault.iconSuccessFill}
-                                            />
-                                        )}
+                                    <Tooltip text={this.props.policy.name}>
+                                        <Text
+                                            numberOfLines={1}
+                                            style={[
+                                                styles.displayName,
+                                                styles.alignSelfCenter,
+                                            ]}
+                                        >
+                                            {this.props.policy.name}
+                                        </Text>
+                                    </Tooltip>
                                 </Pressable>
-                                {!_.isEmpty(this.props.policy.name) && (
-                                    <Pressable
-                                        style={[
-                                            styles.alignSelfCenter,
-                                            styles.mt4,
-                                            styles.mb6,
-                                            styles.w100,
-                                        ]}
-                                        onPress={this.openEditor}
-                                    >
-                                        <Tooltip text={this.props.policy.name}>
-                                            <Text
-                                                numberOfLines={1}
-                                                style={[
-                                                    styles.displayName,
-                                                    styles.alignSelfCenter,
-                                                ]}
-                                            >
-                                                {this.props.policy.name}
-                                            </Text>
-                                        </Tooltip>
-                                    </Pressable>
-                                )}
-                            </View>
+                            )}
                         </View>
-                        {_.map(menuItems, item => (
-                            <MenuItem
-                                key={item.translationKey}
-                                title={this.props.translate(item.translationKey)}
-                                icon={item.icon}
-                                iconRight={item.iconRight}
-                                onPress={() => item.action()}
-                                shouldShowRightIcon
-                            />
-                        ))}
                     </View>
+                    {_.map(menuItems, item => (
+                        <MenuItem
+                            key={item.translationKey}
+                            title={this.props.translate(item.translationKey)}
+                            icon={item.icon}
+                            iconRight={item.iconRight}
+                            onPress={() => item.action()}
+                            shouldShowRightIcon
+                        />
+                    ))}
                 </ScrollView>
                 <ConfirmModal
                     title={this.props.translate('workspace.common.delete')}