diff --git a/generators/react-native/generator.mjs b/generators/react-native/generator.mjs index 6b5898e8b..7c27138b5 100644 --- a/generators/react-native/generator.mjs +++ b/generators/react-native/generator.mjs @@ -163,6 +163,9 @@ export default class extends BaseApplicationGenerator { get [BaseApplicationGenerator.PREPARING]() { return this.asPreparingTaskGroup({ + dependencies({ application }) { + this.loadNodeDependenciesFromPackageJson(application.nodeDependencies, this.templatePath('../resources/expo/package.json')); + }, preparingPatchInFile() { this.patchInFile = patchInFile.bind(this); }, diff --git a/generators/react-native/resources/expo/package.json b/generators/react-native/resources/expo/package.json index d9f1925aa..1130aa818 100644 --- a/generators/react-native/resources/expo/package.json +++ b/generators/react-native/resources/expo/package.json @@ -7,35 +7,36 @@ "update-dependencies": "npm install && npx expo install --fix && rm -rf package-lock.json node_modules" }, "dependencies": { - "@expo/vector-icons": "^13.0.0", - "@react-native-async-storage/async-storage": "1.18.2", - "@react-native-community/datetimepicker": "7.2.0", - "@react-native-masked-view/masked-view": "0.2.9", - "@react-native-picker/picker": "2.4.10", + "@expo/metro-runtime": "~3.2.1", + "@expo/vector-icons": "^14.0.2", + "@react-native-async-storage/async-storage": "1.23.1", + "@react-native-community/datetimepicker": "8.0.1", + "@react-native-masked-view/masked-view": "0.3.1", + "@react-native-picker/picker": "2.7.5", "@react-navigation/devtools": "6.0.26", - "expo": "49.0.21", - "expo-auth-session": "~5.0.2", - "expo-constants": "~14.4.2", - "expo-image-picker": "~14.3.2", - "expo-linking": "~5.0.2", - "expo-random": "~13.2.0", - "expo-splash-screen": "~0.20.5", - "expo-status-bar": "~1.6.0", - "expo-web-browser": "~12.3.2", + "expo": "51.0.11", + "expo-auth-session": "~5.5.2", + "expo-constants": "~16.0.2", + "expo-image-picker": "~15.0.5", + "expo-linking": "~6.3.1", + "expo-random": "~14.0.1", + "expo-splash-screen": "~0.27.5", + "expo-status-bar": "~1.12.1", + "expo-web-browser": "~13.0.3", "react": "18.2.0", "react-dom": "18.2.0", - "react-native": "0.72.10", - "react-native-gesture-handler": "~2.12.0", - "react-native-reanimated": "~3.3.0", - "react-native-safe-area-context": "4.6.3", - "react-native-screens": "~3.22.0", + "react-native": "0.74.2", + "react-native-gesture-handler": "~2.16.2", + "react-native-reanimated": "~3.10.1", + "react-native-safe-area-context": "4.10.1", + "react-native-screens": "3.31.1", "react-native-web": "~0.19.12" }, "devDependencies": { "@babel/core": "^7.24.7", "@react-native-community/cli-server-api": "13.6.9", - "@types/react": "~18.2.65", - "jest-expo": "^49.0.0", - "typescript": "^5.4.5" + "@types/react": "~18.2.79", + "jest-expo": "~51.0.2", + "typescript": "~5.3.3" } } diff --git a/generators/react-native/templates/App.js.ejs b/generators/react-native/templates/App.js.ejs index c20d36276..1b65f090a 100644 --- a/generators/react-native/templates/App.js.ejs +++ b/generators/react-native/templates/App.js.ejs @@ -2,6 +2,7 @@ import * as React from 'react'; import { Provider } from 'react-redux'; import createStore from './app/shared/reducers'; import * as SplashScreen from 'expo-splash-screen'; +import 'setimmediate'; import NavContainer from './app/navigation/nav-container'; diff --git a/generators/react-native/templates/app/modules/entities/_entityFolder_/_entityFile_-screen.js.ejs b/generators/react-native/templates/app/modules/entities/_entityFolder_/_entityFile_-screen.js.ejs index 3d282be78..1fe6d8682 100644 --- a/generators/react-native/templates/app/modules/entities/_entityFolder_/_entityFile_-screen.js.ejs +++ b/generators/react-native/templates/app/modules/entities/_entityFolder_/_entityFile_-screen.js.ejs @@ -18,6 +18,9 @@ function <%= entityNameCapitalized %>Screen(props) { <%_ } _%> const { <%= entityInstance %>, <%= entityInstance %>List, getAll<%= entityNamePlural %>, fetching } = props; + const fetch<%= entityNamePlural %> = React.useCallback(() => { + getAll<%= entityNamePlural %>({ page: page - 1, sort, size }); + }, [getAll<%= entityNamePlural %>, page, sort, size]); useFocusEffect( React.useCallback(() => { @@ -69,10 +72,6 @@ function <%= entityNameCapitalized %>Screen(props) { props.performSearch(query) } <%_ } _%> - const fetch<%= entityNamePlural %> = React.useCallback(() => { - getAll<%= entityNamePlural %>({ page: page - 1, sort, size }); - }, [getAll<%= entityNamePlural %>, page, sort, size]); - const handleLoadMore = () => { <%_ if (pagination === 'no') { _%> diff --git a/generators/react-native/templates/app/modules/home/home-screen.js.ejs b/generators/react-native/templates/app/modules/home/home-screen.js.ejs index cabca4487..9ed6da15a 100644 --- a/generators/react-native/templates/app/modules/home/home-screen.js.ejs +++ b/generators/react-native/templates/app/modules/home/home-screen.js.ejs @@ -20,13 +20,13 @@ function HomeScreen(props) { {account && account.login ? ( - You are signed in as {account.login} + You are signed in as {account.login} ) : ( - You are not signed in. + You are not signed in. )} diff --git a/generators/react-native/templates/app/navigation/modal-screen.js.ejs b/generators/react-native/templates/app/navigation/modal-screen.js.ejs index 4f647ce9f..388d367c0 100644 --- a/generators/react-native/templates/app/navigation/modal-screen.js.ejs +++ b/generators/react-native/templates/app/navigation/modal-screen.js.ejs @@ -18,9 +18,9 @@ export function ModalScreen({ route, navigation, isError = false }) { {isError ? ( - + ) : ( - + )}{' '} {route.params.title || ''} diff --git a/generators/react-native/templates/app/navigation/nav-container.js.ejs b/generators/react-native/templates/app/navigation/nav-container.js.ejs index 241873157..af73c1a0e 100644 --- a/generators/react-native/templates/app/navigation/nav-container.js.ejs +++ b/generators/react-native/templates/app/navigation/nav-container.js.ejs @@ -108,7 +108,7 @@ export const getDrawerRoutes = () => { }; const linking = { - prefixes: ['rnapp://', Linking.makeUrl('/')], + prefixes: ['rnapp://', Linking.createURL('/')], config: { initialRouteName: 'Home', screens: { @@ -169,8 +169,8 @@ function NavContainer(props) { getAccount(); } }; - AppState.addEventListener('change', handleChange); - return () => AppState.removeEventListener('change', handleChange); + const sub = AppState.addEventListener('change', handleChange); + return () => sub.remove(); }, [getAccount]); useReduxDevToolsExtension(navigationRef); diff --git a/generators/react-native/templates/app/shared/components/search-bar/search-bar.js.ejs b/generators/react-native/templates/app/shared/components/search-bar/search-bar.js.ejs index 2afd8420f..255315b3d 100644 --- a/generators/react-native/templates/app/shared/components/search-bar/search-bar.js.ejs +++ b/generators/react-native/templates/app/shared/components/search-bar/search-bar.js.ejs @@ -15,7 +15,7 @@ export default function SearchBar(props) { const dimensions = useWindowDimensions(); return ( - + "postinstall": "patch-package", - "prettier": "prettier --write \"{,.,**/,.jhipster/**/}*.{md,json,yml,js,ts,tsx}\"", "start": "expo start", "web": "expo start --web" }, "dependencies": { "@expo/vector-icons": "EXPO_REPLACE_WITH_VERSION", + "@expo/metro-runtime": "EXPO_REPLACE_WITH_VERSION", "@react-native-async-storage/async-storage": "EXPO_REPLACE_WITH_VERSION", "@react-native-community/datetimepicker": "EXPO_REPLACE_WITH_VERSION", "@react-native-masked-view/masked-view": "EXPO_REPLACE_WITH_VERSION", diff --git a/lib/patch-navigation.js b/lib/patch-navigation.js index 4371782c9..c1475b2cd 100644 --- a/lib/patch-navigation.js +++ b/lib/patch-navigation.js @@ -20,7 +20,7 @@ function patchNavigationForEntity(entity) { }); // import entity screens to navigation - const navigationDeclaration = `{ name: '${entity.entityNameCapitalized}', route: '${entity.entityFileName}', component: ${entity.entityNameCapitalized}Screen, options: { title: '${entity.entityNamePlural}', headerLeft: () => navigate('Entities')} />, headerRight: () => navigate('${entity.entityNameCapitalized}Edit', { id: undefined })} backImage={(props) => } /> },},`; + const navigationDeclaration = `{ name: '${entity.entityNameCapitalized}', route: '${entity.entityFileName}', component: ${entity.entityNameCapitalized}Screen, options: { title: '${entity.entityNamePlural}', headerLeft: () => navigate('Entities')} />, headerRight: () => navigate('${entity.entityNameCapitalized}Edit', { id: undefined })} backImage={(props) => } /> },},`; this.patchInFile(entityStackPath, { before: 'jhipster-react-native-navigation-declaration-needle', insert: navigationDeclaration,