Skip to content
This repository was archived by the owner on Dec 16, 2022. It is now read-only.

Commit 34d0e94

Browse files
francoischalifourfrancoischalifour
authored
feat(templates): Add JavaScript Helper template (#78)
1 parent 1dc0d03 commit 34d0e94

File tree

17 files changed

+578
-3
lines changed

17 files changed

+578
-3
lines changed

‎scripts/__image_snapshots__/javascript-helper/favicon.png-snap.png‎

9.71 KB
Loading

‎scripts/__snapshots__/e2e-templates.test.js.snap‎

Lines changed: 308 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3313,6 +3313,314 @@ Array [
33133313
]
33143314
`;
33153315
3316+
exports[`Templates JavaScript Helper File content: .editorconfig 1`] = `
3317+
"root = true
3318+
3319+
[*]
3320+
charset = utf-8
3321+
indent_style = space
3322+
indent_size = 2
3323+
end_of_line = lf
3324+
insert_final_newline = true
3325+
trim_trailing_whitespace = true"
3326+
`;
3327+
3328+
exports[`Templates JavaScript Helper File content: .eslintignore 1`] = `
3329+
"/node_modules
3330+
/dist
3331+
/.cache"
3332+
`;
3333+
3334+
exports[`Templates JavaScript Helper File content: .eslintrc.js 1`] = `
3335+
"module.exports = {
3336+
extends: 'algolia',
3337+
};"
3338+
`;
3339+
3340+
exports[`Templates JavaScript Helper File content: .gitignore 1`] = `
3341+
"# See https://help.github.com/ignore-files/ for more about ignoring files.
3342+
3343+
# dependencies
3344+
/node_modules
3345+
3346+
# testing
3347+
/coverage
3348+
3349+
# production
3350+
/dist
3351+
/.cache
3352+
3353+
# misc
3354+
.DS_Store
3355+
.env.local
3356+
.env.development.local
3357+
.env.test.local
3358+
.env.production.local
3359+
3360+
npm-debug.log*
3361+
yarn-debug.log*
3362+
yarn-error.log*"
3363+
`;
3364+
3365+
exports[`Templates JavaScript Helper File content: .prettierrc 1`] = `
3366+
"{
3367+
\\"singleQuote\\": true,
3368+
\\"proseWrap\\": \\"never\\",
3369+
\\"trailingComma\\": \\"es5\\"
3370+
}"
3371+
`;
3372+
3373+
exports[`Templates JavaScript Helper File content: README.md 1`] = `
3374+
"# javascript-helper-app
3375+
3376+
_This project was generated with [create-instantsearch-app](https://github.com/algolia/create-instantsearch-app) by [Algolia](https://algolia.com)._
3377+
3378+
## Get started
3379+
3380+
To run this project locally, install the dependencies and run the local server:
3381+
3382+
\`\`\`sh
3383+
npm install
3384+
npm start
3385+
\`\`\`
3386+
3387+
Alternatively, you may use [Yarn](https://http://yarnpkg.com/):
3388+
3389+
\`\`\`sh
3390+
yarn
3391+
yarn start
3392+
\`\`\`"
3393+
`;
3394+
3395+
exports[`Templates JavaScript Helper File content: index.html 1`] = `
3396+
"<!DOCTYPE html>
3397+
<html lang=\\"en\\">
3398+
3399+
<head>
3400+
<meta charset=\\"utf-8\\">
3401+
<meta name=\\"viewport\\" content=\\"width=device-width, initial-scale=1, shrink-to-fit=no\\">
3402+
<meta name=\\"theme-color\\" content=\\"#000000\\">
3403+
3404+
<link rel=\\"manifest\\" href=\\"./manifest.webmanifest\\">
3405+
<link rel=\\"shortcut icon\\" href=\\"./favicon.png\\">
3406+
3407+
<link rel=\\"stylesheet\\" href=\\"./src/index.css\\">
3408+
<link rel=\\"stylesheet\\" href=\\"./src/app.css\\">
3409+
3410+
<title>javascript-helper-app</title>
3411+
</head>
3412+
3413+
<body>
3414+
<header class=\\"header\\">
3415+
<h1 class=\\"header-title\\">
3416+
<a href=\\"/\\">javascript-helper-app</a>
3417+
</h1>
3418+
<p class=\\"header-subtitle\\">using the
3419+
<a href=\\"https://github.com/algolia/algoliasearch-helper-js\\">Algolia Search Helper for JavaScript</a>
3420+
</p>
3421+
</header>
3422+
3423+
<div class=\\"container\\">
3424+
<div class=\\"container-app\\">
3425+
<div id=\\"searchBox\\">
3426+
<form role=\\"search\\">
3427+
<input type=\\"search\\" placeholder=\\"Search placeholder\\" />
3428+
</form>
3429+
</div>
3430+
<div id=\\"hits\\"></div>
3431+
</div>
3432+
</div>
3433+
3434+
<script src=\\"./src/app.js\\"></script>
3435+
</body>
3436+
3437+
</html>"
3438+
`;
3439+
3440+
exports[`Templates JavaScript Helper File content: manifest.webmanifest 1`] = `
3441+
"{
3442+
\\"short_name\\": \\"javascript-helper-app\\",
3443+
\\"name\\": \\"javascript-helper-app Sample\\",
3444+
\\"icons\\": [
3445+
{
3446+
\\"src\\": \\"favicon.png\\",
3447+
\\"sizes\\": \\"64x64 32x32 24x24 16x16\\",
3448+
\\"type\\": \\"image/x-icon\\"
3449+
}
3450+
],
3451+
\\"start_url\\": \\"./index.html\\",
3452+
\\"display\\": \\"standalone\\",
3453+
\\"theme_color\\": \\"#000000\\",
3454+
\\"background_color\\": \\"#ffffff\\"
3455+
}"
3456+
`;
3457+
3458+
exports[`Templates JavaScript Helper File content: package.json 1`] = `
3459+
"{
3460+
\\"name\\": \\"javascript-helper-app\\",
3461+
\\"version\\": \\"1.0.0\\",
3462+
\\"private\\": true,
3463+
\\"scripts\\": {
3464+
\\"start\\": \\"parcel index.html --port 3000\\",
3465+
\\"build\\": \\"parcel build index.html\\",
3466+
\\"lint\\": \\"eslint .\\",
3467+
\\"lint:fix\\": \\"npm run lint -- --fix\\"
3468+
},
3469+
\\"dependencies\\": {
3470+
\\"algoliasearch\\": \\"3.29.0\\",
3471+
\\"algoliasearch-helper\\": \\"1.0.0\\"
3472+
},
3473+
\\"devDependencies\\": {
3474+
\\"babel-eslint\\": \\"8.2.5\\",
3475+
\\"eslint\\": \\"4.19.1\\",
3476+
\\"eslint-config-algolia\\": \\"13.1.0\\",
3477+
\\"eslint-config-prettier\\": \\"2.9.0\\",
3478+
\\"eslint-plugin-import\\": \\"2.13.0\\",
3479+
\\"eslint-plugin-prettier\\": \\"2.6.1\\",
3480+
\\"parcel-bundler\\": \\"1.9.4\\",
3481+
\\"prettier\\": \\"1.13.7\\"
3482+
}
3483+
}"
3484+
`;
3485+
3486+
exports[`Templates JavaScript Helper File content: src/app.css 1`] = `
3487+
"em {
3488+
background: cyan;
3489+
font-style: normal;
3490+
}
3491+
3492+
.header {
3493+
display: flex;
3494+
align-items: center;
3495+
min-height: 50px;
3496+
padding: 0.5rem 1rem;
3497+
background-image: linear-gradient(73deg, #3369e7, #1cc7d0);
3498+
color: #fff;
3499+
margin-bottom: 1rem;
3500+
}
3501+
3502+
.header a {
3503+
color: #fff;
3504+
text-decoration: none;
3505+
}
3506+
3507+
.header-title {
3508+
font-size: 1.2rem;
3509+
font-weight: normal;
3510+
}
3511+
3512+
.header-title::after {
3513+
content: ' ▸ ';
3514+
padding: 0 0.5rem;
3515+
}
3516+
3517+
.header-subtitle {
3518+
font-size: 1.2rem;
3519+
}
3520+
3521+
.container {
3522+
max-width: 1200px;
3523+
margin: 0 auto;
3524+
padding: 1rem;
3525+
}
3526+
3527+
.container-app {
3528+
display: grid;
3529+
}
3530+
3531+
#searchBox input[type=\\"search\\"] {
3532+
width: 100%;
3533+
padding: 12px;
3534+
font: inherit;
3535+
border-radius: 2px;
3536+
border: 1px solid rgba(150, 150, 150, 0.16);
3537+
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
3538+
}
3539+
3540+
.ais-hits {
3541+
display: grid;
3542+
grid-template-columns: 49% 49%;
3543+
grid-gap: 2%;
3544+
list-style: none;
3545+
padding: 0;
3546+
margin: 0;
3547+
}
3548+
3549+
.ais-hits--item {
3550+
min-height: 100px;
3551+
padding: 1rem;
3552+
background: #fff;
3553+
border-radius: 4px;
3554+
border: 1px solid rgba(150, 150, 150, 0.16);
3555+
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.16);
3556+
margin-bottom: 1rem;
3557+
}
3558+
3559+
#searchBox {
3560+
margin-bottom: 2rem;
3561+
}"
3562+
`;
3563+
3564+
exports[`Templates JavaScript Helper File content: src/app.js 1`] = `
3565+
"import algoliasearch from 'algoliasearch';
3566+
import algoliasearchHelper from 'algoliasearch-helper';
3567+
3568+
const client = algoliasearch('appId', 'apiKey');
3569+
const helper = algoliasearchHelper(client, 'indexName');
3570+
3571+
const $searchBox = document.querySelector('#searchBox input[type=search]');
3572+
const $hits = document.querySelector('#hits');
3573+
3574+
$searchBox.addEventListener('input', event => {
3575+
const query = event.target.value;
3576+
3577+
helper.setQuery(query).search();
3578+
});
3579+
3580+
helper.on('result', result => {
3581+
// Please sanitize user-provided data when using \`innerHTML\` to avoid XSS
3582+
$hits.innerHTML = \`
3583+
<ul class=\\"ais-hits\\">
3584+
\${result.hits
3585+
.map(hit => \`<li class=\\"ais-hits--item\\">\${hit._highlightResult.mainAttribute.value}</li>\`)
3586+
.join('')}
3587+
</ul>\`;
3588+
});
3589+
3590+
helper.search();"
3591+
`;
3592+
3593+
exports[`Templates JavaScript Helper File content: src/index.css 1`] = `
3594+
"body,
3595+
h1 {
3596+
margin: 0;
3597+
padding: 0;
3598+
}
3599+
3600+
body {
3601+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
3602+
Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
3603+
}"
3604+
`;
3605+
3606+
exports[`Templates JavaScript Helper Folder structure: contains the right files 1`] = `
3607+
Array [
3608+
".editorconfig",
3609+
".eslintignore",
3610+
".eslintrc.js",
3611+
".gitignore",
3612+
".prettierrc",
3613+
"README.md",
3614+
"favicon.png",
3615+
"index.html",
3616+
"manifest.webmanifest",
3617+
"package.json",
3618+
"src/app.css",
3619+
"src/app.js",
3620+
"src/index.css",
3621+
]
3622+
`;
3623+
33163624
exports[`Templates React InstantSearch File content: .editorconfig 1`] = `
33173625
"root = true
33183626

‎src/api/__tests__/__snapshots__/index.test.js.snap‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
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"`;
3+
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"`;
44

55
exports[`Options with unvalid name throws 1`] = `
66
"Could not create a project called \\"./WrongNpmName\\" because of npm naming restrictions.
77
- name cannot start with a period
88
- name can only contain URL-friendly characters"
99
`;
1010

11-
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"`;
11+
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"`;
1212

1313
exports[`Options without path throws 1`] = `"The option \`path\` is required."`;
1414

15-
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"`;
15+
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"`;

‎src/templates/JavaScript Helper/.editorconfig‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
indent_style = space
6+
indent_size = 2
7+
end_of_line = lf
8+
insert_final_newline = true
9+
trim_trailing_whitespace = true

‎src/templates/JavaScript Helper/.eslintignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/node_modules
2+
/dist
3+
/.cache

‎src/templates/JavaScript Helper/.eslintrc.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
extends: 'algolia',
3+
};

‎src/templates/JavaScript Helper/.gitignore.template‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
# See https://help.github.com/ignore-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
6+
# testing
7+
/coverage
8+
9+
# production
10+
/dist
11+
/.cache
12+
13+
# misc
14+
.DS_Store
15+
.env.local
16+
.env.development.local
17+
.env.test.local
18+
.env.production.local
19+
20+
npm-debug.log*
21+
yarn-debug.log*
22+
yarn-error.log*

‎src/templates/JavaScript Helper/.prettierrc‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"singleQuote": true,
3+
"proseWrap": "never",
4+
"trailingComma": "es5"
5+
}

‎src/templates/JavaScript Helper/.template.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
const install = require('../../tasks/node/install');
2+
const teardown = require('../../tasks/node/teardown');
3+
4+
module.exports = {
5+
libraryName: 'algoliasearch-helper',
6+
templateName: 'javascript-helper',
7+
appName: 'javascript-helper-app',
8+
keywords: ['algolia', 'JavaScript', 'Helper', 'algoliasearch-helper'],
9+
tasks: {
10+
install,
11+
teardown,
12+
},
13+
};

0 commit comments

Comments
 (0)