algolia · francoischalifour · Jul 5, 2018 · Jul 5, 2018 · Jul 5, 2018 · Jul 5, 2018
diff --git a/scripts/__image_snapshots__/javascript-helper/favicon.png-snap.png b/scripts/__image_snapshots__/javascript-helper/favicon.png-snap.png
diff --git a/scripts/__snapshots__/e2e-templates.test.js.snap b/scripts/__snapshots__/e2e-templates.test.js.snap
@@ -3313,6 +3313,314 @@ Array [
 ]
 `;
 
+exports[`Templates JavaScript Helper File content: .editorconfig 1`] = `
+"root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true"
+`;
+
+exports[`Templates JavaScript Helper File content: .eslintignore 1`] = `
+"/node_modules
+/dist
+/.cache"
+`;
+
+exports[`Templates JavaScript Helper File content: .eslintrc.js 1`] = `
+"module.exports = {
+  extends: 'algolia',
+};"
+`;
+
+exports[`Templates JavaScript Helper File content: .gitignore 1`] = `
+"# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/dist
+/.cache
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*"
+`;
+
+exports[`Templates JavaScript Helper File content: .prettierrc 1`] = `
+"{
+  \\"singleQuote\\": true,
+  \\"proseWrap\\": \\"never\\",
+  \\"trailingComma\\": \\"es5\\"
+}"
+`;
+
+exports[`Templates JavaScript Helper File content: README.md 1`] = `
+"# javascript-helper-app
+
+_This project was generated with [create-instantsearch-app](https://github.com/algolia/create-instantsearch-app) by [Algolia](https://algolia.com)._
+
+## Get started
+
+To run this project locally, install the dependencies and run the local server:
+
+\`\`\`sh
+npm install
+npm start
+\`\`\`
+
+Alternatively, you may use [Yarn](https://http://yarnpkg.com/):
+
+\`\`\`sh
+yarn
+yarn start
+\`\`\`"
+`;
+
+exports[`Templates JavaScript Helper File content: index.html 1`] = `
+"<!DOCTYPE html>
+<html lang=\\"en\\">
+
+<head>
+  <meta charset=\\"utf-8\\">
+  <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=\\"./src/index.css\\">
+  <link rel=\\"stylesheet\\" href=\\"./src/app.css\\">
+
+  <title>javascript-helper-app</title>
+</head>
+
+<body>
+  <header class=\\"header\\">
+    <h1 class=\\"header-title\\">
+      <a href=\\"/\\">javascript-helper-app</a>
+    </h1>
+    <p class=\\"header-subtitle\\">using the
+      <a href=\\"https://github.com/algolia/algoliasearch-helper-js\\">Algolia Search Helper for JavaScript</a>
+    </p>
+  </header>
+
+  <div class=\\"container\\">
+    <div class=\\"container-app\\">
+      <div id=\\"searchBox\\">
+        <form role=\\"search\\">
+          <input type=\\"search\\" placeholder=\\"Search placeholder\\" />
+        </form>
+      </div>
+      <div id=\\"hits\\"></div>
+    </div>
+  </div>
+
+  <script src=\\"./src/app.js\\"></script>
+</body>
+
+</html>"
+`;
+
+exports[`Templates JavaScript Helper File content: manifest.webmanifest 1`] = `
+"{
+  \\"short_name\\": \\"javascript-helper-app\\",
+  \\"name\\": \\"javascript-helper-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 JavaScript Helper File content: package.json 1`] = `
+"{
+  \\"name\\": \\"javascript-helper-app\\",
+  \\"version\\": \\"1.0.0\\",
+  \\"private\\": true,
+  \\"scripts\\": {
+    \\"start\\": \\"parcel index.html --port 3000\\",
+    \\"build\\": \\"parcel build index.html\\",
+    \\"lint\\": \\"eslint .\\",
+    \\"lint:fix\\": \\"npm run lint -- --fix\\"
+  },
+  \\"dependencies\\": {
+    \\"algoliasearch\\": \\"3.29.0\\",
+    \\"algoliasearch-helper\\": \\"1.0.0\\"
+  },
+  \\"devDependencies\\": {
+    \\"babel-eslint\\": \\"8.2.5\\",
+    \\"eslint\\": \\"4.19.1\\",
+    \\"eslint-config-algolia\\": \\"13.1.0\\",
+    \\"eslint-config-prettier\\": \\"2.9.0\\",
+    \\"eslint-plugin-import\\": \\"2.13.0\\",
+    \\"eslint-plugin-prettier\\": \\"2.6.1\\",
+    \\"parcel-bundler\\": \\"1.9.4\\",
+    \\"prettier\\": \\"1.13.7\\"
+  }
+}"
+`;
+
+exports[`Templates JavaScript Helper File content: src/app.css 1`] = `
+"em {
+  background: cyan;
+  font-style: normal;
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  min-height: 50px;
+  padding: 0.5rem 1rem;
+  background-image: linear-gradient(73deg, #3369e7, #1cc7d0);
+  color: #fff;
+  margin-bottom: 1rem;
+}
+
+.header a {
+  color: #fff;
+  text-decoration: none;
+}
+
+.header-title {
+  font-size: 1.2rem;
+  font-weight: normal;
+}
+
+.header-title::after {
+  content: ' ▸ ';
+  padding: 0 0.5rem;
+}
+
+.header-subtitle {
+  font-size: 1.2rem;
+}
+
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 1rem;
+}
+
+.container-app {
+  display: grid;
+}
+
+#searchBox input[type=\\"search\\"] {
+  width: 100%;
+  padding: 12px;
+  font: inherit;
+  border-radius: 2px;
+  border: 1px solid rgba(150, 150, 150, 0.16);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
+}
+
+.ais-hits {
+  display: grid;
+  grid-template-columns: 49% 49%;
+  grid-gap: 2%;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.ais-hits--item {
+  min-height: 100px;
+  padding: 1rem;
+  background: #fff;
+  border-radius: 4px;
+  border: 1px solid rgba(150, 150, 150, 0.16);
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.16);
+  margin-bottom: 1rem;
+}
+
+#searchBox {
+  margin-bottom: 2rem;
+}"
+`;
+
+exports[`Templates JavaScript Helper File content: src/app.js 1`] = `
+"import algoliasearch from 'algoliasearch';
+import algoliasearchHelper from 'algoliasearch-helper';
+
+const client = algoliasearch('appId', 'apiKey');
+const helper = algoliasearchHelper(client, 'indexName');
+
+const $searchBox = document.querySelector('#searchBox input[type=search]');
+const $hits = document.querySelector('#hits');
+
+$searchBox.addEventListener('input', event => {
+  const query = event.target.value;
+
+  helper.setQuery(query).search();
+});
+
+helper.on('result', result => {
+  // Please sanitize user-provided data when using \`innerHTML\` to avoid XSS
+  $hits.innerHTML = \`
+    <ul class=\\"ais-hits\\">
+      \${result.hits
+        .map(hit => \`<li class=\\"ais-hits--item\\">\${hit._highlightResult.mainAttribute.value}</li>\`)
+        .join('')}
+    </ul>\`;
+});
+
+helper.search();"
+`;
+
+exports[`Templates JavaScript Helper File content: src/index.css 1`] = `
+"body,
+h1 {
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
+    Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+}"
+`;
+
+exports[`Templates JavaScript Helper Folder structure: contains the right files 1`] = `
+Array [
+  ".editorconfig",
+  ".eslintignore",
+  ".eslintrc.js",
+  ".gitignore",
+  ".prettierrc",
+  "README.md",
+  "favicon.png",
+  "index.html",
+  "manifest.webmanifest",
+  "package.json",
+  "src/app.css",
+  "src/app.js",
+  "src/index.css",
+]
+`;
+
 exports[`Templates React InstantSearch File content: .editorconfig 1`] = `
 "root = true
 

diff --git a/src/api/__tests__/__snapshots__/index.test.js.snap b/src/api/__tests__/__snapshots__/index.test.js.snap
@@ -1,15 +1,15 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Options with unknown template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, JavaScript Client, React InstantSearch, React InstantSearch Native, Vue InstantSearch"`;
+exports[`Options with unknown template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, JavaScript Client, JavaScript Helper, React InstantSearch, React InstantSearch Native, Vue InstantSearch"`;
 
 exports[`Options with unvalid name throws 1`] = `
 "Could not create a project called \\"[31m./WrongNpmName[39m\\" because of npm naming restrictions.
   - name cannot start with a period
   - name can only contain URL-friendly characters"
 `;
 
-exports[`Options with wrong template path throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, JavaScript Client, React InstantSearch, React InstantSearch Native, Vue InstantSearch"`;
+exports[`Options with wrong template path throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, JavaScript Client, JavaScript Helper, React InstantSearch, React InstantSearch Native, Vue InstantSearch"`;
 
 exports[`Options without path throws 1`] = `"The option \`path\` is required."`;
 
-exports[`Options without template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, JavaScript Client, React InstantSearch, React InstantSearch Native, Vue InstantSearch"`;
+exports[`Options without template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, JavaScript Client, JavaScript Helper, React InstantSearch, React InstantSearch Native, Vue InstantSearch"`;
diff --git a/src/templates/JavaScript Helper/.editorconfig b/src/templates/JavaScript Helper/.editorconfig
@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
diff --git a/src/templates/JavaScript Helper/.eslintignore b/src/templates/JavaScript Helper/.eslintignore
@@ -0,0 +1,3 @@
+/node_modules
+/dist
+/.cache
diff --git a/src/templates/JavaScript Helper/.eslintrc.js b/src/templates/JavaScript Helper/.eslintrc.js
@@ -0,0 +1,3 @@
+module.exports = {
+  extends: 'algolia',
+};
diff --git a/src/templates/JavaScript Helper/.gitignore.template b/src/templates/JavaScript Helper/.gitignore.template
@@ -0,0 +1,22 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/dist
+/.cache
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/src/templates/JavaScript Helper/.prettierrc b/src/templates/JavaScript Helper/.prettierrc
@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "proseWrap": "never",
+  "trailingComma": "es5"
+}
diff --git a/src/templates/JavaScript Helper/.template.js b/src/templates/JavaScript Helper/.template.js
@@ -0,0 +1,13 @@
+const install = require('../../tasks/node/install');
+const teardown = require('../../tasks/node/teardown');
+
+module.exports = {
+  libraryName: 'algoliasearch-helper',
+  templateName: 'javascript-helper',
+  appName: 'javascript-helper-app',
+  keywords: ['algolia', 'JavaScript', 'Helper', 'algoliasearch-helper'],
+  tasks: {
+    install,
+    teardown,
+  },
+};