create-instantsearch-app 5.1.0 → 5.1.1

package/CHANGELOG.md

@@ -1,3 +1,12 @@
+## [5.1.1](https://github.com/algolia/create-instantsearch-app/compare/5.1.0...5.1.1) (2022-01-03)
+
+
+### Bug Fixes
+
+* **react-native:** update template and related dependencies ([#546](https://github.com/algolia/create-instantsearch-app/issues/546)) ([858d33f](https://github.com/algolia/create-instantsearch-app/commit/858d33fb01272e8a13964a739c247743cbd855dc))
+
+
+
 # [5.1.0](https://github.com/algolia/create-instantsearch-app/compare/5.0.1...5.1.0) (2021-12-14)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-instantsearch-app",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "license": "MIT",
   "description": "⚡️ Build InstantSearch apps at the speed of thought",
   "keywords": [

package/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 (
-      <SafeAreaView style={styles.safe}>
-        <StatusBar barStyle="light-content" />
-        <View style={styles.container}>
-          <InstantSearch
-            searchClient={searchClient}
-            indexName="{{indexName}}"
-            root={this.root}
-          >
-            <SearchBox />
-            <InfiniteHits />
-          </InstantSearch>
-        </View>
-      </SafeAreaView>
-    );
-  }
-}
+const App = () => {
+  return (
+    <SafeAreaView style={styles.safe}>
+      <StatusBar barStyle="light-content" />
+      <View style={styles.container}>
+        <InstantSearch searchClient={searchClient} indexName="{{indexName}}">
+          <SearchBox />
+          <InfiniteHits />
+        </InstantSearch>
+      </View>
+    </SafeAreaView>
+  );
+};
 
 export default App;

package/src/templates/React InstantSearch Native/app.json

@@ -2,6 +2,6 @@
   "expo": {
     "name": "{{name}}",
     "slug": "{{name}}",
-    "sdkVersion": "32.0.0"
+    "sdkVersion": "44.0.0"
   }
 }

package/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"
   }
 }

package/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 }) => (
   <FlatList
     data={hits}
     keyExtractor={item => item.objectID}
     ItemSeparatorComponent={() => <View style={styles.separator} />}
-    onEndReached={() => hasMore && refine()}
+    onEndReached={() => hasMore && refineNext()}
     renderItem={({ item }) => (
       <View style={styles.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);

package/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,