Merge pull request #7040 from thesahindia/thesahindia/ui-ux/workspace…

…-focus-fix workspace focus fix
Expensify · Jan 7, 2022 · 7af06bc · 7af06bc
2 parents 30118b7 + aa9f9c0
commit 7af06bc
Showing 1 changed file with 10 additions and 32 deletions.
diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js
@@ -1,8 +1,6 @@
 import _ from 'underscore';
 import React from 'react';
 import {View, ScrollView, Pressable} from 'react-native';
-import PropTypes from 'prop-types';
-import {withNavigationFocus} from '@react-navigation/compat';
 import Navigation from '../../libs/Navigation/Navigation';
 import ROUTES from '../../ROUTES';
 import styles from '../../styles/styles';
@@ -16,20 +14,15 @@ import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize
 import MenuItem from '../../components/MenuItem';
 import themedefault from '../../styles/themes/default';
 import HeaderWithCloseButton from '../../components/HeaderWithCloseButton';
-import withWindowDimensions, {windowDimensionsPropTypes} from '../../components/withWindowDimensions';
 import compose from '../../libs/compose';
 import Avatar from '../../components/Avatar';
 import FullScreenLoadingIndicator from '../../components/FullscreenLoadingIndicator';
 import withFullPolicy, {fullPolicyPropTypes, fullPolicyDefaultProps} from './withFullPolicy';
 import * as PolicyActions from '../../libs/actions/Policy';
 
 const propTypes = {
-    /** Whether the current screen is focused. */
-    isFocused: PropTypes.bool.isRequired,
-
     ...fullPolicyPropTypes,
     ...withLocalizePropTypes,
-    ...windowDimensionsPropTypes,
 };
 
 const defaultProps = fullPolicyDefaultProps;
@@ -81,49 +74,41 @@ class WorkspaceInitialPage extends React.Component {
                 translationKey: 'workspace.common.settings',
                 icon: Expensicons.Gear,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceSettingsRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceSettingsRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.card',
                 icon: Expensicons.ExpensifyCard,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceCardRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceCardRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.reimburse',
                 icon: Expensicons.Receipt,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceReimburseRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceReimburseRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.bills',
                 icon: Expensicons.Bill,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceBillsRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceBillsRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.invoices',
                 icon: Expensicons.Invoice,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceInvoicesRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceInvoicesRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.travel',
                 icon: Expensicons.Luggage,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceTravelRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceTravelRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.members',
                 icon: Expensicons.Users,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceMembersRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceMembersRoute(policy.id)),
             },
             {
                 translationKey: 'workspace.common.bankAccount',
                 icon: Expensicons.Bank,
                 action: () => Navigation.navigate(ROUTES.getWorkspaceBankAccountRoute(policy.id)),
-                isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceBankAccountRoute(policy.id)),
             },
         ];
 
@@ -204,21 +189,16 @@ class WorkspaceInitialPage extends React.Component {
                                 )}
                             </View>
                         </View>
-                        {_.map(menuItems, (item) => {
-                            const shouldFocus = this.props.isSmallScreenWidth ? !this.props.isFocused && item.isActive : item.isActive;
-                            return (
-                                <MenuItem
-                                    key={item.translationKey}
-                                    title={this.props.translate(item.translationKey)}
-                                    icon={item.icon}
-                                    iconRight={item.iconRight}
-                                    onPress={() => item.action()}
-                                    wrapperStyle={shouldFocus ? styles.activeComponentBG : undefined}
-                                    focused={shouldFocus}
-                                    shouldShowRightIcon
-                                />
-                            );
-                        })}
+                        {_.map(menuItems, item => (
+                            <MenuItem
+                                key={item.translationKey}
+                                title={this.props.translate(item.translationKey)}
+                                icon={item.icon}
+                                iconRight={item.iconRight}
+                                onPress={() => item.action()}
+                                shouldShowRightIcon
+                            />
+                        ))}
                     </View>
                 </ScrollView>
                 <ConfirmModal
@@ -241,7 +221,5 @@ WorkspaceInitialPage.displayName = 'WorkspaceInitialPage';
 
 export default compose(
     withLocalize,
-    withWindowDimensions,
-    withNavigationFocus,
     withFullPolicy,
 )(WorkspaceInitialPage);