-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Poc/split navs #101
base: main
Are you sure you want to change the base?
Poc/split navs #101
Conversation
d5a8d96
to
0283fa5
Compare
030b630
to
a1d9a3a
Compare
Poc/split go up
split navigators performance
Migrate FloatingActionButton to useOnyx and add small cleanups
…eze-sidebar Poc/split navs freeze sidebar
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I left some comments! Monumental work here!
@@ -208,3 +208,274 @@ The action for the first step created with `getMinimalAction` looks like this: | |||
|
|||
### Deeplinking | |||
There is no minimal action for deeplinking directly to the `Profile` screen. But because the `Settings_root` is not on the stack, pressing UP will reset the params for navigators to the correct ones. | |||
|
|||
### Tests |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why are the tests put here?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We'll move it to the separate package
@@ -43,7 +43,7 @@ index 7558eb3..b7bb75e 100644 | |||
}) : STATE_TRANSITIONING_OR_BELOW_TOP; | |||
} | |||
+ | |||
+ const isHomeScreenAndNotOnTop = (route.name === 'BottomTabNavigator' || route.name === 'Workspace_Initial') && isScreenActive !== STATE_ON_TOP; | |||
+ const isHomeScreenAndNotOnTop = (route.name === 'BottomTabNavigator' || route.name === 'Workspace_Initial' || route.name === 'Home' || route.name === 'Search_Bottom_Tab' || route.name === 'Settings_Root' || route.name === 'ReportsSplitNavigator' || route.name === 'Search_Central_Pane') && isScreenActive !== STATE_ON_TOP; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe we should change variable name or find some more generic way to handle it?
ACTION_TYPE: { | ||
REPLACE: 'REPLACE', | ||
PUSH: 'PUSH', | ||
NAVIGATE: 'NAVIGATE', | ||
|
||
/** These action types are custom for RootNavigator */ | ||
SWITCH_POLICY_ID: 'SWITCH_POLICY_ID', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Are those actions described somewhere?
const [isSidebarLoaded] = useOnyx(ONYXKEYS.IS_SIDEBAR_LOADED, {initialValue: false}); | ||
const isActiveRouteHome = useIsCurrentRouteHome(); | ||
const isActiveRouteHome = useNavigationState((state) => state?.routes.some((route) => route.name === SCREENS.HOME)); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe this logic can be abstracted to some navigation utils file?
const rootState = navigationRef.getRootState() as State<RootStackParamList>; | ||
const lastSearchRoute = rootState.routes.filter((route) => route.name === SCREENS.SEARCH.CENTRAL_PANE).at(-1); | ||
const rootState = navigationRef.getRootState() as State<RootNavigatorParamList>; | ||
const lastSearchRoute = rootState.routes.filter((route) => route.name === SCREENS.SEARCH.ROOT).at(-1); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could you maybe use findLast
here?
@@ -38,6 +38,7 @@ jest.mock('@react-navigation/native', () => { | |||
const actualNav = jest.requireActual<typeof Navigation>('@react-navigation/native'); | |||
return { | |||
...actualNav, | |||
useNavigationState: () => true, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why does it return boolean?
|
||
function switchPolicyAfterInteractions(newPolicyID: string | undefined) { | ||
InteractionManager.runAfterInteractions(() => { | ||
Navigation.navigateWithSwitchPolicyID({policyID: newPolicyID}); | ||
navigationRef.dispatch({type: CONST.NAVIGATION.ACTION_TYPE.SWITCH_POLICY_ID, payload: {policyID: newPolicyID}}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Isn't it too detailed to be called in non-navigation file?
@@ -35,19 +43,37 @@ function BaseSidebarScreen() { | |||
return; | |||
} | |||
|
|||
Navigation.navigateWithSwitchPolicyID({policyID: undefined}); | |||
// Otherwise, if the workspace is already loaded, we don't need to do anything | |||
const topmostReport = navigationRef.getRootState()?.routes.findLast((route) => route.name === NAVIGATORS.REPORTS_SPLIT_NAVIGATOR); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same with detailed here.
<BaseSidebarScreen /> | ||
</FreezeWrapper> | ||
); | ||
return <BaseSidebarScreen />; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this component needed then?
} else { | ||
// Otherwise, navigate to the specific route defined in "backTo" with a country parameter | ||
Navigation.navigate(appendParam(backTo, 'country', option.value)); | ||
// Set compareParams to false because we want to goUp to this particular screen and update params (country). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we still use goUp
nomenclature?
Add LinkToOptions
Fix tooltips for bottom tab bar and sidebar list
Details
Fixed Issues
$
PROPOSAL:
Tests
Offline tests
QA Steps
PR Author Checklist
### Fixed Issues
section aboveTests
sectionOffline steps
sectionQA steps
sectiontoggleReport
and notonIconClick
)myBool && <MyComponent />
.src/languages/*
files and using the translation methodSTYLE.md
) were followedAvatar
, I verified the components usingAvatar
are working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG)
)Avatar
is modified, I verified thatAvatar
is working as expected in all cases)Design
label and/or tagged@Expensify/design
so the design team can review the changes.ScrollView
component to make it scrollable when more elements are added to the page.main
branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTest
steps.Screenshots/Videos
Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari
MacOS: Desktop