From 858d33fb01272e8a13964a739c247743cbd855dc Mon Sep 17 00:00:00 2001 From: Dhaya <154633+dhayab@users.noreply.github.com> Date: Mon, 3 Jan 2022 16:55:12 +0100 Subject: [PATCH] fix(react-native): update template and related dependencies (#546) --- e2e/__snapshots__/templates.test.js.snap | 56 +++++++------------ .../React InstantSearch Native/App.js.hbs | 43 +++++--------- .../React InstantSearch Native/app.json | 2 +- .../React InstantSearch Native/package.json | 29 +++++----- .../src/InfiniteHits.js.hbs | 6 +- .../src/SearchBox.js.hbs | 1 + 6 files changed, 55 insertions(+), 82 deletions(-) diff --git a/e2e/__snapshots__/templates.test.js.snap b/e2e/__snapshots__/templates.test.js.snap index 0e0facdb4..65f632807 100644 --- a/e2e/__snapshots__/templates.test.js.snap +++ b/e2e/__snapshots__/templates.test.js.snap @@ -3451,7 +3451,7 @@ If you want to publish it as a public scoped package, run \`npm publish --access exports[`Templates InstantSearch.js widget File content: LICENSE.md 1`] = ` "The MIT License (MIT) -Copyright (c) 2021-present algolia. +Copyright (c) 2022-present algolia. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \\"Software\\"), to deal @@ -5904,7 +5904,7 @@ exports[`Templates React InstantSearch Native File content: .watchmanconfig 1`] exports[`Templates React InstantSearch Native File content: App.js 1`] = ` "import React from 'react'; import { StyleSheet, View, SafeAreaView, StatusBar } from 'react-native'; -import algoliasearch from 'algoliasearch/reactnative'; +import algoliasearch from 'algoliasearch'; import { InstantSearch } from 'react-instantsearch-native'; import SearchBox from './src/SearchBox'; import InfiniteHits from './src/InfiniteHits'; @@ -5925,34 +5925,19 @@ const styles = StyleSheet.create({ }, }); -class App extends React.Component { - root = { - Root: View, - props: { - style: { - flex: 1, - }, - }, - }; - - render() { - return ( - - - - - - - - - - ); - } -} +const App = () => { + return ( + + + + + + + + + + ); +}; export default App;" `; @@ -5984,7 +5969,7 @@ exports[`Templates React InstantSearch Native File content: app.json 1`] = ` \\"expo\\": { \\"name\\": \\"react-instantsearch-native-app\\", \\"slug\\": \\"react-instantsearch-native-app\\", - \\"sdkVersion\\": \\"32.0.0\\" + \\"sdkVersion\\": \\"44.0.0\\" } }" `; @@ -6076,12 +6061,12 @@ const styles = StyleSheet.create({ }, }); -const InfiniteHits = ({ hits, hasMore, refine }) => ( +const InfiniteHits = ({ hits, hasMore, refineNext }) => ( item.objectID} ItemSeparatorComponent={() => } - onEndReached={() => hasMore && refine()} + onEndReached={() => hasMore && refineNext()} renderItem={({ item }) => ( @@ -6098,7 +6083,7 @@ const InfiniteHits = ({ hits, hasMore, refine }) => ( InfiniteHits.propTypes = { hits: PropTypes.arrayOf(PropTypes.object).isRequired, hasMore: PropTypes.bool.isRequired, - refine: PropTypes.func.isRequired, + refineNext: PropTypes.func.isRequired, }; export default connectInfiniteHits(InfiniteHits);" @@ -6113,6 +6098,7 @@ import { connectSearchBox } from 'react-instantsearch-native'; const styles = StyleSheet.create({ container: { padding: 16, + backgroundColor: '#252b33', }, input: { height: 48, @@ -6258,7 +6244,7 @@ If you want to publish it as a public scoped package, run \`npm publish --access exports[`Templates React InstantSearch widget File content: LICENSE.md 1`] = ` "The MIT License (MIT) -Copyright (c) 2021-present algolia. +Copyright (c) 2022-present algolia. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \\"Software\\"), to deal diff --git a/src/templates/React InstantSearch Native/App.js.hbs b/src/templates/React InstantSearch Native/App.js.hbs index 01da44f9f..26ed778c8 100644 --- a/src/templates/React InstantSearch Native/App.js.hbs +++ b/src/templates/React InstantSearch Native/App.js.hbs @@ -1,6 +1,6 @@ import React from 'react'; import { StyleSheet, View, SafeAreaView, StatusBar } from 'react-native'; -import algoliasearch from 'algoliasearch/reactnative'; +import algoliasearch from 'algoliasearch'; import { InstantSearch } from 'react-instantsearch-native'; import SearchBox from './src/SearchBox'; import InfiniteHits from './src/InfiniteHits'; @@ -21,33 +21,18 @@ const styles = StyleSheet.create({ }, }); -class App extends React.Component { - root = { - Root: View, - props: { - style: { - flex: 1, - }, - }, - }; - - render() { - return ( - - - - - - - - - - ); - } -} +const App = () => { + return ( + + + + + + + + + + ); +}; export default App; diff --git a/src/templates/React InstantSearch Native/app.json b/src/templates/React InstantSearch Native/app.json index 8005f29d1..d6363dee9 100644 --- a/src/templates/React InstantSearch Native/app.json +++ b/src/templates/React InstantSearch Native/app.json @@ -2,6 +2,6 @@ "expo": { "name": "{{name}}", "slug": "{{name}}", - "sdkVersion": "32.0.0" + "sdkVersion": "44.0.0" } } diff --git a/src/templates/React InstantSearch Native/package.json b/src/templates/React InstantSearch Native/package.json index d93558074..65a2bdc9f 100644 --- a/src/templates/React InstantSearch Native/package.json +++ b/src/templates/React InstantSearch Native/package.json @@ -10,22 +10,23 @@ "eject": "expo eject" }, "dependencies": { - "algoliasearch": "3.32.1", - "expo": "32.0.6", - "prop-types": "15.7.2", - "react": "16.5.0", + "algoliasearch": "4.11.0", + "expo": "44.0.3", + "prop-types": "15.8.0", + "react": "17.0.2", "react-instantsearch-native": "{{libraryVersion}}", - "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz" + "react-native": "0.64.3" }, "devDependencies": { - "babel-preset-expo": "5.2.0", - "eslint": "5.7.0", - "eslint-config-algolia": "13.2.3", - "eslint-config-prettier": "3.6.0", - "eslint-plugin-import": "2.18.2", - "eslint-plugin-prettier": "3.1.0", - "eslint-plugin-react": "7.13.0", - "expo-cli": "2.21.2", - "prettier": "1.19.1" + "@babel/core": "7.16.5", + "babel-preset-expo": "9.0.2", + "eslint": "8.5.0", + "eslint-config-algolia": "20.0.0", + "eslint-config-prettier": "8.3.0", + "eslint-plugin-import": "2.25.3", + "eslint-plugin-prettier": "4.0.0", + "eslint-plugin-react": "7.28.0", + "expo-cli": "5.0.3", + "prettier": "2.5.1" } } diff --git a/src/templates/React InstantSearch Native/src/InfiniteHits.js.hbs b/src/templates/React InstantSearch Native/src/InfiniteHits.js.hbs index fdd7cf136..fc6eecb9a 100644 --- a/src/templates/React InstantSearch Native/src/InfiniteHits.js.hbs +++ b/src/templates/React InstantSearch Native/src/InfiniteHits.js.hbs @@ -20,12 +20,12 @@ const styles = StyleSheet.create({ }, }); -const InfiniteHits = ({ hits, hasMore, refine }) => ( +const InfiniteHits = ({ hits, hasMore, refineNext }) => ( item.objectID} ItemSeparatorComponent={() => } - onEndReached={() => hasMore && refine()} + onEndReached={() => hasMore && refineNext()} renderItem={({ item }) => ( {{#if attributesToDisplay}} @@ -50,7 +50,7 @@ const InfiniteHits = ({ hits, hasMore, refine }) => ( InfiniteHits.propTypes = { hits: PropTypes.arrayOf(PropTypes.object).isRequired, hasMore: PropTypes.bool.isRequired, - refine: PropTypes.func.isRequired, + refineNext: PropTypes.func.isRequired, }; export default connectInfiniteHits(InfiniteHits); diff --git a/src/templates/React InstantSearch Native/src/SearchBox.js.hbs b/src/templates/React InstantSearch Native/src/SearchBox.js.hbs index 69d85d535..b810852ff 100644 --- a/src/templates/React InstantSearch Native/src/SearchBox.js.hbs +++ b/src/templates/React InstantSearch Native/src/SearchBox.js.hbs @@ -6,6 +6,7 @@ import { connectSearchBox } from 'react-instantsearch-native'; const styles = StyleSheet.create({ container: { padding: 16, + backgroundColor: '#252b33', }, input: { height: 48,