fix(js): update and simplify dependencies

.circleci/config.yml

@@ -99,9 +99,9 @@ jobs:
       - build_app:
           template: 'Autocomplete.js 0'
           app: 'autocomplete.js'
-      - build_app:
-          template: 'InstantSearch.js'
-          app: 'instantsearch.js'
+      # - build_app:
+      #     template: 'InstantSearch.js'
+      #     app: 'instantsearch.js'
       - build_app:
           template: 'JavaScript Client'
           app: 'javascript-client'

e2e/__snapshots__/templates.test.js.snap

@@ -3082,7 +3082,6 @@ exports[`Templates InstantSearch.js File content: index.html 1`] = `
   <meta name=\\"viewport\\" content=\\"width=device-width, initial-scale=1, shrink-to-fit=no\\">
   <meta name=\\"theme-color\\" content=\\"#000000\\">
 
-  <link rel=\\"manifest\\" href=\\"./manifest.webmanifest\\">
   <link rel=\\"shortcut icon\\" href=\\"./favicon.png\\">
 
   <link rel=\\"stylesheet\\" href=\\"https://cdn.jsdelivr.net/npm/instantsearch.css@7/themes/algolia-min.css\\">
@@ -3128,35 +3127,16 @@ exports[`Templates InstantSearch.js File content: index.html 1`] = `
 </html>"
 `;
 
-exports[`Templates InstantSearch.js File content: manifest.webmanifest 1`] = `
-"{
-  \\"short_name\\": \\"instantsearch.js-app\\",
-  \\"name\\": \\"instantsearch.js-app Sample\\",
-  \\"icons\\": [
-    {
-      \\"src\\": \\"favicon.png\\",
-      \\"sizes\\": \\"64x64 32x32 24x24 16x16\\",
-      \\"type\\": \\"image/x-icon\\"
-    }
-  ],
-  \\"start_url\\": \\"./index.html\\",
-  \\"display\\": \\"standalone\\",
-  \\"theme_color\\": \\"#000000\\",
-  \\"background_color\\": \\"#ffffff\\"
-}"
-`;
-
 exports[`Templates InstantSearch.js File content: package.json 1`] = `
 "{
   \\"name\\": \\"instantsearch.js-app\\",
   \\"version\\": \\"1.0.0\\",
   \\"private\\": true,
-  \\"main\\": \\"src/app.js\\",
   \\"scripts\\": {
     \\"start\\": \\"parcel index.html --port 3000\\",
     \\"build\\": \\"parcel build index.html\\",
-    \\"lint\\": \\"eslint .\\",
-    \\"lint:fix\\": \\"npm run lint -- --fix\\"
+    \\"lint\\": \\"eslint . && prettier --check .\\",
+    \\"lint:fix\\": \\"eslint . --fix && prettier --write .\\"
   },
   \\"partialDependencies\\": {
     \\"instantsearch.js\\": \\"3.0.0\\"
@@ -3260,19 +3240,37 @@ search.addWidgets([
   instantsearch.widgets.dynamicWidgets({
     container: '#dynamic-widgets',
     fallbackWidget({ container, attribute }) {
-      return instantsearch.widgets.refinementList({
+      return instantsearch.widgets.panel({
+        templates: {
+          header({ widgetParams: { attribute } }) {
+            return attribute;
+          },
+        },
+      })(instantsearch.widgets.refinementList)({
         container,
         attribute,
       });
     },
     widgets: [
       container =>
-        instantsearch.widgets.refinementList({
+        instantsearch.widgets.panel({
+          templates: {
+            header({ widgetParams: { attribute } }) {
+              return attribute;
+            },
+          },
+        })(instantsearch.widgets.refinementList)({
           container,
           attribute: 'facet1',
         }),
       container =>
-        instantsearch.widgets.refinementList({
+        instantsearch.widgets.panel({
+          templates: {
+            header({ widgetParams: { attribute } }) {
+              return attribute;
+            },
+          },
+        })(instantsearch.widgets.refinementList)({
           container,
           attribute: 'facet2',
         }),
@@ -3342,7 +3340,6 @@ Array [
   "README.md",
   "favicon.png",
   "index.html",
-  "manifest.webmanifest",
   "package.json",
   "src/app.css",
   "src/app.js",

src/templates/InstantSearch.js/index.html.hbs

@@ -6,7 +6,6 @@
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
   <meta name="theme-color" content="#000000">
 
-  <link rel="manifest" href="./manifest.webmanifest">
   <link rel="shortcut icon" href="./favicon.png">
 
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.css@7/themes/algolia-min.css">

src/templates/InstantSearch.js/package.json

@@ -2,22 +2,16 @@
   "name": "{{name}}",
   "version": "1.0.0",
   "private": true,
-  "main": "src/app.js",
   "scripts": {
     "start": "parcel index.html --port 3000",
     "build": "parcel build index.html",
-    "lint": "eslint .",
-    "lint:fix": "npm run lint -- --fix"
+    "lint": "eslint . && prettier --check .",
+    "lint:fix": "eslint . --fix && prettier --write ."
   },
   "devDependencies": {
-    "babel-eslint": "10.0.3",
-    "eslint": "5.7.0",
-    "eslint-config-algolia": "13.2.3",
-    "eslint-config-prettier": "3.6.0",
-    "eslint-plugin-import": "2.19.1",
-    "eslint-plugin-prettier": "3.1.2",
-    "parcel-bundler": "1.12.5",
-    "prettier": "1.19.1"
+    "eslint": "8.15.0",
+    "parcel": "2.0.1",
+    "prettier": "2.6.2"
   },
   "dependencies": {
     "algoliasearch": "4",

src/templates/InstantSearch.js/src/app.js.hbs

@@ -39,14 +39,27 @@ search.addWidgets([
   instantsearch.widgets.dynamicWidgets({
     container: '#dynamic-widgets',
     fallbackWidget({ container, attribute }) {
-      return instantsearch.widgets.refinementList({
+      return instantsearch.widgets.panel({
+        templates: {
+          header({ widgetParams: { attribute } }) {
+            return attribute;
+          },
+        },
+      })(instantsearch.widgets.refinementList)({
         container,
         attribute,
       });
     },
     widgets: [
       {{#each attributesForFaceting}}
-      container => instantsearch.widgets.refinementList({
+      container =>
+        instantsearch.widgets.panel({
+          templates: {
+            header({ widgetParams: { attribute } }) {
+              return attribute;
+            },
+          },
+        })(instantsearch.widgets.refinementList)({
           container,
           attribute: '{{this}}',
         }),
@@ -55,7 +68,13 @@ search.addWidgets([
   }),
   {{else}}
   {{#each attributesForFaceting}}
-  instantsearch.widgets.refinementList({
+  instantsearch.widgets.panel({
+    templates: {
+      header({ widgetParams: { attribute } }) {
+        return attribute;
+      },
+    },
+  })(instantsearch.widgets.refinementList)({
     container: '#{{this}}-list',
     attribute: '{{this}}',
   }),