e-mission-phone
e-mission-phone copied to clipboard
e-mission
⏱️ Implement TimelineContext (refactoring of LabelTabContext)
As described in https://github.com/e-mission/e-mission-docs/issues/1055#issuecomment-2014120602
Hoist the state for the fetched composite trips (and all associated "timeline"-related state) higher in the component tree, such that both the Label tab and the Dashboard tab will be able to access the same data.
Notes from commits
extract main content of <App> into new component, <Main>
<Main>will sit within <App> and contain BottomNavigation, which has the 3 tabs LabelTab, MetricsTab, and ProfileSettings. This will allow the tabs to share some information, but be categorically separate from OnboardingStack.
refactor LabelTabContext into TimelineContext
Up to this point, the Label tab and Dashboard tab have been completely separate in terms of the data they use. The label tab read composite trips and the dashboard tab read metrics from the server. We plan to unify them to both use composite trips. This way, one query provides all the needed information to both tabs and there will no longer be a need to re-fetch when switching between these tabs. To do this, the tabs need to share common data in a context that is higher up in the component tree.
Thus, much of the state that was previously kept at the level of <LabelTab>, (in LabelTabContext) is being hoisted up to the level of <Main>, and will be kept in a context called TimelineContext, which can be shared between the tabs.
The contents of TimelineContext are essentially just copied over from LabelTabContext. Two values are renamed: "isLoading" -> "timelineIsLoading" and "refresh" -> "refreshTimeline".
The things that are still specific to the Label tab (i.e. filtering dropdown "To Label" vs "All trips") are kept in LabelTab. Since LabelTabContext now has only 3 state values, and LabelTab.tsx is not that complex anymore, I included LabelTabContext directly in LabelTab.tsx rather than its own file.
At the end of this refactoring, the majority of the complexity is now in TimelineContext. It is instantiated in <Main> and provided to the children of <Main> (the tabs).
