diff --git a/packages/rn-tester/js/RNTesterAppShared.js b/packages/rn-tester/js/RNTesterAppShared.js index 0909e27e9a1..1f4e01962ea 100644 --- a/packages/rn-tester/js/RNTesterAppShared.js +++ b/packages/rn-tester/js/RNTesterAppShared.js @@ -50,6 +50,7 @@ const RNTesterApp = (): React.Node => { const { activeModuleKey, + activeModuleTitle, activeModuleExampleKey, screen, bookmarks, @@ -100,10 +101,10 @@ const RNTesterApp = (): React.Node => { }, [activeModuleKey, handleBackPress]); const handleModuleCardPress = React.useCallback( - ({exampleType, key}) => { + ({exampleType, key, title}) => { dispatch({ type: RNTesterActionsType.MODULE_CARD_PRESS, - data: {exampleType, key}, + data: {exampleType, key, title}, }); }, [dispatch], @@ -151,11 +152,14 @@ const RNTesterApp = (): React.Node => { activeModuleExampleKey != null ? activeModule?.examples.find(e => e.name === activeModuleExampleKey) : null; - const title = Screens.COMPONENTS - ? 'Components' - : Screens.APIS - ? 'APIs' - : 'Bookmarks'; + const title = + activeModuleTitle != null + ? activeModuleTitle + : screen === Screens.COMPONENTS + ? 'Components' + : screen === Screens.APIS + ? 'APIs' + : 'Bookmarks'; const activeExampleList = screen === Screens.COMPONENTS diff --git a/packages/rn-tester/js/components/RNTesterModuleList.js b/packages/rn-tester/js/components/RNTesterModuleList.js index fe370272612..05e1bf5e601 100644 --- a/packages/rn-tester/js/components/RNTesterModuleList.js +++ b/packages/rn-tester/js/components/RNTesterModuleList.js @@ -39,7 +39,10 @@ const ExampleModuleRow = ({ - toggleBookmark({exampleType: item.exampleType, key: item.key}) + toggleBookmark({ + exampleType: item.exampleType, + key: item.key, + }) }> } onPress={() => - handlePress({exampleType: item.exampleType, key: item.key}) + handlePress({ + exampleType: item.exampleType, + key: item.key, + title: item.module.title, + }) } /> ); diff --git a/packages/rn-tester/js/types/RNTesterTypes.js b/packages/rn-tester/js/types/RNTesterTypes.js index af46c2554e8..34c59dc5925 100644 --- a/packages/rn-tester/js/types/RNTesterTypes.js +++ b/packages/rn-tester/js/types/RNTesterTypes.js @@ -61,6 +61,7 @@ export type ComponentList = null | {components: string[], apis: string[]}; export type RNTesterState = { activeModuleKey: null | string, + activeModuleTitle: null | string, activeModuleExampleKey: null | string, screen: ScreenTypes, bookmarks: ComponentList, diff --git a/packages/rn-tester/js/utils/RNTesterReducer.js b/packages/rn-tester/js/utils/RNTesterReducer.js index b4edec79469..dc54ab77a80 100644 --- a/packages/rn-tester/js/utils/RNTesterReducer.js +++ b/packages/rn-tester/js/utils/RNTesterReducer.js @@ -78,6 +78,7 @@ export const RNTesterReducer = ( return { ...state, activeModuleKey: null, + activeModuleTitle: null, activeModuleExampleKey: null, screen: action.data.screen, }; @@ -85,6 +86,7 @@ export const RNTesterReducer = ( return { ...state, activeModuleKey: action.data.key, + activeModuleTitle: action.data.title, activeModuleExampleKey: null, recentlyUsed: getUpdatedRecentlyUsed({ exampleType: action.data.exampleType, @@ -113,6 +115,8 @@ export const RNTesterReducer = ( activeModuleExampleKey: null, activeModuleKey: state.activeModuleExampleKey != null ? state.activeModuleKey : null, + activeModuleTitle: + state.activeModuleExampleKey != null ? state.activeModuleTitle : null, }; default: throw new Error(`Invalid action type ${action.type}`); diff --git a/packages/rn-tester/js/utils/testerStateUtils.js b/packages/rn-tester/js/utils/testerStateUtils.js index fba305784bc..584bbffee73 100644 --- a/packages/rn-tester/js/utils/testerStateUtils.js +++ b/packages/rn-tester/js/utils/testerStateUtils.js @@ -26,6 +26,7 @@ export const Screens = { export const initialState: RNTesterState = { activeModuleKey: null, + activeModuleTitle: null, activeModuleExampleKey: null, screen: null, bookmarks: null, @@ -135,6 +136,7 @@ export const getInitialStateFromAsyncStorage = async ( if (!initialStateString) { return { activeModuleKey: null, + activeModuleTitle: null, activeModuleExampleKey: null, screen: Screens.COMPONENTS, bookmarks: {components: [], apis: []},