├── .prettierignore
├── docs
    ├── CODEOWNERS.md
    ├── CONTRIBUTING.md
    └── CODE_OF_CONDUCT.md
├── public
    ├── robots.txt
    ├── img
    │   ├── favicon.ico
    │   └── icons
    │   │   ├── icon-72x72.png
    │   │   ├── icon-96x96.png
    │   │   ├── icon-128x128.png
    │   │   ├── icon-144x144.png
    │   │   ├── icon-152x152.png
    │   │   ├── icon-384x384.png
    │   │   ├── favicon-16x16.png
    │   │   ├── favicon-32x32.png
    │   │   ├── apple-touch-icon.png
    │   │   ├── android-chrome-192x192.png
    │   │   ├── android-chrome-512x512.png
    │   │   ├── apple-touch-icon-152x152.png
    │   │   ├── msapplication-icon-144x144.png
    │   │   └── safari-pinned-tab.svg
    ├── .well-known
    │   └── assetlinks.json
    ├── manifest.json
    ├── index.html
    └── service-worker.js
├── vue-config
    ├── config.development.js
    ├── config.default.js
    └── config.production.js
├── .prettierrc
├── cypress.json
├── .firebaserc
├── tests
    ├── unit
    │   ├── .eslintrc.js
    │   ├── setup.js
    │   ├── store
    │   │   ├── authentication
    │   │   │   ├── authentication.getters.spec.js
    │   │   │   ├── authentication.mutations.spec.js
    │   │   │   └── authentication.actions.spec.js
    │   │   ├── app
    │   │   │   ├── app.getters.spec.js
    │   │   │   ├── app.actions.spec.js
    │   │   │   └── app.mutations.spec.js
    │   │   └── products
    │   │   │   ├── products.getters.spec.js
    │   │   │   ├── products.mutations.spec.js
    │   │   │   └── products.actions.spec.js
    │   ├── misc
    │   │   └── helpers.spec.js
    │   └── views
    │   │   └── Login.spec.js
    └── e2e
    │   ├── .eslintrc.js
    │   ├── specs
    │       └── test.js
    │   ├── support
    │       ├── index.js
    │       └── commands.js
    │   └── plugins
    │       └── index.js
├── src
    ├── store
    │   ├── authentication
    │   │   ├── authentication.state.js
    │   │   ├── authentication.mutations.js
    │   │   ├── authentication.getters.js
    │   │   ├── index.js
    │   │   └── authentication.actions.js
    │   ├── app
    │   │   ├── app.getters.js
    │   │   ├── app.state.js
    │   │   ├── index.js
    │   │   ├── app.mutations.js
    │   │   └── app.actions.js
    │   ├── products
    │   │   ├── products.state.js
    │   │   ├── index.js
    │   │   ├── products.getters.js
    │   │   ├── products.mutations.js
    │   │   └── products.actions.js
    │   └── index.js
    ├── assets
    │   ├── logo.png
    │   └── img
    │   │   └── apple-navigation-action.png
    ├── firebase
    │   ├── users-db.js
    │   ├── user-products-db.js
    │   ├── authentication.js
    │   ├── init.js
    │   ├── async-firestore.js
    │   ├── firestore.rules
    │   └── generic-db.js
    ├── theme
    │   └── variables.scss
    ├── misc
    │   ├── handle-network-status.js
    │   ├── helpers.js
    │   ├── handle-apple-install-prompt.js
    │   └── register-service-worker.js
    ├── components
    │   ├── ProductDetail.vue
    │   ├── NewContentAvailableToastr.vue
    │   ├── ProductItem.vue
    │   ├── ProductList.vue
    │   ├── AddProduct.vue
    │   ├── AppleAddToHomeScreenModal.vue
    │   └── NavBar.vue
    ├── views
    │   ├── Product.vue
    │   ├── Products.vue
    │   ├── CheckLogin.vue
    │   ├── Home.vue
    │   └── Login.vue
    ├── main.js
    ├── router
    │   └── index.js
    └── App.vue
├── resources
    ├── ci-workflow.jpg
    ├── firebase-web-btn.jpg
    └── lighthouse-score-report.jpg
├── babel.config.js
├── internals
    ├── helpers
    │   ├── get-npm-config.js
    │   ├── clean-useless-scripts.js
    │   ├── clean-useless-dependencies.js
    │   ├── clean-readme-content.js
    │   ├── set-local-env-file.js
    │   ├── clean-useless-resources.js
    │   ├── change-project-name.js
    │   └── git-helper.js
    └── setup.js
├── .env.example
├── .env.production
├── jsconfig.json
├── .gitignore
├── .vscode
    └── settings.json
├── .eslintrc.js
├── .github
    ├── FUNDING.yml
    ├── ISSUE_TEMPLATE
    │   ├── feature_request.md
    │   └── bug_report.md
    └── workflows
    │   ├── ci.yml
    │   └── deploy-production.yml
├── vue.config.js
├── LICENSE
├── firebase.json
├── .circleci
    └── config.yml
├── .all-contributorsrc
├── package.json
├── CHANGELOG.md
└── README.md


/.prettierignore:
--------------------------------------------------------------------------------
1 | dist/


--------------------------------------------------------------------------------
/docs/CODEOWNERS.md:
--------------------------------------------------------------------------------
1 | - @kefranabg @tbetous
2 | 


--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | User-agent: *
2 | Disallow:
3 | 


--------------------------------------------------------------------------------
/vue-config/config.development.js:
--------------------------------------------------------------------------------
1 | module.exports = {}
2 | 


--------------------------------------------------------------------------------
/.prettierrc:
--------------------------------------------------------------------------------
1 | {
2 |   "singleQuote": true,
3 |   "semi": false
4 | }
5 | 


--------------------------------------------------------------------------------
/cypress.json:
--------------------------------------------------------------------------------
1 | {
2 |   "pluginsFile": "tests/e2e/plugins/index.js"
3 | }
4 | 


--------------------------------------------------------------------------------
/.firebaserc:
--------------------------------------------------------------------------------
1 | {
2 |   "projects": {
3 |     "default": "bento-starter"
4 |   }
5 | }
6 | 


--------------------------------------------------------------------------------
/tests/unit/.eslintrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   env: {
3 |     jest: true
4 |   }
5 | }
6 | 


--------------------------------------------------------------------------------
/src/store/authentication/authentication.state.js:
--------------------------------------------------------------------------------
1 | export default {
2 |   user: undefined
3 | }
4 | 


--------------------------------------------------------------------------------
/src/assets/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/src/assets/logo.png


--------------------------------------------------------------------------------
/public/img/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/favicon.ico


--------------------------------------------------------------------------------
/resources/ci-workflow.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/resources/ci-workflow.jpg


--------------------------------------------------------------------------------
/public/img/icons/icon-72x72.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/icon-72x72.png


--------------------------------------------------------------------------------
/public/img/icons/icon-96x96.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/icon-96x96.png


--------------------------------------------------------------------------------
/resources/firebase-web-btn.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/resources/firebase-web-btn.jpg


--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   plugins: ['lodash'],
3 |   presets: [['@vue/app', { useBuiltIns: 'entry' }]]
4 | }
5 | 


--------------------------------------------------------------------------------
/public/img/icons/icon-128x128.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/icon-128x128.png


--------------------------------------------------------------------------------
/public/img/icons/icon-144x144.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/icon-144x144.png


--------------------------------------------------------------------------------
/public/img/icons/icon-152x152.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/icon-152x152.png


--------------------------------------------------------------------------------
/public/img/icons/icon-384x384.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/icon-384x384.png


--------------------------------------------------------------------------------
/public/img/icons/favicon-16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/favicon-16x16.png


--------------------------------------------------------------------------------
/public/img/icons/favicon-32x32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/favicon-32x32.png


--------------------------------------------------------------------------------
/src/store/authentication/authentication.mutations.js:
--------------------------------------------------------------------------------
1 | export default {
2 |   setUser: (state, value) => (state.user = value)
3 | }
4 | 


--------------------------------------------------------------------------------
/public/img/icons/apple-touch-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/apple-touch-icon.png


--------------------------------------------------------------------------------
/resources/lighthouse-score-report.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/resources/lighthouse-score-report.jpg


--------------------------------------------------------------------------------
/internals/helpers/get-npm-config.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs')
2 | 
3 | module.exports = JSON.parse(fs.readFileSync('package.json', 'utf8'))
4 | 


--------------------------------------------------------------------------------
/public/img/icons/android-chrome-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/android-chrome-192x192.png


--------------------------------------------------------------------------------
/public/img/icons/android-chrome-512x512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/android-chrome-512x512.png


--------------------------------------------------------------------------------
/src/assets/img/apple-navigation-action.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/src/assets/img/apple-navigation-action.png


--------------------------------------------------------------------------------
/public/img/icons/apple-touch-icon-152x152.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/apple-touch-icon-152x152.png


--------------------------------------------------------------------------------
/public/img/icons/msapplication-icon-144x144.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kefranabg/bento-starter/master/public/img/icons/msapplication-icon-144x144.png


--------------------------------------------------------------------------------
/src/store/authentication/authentication.getters.js:
--------------------------------------------------------------------------------
1 | import { isNil } from 'lodash'
2 | 
3 | export default {
4 |   isUserLoggedIn: state => !isNil(state.user)
5 | }
6 | 


--------------------------------------------------------------------------------
/src/store/app/app.getters.js:
--------------------------------------------------------------------------------
1 | import { isNil } from 'lodash'
2 | 
3 | export default {
4 |   newContentAvailable: state => !isNil(state.SWRegistrationForNewContent)
5 | }
6 | 


--------------------------------------------------------------------------------
/src/store/products/products.state.js:
--------------------------------------------------------------------------------
1 | export default {
2 |   products: null,
3 |   productNameToCreate: '',
4 |   productDeletionPending: [],
5 |   productCreationPending: false
6 | }
7 | 


--------------------------------------------------------------------------------
/.env.example:
--------------------------------------------------------------------------------
1 | # Please refer to https://cli.vuejs.org/guide/mode-and-env.html#modes to get familiar with vue environments
2 | 
3 | # App
4 | 
5 | VUE_APP_TITLE=Bento Starter
6 | VUE_APP_SHORT_TITLE=Bento


--------------------------------------------------------------------------------
/.env.production:
--------------------------------------------------------------------------------
1 | # Please refer to https://cli.vuejs.org/guide/mode-and-env.html#modes to get familiar with vue environments
2 | 
3 | # App
4 | 
5 | VUE_APP_TITLE=Bento Starter
6 | VUE_APP_SHORT_TITLE=Bento


--------------------------------------------------------------------------------
/tests/e2e/.eslintrc.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   plugins: ['cypress'],
 3 |   env: {
 4 |     mocha: true,
 5 |     'cypress/globals': true
 6 |   },
 7 |   rules: {
 8 |     strict: 'off'
 9 |   }
10 | }
11 | 


--------------------------------------------------------------------------------
/jsconfig.json:
--------------------------------------------------------------------------------
 1 | // VSCode configuration providing help with aliases
 2 | {
 3 |   "compilerOptions": {
 4 |     "baseUrl": ".",
 5 |     "paths": {
 6 |       "@/*": ["./src/*"]
 7 |     }
 8 |   },
 9 |   "include": ["src", "tests"]
10 | }
11 | 


--------------------------------------------------------------------------------
/tests/e2e/specs/test.js:
--------------------------------------------------------------------------------
1 | // https://docs.cypress.io/api/introduction/api.html
2 | 
3 | describe('My First Test', () => {
4 |   it('Visits the app root url', () => {
5 |     cy.visit('/login')
6 |     cy.contains('h1', 'Login')
7 |   })
8 | })
9 | 


--------------------------------------------------------------------------------
/src/firebase/users-db.js:
--------------------------------------------------------------------------------
 1 | import GenericDB from './generic-db'
 2 | 
 3 | export default class UsersDB extends GenericDB {
 4 |   constructor() {
 5 |     super('users')
 6 |   }
 7 | 
 8 |   // Here you can extend UserDB with custom methods
 9 | }
10 | 


--------------------------------------------------------------------------------
/src/theme/variables.scss:
--------------------------------------------------------------------------------
 1 | /* Misc */
 2 | 
 3 | $vue-color: #46bd87;
 4 | $danger-color: #ea4d46;
 5 | 
 6 | /* Navbar */
 7 | 
 8 | $navbar-height: 3.6rem;
 9 | $navbar-color: #fff;
10 | $navbar-offline-color: #333;
11 | $navbar-link-color: #2c3e50;
12 | 


--------------------------------------------------------------------------------
/src/store/app/app.state.js:
--------------------------------------------------------------------------------
1 | export default {
2 |   appTitle: process.env.VUE_APP_TITLE,
3 |   appShortTitle: process.env.VUE_APP_SHORT_TITLE,
4 |   networkOnLine: true,
5 |   SWRegistrationForNewContent: null,
6 |   showAddToHomeScreenModalForApple: false,
7 |   refreshingApp: false
8 | }
9 | 


--------------------------------------------------------------------------------
/src/firebase/user-products-db.js:
--------------------------------------------------------------------------------
 1 | import GenericDB from './generic-db'
 2 | 
 3 | export default class UserProductsDB extends GenericDB {
 4 |   constructor(userId) {
 5 |     super(`users/${userId}/products`)
 6 |   }
 7 | 
 8 |   // Here you can extend UserProductsDB with custom methods
 9 | }
10 | 


--------------------------------------------------------------------------------
/src/store/app/index.js:
--------------------------------------------------------------------------------
 1 | import state from './app.state'
 2 | import mutations from './app.mutations'
 3 | import actions from './app.actions'
 4 | import getters from './app.getters'
 5 | 
 6 | export default {
 7 |   namespaced: true,
 8 |   state,
 9 |   mutations,
10 |   actions,
11 |   getters
12 | }
13 | 


--------------------------------------------------------------------------------
/src/store/products/index.js:
--------------------------------------------------------------------------------
 1 | import state from './products.state'
 2 | import mutations from './products.mutations'
 3 | import actions from './products.actions'
 4 | import getters from './products.getters'
 5 | 
 6 | export default {
 7 |   namespaced: true,
 8 |   state,
 9 |   mutations,
10 |   actions,
11 |   getters
12 | }
13 | 


--------------------------------------------------------------------------------
/src/misc/handle-network-status.js:
--------------------------------------------------------------------------------
 1 | import store from '@/store'
 2 | 
 3 | store.commit('app/setNetworkOnline', navigator.onLine)
 4 | 
 5 | window.addEventListener('online', () =>
 6 |   store.commit('app/setNetworkOnline', true)
 7 | )
 8 | 
 9 | window.addEventListener('offline', () =>
10 |   store.commit('app/setNetworkOnline', false)
11 | )
12 | 


--------------------------------------------------------------------------------
/src/firebase/authentication.js:
--------------------------------------------------------------------------------
 1 | import firebase from 'firebase/app'
 2 | import { isNil } from 'lodash'
 3 | 
 4 | import store from '@/store'
 5 | 
 6 | firebase.auth().onAuthStateChanged(firebaseUser => {
 7 |   const actionToDispatch = isNil(firebaseUser) ? 'logout' : 'login'
 8 |   store.dispatch(`authentication/${actionToDispatch}`, firebaseUser)
 9 | })
10 | 


--------------------------------------------------------------------------------
/src/store/authentication/index.js:
--------------------------------------------------------------------------------
 1 | import state from './authentication.state'
 2 | import mutations from './authentication.mutations'
 3 | import actions from './authentication.actions'
 4 | import getters from './authentication.getters'
 5 | 
 6 | export default {
 7 |   namespaced: true,
 8 |   state,
 9 |   mutations,
10 |   actions,
11 |   getters
12 | }
13 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | .DS_Store
 2 | node_modules
 3 | /dist
 4 | /report
 5 | 
 6 | /tests/e2e/videos/
 7 | /tests/e2e/screenshots/
 8 | 
 9 | # local env files
10 | .env.local
11 | .env.*.local
12 | 
13 | # Log files
14 | npm-debug.log*
15 | yarn-debug.log*
16 | yarn-error.log*
17 | 
18 | # Editor directories and files
19 | .idea
20 | .firebase
21 | firebase-debug.log
22 | *.suo
23 | *.ntvs*
24 | *.njsproj
25 | *.sln
26 | *.sw*
27 | 


--------------------------------------------------------------------------------
/src/store/app/app.mutations.js:
--------------------------------------------------------------------------------
1 | export default {
2 |   setNetworkOnline: (state, value) => (state.networkOnLine = value),
3 |   setSWRegistrationForNewContent: (state, value) =>
4 |     (state.SWRegistrationForNewContent = value),
5 |   setShowAddToHomeScreenModalForApple: (state, value) =>
6 |     (state.showAddToHomeScreenModalForApple = value),
7 |   setRefreshingApp: (state, value) => (state.refreshingApp = value)
8 | }
9 | 


--------------------------------------------------------------------------------
/public/.well-known/assetlinks.json:
--------------------------------------------------------------------------------
 1 | [
 2 |   {
 3 |     "relation": ["delegate_permission/common.handle_all_urls"],
 4 |     "target": {
 5 |       "namespace": "android_app",
 6 |       "package_name": "com.bentostarter.bentostarterdemo",
 7 |       "sha256_cert_fingerprints": [
 8 |         "8A:E2:E8:BB:E0:63:96:4E:0A:39:9A:C0:00:B8:06:9C:5D:46:B5:4E:A0:67:32:9E:3D:9E:0C:A8:F9:AF:AA:C4"
 9 |       ]
10 |     }
11 |   }
12 | ]
13 | 


--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "vetur.validation.template": false,
 3 | 
 4 |   "editor.codeActionsOnSave": {
 5 |     "source.fixAll": true
 6 |   },
 7 |   "eslint.options": { "extensions": [".html", ".js", ".vue", ".scss"] },
 8 |   "eslint.validate": ["javascript", "vue"],
 9 | 
10 |   "javascript.validate.enable": false,
11 |   "javascript.format.enable": false,
12 | 
13 |   "[scss]": {
14 |     "editor.formatOnSave": true
15 |   }
16 | }
17 | 


--------------------------------------------------------------------------------
/vue-config/config.default.js:
--------------------------------------------------------------------------------
 1 | const path = require('path')
 2 | 
 3 | module.exports = {
 4 |   /* See https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa for more details */
 5 |   pwa: {
 6 |     themeColor: '#FFFFFF',
 7 |     appleMobileWebAppStatusBarStyle: 'black',
 8 |     workboxPluginMode: 'InjectManifest',
 9 |     workboxOptions: {
10 |       swSrc: path.join('public', 'service-worker.js')
11 |     }
12 |   }
13 | }
14 | 


--------------------------------------------------------------------------------
/src/store/products/products.getters.js:
--------------------------------------------------------------------------------
 1 | import { find } from 'lodash'
 2 | 
 3 | export default {
 4 |   /**
 5 |    * Check if a product has deletion pending
 6 |    */
 7 |   isProductDeletionPending: state => productId =>
 8 |     state.productDeletionPending.includes(productId),
 9 | 
10 |   /**
11 |    * Get product by id
12 |    */
13 |   getProductById: state => productId =>
14 |     find(state.products, product => product.id === productId)
15 | }
16 | 


--------------------------------------------------------------------------------
/tests/unit/setup.js:
--------------------------------------------------------------------------------
 1 | class LocalStorageMock {
 2 |   constructor() {
 3 |     this.store = {}
 4 |   }
 5 | 
 6 |   clear() {
 7 |     this.store = {}
 8 |   }
 9 | 
10 |   getItem(key) {
11 |     return this.store[key] || null
12 |   }
13 | 
14 |   setItem(key, value) {
15 |     this.store[key] = value.toString()
16 |   }
17 | 
18 |   removeItem(key) {
19 |     delete this.store[key]
20 |   }
21 | }
22 | 
23 | global.localStorage = new LocalStorageMock()
24 | 


--------------------------------------------------------------------------------
/internals/helpers/clean-useless-scripts.js:
--------------------------------------------------------------------------------
 1 | const readPkg = require('read-pkg')
 2 | const writePkg = require('write-pkg')
 3 | 
 4 | /**
 5 |  * Remove the "setup" script from package.json
 6 |  * @returns {Promise<any>}
 7 |  */
 8 | module.exports = async () => {
 9 |   const pkg = await readPkg()
10 | 
11 |   if (!pkg.scripts) {
12 |     pkg.scripts = {}
13 |   }
14 | 
15 |   delete pkg.scripts.setup
16 |   delete pkg.scripts.presetup
17 | 
18 |   return writePkg(pkg)
19 | }
20 | 


--------------------------------------------------------------------------------
/internals/helpers/clean-useless-dependencies.js:
--------------------------------------------------------------------------------
 1 | const util = require('util')
 2 | const exec = util.promisify(require('child_process').exec)
 3 | const shell = require('shelljs')
 4 | 
 5 | /**
 6 |  * Remove npm dependencies which are only used by this script
 7 |  * @returns {Promise<any>}
 8 |  */
 9 | module.exports = async () =>
10 |   await exec(
11 |     'npm uninstall rimraf compare-versions chalk shelljs read-pkg write-pkg inquirer ora boxen change-case --save-dev'
12 |   )
13 | 


--------------------------------------------------------------------------------
/src/store/index.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue'
 2 | import Vuex from 'vuex'
 3 | import authentication from './authentication'
 4 | import app from './app'
 5 | import products from './products'
 6 | 
 7 | Vue.use(Vuex)
 8 | 
 9 | /* If you don't know about Vuex, please refer to https://vuex.vuejs.org/ */
10 | 
11 | export default new Vuex.Store({
12 |   strict: process.env.NODE_ENV !== 'production',
13 |   modules: {
14 |     authentication,
15 |     app,
16 |     products
17 |   }
18 | })
19 | 


--------------------------------------------------------------------------------
/src/components/ProductDetail.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="product-detail">
 3 |     <h1>{{ product.name }}</h1>
 4 |   </div>
 5 | </template>
 6 | 
 7 | <script>
 8 | export default {
 9 |   props: {
10 |     product: Object
11 |   }
12 | }
13 | </script>
14 | 
15 | <style lang="scss" scoped>
16 | @import '@/theme/variables.scss';
17 | 
18 | .product-detail {
19 |   display: flex;
20 |   flex-direction: column;
21 |   justify-content: center;
22 |   align-items: center;
23 |   width: 100%;
24 | }
25 | </style>
26 | 


--------------------------------------------------------------------------------
/internals/helpers/clean-readme-content.js:
--------------------------------------------------------------------------------
 1 | const util = require('util')
 2 | const writeFile = util.promisify(require('fs').writeFile)
 3 | 
 4 | const newReadmeContent = `# My bento-starter project
 5 | 
 6 | ## Documentation
 7 | 
 8 | Documentation available :point_right: [here](https://bento-starter.netlify.com/)`
 9 | 
10 | /**
11 |  * Replace README.md content
12 |  *
13 |  * @returns {Promise<any>}
14 |  */
15 | module.exports = async () =>
16 |   await writeFile(`${__dirname}/../../README.md`, newReadmeContent)
17 | 


--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "Bento Starter",
 3 |   "short_name": "Bento",
 4 |   "icons": [
 5 |     {
 6 |       "src": "./img/icons/android-chrome-192x192.png",
 7 |       "sizes": "192x192",
 8 |       "type": "image/png"
 9 |     },
10 |     {
11 |       "src": "./img/icons/android-chrome-512x512.png",
12 |       "sizes": "512x512",
13 |       "type": "image/png"
14 |     }
15 |   ],
16 |   "start_url": "./index.html",
17 |   "display": "standalone",
18 |   "background_color": "#000000",
19 |   "theme_color": "#FFFFFF"
20 | }
21 | 


--------------------------------------------------------------------------------
/src/firebase/init.js:
--------------------------------------------------------------------------------
 1 | import firebase from 'firebase/app'
 2 | import 'firebase/auth'
 3 | 
 4 | // The configuration below is not sensitive data. You can serenely add your config here
 5 | const config = {
 6 |   apiKey: 'AIzaSyCe6CSzOUs6_Ij_VHa6hancdEi6CNBtw7c',
 7 |   authDomain: 'bento-starter.firebaseapp.com',
 8 |   databaseURL: 'https://bento-starter.firebaseio.com',
 9 |   projectId: 'bento-starter',
10 |   storageBucket: 'bento-starter.appspot.com',
11 |   messagingSenderId: '458464977217'
12 | }
13 | 
14 | firebase.initializeApp(config)
15 | 


--------------------------------------------------------------------------------
/src/misc/helpers.js:
--------------------------------------------------------------------------------
 1 | import UsersDB from '@/firebase/users-db'
 2 | 
 3 | /**
 4 |  * Create new user from firebase auth user infos
 5 |  */
 6 | // eslint-disable-next-line
 7 | export const createNewUserFromFirebaseAuthUser = async firebaseAuthUser => {
 8 |   const providerData = firebaseAuthUser.providerData[0]
 9 |   const { displayName, photoURL, email } = providerData
10 |   const userDb = new UsersDB()
11 |   const user = {
12 |     displayName,
13 |     photoURL,
14 |     email
15 |   }
16 | 
17 |   return userDb.create(user, firebaseAuthUser.uid)
18 | }
19 | 


--------------------------------------------------------------------------------
/internals/helpers/set-local-env-file.js:
--------------------------------------------------------------------------------
 1 | const util = require('util')
 2 | const copyFile = util.promisify(require('fs').copyFile)
 3 | 
 4 | /**
 5 |  * Create '.env.local' file by copying '.env.example' file
 6 |  *
 7 |  * @returns {Promise<any>}
 8 |  */
 9 | module.exports = async () => {
10 |   await copyFile(
11 |     `${__dirname}/../../.env.example`,
12 |     `${__dirname}/../../.env.local`
13 |   )
14 | 
15 |   // We need this file to get cypress tests working on circleCI
16 |   await copyFile(
17 |     `${__dirname}/../../.env.example`,
18 |     `${__dirname}/../../.env.production`
19 |   )
20 | }
21 | 


--------------------------------------------------------------------------------
/tests/unit/store/authentication/authentication.getters.spec.js:
--------------------------------------------------------------------------------
 1 | import getters from '@/store/authentication/authentication.getters'
 2 | 
 3 | describe('authentication module getters', () => {
 4 |   describe('isUserLoggedIn', () => {
 5 |     it('should be false if the user is not logged in', () => {
 6 |       const state = { user: null }
 7 |       expect(getters.isUserLoggedIn(state)).toBe(false)
 8 |     })
 9 | 
10 |     it('should be true if the user is logged in', () => {
11 |       const state = { user: { id: 1 } }
12 |       expect(getters.isUserLoggedIn(state)).toBe(true)
13 |     })
14 |   })
15 | })
16 | 


--------------------------------------------------------------------------------
/src/views/Product.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="page-wrapper">
 3 |     <product-detail
 4 |       v-if="currentProduct"
 5 |       :product="currentProduct"
 6 |     ></product-detail>
 7 |   </div>
 8 | </template>
 9 | 
10 | <script>
11 | import { mapGetters } from 'vuex'
12 | import ProductDetail from '@/components/ProductDetail'
13 | 
14 | export default {
15 |   components: { ProductDetail },
16 |   props: {
17 |     id: String
18 |   },
19 |   computed: {
20 |     ...mapGetters('products', ['getProductById']),
21 |     currentProduct() {
22 |       return this.getProductById(this.id)
23 |     }
24 |   }
25 | }
26 | </script>
27 | 


--------------------------------------------------------------------------------
/src/firebase/async-firestore.js:
--------------------------------------------------------------------------------
 1 | import firebase from 'firebase/app'
 2 | import { isNil } from 'lodash'
 3 | 
 4 | let asyncFirestore = null
 5 | 
 6 | // Lazy load firestore with async import is important for performance
 7 | 
 8 | export default () => {
 9 |   if (isNil(asyncFirestore)) {
10 |     asyncFirestore = import(/* webpackChunkName: "chunk-firestore" */ 'firebase/firestore').then(
11 |       () => {
12 |         firebase.firestore().settings({})
13 |         firebase.firestore().enablePersistence({ synchronizeTabs: true })
14 |         return firebase.firestore()
15 |       }
16 |     )
17 |   }
18 |   return asyncFirestore
19 | }
20 | 


--------------------------------------------------------------------------------
/tests/unit/store/authentication/authentication.mutations.spec.js:
--------------------------------------------------------------------------------
 1 | import mutations from '@/store/authentication/authentication.mutations'
 2 | 
 3 | const user = {
 4 |   displayName: 'Robert Bob',
 5 |   photoUrl: 'https://my-awesome-photo.com',
 6 |   email: 'robert.bob@mail.com'
 7 | }
 8 | 
 9 | describe('authentication module mutation', () => {
10 |   describe('setUser', () => {
11 |     it('should set the user to the given parameter', () => {
12 |       const state = {
13 |         user: null
14 |       }
15 |       mutations.setUser(state, user)
16 |       expect(state).toEqual({
17 |         user
18 |       })
19 |     })
20 |   })
21 | })
22 | 


--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue'
 2 | 
 3 | import App from './App.vue'
 4 | import router from './router'
 5 | import store from './store'
 6 | import '@/misc/register-service-worker'
 7 | import '@/misc/handle-network-status'
 8 | import '@/firebase/init'
 9 | import '@/firebase/authentication'
10 | import '@/misc/handle-apple-install-prompt'
11 | import 'pwacompat'
12 | 
13 | Vue.config.productionTip = false
14 | 
15 | new Vue({
16 |   router,
17 |   store,
18 |   render: h => h(App)
19 | }).$mount('#app')
20 | 
21 | // eslint-disable-next-line no-console
22 | console.info(`
23 | 🍱 This app was bootstrapped with bento-starter 🍱
24 | 
25 | 👉 https://bento-starter.netlify.com/
26 | 
27 | `)
28 | 


--------------------------------------------------------------------------------
/internals/helpers/clean-useless-resources.js:
--------------------------------------------------------------------------------
 1 | const path = require('path')
 2 | const util = require('util')
 3 | const rimraf = util.promisify(require('rimraf'))
 4 | 
 5 | const rootDirname = path.resolve(`${__dirname}/../../`)
 6 | 
 7 | const resourcesPathsToDelete = [
 8 |   `${rootDirname}/internals`,
 9 |   `${rootDirname}/docs`,
10 |   `${rootDirname}/.github/ISSUE_TEMPLATE`,
11 |   `${rootDirname}/.github/FUNDING.yml`,
12 |   `${rootDirname}/resources`,
13 |   `${rootDirname}/.env.example`,
14 |   `${rootDirname}/LICENSE`
15 | ]
16 | 
17 | /**
18 |  * Delete useless resources
19 |  * */
20 | module.exports = async () =>
21 |   await Promise.all(resourcesPathsToDelete.map(path => rimraf(path)))
22 | 


--------------------------------------------------------------------------------
/tests/unit/store/app/app.getters.spec.js:
--------------------------------------------------------------------------------
 1 | import getters from '@/store/app/app.getters'
 2 | 
 3 | describe('app module getters', () => {
 4 |   describe('newContentAvailable', () => {
 5 |     it('should return true if SWRegistrationForNewContent is not null', () => {
 6 |       const result = getters.newContentAvailable({
 7 |         SWRegistrationForNewContent: {}
 8 |       })
 9 | 
10 |       expect(result).toBe(true)
11 |     })
12 | 
13 |     it('should return false if SWRegistrationForNewContent is null', () => {
14 |       const result = getters.newContentAvailable({
15 |         SWRegistrationForNewContent: null
16 |       })
17 | 
18 |       expect(result).toBe(false)
19 |     })
20 |   })
21 | })
22 | 


--------------------------------------------------------------------------------
/tests/unit/store/products/products.getters.spec.js:
--------------------------------------------------------------------------------
 1 | import getters from '@/store/products/products.getters'
 2 | 
 3 | const state = { productDeletionPending: [1, 2, 3] }
 4 | 
 5 | describe('products module getters', () => {
 6 |   describe('isProductDeletionPending', () => {
 7 |     it('should return true if the given product id is marked as pending', () => {
 8 |       const result = getters.isProductDeletionPending(state)(1)
 9 |       expect(result).toBe(true)
10 |     })
11 | 
12 |     it('should return false if the given product id is not marked as pending', () => {
13 |       const result = getters.isProductDeletionPending(state)(4)
14 |       expect(result).toBe(false)
15 |     })
16 |   })
17 | })
18 | 


--------------------------------------------------------------------------------
/.eslintrc.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   root: true,
 3 |   env: {
 4 |     node: true,
 5 |     jest: true
 6 |   },
 7 |   extends: [
 8 |     'airbnb-base',
 9 |     'eslint:recommended',
10 |     'plugin:vue/recommended',
11 |     '@vue/prettier'
12 |   ],
13 |   rules: {
14 |     'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
15 |     'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
16 |     'vue/require-default-prop': 'off',
17 |     'import/no-unresolved': 'off',
18 |     'no-param-reassign': 'off',
19 |     'no-return-assign': 'off',
20 |     'no-var': 2,
21 |     'prefer-const': 2
22 |   },
23 |   parserOptions: {
24 |     parser: 'babel-eslint'
25 |   }
26 | }
27 | 


--------------------------------------------------------------------------------
/.github/FUNDING.yml:
--------------------------------------------------------------------------------
 1 | # These are supported funding model platforms
 2 | 
 3 | github: [kefranabg]
 4 | patreon: # Replace with a single Patreon username
 5 | open_collective: # Replace with a single Open Collective username
 6 | ko_fi: # Replace with a single Ko-fi username
 7 | tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
 8 | community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry
 9 | liberapay: # Replace with a single Liberapay username
10 | issuehunt: # Replace with a single IssueHunt username
11 | otechie: # Replace with a single Otechie username
12 | custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']
13 | 


--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/feature_request.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | name: Feature request
 3 | about: Suggest an idea for this project
 4 | title: ''
 5 | labels: ''
 6 | assignees: ''
 7 | 
 8 | ---
 9 | 
10 | **Is your feature request related to a problem? Please describe.**
11 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
12 | 
13 | **Describe the solution you'd like**
14 | A clear and concise description of what you want to happen.
15 | 
16 | **Describe alternatives you've considered**
17 | A clear and concise description of any alternative solutions or features you've considered.
18 | 
19 | **Additional context**
20 | Add any other context or screenshots about the feature request here.
21 | 


--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8" />
 5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 6 |     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
 7 |     <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
 8 |   </head>
 9 |   <body>
10 |     <noscript>
11 |       <strong
12 |         >We're sorry but <%= VUE_APP_TITLE %> doesn't work properly without
13 |         JavaScript enabled. Please enable it to continue.</strong
14 |       >
15 |     </noscript>
16 |     <main role="main">
17 |       <div id="app"></div>
18 |     </main>
19 | 
20 |     <!-- built files will be auto injected -->
21 |   </body>
22 | </html>
23 | 


--------------------------------------------------------------------------------
/vue.config.js:
--------------------------------------------------------------------------------
 1 | // Declare root dirname globally
 2 | const path = require('path')
 3 | 
 4 | // eslint-disable-next-line no-underscore-dangle
 5 | global.__rootDirname = path.join(__dirname, 'dist')
 6 | 
 7 | const fs = require('fs')
 8 | const merge = require('webpack-merge')
 9 | const defaultConfiguration = require('./vue-config/config.default')
10 | 
11 | const environmentConfigurationPath = `./vue-config/config.${
12 |   process.env.NODE_ENV
13 | }.js`
14 | 
15 | const environmentConfiguration = fs.existsSync(environmentConfigurationPath)
16 |   ? require(environmentConfigurationPath) // eslint-disable-line
17 |   : {}
18 | 
19 | const config = merge(defaultConfiguration, environmentConfiguration)
20 | 
21 | module.exports = config
22 | 


--------------------------------------------------------------------------------
/tests/unit/misc/helpers.spec.js:
--------------------------------------------------------------------------------
 1 | import { createNewUserFromFirebaseAuthUser } from '@/misc/helpers'
 2 | 
 3 | const mockCreate = jest.fn()
 4 | jest.mock('@/firebase/users-db', () =>
 5 |   jest.fn().mockImplementation(() => ({ create: mockCreate }))
 6 | )
 7 | 
 8 | describe('helpers', () => {
 9 |   describe('createNewUserFromFirebaseAuthUser', () => {
10 |     it('should set user with the created user', async () => {
11 |       const firebaseUser = { providerData: [{ id: 1 }] }
12 |       const newUser = { id: 2 }
13 |       mockCreate.mockResolvedValue(Promise.resolve(newUser))
14 |       const createdUser = await createNewUserFromFirebaseAuthUser(firebaseUser)
15 | 
16 |       expect(createdUser).toBe(newUser)
17 |     })
18 |   })
19 | })
20 | 


--------------------------------------------------------------------------------
/src/misc/handle-apple-install-prompt.js:
--------------------------------------------------------------------------------
 1 | import store from '@/store'
 2 | import { isNil } from 'lodash'
 3 | 
 4 | const isIosOnBrowser =
 5 |   ['iPhone', 'iPad', 'iPod'].includes(navigator.platform) &&
 6 |   !window.navigator.standalone
 7 | 
 8 | if (isIosOnBrowser) {
 9 |   const now = Date.now()
10 |   let limitDate = null
11 |   const addToHomeIosPromptLastDate = localStorage.getItem(
12 |     'addToHomeIosPromptLastDate'
13 |   )
14 | 
15 |   if (!isNil(addToHomeIosPromptLastDate)) {
16 |     limitDate = new Date(parseInt(addToHomeIosPromptLastDate, 10))
17 |     limitDate.setMonth(limitDate.getMonth() + 1)
18 |   }
19 | 
20 |   if (isNil(limitDate) || now >= limitDate.getTime()) {
21 |     store.commit('app/setShowAddToHomeScreenModalForApple', true)
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/tests/e2e/support/index.js:
--------------------------------------------------------------------------------
 1 | // ***********************************************************
 2 | // This example support/index.js is processed and
 3 | // loaded automatically before your test files.
 4 | //
 5 | // This is a great place to put global configuration and
 6 | // behavior that modifies Cypress.
 7 | //
 8 | // You can change the location of this file or turn off
 9 | // automatically serving support files with the
10 | // 'supportFile' configuration option.
11 | //
12 | // You can read more here:
13 | // https://on.cypress.io/configuration
14 | // ***********************************************************
15 | 
16 | // Import commands.js using ES2015 syntax:
17 | import './commands'
18 | 
19 | // Alternatively you can use CommonJS syntax:
20 | // require('./commands')
21 | 


--------------------------------------------------------------------------------
/src/components/NewContentAvailableToastr.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="wrapper">
 3 |     <template v-if="refreshingApp">
 4 |       Loading new content...
 5 |     </template>
 6 |     <template v-else>
 7 |       New content available. Please
 8 |       <span class="refresh-btn" @click="$emit('refresh')">REFRESH</span>
 9 |     </template>
10 |   </div>
11 | </template>
12 | 
13 | <script>
14 | export default {
15 |   props: {
16 |     refreshingApp: Boolean
17 |   }
18 | }
19 | </script>
20 | 
21 | <style lang="scss" scoped>
22 | .wrapper {
23 |   padding: 10px 20px;
24 |   background-color: #333;
25 |   color: white;
26 |   display: inline-block;
27 |   border-radius: 4px;
28 | 
29 |   .refresh-btn {
30 |     text-decoration: underline;
31 |     cursor: pointer;
32 |   }
33 | }
34 | </style>
35 | 


--------------------------------------------------------------------------------
/src/firebase/firestore.rules:
--------------------------------------------------------------------------------
 1 | service cloud.firestore {
 2 |   match /databases/{database}/documents {
 3 |   function authenticated() { return request.auth.uid != null }
 4 |   
 5 |     match /users/{userId} {
 6 |        allow get: if authenticated() && request.auth.uid == userId;
 7 |        allow create: if authenticated() && request.auth.uid == userId;
 8 |        allow update, delete: if authenticated() && request.auth.uid == userId;
 9 |     }
10 | 
11 |     match /users/{userId}/products/{productId} {
12 |       allow get: if authenticated() && request.auth.uid == userId;
13 | 			allow list: if authenticated() && request.auth.uid == userId;
14 |       allow create: if authenticated() && request.auth.uid == userId;
15 |       allow update, delete: if authenticated() && request.auth.uid == userId;
16 |     }
17 |   }
18 | }


--------------------------------------------------------------------------------
/src/store/app/app.actions.js:
--------------------------------------------------------------------------------
 1 | import { isNil } from 'lodash'
 2 | 
 3 | export default {
 4 |   /**
 5 |    * Closes "add to home screen" modal for apple
 6 |    */
 7 |   closeAddToHomeScreenModalForApple: async ({ commit }) => {
 8 |     localStorage.setItem('addToHomeIosPromptLastDate', Date.now())
 9 |     commit('setShowAddToHomeScreenModalForApple', false)
10 |   },
11 | 
12 |   /**
13 |    * Trigger service worker skipWating so the new service worker can take over.
14 |    * This will also trigger a window refresh (see /src/misc/register-service-worker.js)
15 |    */
16 |   serviceWorkerSkipWaiting({ state, commit }) {
17 |     if (isNil(state.SWRegistrationForNewContent)) return
18 | 
19 |     commit('setRefreshingApp', true)
20 |     state.SWRegistrationForNewContent.waiting.postMessage('skipWaiting')
21 |   }
22 | }
23 | 


--------------------------------------------------------------------------------
/src/views/Products.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="page-wrapper">
 3 |     <h1 class="products-page-title">Products page</h1>
 4 |     <product-list class="product-list"></product-list>
 5 |     <add-product v-if="networkOnLine"></add-product>
 6 |   </div>
 7 | </template>
 8 | 
 9 | <script>
10 | import { mapState } from 'vuex'
11 | import ProductList from '@/components/ProductList'
12 | import AddProduct from '@/components/AddProduct'
13 | 
14 | export default {
15 |   components: { ProductList, AddProduct },
16 |   computed: mapState('app', ['networkOnLine'])
17 | }
18 | </script>
19 | 
20 | <style lang="scss" scoped>
21 | @import '@/theme/variables.scss';
22 | 
23 | .products-page-title {
24 |   text-align: center;
25 |   margin-bottom: 60px;
26 | }
27 | 
28 | .product-list {
29 |   margin: 20px 0;
30 | }
31 | </style>
32 | 


--------------------------------------------------------------------------------
/src/views/CheckLogin.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <h1 class="loading-title">
 3 |     Loading...
 4 |   </h1>
 5 | </template>
 6 | 
 7 | <script>
 8 | import { mapState } from 'vuex'
 9 | import { isNil } from 'lodash'
10 | 
11 | export default {
12 |   computed: mapState('authentication', ['user']),
13 |   watch: {
14 |     user: {
15 |       handler(user) {
16 |         if (user === undefined) return
17 | 
18 |         if (this.$route.query.redirectUrl === this.$route.path) {
19 |           this.$router.push('/')
20 |         }
21 | 
22 |         const redirectUrl = isNil(user)
23 |           ? `/login?redirectUrl=${this.$route.query.redirectUrl}`
24 |           : this.$route.query.redirectUrl
25 | 
26 |         this.$router.push(redirectUrl)
27 |       },
28 |       immediate: true
29 |     }
30 |   }
31 | }
32 | </script>
33 | 
34 | <style lang="scss" scoped>
35 | .loading-title {
36 |   text-align: center;
37 | }
38 | </style>
39 | 


--------------------------------------------------------------------------------
/tests/e2e/support/commands.js:
--------------------------------------------------------------------------------
 1 | // ***********************************************
 2 | // This example commands.js shows you how to
 3 | // create various custom commands and overwrite
 4 | // existing commands.
 5 | //
 6 | // For more comprehensive examples of custom
 7 | // commands please read more here:
 8 | // https://on.cypress.io/custom-commands
 9 | // ***********************************************
10 | //
11 | //
12 | // -- This is a parent command --
13 | // Cypress.Commands.add("login", (email, password) => { ... })
14 | //
15 | //
16 | // -- This is a child command --
17 | // Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
18 | //
19 | //
20 | // -- This is a dual command --
21 | // Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
22 | //
23 | //
24 | // -- This is will overwrite an existing command --
25 | // Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
26 | 


--------------------------------------------------------------------------------
/tests/e2e/plugins/index.js:
--------------------------------------------------------------------------------
 1 | // https://docs.cypress.io/guides/guides/plugins-guide.html
 2 | 
 3 | // if you need a custom webpack configuration you can uncomment the following import
 4 | // and then use the `file:preprocessor` event
 5 | // as explained in the cypress docs
 6 | // https://docs.cypress.io/api/plugins/preprocessors-api.html#Examples
 7 | 
 8 | /* eslint-disable import/no-extraneous-dependencies, global-require, arrow-body-style */
 9 | // const webpack = require('@cypress/webpack-preprocessor')
10 | 
11 | module.exports = (on, config) => {
12 |   // on('file:preprocessor', webpack({
13 |   //  webpackOptions: require('@vue/cli-service/webpack.config'),
14 |   //  watchOptions: {}
15 |   // }))
16 | 
17 |   return {
18 |     ...config,
19 |     fixturesFolder: 'tests/e2e/fixtures',
20 |     integrationFolder: 'tests/e2e/specs',
21 |     screenshotsFolder: 'tests/e2e/screenshots',
22 |     videosFolder: 'tests/e2e/videos',
23 |     supportFile: 'tests/e2e/support/index.js'
24 |   }
25 | }
26 | 


--------------------------------------------------------------------------------
/vue-config/config.production.js:
--------------------------------------------------------------------------------
 1 | const path = require('path')
 2 | const BundleAnalyzerPlugin = require('webpack-bundle-analyzer') // eslint-disable-line
 3 |   .BundleAnalyzerPlugin
 4 | const PrerenderSPAPlugin = require('prerender-spa-plugin') // eslint-disable-line
 5 | 
 6 | const prerenderedRoutesList = ['/login', '/home', '/']
 7 | 
 8 | module.exports = {
 9 |   configureWebpack: {
10 |     plugins: [
11 |       /* Refer to https://www.npmjs.com/package/webpack-bundle-analyzer for more details */
12 |       new BundleAnalyzerPlugin({
13 |         analyzerMode: 'disabled',
14 |         generateStatsFile: true
15 |       }),
16 |       /* See https://github.com/chrisvfritz/prerender-spa-plugin for more details */
17 |       new PrerenderSPAPlugin({
18 |         // Required - The path to the webpack-outputted app to prerender.
19 |         staticDir: path.join(__rootDirname),
20 |         // Required - Routes to prerender.
21 |         routes: prerenderedRoutesList
22 |       })
23 |     ]
24 |   }
25 | }
26 | 


--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/bug_report.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | name: Bug report
 3 | about: Create a report to help us improve
 4 | title: ''
 5 | labels: ''
 6 | assignees: ''
 7 | 
 8 | ---
 9 | 
10 | **Describe the bug**
11 | A clear and concise description of what the bug is.
12 | 
13 | **To Reproduce**
14 | Steps to reproduce the behavior:
15 | 1. Go to '...'
16 | 2. Click on '....'
17 | 3. Scroll down to '....'
18 | 4. See error
19 | 
20 | **Expected behavior**
21 | A clear and concise description of what you expected to happen.
22 | 
23 | **Screenshots**
24 | If applicable, add screenshots to help explain your problem.
25 | 
26 | **Desktop (please complete the following information):**
27 |  - OS: [e.g. iOS]
28 |  - Browser [e.g. chrome, safari]
29 |  - Version [e.g. 22]
30 | 
31 | **Smartphone (please complete the following information):**
32 |  - Device: [e.g. iPhone6]
33 |  - OS: [e.g. iOS8.1]
34 |  - Browser [e.g. stock browser, safari]
35 |  - Version [e.g. 22]
36 | 
37 | **Additional context**
38 | Add any other context about the problem here.
39 | 


--------------------------------------------------------------------------------
/src/store/products/products.mutations.js:
--------------------------------------------------------------------------------
 1 | export default {
 2 |   /* Product input name */
 3 |   setProductNameToCreate: (state, productNameToCreate) =>
 4 |     (state.productNameToCreate = productNameToCreate),
 5 | 
 6 |   /* Products */
 7 |   setProducts: (state, products) => (state.products = products),
 8 |   addProduct: (state, product) => state.products.push(product),
 9 |   removeProductById: (state, productId) => {
10 |     const index = state.products.findIndex(product => product.id === productId)
11 |     state.products.splice(index, 1)
12 |   },
13 | 
14 |   /* Products deletion */
15 |   addProductDeletionPending: (state, productId) =>
16 |     state.productDeletionPending.push(productId),
17 |   removeProductDeletionPending: (state, productId) => {
18 |     const index = state.products.findIndex(product => product.id === productId)
19 |     state.productDeletionPending.splice(index, 1)
20 |   },
21 | 
22 |   /* Product creation */
23 |   setProductCreationPending: (state, value) =>
24 |     (state.productCreationPending = value)
25 | }
26 | 


--------------------------------------------------------------------------------
/.github/workflows/ci.yml:
--------------------------------------------------------------------------------
 1 | name: CI
 2 | on: pull_request
 3 | 
 4 | jobs:
 5 |   tests:
 6 |     runs-on: ubuntu-latest
 7 |     steps:
 8 |       - uses: actions/checkout@v2
 9 |       - uses: actions/setup-node@v1
10 |         with:
11 |           node-version: 10
12 |       - uses: actions/cache@v1
13 |         with:
14 |           path: ~/.npm
15 |           key: ${{ runner.os }}-node-modules-${{ hashFiles('package-lock.json') }}
16 |           restore-keys: |
17 |             ${{ runner.os }}-node-modules-
18 |             ${{ runner.os }}-
19 |       - name: Install dependencies
20 |         run: npm ci --cache-min=9999 --no-audit --progress=false
21 |       - name: Check prettier
22 |         run: npm run prettier:check
23 |       - name: Check linter
24 |         run: npm run lint
25 |       - name: Check unit tests
26 |         run: npm run test:unit
27 |       - name: Check e2e tests
28 |         run: npm run test:e2e:headless
29 |       - name: Build project
30 |         run: npm run build
31 |       - name: Check bundle size
32 |         run: npm run bundlesize
33 | 


--------------------------------------------------------------------------------
/public/service-worker.js:
--------------------------------------------------------------------------------
 1 | workbox.core.setCacheNameDetails({ prefix: 'bento-starter' })
 2 | 
 3 | /**
 4 |  * The workboxSW.precacheAndRoute() method efficiently caches and responds to
 5 |  * requests for URLs in the manifest.
 6 |  * See https://goo.gl/S9QRab
 7 |  */
 8 | self.__precacheManifest = [].concat(self.__precacheManifest || [])
 9 | workbox.precaching.precacheAndRoute(self.__precacheManifest, {})
10 | 
11 | // Redirect to index.html if sw cannot find matching route
12 | workbox.routing.registerNavigationRoute('/index.html', {
13 |   /* Do not redirect routes used by firebase auth  */
14 |   blacklist: [
15 |     new RegExp('/__/auth/handler'),
16 |     new RegExp('/__/auth/iframe'),
17 |     new RegExp('/.well-known')
18 |   ]
19 | })
20 | 
21 | workbox.routing.registerRoute(
22 |   /^https:\/\/fonts/,
23 |   workbox.strategies.staleWhileRevalidate({
24 |     cacheName: 'fonts.googleapis',
25 |     plugins: []
26 |   }),
27 |   'GET'
28 | )
29 | 
30 | addEventListener('message', messageEvent => {
31 |   if (messageEvent.data === 'skipWaiting') return self.skipWaiting()
32 | })
33 | 


--------------------------------------------------------------------------------
/src/store/authentication/authentication.actions.js:
--------------------------------------------------------------------------------
 1 | import router from '@/router'
 2 | import { isNil } from 'lodash'
 3 | import { createNewUserFromFirebaseAuthUser } from '@/misc/helpers'
 4 | import UsersDB from '@/firebase/users-db'
 5 | 
 6 | export default {
 7 |   /**
 8 |    * Callback fired when user login
 9 |    */
10 |   login: async ({ commit, dispatch }, firebaseAuthUser) => {
11 |     const userFromFirebase = await new UsersDB().read(firebaseAuthUser.uid)
12 | 
13 |     const user = isNil(userFromFirebase)
14 |       ? await createNewUserFromFirebaseAuthUser(firebaseAuthUser)
15 |       : userFromFirebase
16 | 
17 |     commit('setUser', user)
18 |     dispatch('products/getUserProducts', null, { root: true })
19 |   },
20 | 
21 |   /**
22 |    * Callback fired when user logout
23 |    */
24 |   logout: ({ commit }) => {
25 |     commit('setUser', null)
26 |     commit('products/setProducts', null, { root: true })
27 | 
28 |     const currentRouter = router.app.$route
29 |     if (!(currentRouter.meta && currentRouter.meta.authNotRequired)) {
30 |       router.push('/login')
31 |     }
32 |   }
33 | }
34 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2019 Franck Abgrall
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/src/components/ProductItem.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="product-item">
 3 |     <router-link
 4 |       class="product-link"
 5 |       :to="{ name: 'product', params: { id: data.id } }"
 6 |     >
 7 |       #{{ index }} {{ data.name }}
 8 |     </router-link>
 9 |     <div
10 |       v-if="!disableActions"
11 |       class="delete-btn"
12 |       @click="$emit('deleteProduct', data.id)"
13 |     >
14 |       {{ isProductDeletionPending ? 'delete in progress...' : 'delete' }}
15 |     </div>
16 |   </div>
17 | </template>
18 | 
19 | <script>
20 | export default {
21 |   props: {
22 |     data: Object,
23 |     index: Number,
24 |     isProductDeletionPending: Boolean,
25 |     disableActions: Boolean
26 |   }
27 | }
28 | </script>
29 | 
30 | <style lang="scss" scoped>
31 | @import '@/theme/variables.scss';
32 | 
33 | .product-item {
34 |   display: flex;
35 |   justify-content: space-between;
36 |   align-items: center;
37 |   width: 100%;
38 | 
39 |   .product-link {
40 |     color: $vue-color;
41 |   }
42 | 
43 |   .delete-btn {
44 |     cursor: pointer;
45 |     padding: 5px 10px;
46 |     border: 1px solid;
47 |     display: inline-block;
48 |     border-radius: 3px;
49 |     margin-left: 10px;
50 |     color: $danger-color;
51 |     border-color: $danger-color;
52 |   }
53 | }
54 | </style>
55 | 


--------------------------------------------------------------------------------
/firebase.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "firestore": {
 3 |     "rules": "./src/firebase/firestore.rules"
 4 |   },
 5 |   "hosting": {
 6 |     "headers": [
 7 |       {
 8 |         "source": "/service-worker.js",
 9 |         "headers": [
10 |           {
11 |             "key": "Cache-Control",
12 |             "value": "no-cache"
13 |           }
14 |         ]
15 |       },
16 |       {
17 |         "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
18 |         "headers": [
19 |           {
20 |             "key": "Access-Control-Allow-Origin",
21 |             "value": "*"
22 |           }
23 |         ]
24 |       },
25 |       {
26 |         "source": "**/*.@(jpg|jpeg|gif|png|svg|css|js)",
27 |         "headers": [
28 |           {
29 |             "key": "Cache-Control",
30 |             "value": "max-age=2592000"
31 |           }
32 |         ]
33 |       },
34 |       {
35 |         "source": "404.html",
36 |         "headers": [
37 |           {
38 |             "key": "Cache-Control",
39 |             "value": "max-age=300"
40 |           }
41 |         ]
42 |       }
43 |     ],
44 |     "public": "dist/",
45 |     "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
46 |     "rewrites": [
47 |       {
48 |         "source": "**",
49 |         "destination": "/index.html"
50 |       }
51 |     ]
52 |   }
53 | }
54 | 


--------------------------------------------------------------------------------
/src/components/ProductList.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div>
 3 |     <p v-if="products === null" class="infos-label">Loading...</p>
 4 |     <p v-if="products && !products.length" class="infos-label">
 5 |       You don't have any product yet
 6 |     </p>
 7 |     <product-item
 8 |       v-for="(product, index) in products"
 9 |       :key="product.id"
10 |       class="product-row"
11 |       :index="index"
12 |       :is-product-deletion-pending="isProductDeletionPending(product.id)"
13 |       :disable-actions="!networkOnLine"
14 |       :data="product"
15 |       @deleteProduct="deleteUserProduct"
16 |     ></product-item>
17 |   </div>
18 | </template>
19 | 
20 | <script>
21 | import ProductItem from '@/components/ProductItem'
22 | import { mapState, mapActions, mapGetters } from 'vuex'
23 | 
24 | export default {
25 |   components: { ProductItem },
26 |   computed: {
27 |     ...mapGetters('products', ['isProductDeletionPending']),
28 |     ...mapState('products', ['products']),
29 |     ...mapState('app', ['networkOnLine'])
30 |   },
31 |   methods: mapActions('products', ['deleteUserProduct'])
32 | }
33 | </script>
34 | 
35 | <style lang="scss" scoped>
36 | @import '@/theme/variables.scss';
37 | 
38 | .infos-label {
39 |   text-align: center;
40 | }
41 | 
42 | .product-row {
43 |   display: flex;
44 |   align-items: center;
45 |   width: 100%;
46 |   max-width: 500px;
47 |   margin: 10px auto;
48 |   justify-content: space-between;
49 | }
50 | </style>
51 | 


--------------------------------------------------------------------------------
/tests/unit/store/app/app.actions.spec.js:
--------------------------------------------------------------------------------
 1 | import actions from '@/store/app/app.actions'
 2 | 
 3 | const commit = jest.fn()
 4 | 
 5 | afterEach(() => {
 6 |   commit.mockReset()
 7 | })
 8 | 
 9 | describe('app module action', () => {
10 |   describe('closeAddToHomeScreenModalForApple', () => {
11 |     it('should set the state of the modal as closed', () => {
12 |       actions.closeAddToHomeScreenModalForApple({ commit })
13 |       expect(commit).toHaveBeenCalledWith(
14 |         'setShowAddToHomeScreenModalForApple',
15 |         false
16 |       )
17 |     })
18 |   })
19 | 
20 |   describe('serviceWorkerSkipWaiting', () => {
21 |     it('should set app refreshing status and call sw postMessage with skipWaiting', () => {
22 |       const state = {
23 |         SWRegistrationForNewContent: {
24 |           waiting: {
25 |             postMessage: jest.fn()
26 |           }
27 |         }
28 |       }
29 | 
30 |       actions.serviceWorkerSkipWaiting({ commit, state })
31 | 
32 |       expect(commit).toHaveBeenCalledWith('setRefreshingApp', true)
33 |       expect(
34 |         state.SWRegistrationForNewContent.waiting.postMessage
35 |       ).toHaveBeenCalledWith('skipWaiting')
36 |     })
37 | 
38 |     it('should not set app refreshing status and call sw postMessage with skipWaiting', () => {
39 |       const state = {
40 |         SWRegistrationForNewContent: null
41 |       }
42 | 
43 |       actions.serviceWorkerSkipWaiting({ commit, state })
44 | 
45 |       expect(commit).not.toHaveBeenCalled()
46 |     })
47 |   })
48 | })
49 | 


--------------------------------------------------------------------------------
/src/views/Home.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="page-wrapper">
 3 |     <h1 class="home-page-title">{{ appTitle }}</h1>
 4 |     <img alt="logo-bento" class="logo" src="@/assets/img/bento-starter.svg" />
 5 | 
 6 |     <a
 7 |       rel="noopener"
 8 |       class="documentation-link"
 9 |       target="_blank"
10 |       href="https://bento-starter.netlify.com/"
11 |       >Documentation →</a
12 |     >
13 |   </div>
14 | </template>
15 | 
16 | <script>
17 | import { mapState } from 'vuex'
18 | 
19 | export default {
20 |   head() {
21 |     return {
22 |       title: {
23 |         inner: 'Home'
24 |       },
25 |       meta: [
26 |         {
27 |           name: 'description',
28 |           content: `${this.appTitle} home page`,
29 |           id: 'desc'
30 |         }
31 |       ]
32 |     }
33 |   },
34 |   computed: mapState('app', ['appTitle'])
35 | }
36 | </script>
37 | 
38 | <style lang="scss" scoped>
39 | @import '@/theme/variables.scss';
40 | 
41 | .page-wrapper {
42 |   display: flex;
43 |   flex-direction: column;
44 |   justify-content: center;
45 |   align-items: center;
46 | 
47 |   .logo {
48 |     margin-bottom: 3rem;
49 |   }
50 | 
51 |   .home-page-title {
52 |     text-align: center;
53 |   }
54 | 
55 |   .documentation-link {
56 |     display: inline-block;
57 |     font-size: 1.2rem;
58 |     color: #fff;
59 |     background-color: #5d6788;
60 |     padding: 0.8rem 1.6rem;
61 |     border-radius: 4px;
62 |     transition: background-color 0.1s ease;
63 |     box-sizing: border-box;
64 |     text-decoration: none;
65 |     width: fit-content;
66 |     font-weight: 500;
67 |   }
68 | }
69 | </style>
70 | 


--------------------------------------------------------------------------------
/docs/CONTRIBUTING.md:
--------------------------------------------------------------------------------
 1 | # Contributing
 2 | 
 3 | Contributions, issues and feature requests are very welcome. If you are using this app and fixed a bug or improve it, please consider submitting a PR!
 4 | 
 5 | You can contact us on Twitter ([Franck](https://twitter.com/FranckAbgrall) or [Thomas](https://twitter.com/tbetous))
 6 | 
 7 | If you want to contribute you must read and accept out [Code of Conduct](/code-of-conduct)
 8 | 
 9 | ## Guidelines
10 | 
11 | ### General guidelines
12 | 
13 | - The master branch is where incoming new features are merged (the next coming release).
14 | - All new features / bugs should be done in dedicated branch from the `master` branch.
15 | - It's a very nice thing to have multiple small commits as you work on the PR. It's easier to review it. Then we will squash it before merging.
16 | 
17 | ### Commit messages
18 | 
19 | This project uses [gitmoji](https://gitmoji.carloscuesta.me/) as commit convention, because it's fun and provides an easy way of identifying the purpose or intention of a commit with only looking at the emojis used. All you just have to do is to find the emoji corresponding to the purpose of your commit in [this list](https://gitmoji.carloscuesta.me/) following by a short message explaining the update. You can also add a description if it's needed. That's all ;)
20 | 
21 | https://gitmoji.carloscuesta.me/
22 | 
23 | ### Adding new feature
24 | 
25 | Ideally you should open a suggestion issue on [GitHub](https://github.com/kefranabg/bento-starter) or chat with the community on [Slack](https://join.slack.com/t/bento-starter/shared_invite/enQtNjE5OTI5MzQyMTE3LTQ1N2M0NzAxYWM1OTJmYTA4YTIxMmM4MDhiNTI0MGNjZGIyNDFjY2UwNjE2Nzc3NzMzMzViOTYyOGViYjkxYzY).
26 | 


--------------------------------------------------------------------------------
/src/misc/register-service-worker.js:
--------------------------------------------------------------------------------
 1 | import { register } from 'register-service-worker'
 2 | 
 3 | import store from '@/store'
 4 | 
 5 | if (process.env.NODE_ENV === 'production') {
 6 |   register('/service-worker.js', {
 7 |     ready() {
 8 |       // eslint-disable-next-line no-console
 9 |       console.info('Service worker is active.')
10 |     },
11 |     registered() {
12 |       // eslint-disable-next-line no-console
13 |       console.info('Service worker has been registered.')
14 |     },
15 |     cached() {
16 |       // eslint-disable-next-line no-console
17 |       console.info('Content has been cached for offline use.')
18 |     },
19 |     updatefound() {
20 |       // eslint-disable-next-line no-console
21 |       console.info('New content is downloading.')
22 |     },
23 |     updated(reg) {
24 |       // eslint-disable-next-line no-console
25 |       console.info('New content is available; please refresh.')
26 |       store.commit(`app/setSWRegistrationForNewContent`, reg)
27 |     },
28 |     offline() {
29 |       // eslint-disable-next-line no-console
30 |       console.info(
31 |         'No internet connection found. App is running in offline mode.'
32 |       )
33 |     },
34 |     error(error) {
35 |       // eslint-disable-next-line no-console
36 |       console.error('Error during service worker registration:', error)
37 |     }
38 |   })
39 | }
40 | 
41 | if ('serviceWorker' in navigator) {
42 |   let refreshing = false
43 |   // This is triggered when a new service worker take over
44 |   navigator.serviceWorker.addEventListener('controllerchange', () => {
45 |     if (refreshing) return
46 |     refreshing = true
47 | 
48 |     window.location.reload()
49 |   })
50 | }
51 | 


--------------------------------------------------------------------------------
/src/store/products/products.actions.js:
--------------------------------------------------------------------------------
 1 | import UserProductsDB from '@/firebase/user-products-db'
 2 | 
 3 | export default {
 4 |   /**
 5 |    * Fetch products of current loggedin user
 6 |    */
 7 |   getUserProducts: async ({ rootState, commit }) => {
 8 |     const userProductDb = new UserProductsDB(rootState.authentication.user.id)
 9 | 
10 |     const products = await userProductDb.readAll()
11 |     commit('setProducts', products)
12 |   },
13 | 
14 |   /**
15 |    * Create a product for current loggedin user
16 |    */
17 |   createUserProduct: async ({ commit, rootState }, product) => {
18 |     const userProductDb = new UserProductsDB(rootState.authentication.user.id)
19 | 
20 |     commit('setProductCreationPending', true)
21 |     const createdProduct = await userProductDb.create(product)
22 |     commit('addProduct', createdProduct)
23 |     commit('setProductCreationPending', false)
24 |   },
25 | 
26 |   /**
27 |    * Create a new product for current loggedin user and reset product name input
28 |    */
29 |   triggerAddProductAction: ({ dispatch, state, commit }) => {
30 |     if (state.productNameToCreate === '') return
31 | 
32 |     const product = { name: state.productNameToCreate }
33 |     commit('setProductNameToCreate', '')
34 |     dispatch('createUserProduct', product)
35 |   },
36 | 
37 |   /**
38 |    * Delete a user product from its id
39 |    */
40 |   deleteUserProduct: async ({ rootState, commit, getters }, productId) => {
41 |     if (getters.isProductDeletionPending(productId)) return
42 | 
43 |     const userProductsDb = new UserProductsDB(rootState.authentication.user.id)
44 | 
45 |     commit('addProductDeletionPending', productId)
46 |     await userProductsDb.delete(productId)
47 |     commit('removeProductById', productId)
48 |     commit('removeProductDeletionPending', productId)
49 |   }
50 | }
51 | 


--------------------------------------------------------------------------------
/src/components/AddProduct.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="product-action-bar">
 3 |     <input
 4 |       placeholder="product name..."
 5 |       class="product-name-input"
 6 |       type="text"
 7 |       :value="productNameToCreate"
 8 |       @input="setProductNameToCreate($event.target.value)"
 9 |       @keypress.enter="triggerAddProductAction"
10 |     />
11 |     <div
12 |       :class="{ disabled: productCreationPending }"
13 |       class="create-product-btn"
14 |       @click="triggerAddProductAction"
15 |     >
16 |       add product
17 |     </div>
18 |   </div>
19 | </template>
20 | 
21 | <script>
22 | import { mapMutations, mapState, mapActions } from 'vuex'
23 | 
24 | export default {
25 |   computed: mapState('products', [
26 |     'productNameToCreate',
27 |     'productCreationPending'
28 |   ]),
29 |   methods: {
30 |     ...mapMutations('products', ['setProductNameToCreate']),
31 |     ...mapActions('products', ['triggerAddProductAction'])
32 |   }
33 | }
34 | </script>
35 | 
36 | <style lang="scss" scoped>
37 | @import '@/theme/variables.scss';
38 | 
39 | .product-action-bar {
40 |   display: flex;
41 |   align-items: center;
42 |   justify-content: center;
43 | 
44 |   .product-name-input {
45 |     padding-left: 5px;
46 |     height: 30px;
47 |     width: 150px;
48 |     outline: none;
49 |     font: inherit;
50 |     border: 1px solid;
51 |     border-color: #2c3e50;
52 |     border-radius: 3px;
53 |   }
54 | 
55 |   .create-product-btn {
56 |     cursor: pointer;
57 |     padding: 5px 10px;
58 |     border: 1px solid;
59 |     display: inline-block;
60 |     border-radius: 3px;
61 |     margin-left: 10px;
62 |     border-color: #2c3e50;
63 | 
64 |     &.disabled {
65 |       pointer-events: none;
66 |       background-color: #aaa;
67 |     }
68 | 
69 |     &:hover {
70 |       color: $vue-color;
71 |       border-color: $vue-color;
72 |     }
73 |   }
74 | }
75 | </style>
76 | 


--------------------------------------------------------------------------------
/.github/workflows/deploy-production.yml:
--------------------------------------------------------------------------------
 1 | name: Deploy on production
 2 | on:
 3 |   push:
 4 |     branches:
 5 |       - master
 6 | 
 7 | jobs:
 8 |   tests:
 9 |     runs-on: ubuntu-latest
10 |     steps:
11 |       - uses: actions/checkout@v2
12 |       - uses: actions/setup-node@v1
13 |         with:
14 |           node-version: 10
15 |       - uses: actions/cache@v1
16 |         with:
17 |           path: ~/.npm
18 |           key: ${{ runner.os }}-node-modules-${{ hashFiles('package-lock.json') }}
19 |           restore-keys: |
20 |             ${{ runner.os }}-node-modules-
21 |             ${{ runner.os }}-
22 |       - name: Install dependencies
23 |         run: npm ci --cache-min=9999 --no-audit --progress=false
24 |       - name: Check prettier
25 |         run: npm run prettier:check
26 |       - name: Check linter
27 |         run: npm run lint
28 |       - name: Check unit tests
29 |         run: npm run test:unit
30 |       - name: Check e2e tests
31 |         run: npm run test:e2e:headless
32 |       - name: Build project
33 |         run: npm run build
34 |       - name: Check bundle size
35 |         run: npm run bundlesize
36 |       - name: Upload build
37 |         uses: actions/upload-artifact@master
38 |         with:
39 |           name: build
40 |           path: dist
41 | 
42 |   deploy:
43 |     runs-on: ubuntu-latest
44 |     needs: [tests]
45 |     steps:
46 |       - name: Checkout project
47 |         uses: actions/checkout@v2
48 |       - name: Setup nodeJs
49 |         uses: actions/setup-node@v1
50 |         with:
51 |           node-version: 10
52 |       - name: Download build
53 |         uses: actions/download-artifact@master
54 |         with:
55 |           name: build
56 |           path: dist
57 |       - name: Deploy project to firebase
58 |         uses: w9jds/firebase-action@master
59 |         with:
60 |           args: deploy --non-interactive
61 |         env:
62 |           FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
63 | 


--------------------------------------------------------------------------------
/internals/helpers/change-project-name.js:
--------------------------------------------------------------------------------
 1 | const util = require('util')
 2 | const readFile = util.promisify(require('fs').readFile)
 3 | const writeFile = util.promisify(require('fs').writeFile)
 4 | const exec = util.promisify(require('child_process').exec)
 5 | const path = require('path')
 6 | const changeCase = require('change-case')
 7 | 
 8 | const packageJson = require('../../package.json')
 9 | const packageLock = require('../../package-lock.json')
10 | const manifest = require('../../public/manifest.json')
11 | 
12 | const rootDirname = path.resolve(`${__dirname}/../../`)
13 | 
14 | const confPath = `${rootDirname}/.env.example`
15 | const packageJsonPath = `${rootDirname}/package.json`
16 | const packageLockPath = `${rootDirname}/package-lock.json`
17 | const manifestPath = `${rootDirname}/public/manifest.json`
18 | 
19 | const processPackageJson = async newProjectName => {
20 |   packageJson.name = changeCase.paramCase(newProjectName)
21 |   return writeFile(packageJsonPath, JSON.stringify(packageJson))
22 | }
23 | 
24 | const processPackageLock = async newProjectName => {
25 |   packageLock.name = changeCase.paramCase(newProjectName)
26 |   return writeFile(packageLockPath, JSON.stringify(packageLock))
27 | }
28 | 
29 | const processManifest = async (newProjectName, newProjectShortName) => {
30 |   manifest.name = newProjectName
31 |   manifest.short_name = newProjectShortName
32 |   return writeFile(manifestPath, JSON.stringify(manifest))
33 | }
34 | 
35 | const processConfig = async (newProjectName, newProjectShortName) => {
36 |   const content = await readFile(confPath, 'utf-8')
37 |   const newContent = content
38 |     .replace(/Bento Starter/, newProjectName)
39 |     .replace(/Bento/, newProjectShortName)
40 |   return writeFile(confPath, newContent)
41 | }
42 | 
43 | module.exports = async (newProjectName, newProjectShortName) => {
44 |   await Promise.all([
45 |     processPackageJson(newProjectName),
46 |     processPackageLock(newProjectName),
47 |     processManifest(newProjectName, newProjectShortName),
48 |     processConfig(newProjectName, newProjectShortName)
49 |   ])
50 |   return exec('npm run prettier:format-all')
51 | }
52 | 


--------------------------------------------------------------------------------
/src/router/index.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue'
 2 | import Router from 'vue-router'
 3 | import Head from 'vue-head'
 4 | import Home from '@/views/Home'
 5 | import CheckLogin from '@/views/CheckLogin'
 6 | import { isNil } from 'lodash'
 7 | import store from '@/store'
 8 | 
 9 | Vue.use(Router)
10 | 
11 | /* If you don't know about VueHead, please refer to https://github.com/ktquez/vue-head */
12 | 
13 | Vue.use(Head, {
14 |   complement: process.env.VUE_APP_TITLE
15 | })
16 | 
17 | /* If you don't know about VueRouter, please refer to https://router.vuejs.org/ */
18 | 
19 | const router = new Router({
20 |   mode: 'history',
21 |   base: process.env.BASE_URL,
22 |   routes: [
23 |     {
24 |       path: '/home',
25 |       name: 'home',
26 |       component: Home,
27 |       meta: {
28 |         authNotRequired: true
29 |       }
30 |     },
31 |     {
32 |       path: '/check-login',
33 |       name: 'check-login',
34 |       component: CheckLogin,
35 |       meta: {
36 |         authNotRequired: true
37 |       }
38 |     },
39 |     {
40 |       path: '/login',
41 |       name: 'login',
42 |       component: () =>
43 |         import(/* webpackChunkName: "client-chunk-login" */ '@/views/Login.vue'),
44 |       meta: {
45 |         authNotRequired: true
46 |       }
47 |     },
48 |     {
49 |       path: '/products',
50 |       name: 'products',
51 |       component: () =>
52 |         import(/* webpackChunkName: "client-chunk-products" */ '@/views/Products.vue')
53 |     },
54 |     {
55 |       path: '/products/:id',
56 |       name: 'product',
57 |       props: true,
58 |       component: () =>
59 |         import(/* webpackChunkName: "client-chunk-product-details" */ '@/views/Product.vue')
60 |     },
61 |     { path: '*', redirect: '/home' }
62 |   ]
63 | })
64 | 
65 | /**
66 |  * Handle user redirections
67 |  */
68 | // eslint-disable-next-line consistent-return
69 | router.beforeEach((to, from, next) => {
70 |   if (
71 |     !(to.meta && to.meta.authNotRequired) &&
72 |     isNil(store.state.authentication.user)
73 |   ) {
74 |     const path =
75 |       store.state.authentication.user === null ? '/login' : '/check-login'
76 |     return next(`${path}?redirectUrl=${to.path}`)
77 |   }
78 |   next()
79 | })
80 | 
81 | export default router
82 | 


--------------------------------------------------------------------------------
/internals/helpers/git-helper.js:
--------------------------------------------------------------------------------
 1 | const util = require('util')
 2 | const exec = util.promisify(require('child_process').exec)
 3 | const shell = require('shelljs')
 4 | const rimraf = util.promisify(require('rimraf'))
 5 | 
 6 | /**
 7 |  * Checks if we are under Git version control
 8 |  * @returns {Promise<boolean>}
 9 |  */
10 | async function hasGitRepository() {
11 |   try {
12 |     const result = await exec('git status')
13 |     return !result.stderr
14 |   } catch (err) {
15 |     return false
16 |   }
17 | }
18 | 
19 | /**
20 |  * Checks if this is a clone from our repo
21 |  * @returns {Promise<any>}
22 |  */
23 | async function checkIfRepositoryIsAClone() {
24 |   const { stdout } = await exec('git remote -v')
25 | 
26 |   const isClonedRepo = stdout
27 |     .split(/\r?\n/)
28 |     .map(line => line.trim())
29 |     .filter(line => line.startsWith('origin'))
30 |     .filter(line => /kefranabg\/bento-starter\.git/.test(line)).length
31 | 
32 |   return !!isClonedRepo
33 | }
34 | 
35 | /**
36 |  * Checks if we are under Git version control and if this is a clone of our repository.
37 |  * @returns {Promise<boolean>}
38 |  */
39 | async function checkIfRepositoryIsCleanable() {
40 |   const hasGitRepo = await hasGitRepository()
41 |   return hasGitRepo && (await checkIfRepositoryIsAClone())
42 | }
43 | 
44 | /**
45 |  * Remove the current Git repository
46 |  * @returns {Promise<any>}
47 |  */
48 | async function removeGitRepository() {
49 |   return rimraf('.git')
50 | }
51 | 
52 | /**
53 |  * Initialize a new Git repository
54 |  * @returns {Promise<any>}
55 |  */
56 | async function initGitRepository() {
57 |   return exec('git init')
58 | }
59 | 
60 | /**
61 |  * Do initial commit
62 |  * @returns {Promise<any>}
63 |  */
64 | async function doInitalCommit() {
65 |   return exec('git add . && git commit -m ":tada: Initial commit"')
66 | }
67 | 
68 | /**
69 |  * Change the origin of the git repository
70 |  * @param {String} origin
71 |  */
72 | async function changeOrigin(origin) {
73 |   return exec(`git remote add origin ${origin}`)
74 | }
75 | 
76 | module.exports = {
77 |   initGitRepository,
78 |   hasGitRepository,
79 |   checkIfRepositoryIsAClone,
80 |   checkIfRepositoryIsCleanable,
81 |   removeGitRepository,
82 |   doInitalCommit,
83 |   changeOrigin
84 | }
85 | 


--------------------------------------------------------------------------------
/src/App.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div id="app">
 3 |     <nav-bar></nav-bar>
 4 |     <div class="main-wrapper">
 5 |       <router-view />
 6 |     </div>
 7 | 
 8 |     <new-content-available-toastr
 9 |       v-if="newContentAvailable"
10 |       class="new-content-available-toastr"
11 |       :refreshing-app="refreshingApp"
12 |       @refresh="serviceWorkerSkipWaiting"
13 |     ></new-content-available-toastr>
14 |     <apple-add-to-home-screen-modal
15 |       v-if="showAddToHomeScreenModalForApple"
16 |       class="apple-add-to-home-screen-modal"
17 |       @close="closeAddToHomeScreenModalForApple(false)"
18 |     >
19 |     </apple-add-to-home-screen-modal>
20 |   </div>
21 | </template>
22 | <script>
23 | import NavBar from '@/components/NavBar'
24 | import NewContentAvailableToastr from '@/components/NewContentAvailableToastr'
25 | import AppleAddToHomeScreenModal from '@/components/AppleAddToHomeScreenModal'
26 | import { mapState, mapActions, mapGetters } from 'vuex'
27 | 
28 | export default {
29 |   components: { NavBar, NewContentAvailableToastr, AppleAddToHomeScreenModal },
30 |   computed: {
31 |     ...mapGetters('app', ['newContentAvailable']),
32 |     ...mapState('app', ['showAddToHomeScreenModalForApple', 'refreshingApp'])
33 |   },
34 |   methods: mapActions('app', [
35 |     'closeAddToHomeScreenModalForApple',
36 |     'serviceWorkerSkipWaiting'
37 |   ])
38 | }
39 | </script>
40 | 
41 | <style lang="scss">
42 | body {
43 |   margin: 0;
44 | 
45 |   a {
46 |     font-weight: 500;
47 |     text-decoration: none;
48 |   }
49 | 
50 |   #app {
51 |     font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
52 |       Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
53 |     -webkit-font-smoothing: antialiased;
54 |     -moz-osx-font-smoothing: grayscale;
55 |     font-size: 16px;
56 |     color: #2c3e50;
57 | 
58 |     .new-content-available-toastr {
59 |       position: absolute;
60 |       bottom: 10px;
61 |       right: 10px;
62 |     }
63 | 
64 |     .apple-add-to-home-screen-modal {
65 |       position: absolute;
66 |       bottom: 0;
67 |       right: 0;
68 |       top: 0;
69 |       left: 0;
70 |       height: fit-content;
71 |       width: fit-content;
72 |       margin: auto;
73 |       z-index: 1000;
74 |     }
75 | 
76 |     .main-wrapper {
77 |       margin-top: 3.6rem;
78 |       padding: 20px;
79 | 
80 |       .page-wrapper {
81 |         width: 60%;
82 |         margin: auto;
83 | 
84 |         @media screen and (max-width: 1000px) {
85 |           width: 100%;
86 |         }
87 |       }
88 |     }
89 |   }
90 | }
91 | </style>
92 | 


--------------------------------------------------------------------------------
/src/components/AppleAddToHomeScreenModal.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div>
  3 |     <div class="modal-wrapper">
  4 |       <div class="close" @click="$emit('close')"></div>
  5 |       <div class="main-content">
  6 |         <img class="app-logo" src="@/assets/logo.png" />
  7 |         <h3 class="title">Install {{ appTitle }}</h3>
  8 |         <p class="description">
  9 |           Install this application to your home screen for quickly and easy
 10 |           access when you're on the go.
 11 |         </p>
 12 |       </div>
 13 | 
 14 |       <div class="footer">
 15 |         Just tap
 16 |         <img
 17 |           class="apple-navigation-action-img"
 18 |           src="@/assets/img/apple-navigation-action.png"
 19 |         />then 'Add to Home Screen'
 20 |       </div>
 21 |     </div>
 22 |   </div>
 23 | </template>
 24 | 
 25 | <script>
 26 | import { mapState } from 'vuex'
 27 | 
 28 | export default {
 29 |   computed: mapState('app', ['appTitle'])
 30 | }
 31 | </script>
 32 | 
 33 | <style lang="scss" scoped>
 34 | .modal-wrapper {
 35 |   box-shadow: 0px 0px 20px 0px #656565;
 36 |   margin: 30px;
 37 |   background: white;
 38 |   position: relative;
 39 | 
 40 |   .close {
 41 |     position: absolute;
 42 |     right: 10px;
 43 |     top: 10px;
 44 |     width: 21px;
 45 |     height: 21px;
 46 |     opacity: 0.3;
 47 |   }
 48 | 
 49 |   .close:hover {
 50 |     opacity: 1;
 51 |   }
 52 | 
 53 |   .close:before,
 54 |   .close:after {
 55 |     position: absolute;
 56 |     left: 8px;
 57 |     content: ' ';
 58 |     height: 22px;
 59 |     width: 2px;
 60 |     background-color: #333;
 61 |   }
 62 | 
 63 |   .close:before {
 64 |     transform: rotate(45deg);
 65 |   }
 66 | 
 67 |   .close:after {
 68 |     transform: rotate(-45deg);
 69 |   }
 70 | 
 71 |   .main-content {
 72 |     padding: 20px;
 73 |     display: flex;
 74 |     flex-direction: column;
 75 |     justify-content: center;
 76 |     align-items: center;
 77 | 
 78 |     .app-logo {
 79 |       max-width: 50px;
 80 |       margin-bottom: 10px;
 81 |     }
 82 | 
 83 |     .title {
 84 |       margin: 5px 0;
 85 |       text-align: center;
 86 |     }
 87 | 
 88 |     .description {
 89 |       margin: 5px 0;
 90 |       text-align: center;
 91 |     }
 92 |   }
 93 | 
 94 |   .footer {
 95 |     display: flex;
 96 |     justify-content: center;
 97 |     align-items: center;
 98 |     padding: 10px;
 99 |     background-color: #f9f9f9;
100 |     font-size: 12px;
101 | 
102 |     .apple-navigation-action-img {
103 |       max-width: 15px;
104 |       margin: 0 10px;
105 |     }
106 |   }
107 | }
108 | </style>
109 | 


--------------------------------------------------------------------------------
/tests/unit/store/app/app.mutations.spec.js:
--------------------------------------------------------------------------------
 1 | import mutations from '@/store/app/app.mutations'
 2 | 
 3 | describe('app module mutation', () => {
 4 |   describe('setNetworkOnline', () => {
 5 |     it('should set network online state to the value given in parameter', () => {
 6 |       const state = {
 7 |         networkOnLine: false,
 8 |         SWRegistrationForNewContent: null,
 9 |         showAddToHomeScreenModalForApple: false,
10 |         refreshingApp: false
11 |       }
12 | 
13 |       mutations.setNetworkOnline(state, true)
14 | 
15 |       expect(state).toEqual({
16 |         networkOnLine: true,
17 |         SWRegistrationForNewContent: null,
18 |         showAddToHomeScreenModalForApple: false,
19 |         refreshingApp: false
20 |       })
21 |     })
22 |   })
23 | 
24 |   describe('setSWRegistrationForNewContent', () => {
25 |     it('should set new content available state to the value given in parameter', () => {
26 |       const state = {
27 |         networkOnLine: false,
28 |         SWRegistrationForNewContent: null,
29 |         showAddToHomeScreenModalForApple: false,
30 |         refreshingApp: false
31 |       }
32 |       const newSW = { id: 'sw' }
33 | 
34 |       mutations.setSWRegistrationForNewContent(state, newSW)
35 | 
36 |       expect(state).toEqual({
37 |         networkOnLine: false,
38 |         SWRegistrationForNewContent: newSW,
39 |         showAddToHomeScreenModalForApple: false,
40 |         refreshingApp: false
41 |       })
42 |     })
43 |   })
44 | 
45 |   describe('setShowAddToHomeScreenModalForApple', () => {
46 |     it('should set show add to home screen modal for apple state to the value given in parameter', () => {
47 |       const state = {
48 |         networkOnLine: false,
49 |         SWRegistrationForNewContent: null,
50 |         showAddToHomeScreenModalForApple: false,
51 |         refreshingApp: false
52 |       }
53 | 
54 |       mutations.setShowAddToHomeScreenModalForApple(state, true)
55 | 
56 |       expect(state).toEqual({
57 |         networkOnLine: false,
58 |         SWRegistrationForNewContent: null,
59 |         showAddToHomeScreenModalForApple: true,
60 |         refreshingApp: false
61 |       })
62 |     })
63 |   })
64 | 
65 |   describe('refreshingApp', () => {
66 |     it('should set refreshingApp state to the value given in parameter', () => {
67 |       const state = {
68 |         networkOnLine: false,
69 |         SWRegistrationForNewContent: null,
70 |         showAddToHomeScreenModalForApple: false,
71 |         refreshingApp: false
72 |       }
73 | 
74 |       mutations.setRefreshingApp(state, true)
75 | 
76 |       expect(state).toEqual({
77 |         networkOnLine: false,
78 |         SWRegistrationForNewContent: null,
79 |         showAddToHomeScreenModalForApple: false,
80 |         refreshingApp: true
81 |       })
82 |     })
83 |   })
84 | })
85 | 


--------------------------------------------------------------------------------
/tests/unit/store/products/products.mutations.spec.js:
--------------------------------------------------------------------------------
 1 | import mutations from '@/store/products/products.mutations'
 2 | import { cloneDeep } from 'lodash'
 3 | 
 4 | const product1 = { id: 1, name: 'product1' }
 5 | const product2 = { id: 2, name: 'product2' }
 6 | const baseState = {
 7 |   products: [product1, product2],
 8 |   productNameToCreate: '',
 9 |   productDeletionPending: [1],
10 |   productCreationPending: false
11 | }
12 | 
13 | describe('products module mutations', () => {
14 |   describe('setProductNameToCreate', () => {
15 |     it('should set product name to create correctly', () => {
16 |       const state = cloneDeep(baseState)
17 |       mutations.setProductNameToCreate(state, 'toto')
18 |       expect(state).toEqual({
19 |         ...baseState,
20 |         productNameToCreate: 'toto'
21 |       })
22 |     })
23 |   })
24 | 
25 |   describe('setProducts', () => {
26 |     it('should set products correctly', () => {
27 |       const state = { ...cloneDeep(baseState), products: [] }
28 |       mutations.setProducts(state, [product2, product1])
29 |       expect(state).toEqual({
30 |         ...baseState,
31 |         products: [product2, product1]
32 |       })
33 |     })
34 |   })
35 | 
36 |   describe('addProducts', () => {
37 |     it('should add product correctly', () => {
38 |       const state = { ...cloneDeep(baseState), products: [] }
39 |       mutations.addProduct(state, product1)
40 |       expect(state).toEqual({
41 |         ...baseState,
42 |         products: [product1]
43 |       })
44 |     })
45 |   })
46 | 
47 |   describe('removeProductById', () => {
48 |     it('should remove product correctly', () => {
49 |       const state = cloneDeep(baseState)
50 |       mutations.removeProductById(state, 2)
51 |       expect(state).toEqual({
52 |         ...baseState,
53 |         products: [product1]
54 |       })
55 |     })
56 |   })
57 | 
58 |   describe('addProductDeletionPending', () => {
59 |     it('should mark product as deletion correctly', () => {
60 |       const state = cloneDeep(baseState)
61 |       mutations.addProductDeletionPending(state, 2)
62 |       expect(state).toEqual({
63 |         ...baseState,
64 |         productDeletionPending: [1, 2]
65 |       })
66 |     })
67 |   })
68 | 
69 |   describe('removeProductDeletionPending', () => {
70 |     it('should unmark product as deletion correctly', () => {
71 |       const state = cloneDeep(baseState)
72 |       mutations.removeProductDeletionPending(state, 1)
73 |       expect(state).toEqual({
74 |         ...baseState,
75 |         productDeletionPending: []
76 |       })
77 |     })
78 |   })
79 | 
80 |   describe('setProductCreationPending', () => {
81 |     it('should set product creation pending correctly', () => {
82 |       const state = cloneDeep(baseState)
83 |       mutations.setProductCreationPending(state, true)
84 |       expect(state).toEqual({
85 |         ...baseState,
86 |         productCreationPending: true
87 |       })
88 |     })
89 |   })
90 | })
91 | 


--------------------------------------------------------------------------------
/src/views/Login.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div class="page-wrapper">
  3 |     <h1 class="login-page-title">Login page</h1>
  4 | 
  5 |     <!-- Loader -->
  6 |     <div v-show="user === undefined" data-test="loader">Authenticating...</div>
  7 | 
  8 |     <!-- Offline instruction -->
  9 |     <div v-show="!networkOnLine" data-test="offline-instruction">
 10 |       Please check your connection, login feature is not available offline.
 11 |     </div>
 12 | 
 13 |     <p v-if="loginError">{{ loginError }}</p>
 14 |     <!-- Auth UI -->
 15 |     <div
 16 |       v-show="user !== undefined && !user && networkOnLine"
 17 |       data-test="login-btn"
 18 |       class="login-btn"
 19 |       @click="login"
 20 |     >
 21 |       Login with google
 22 |     </div>
 23 |   </div>
 24 | </template>
 25 | 
 26 | <script>
 27 | import { mapState, mapMutations } from 'vuex'
 28 | import { isNil } from 'lodash'
 29 | import firebase from 'firebase/app'
 30 | import { desktop as isDekstop } from 'is_js'
 31 | 
 32 | export default {
 33 |   data: () => ({ loginError: null }),
 34 |   head() {
 35 |     return {
 36 |       title: {
 37 |         inner: 'Login'
 38 |       },
 39 |       meta: [
 40 |         {
 41 |           name: 'description',
 42 |           content: `Sign in or sign up to ${this.appTitle}`,
 43 |           id: 'desc'
 44 |         }
 45 |       ]
 46 |     }
 47 |   },
 48 |   computed: {
 49 |     ...mapState('authentication', ['user']),
 50 |     ...mapState('app', ['networkOnLine', 'appTitle'])
 51 |   },
 52 |   watch: {
 53 |     user: {
 54 |       handler(user) {
 55 |         if (!isNil(user)) {
 56 |           const redirectUrl = isNil(this.$route.query.redirectUrl)
 57 |             ? '/products'
 58 |             : this.$route.query.redirectUrl
 59 |           this.$router.push(redirectUrl)
 60 |         }
 61 |       },
 62 |       immediate: true
 63 |     }
 64 |   },
 65 |   methods: {
 66 |     ...mapMutations('authentication', ['setUser']),
 67 |     async login() {
 68 |       this.loginError = null
 69 |       const provider = new firebase.auth.GoogleAuthProvider()
 70 |       this.setUser(undefined)
 71 | 
 72 |       try {
 73 |         // Firebase signin with popup is faster than redirect
 74 |         // but we can't use it on mobile because it's not well supported
 75 |         // when app is running as standalone on ios & android
 76 |         // eslint-disable-next-line no-unused-expressions
 77 |         isDekstop()
 78 |           ? await firebase.auth().signInWithPopup(provider)
 79 |           : await firebase.auth().signInWithRedirect(provider)
 80 |       } catch (err) {
 81 |         this.loginError = err
 82 |         this.setUser(null)
 83 |       }
 84 |     }
 85 |   }
 86 | }
 87 | </script>
 88 | 
 89 | <style lang="scss" scoped>
 90 | @import '@/theme/variables.scss';
 91 | 
 92 | .page-wrapper {
 93 |   display: flex;
 94 |   justify-content: center;
 95 |   flex-direction: column;
 96 |   align-items: center;
 97 | 
 98 |   .login-page-title {
 99 |     text-align: center;
100 |   }
101 | 
102 |   .login-btn {
103 |     margin-top: 20px;
104 |     cursor: pointer;
105 |     padding: 5px 20px;
106 |     border: 1px solid;
107 |     display: inline-block;
108 |     border-radius: 3px;
109 |     border-color: #2c3e50;
110 | 
111 |     &:hover {
112 |       color: $vue-color;
113 |       border-color: $vue-color;
114 |     }
115 |   }
116 | }
117 | </style>
118 | 


--------------------------------------------------------------------------------
/docs/CODE_OF_CONDUCT.md:
--------------------------------------------------------------------------------
 1 | # Contributor Covenant Code of Conduct
 2 | 
 3 | ## Our Pledge
 4 | 
 5 | In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
 6 | 
 7 | ## Our Standards
 8 | 
 9 | Examples of behavior that contributes to creating a positive environment include:
10 | 
11 | - Using welcoming and inclusive language
12 | - Being respectful of differing viewpoints and experiences
13 | - Gracefully accepting constructive criticism
14 | - Focusing on what is best for the community
15 | - Showing empathy towards other community members
16 | 
17 | Examples of unacceptable behavior by participants include:
18 | 
19 | - The use of sexualized language or imagery and unwelcome sexual attention or advances
20 | - Trolling, insulting/derogatory comments, and personal or political attacks
21 | - Public or private harassment
22 | - Publishing others' private information, such as a physical or electronic address, without explicit permission
23 | - Other conduct which could reasonably be considered inappropriate in a professional setting
24 | 
25 | ## Our Responsibilities
26 | 
27 | Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
28 | 
29 | Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
30 | 
31 | ## Scope
32 | 
33 | This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
34 | 
35 | ## Enforcement
36 | 
37 | Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at franck.abgrall@zenika.com or thomas.betous@zenika.com. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
38 | 
39 | Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
40 | 
41 | ## Attribution
42 | 
43 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version]
44 | 
45 | [homepage]: http://contributor-covenant.org
46 | [version]: http://contributor-covenant.org/version/1/4/
47 | 


--------------------------------------------------------------------------------
/tests/unit/store/authentication/authentication.actions.spec.js:
--------------------------------------------------------------------------------
  1 | import { createNewUserFromFirebaseAuthUser } from '@/misc/helpers'
  2 | import actions from '@/store/authentication/authentication.actions'
  3 | import router from '@/router'
  4 | 
  5 | const mockUsersDbRead = jest.fn()
  6 | jest.mock('@/firebase/users-db', () =>
  7 |   jest.fn().mockImplementation(() => ({ read: mockUsersDbRead }))
  8 | )
  9 | jest.mock('@/misc/helpers', () => ({
 10 |   createNewUserFromFirebaseAuthUser: jest.fn()
 11 | }))
 12 | 
 13 | const commit = jest.fn()
 14 | const dispatch = jest.fn()
 15 | const user = {
 16 |   displayName: 'Robert Bob',
 17 |   photoUrl: 'https://my-awesome-photo.com',
 18 |   email: 'robert.bob@mail.com'
 19 | }
 20 | 
 21 | afterEach(() => {
 22 |   commit.mockReset()
 23 |   dispatch.mockReset()
 24 |   mockUsersDbRead.mockReset()
 25 |   createNewUserFromFirebaseAuthUser.mockReset()
 26 | })
 27 | 
 28 | describe('authentication module action', () => {
 29 |   describe('login', () => {
 30 |     const firebaseUser = { providerData: [user] }
 31 | 
 32 |     it('should set user with existing user', async () => {
 33 |       mockUsersDbRead.mockResolvedValue(Promise.resolve(user))
 34 |       await actions.login({ commit, dispatch }, firebaseUser)
 35 | 
 36 |       expect(commit).toHaveBeenCalledWith('setUser', user)
 37 |     })
 38 | 
 39 |     it('should set user with a new created user', async () => {
 40 |       const newCreatedUser = { id: 1 }
 41 |       mockUsersDbRead.mockResolvedValue(Promise.resolve(undefined))
 42 |       createNewUserFromFirebaseAuthUser.mockImplementation(() =>
 43 |         Promise.resolve(newCreatedUser)
 44 |       )
 45 | 
 46 |       await actions.login({ commit, dispatch }, firebaseUser)
 47 | 
 48 |       expect(commit).toHaveBeenCalledWith('setUser', newCreatedUser)
 49 |     })
 50 | 
 51 |     it('should get products for the user', async () => {
 52 |       mockUsersDbRead.mockResolvedValue(Promise.resolve(user))
 53 | 
 54 |       await actions.login({ commit, dispatch }, firebaseUser)
 55 | 
 56 |       expect(dispatch).toHaveBeenCalledWith('products/getUserProducts', null, {
 57 |         root: true
 58 |       })
 59 |     })
 60 |   })
 61 | 
 62 |   describe('logout', () => {
 63 |     const push = jest.spyOn(router, 'push').mockImplementation()
 64 | 
 65 |     beforeEach(() => {
 66 |       router.app = { $route: { meta: { authNotRequired: false } } }
 67 |     })
 68 | 
 69 |     afterEach(() => {
 70 |       push.mockClear()
 71 |     })
 72 | 
 73 |     it('should set the user to null', async () => {
 74 |       await actions.logout({ commit, dispatch })
 75 | 
 76 |       expect(commit).toHaveBeenCalledWith('setUser', null)
 77 |     })
 78 | 
 79 |     it('should set products to null', async () => {
 80 |       await actions.logout({ commit, dispatch })
 81 | 
 82 |       expect(commit).toHaveBeenCalledWith('products/setProducts', null, {
 83 |         root: true
 84 |       })
 85 |     })
 86 | 
 87 |     it('should push login view if the current route is not authorized', async () => {
 88 |       jest.spyOn(router, 'push')
 89 | 
 90 |       await actions.logout({ commit, dispatch })
 91 | 
 92 |       expect(push).toHaveBeenCalledWith('/login')
 93 |     })
 94 | 
 95 |     it('should not push any page if the current page is authorized', async () => {
 96 |       router.app = { $route: { meta: { authNotRequired: true } } }
 97 |       jest.spyOn(router, 'push')
 98 | 
 99 |       await actions.logout({ commit, dispatch })
100 | 
101 |       expect(push).not.toHaveBeenCalled()
102 |     })
103 |   })
104 | })
105 | 


--------------------------------------------------------------------------------
/.circleci/config.yml:
--------------------------------------------------------------------------------
  1 | version: 2.1
  2 | 
  3 | executors:
  4 |   default-executor:
  5 |     docker:
  6 |       - image: cypress/base:10
  7 | 
  8 | jobs:
  9 |   install-dependencies:
 10 |     executor: default-executor
 11 |     steps:
 12 |       - checkout
 13 | 
 14 |       - restore_cache:
 15 |           keys:
 16 |             - v2-deps-{{ checksum "package-lock.json" }}
 17 |             - v2-deps
 18 | 
 19 |       - run:
 20 |           name: 'Install dependencies'
 21 |           command: npm ci
 22 | 
 23 |       - save_cache:
 24 |           paths:
 25 |             - ~/.npm
 26 |             - ~/.cache
 27 |           key: v2-deps-{{ checksum "package-lock.json" }}
 28 | 
 29 |       - persist_to_workspace:
 30 |           root: .
 31 |           paths: .
 32 | 
 33 |   check-prettier:
 34 |     executor: default-executor
 35 |     steps:
 36 |       - attach_workspace:
 37 |           at: .
 38 |       - run:
 39 |           name: 'Run prettier check on project files'
 40 |           command: npm run prettier:check
 41 | 
 42 |   check-linter:
 43 |     executor: default-executor
 44 |     steps:
 45 |       - attach_workspace:
 46 |           at: .
 47 |       - run:
 48 |           name: 'Run linter'
 49 |           command: npm run lint
 50 | 
 51 |   run-unit-tests:
 52 |     executor: default-executor
 53 |     steps:
 54 |       - attach_workspace:
 55 |           at: .
 56 |       - run:
 57 |           name: 'Run unit tests'
 58 |           command: npm run test:unit
 59 | 
 60 |   run-e2e-tests:
 61 |     executor: default-executor
 62 |     steps:
 63 |       - attach_workspace:
 64 |           at: .
 65 |       - restore_cache:
 66 |           keys:
 67 |             - v2-deps-{{ checksum "package-lock.json" }}
 68 |             - v2-deps
 69 |       - run:
 70 |           name: 'Run e2e tests'
 71 |           command: npm run test:e2e:headless
 72 | 
 73 |   build:
 74 |     executor: default-executor
 75 |     steps:
 76 |       - attach_workspace:
 77 |           at: .
 78 |       - run:
 79 |           name: 'Build'
 80 |           command: npm run build
 81 |       - persist_to_workspace:
 82 |           root: .
 83 |           paths: .
 84 | 
 85 |   check-bundles-sizes:
 86 |     executor: default-executor
 87 |     steps:
 88 |       - attach_workspace:
 89 |           at: .
 90 |       - run:
 91 |           name: 'Check bundles sizes'
 92 |           command: npm run bundlesize
 93 | 
 94 |   deploy:
 95 |     executor: default-executor
 96 |     steps:
 97 |       - attach_workspace:
 98 |           at: .
 99 |       - run:
100 |           name: 'Firebase deploy'
101 |           command: |
102 |             if [[ "$CIRCLE_BRANCH" == "master" ]]; then
103 |               npm run firebase:deploy:ci
104 |             fi
105 | 
106 | workflows:
107 |   version: 2
108 |   build-and-deploy:
109 |     jobs:
110 |       - install-dependencies
111 |       - check-prettier:
112 |           requires:
113 |             - install-dependencies
114 |       - check-linter:
115 |           requires:
116 |             - install-dependencies
117 |       - run-unit-tests:
118 |           requires:
119 |             - install-dependencies
120 |       - run-e2e-tests:
121 |           requires:
122 |             - install-dependencies
123 |       - build:
124 |           requires:
125 |             - check-prettier
126 |             - check-linter
127 |             - run-unit-tests
128 |             - run-e2e-tests
129 |       - check-bundles-sizes:
130 |           requires:
131 |             - build
132 |       - deploy:
133 |           requires:
134 |             - check-bundles-sizes


--------------------------------------------------------------------------------
/src/firebase/generic-db.js:
--------------------------------------------------------------------------------
  1 | import { isNil, keys, cloneDeep } from 'lodash'
  2 | import firebase from 'firebase/app'
  3 | 
  4 | import firestore from './async-firestore'
  5 | 
  6 | export default class GenericDB {
  7 |   constructor(collectionPath) {
  8 |     this.collectionPath = collectionPath
  9 |   }
 10 | 
 11 |   /**
 12 |    * Create a document in the collection
 13 |    * @param data
 14 |    * @param id
 15 |    */
 16 |   async create(data, id = null) {
 17 |     const collectionRef = (await firestore()).collection(this.collectionPath)
 18 |     const serverTimestamp = firebase.firestore.FieldValue.serverTimestamp()
 19 | 
 20 |     const dataToCreate = {
 21 |       ...data,
 22 |       createTimestamp: serverTimestamp,
 23 |       updateTimestamp: serverTimestamp
 24 |     }
 25 | 
 26 |     const createPromise = isNil(id)
 27 |       ? // Create doc with generated id
 28 |         collectionRef.add(dataToCreate).then(doc => doc.id)
 29 |       : // Create doc with custom id
 30 |         collectionRef
 31 |           .doc(id)
 32 |           .set(dataToCreate)
 33 |           .then(() => id)
 34 | 
 35 |     const docId = await createPromise
 36 | 
 37 |     return {
 38 |       id: docId,
 39 |       ...data,
 40 |       createTimestamp: new Date(),
 41 |       updateTimestamp: new Date()
 42 |     }
 43 |   }
 44 | 
 45 |   /**
 46 |    * Read a document in the collection
 47 |    * @param id
 48 |    */
 49 |   async read(id) {
 50 |     const result = await (await firestore())
 51 |       .collection(this.collectionPath)
 52 |       .doc(id)
 53 |       .get()
 54 | 
 55 |     const data = result.exists ? result.data() : null
 56 | 
 57 |     if (isNil(data)) return null
 58 | 
 59 |     this.convertObjectTimestampPropertiesToDate(data)
 60 |     return { id, ...data }
 61 |   }
 62 | 
 63 |   /**
 64 |    * Read all documents in the collection following constraints
 65 |    * @param constraints
 66 |    */
 67 |   async readAll(constraints = null) {
 68 |     const collectionRef = (await firestore()).collection(this.collectionPath)
 69 |     let query = collectionRef
 70 | 
 71 |     if (constraints) {
 72 |       constraints.forEach(constraint => {
 73 |         query = query.where(...constraint)
 74 |       })
 75 |     }
 76 | 
 77 |     const formatResult = result =>
 78 |       result.docs.map(ref =>
 79 |         this.convertObjectTimestampPropertiesToDate({
 80 |           id: ref.id,
 81 |           ...ref.data()
 82 |         })
 83 |       )
 84 | 
 85 |     return query.get().then(formatResult)
 86 |   }
 87 | 
 88 |   /**
 89 |    * Update a document in the collection
 90 |    * @param data
 91 |    */
 92 |   async update(data) {
 93 |     const { id } = data
 94 |     const clonedData = cloneDeep(data)
 95 |     delete clonedData.id
 96 | 
 97 |     await (await firestore())
 98 |       .collection(this.collectionPath)
 99 |       .doc(id)
100 |       .update({
101 |         ...clonedData,
102 |         updateTimestamp: firebase.firestore.FieldValue.serverTimestamp()
103 |       })
104 | 
105 |     return id
106 |   }
107 | 
108 |   /**
109 |    * Delete a document in the collection
110 |    * @param id
111 |    */
112 |   async delete(id) {
113 |     return (await firestore())
114 |       .collection(this.collectionPath)
115 |       .doc(id)
116 |       .delete()
117 |   }
118 | 
119 |   /**
120 |    * Convert all object Timestamp properties to date
121 |    * @param obj
122 |    */
123 |   convertObjectTimestampPropertiesToDate(obj) {
124 |     const newObj = {}
125 | 
126 |     keys(obj)
127 |       .filter(prop => obj[prop] instanceof Object)
128 |       .forEach(prop => {
129 |         if (obj[prop] instanceof firebase.firestore.Timestamp) {
130 |           newObj[prop] = obj[prop].toDate()
131 |         } else {
132 |           this.convertObjectTimestampPropertiesToDate(obj[prop])
133 |         }
134 |       })
135 | 
136 |     return {
137 |       ...obj,
138 |       ...newObj
139 |     }
140 |   }
141 | }
142 | 


--------------------------------------------------------------------------------
/public/img/icons/safari-pinned-tab.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
 3 |  "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
 4 | <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
 5 |  width="1136.000000pt" height="1136.000000pt" viewBox="0 0 1136.000000 1136.000000"
 6 |  preserveAspectRatio="xMidYMid meet">
 7 | <g transform="translate(0.000000,1136.000000) scale(0.100000,-0.100000)"
 8 | fill="#000000" stroke="none">
 9 | <path d="M5385 9314 c-139 -17 -159 -20 -300 -54 -50 -12 -122 -35 -160 -50
10 | -100 -42 -154 -67 -177 -82 -14 -10 -31 -18 -37 -18 -6 0 -11 -4 -11 -8 0 -4
11 | -14 -16 -31 -26 -17 -10 -52 -39 -78 -65 -43 -43 -184 -120 -323 -177 -27 -10
12 | -48 -22 -48 -26 0 -5 -5 -8 -12 -8 -11 0 -21 -4 -249 -113 -76 -36 -168 -80
13 | -205 -97 -38 -18 -105 -49 -149 -70 -195 -93 -277 -130 -286 -130 -5 0 -9 -4
14 | -9 -10 0 -5 -5 -10 -11 -10 -11 0 -55 -20 -209 -93 -185 -88 -316 -150 -390
15 | -184 -41 -20 -118 -56 -170 -81 -177 -84 -265 -125 -270 -127 -3 -1 -35 -16
16 | -73 -33 -37 -18 -72 -32 -77 -32 -6 0 -10 -4 -10 -10 0 -5 -4 -10 -9 -10 -5 0
17 | -43 -16 -84 -35 -41 -19 -80 -35 -86 -35 -6 0 -11 -3 -11 -7 0 -5 -21 -17 -48
18 | -27 -26 -11 -110 -50 -187 -87 -373 -178 -484 -229 -489 -226 -2 1 -12 -6 -22
19 | -15 -11 -9 -22 -17 -27 -17 -8 -1 -64 -26 -212 -97 -55 -26 -102 -48 -105 -49
20 | -20 -3 -148 -76 -209 -118 -88 -61 -212 -180 -267 -257 -38 -53 -114 -177
21 | -114 -186 0 -2 -9 -23 -19 -47 -27 -58 -60 -176 -67 -234 -3 -26 -7 -217 -9
22 | -423 -2 -206 -7 -494 -10 -640 -12 -510 -12 -602 1 -659 41 -175 136 -287 320
23 | -377 61 -29 116 -54 123 -54 6 0 11 -4 11 -10 0 -5 6 -10 13 -10 6 0 44 -15
24 | 82 -34 84 -41 228 -109 350 -166 50 -23 133 -63 185 -88 171 -81 225 -105 233
25 | -104 4 1 7 -3 7 -10 0 -6 3 -8 6 -5 4 4 19 -2 33 -12 14 -10 37 -22 51 -26 14
26 | -4 79 -34 145 -67 66 -32 121 -58 123 -58 1 0 50 -23 110 -51 147 -71 286
27 | -135 294 -138 4 -1 43 -19 85 -41 43 -21 107 -52 143 -68 36 -17 115 -53 175
28 | -82 61 -29 146 -69 190 -90 163 -77 253 -119 360 -170 61 -29 148 -70 195 -92
29 | 84 -39 148 -70 345 -163 55 -26 136 -65 180 -85 104 -49 259 -122 360 -170 44
30 | -21 121 -57 170 -80 50 -23 131 -61 180 -85 50 -23 134 -63 188 -89 53 -25
31 | 102 -46 107 -46 6 0 18 -4 28 -10 16 -9 57 -26 74 -29 4 -1 27 -9 50 -17 24
32 | -9 54 -18 68 -20 14 -3 36 -9 50 -13 14 -5 54 -14 90 -20 36 -6 79 -13 95 -16
33 | 105 -18 295 -23 430 -12 76 7 99 10 163 22 15 3 43 8 62 11 19 2 49 9 65 14
34 | 131 40 236 75 270 91 56 25 290 132 350 160 28 12 53 22 58 21 4 -1 7 3 7 9 0
35 | 5 4 8 9 5 5 -3 14 1 21 9 7 8 18 15 25 15 6 0 49 18 94 40 45 22 84 40 86 40
36 | 3 0 53 23 112 51 149 71 234 111 328 154 44 20 107 50 140 65 33 15 99 46 148
37 | 68 48 23 90 41 93 41 2 0 21 9 42 20 42 22 175 85 182 87 9 1 184 83 211 99
38 | 14 8 29 12 33 8 3 -3 6 -1 6 5 0 7 4 12 10 12 10 0 85 35 298 136 62 30 115
39 | 54 118 54 4 0 126 57 284 133 47 22 90 42 95 43 6 1 64 28 130 59 66 31 149
40 | 70 185 87 36 17 97 45 135 63 84 39 179 83 295 137 47 21 97 46 112 54 14 7
41 | 33 14 42 14 9 0 16 5 16 10 0 6 5 10 11 10 11 0 28 8 234 105 55 26 125 59
42 | 155 72 30 14 87 40 125 58 69 32 148 68 213 96 17 8 32 17 32 21 0 5 6 8 14 8
43 | 17 0 102 45 146 78 45 33 129 115 130 125 0 4 9 17 20 29 33 35 97 179 110
44 | 248 17 86 21 223 34 1220 2 139 9 253 16 279 22 82 -1 195 -53 257 -23 29 -99
45 | 99 -115 108 -10 5 -19 12 -22 15 -23 27 -185 110 -805 411 -328 159 -340 165
46 | -343 173 -2 4 -9 7 -15 7 -7 0 -50 19 -97 42 -47 23 -88 41 -92 40 -5 -1 -8 1
47 | -8 6 0 4 -15 13 -32 21 -18 8 -134 63 -258 124 -450 219 -495 241 -502 241 -4
48 | 1 -13 7 -19 14 -7 6 -16 12 -20 12 -4 0 -114 52 -244 115 -144 70 -238 122
49 | -241 133 -19 55 -58 123 -98 169 -47 52 -165 137 -217 155 -16 5 -29 14 -29
50 | 19 0 5 -7 9 -15 9 -8 0 -34 9 -58 19 -65 30 -209 71 -332 95 -47 9 -138 20
51 | -254 31 -35 3 -71 11 -79 18 -8 6 -17 11 -18 10 -2 -2 -96 42 -208 98 -194 95
52 | -204 101 -200 125 5 25 -14 94 -26 94 -3 0 -7 11 -8 24 -4 56 -75 178 -125
53 | 214 -10 8 -25 22 -35 31 -79 83 -343 195 -557 236 -38 7 -100 17 -130 21 -16
54 | 1 -48 6 -70 9 -76 12 -430 11 -530 -1z"/>
55 | </g>
56 | </svg>
57 | 


--------------------------------------------------------------------------------
/.all-contributorsrc:
--------------------------------------------------------------------------------
  1 | {
  2 |   "projectName": "bento-starter",
  3 |   "projectOwner": "kefranabg",
  4 |   "repoType": "github",
  5 |   "repoHost": "https://github.com",
  6 |   "files": [
  7 |     "README.md"
  8 |   ],
  9 |   "imageSize": 75,
 10 |   "commit": false,
 11 |   "commitConvention": "none",
 12 |   "contributors": [
 13 |     {
 14 |       "login": "tbetous",
 15 |       "name": "Thomas Betous",
 16 |       "avatar_url": "https://avatars3.githubusercontent.com/u/4435536?v=4",
 17 |       "profile": "https://github.com/tbetous",
 18 |       "contributions": [
 19 |         "code",
 20 |         "doc",
 21 |         "question",
 22 |         "ideas",
 23 |         "review",
 24 |         "maintenance"
 25 |       ]
 26 |     },
 27 |     {
 28 |       "login": "kefranabg",
 29 |       "name": "Franck Abgrall",
 30 |       "avatar_url": "https://avatars3.githubusercontent.com/u/9840435?v=4",
 31 |       "profile": "https://www.franck-abgrall.me/",
 32 |       "contributions": [
 33 |         "code",
 34 |         "doc",
 35 |         "question",
 36 |         "ideas",
 37 |         "review",
 38 |         "maintenance"
 39 |       ]
 40 |     },
 41 |     {
 42 |       "login": "Errorname",
 43 |       "name": "Thibaud Courtoison",
 44 |       "avatar_url": "https://avatars2.githubusercontent.com/u/6669733?v=4",
 45 |       "profile": "https://errorna.me",
 46 |       "contributions": [
 47 |         "doc"
 48 |       ]
 49 |     },
 50 |     {
 51 |       "login": "mbernardeau",
 52 |       "name": "Mathias Bernardeau",
 53 |       "avatar_url": "https://avatars0.githubusercontent.com/u/7049049?v=4",
 54 |       "profile": "https://github.com/mbernardeau",
 55 |       "contributions": [
 56 |         "code",
 57 |         "ideas"
 58 |       ]
 59 |     },
 60 |     {
 61 |       "login": "perkinsjr",
 62 |       "name": "James Perkins",
 63 |       "avatar_url": "https://avatars3.githubusercontent.com/u/45409975?v=4",
 64 |       "profile": "https://jamesperkins.io/",
 65 |       "contributions": [
 66 |         "code",
 67 |         "bug",
 68 |         "question"
 69 |       ]
 70 |     },
 71 |     {
 72 |       "login": "antoinecellier",
 73 |       "name": "Antoine CELLIER",
 74 |       "avatar_url": "https://avatars0.githubusercontent.com/u/5922848?v=4",
 75 |       "profile": "https://github.com/antoinecellier",
 76 |       "contributions": [
 77 |         "code"
 78 |       ]
 79 |     },
 80 |     {
 81 |       "login": "0xflotus",
 82 |       "name": "0xflotus",
 83 |       "avatar_url": "https://avatars3.githubusercontent.com/u/26602940?v=4",
 84 |       "profile": "https://github.com/0xflotus",
 85 |       "contributions": [
 86 |         "doc"
 87 |       ]
 88 |     },
 89 |     {
 90 |       "login": "GregoryBevan",
 91 |       "name": "Gr3gory B3van",
 92 |       "avatar_url": "https://avatars1.githubusercontent.com/u/4266007?v=4",
 93 |       "profile": "https://github.com/GregoryBevan",
 94 |       "contributions": [
 95 |         "ideas"
 96 |       ]
 97 |     },
 98 |     {
 99 |       "login": "RoyBkker",
100 |       "name": "Roy Bakker",
101 |       "avatar_url": "https://avatars2.githubusercontent.com/u/10207274?v=4",
102 |       "profile": "https://www.linkedin.com/pub/roy-bakker/41/aa7/335",
103 |       "contributions": [
104 |         "bug"
105 |       ]
106 |     },
107 |     {
108 |       "login": "NOtherDev",
109 |       "name": "Adam Bar",
110 |       "avatar_url": "https://avatars0.githubusercontent.com/u/1309057?v=4",
111 |       "profile": "https://adambar.pl",
112 |       "contributions": [
113 |         "ideas"
114 |       ]
115 |     },
116 |     {
117 |       "login": "6ones",
118 |       "name": "Chidindu Ogbonna ",
119 |       "avatar_url": "https://avatars3.githubusercontent.com/u/25098427?v=4",
120 |       "profile": "https://github.com/6ones",
121 |       "contributions": [
122 |         "code"
123 |       ]
124 |     },
125 |     {
126 |       "login": "VincentBourdeau",
127 |       "name": "Vincent Bourdeau",
128 |       "avatar_url": "https://avatars1.githubusercontent.com/u/8518122?v=4",
129 |       "profile": "https://github.com/VincentBourdeau",
130 |       "contributions": [
131 |         "code"
132 |       ]
133 |     }
134 |   ],
135 |   "contributorsPerLine": 7
136 | }
137 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "name": "bento-starter",
  3 |   "version": "1.0.0",
  4 |   "scripts": {
  5 |     "serve": "vue-cli-service serve",
  6 |     "build": "vue-cli-service build",
  7 |     "lint": "vue-cli-service lint",
  8 |     "test:e2e": "vue-cli-service test:e2e",
  9 |     "test:e2e:headless": "vue-cli-service test:e2e --headless",
 10 |     "test:unit": "vue-cli-service test:unit",
 11 |     "prettier:format-all": "prettier --write \"**/*.{vue,scss,sass,js,json}\"",
 12 |     "prettier:check": "prettier \"**/*.{vue,scss,sass,js,json}\" --list-different",
 13 |     "firebase:deploy:ci": "firebase deploy --non-interactive --token $FIREBASE_TOKEN",
 14 |     "bundlesize": "bundlesize",
 15 |     "presetup": "npm install",
 16 |     "setup": "node ./internals/setup.js"
 17 |   },
 18 |   "engines": {
 19 |     "npm": ">=5.5.0",
 20 |     "node": ">=9.3.0"
 21 |   },
 22 |   "dependencies": {
 23 |     "core-js": "^3.1.3",
 24 |     "firebase": "^6.0.4",
 25 |     "is_js": "^0.9.0",
 26 |     "lodash": "^4.17.15",
 27 |     "pwacompat": "^2.0.9",
 28 |     "register-service-worker": "^1.6.2",
 29 |     "vue": "^2.6.10",
 30 |     "vue-head": "^2.1.1",
 31 |     "vue-router": "^3.0.6",
 32 |     "vuex": "^3.1.1"
 33 |   },
 34 |   "devDependencies": {
 35 |     "@types/lodash": "^4.14.132",
 36 |     "@vue/cli-plugin-babel": "^4.0.5",
 37 |     "@vue/cli-plugin-e2e-cypress": "4.1.2",
 38 |     "@vue/cli-plugin-eslint": "^4.0.5",
 39 |     "@vue/cli-plugin-pwa": "^3.8.0",
 40 |     "@vue/cli-plugin-unit-jest": "^4.0.5",
 41 |     "@vue/cli-service": "^4.0.5",
 42 |     "@vue/eslint-config-prettier": "^5.0.0",
 43 |     "@vue/test-utils": "^1.0.0-beta.29",
 44 |     "babel-core": "7.0.0-bridge.0",
 45 |     "babel-eslint": "^10.0.1",
 46 |     "babel-jest": "^24.9.0",
 47 |     "babel-plugin-lodash": "^3.3.4",
 48 |     "boxen": "4.0.0",
 49 |     "bundlesize": "github:kefranabg/bundlesize",
 50 |     "chalk": "^2.4.2",
 51 |     "change-case": "3.1.0",
 52 |     "compare-versions": "^3.4.0",
 53 |     "eslint": "^6.6.0",
 54 |     "eslint-config-airbnb": "^18.0.1",
 55 |     "eslint-config-airbnb-base": "^14.0.0",
 56 |     "eslint-config-google": "^0.14.0",
 57 |     "eslint-plugin-import": "^2.17.3",
 58 |     "eslint-plugin-prettier": "^3.1.1",
 59 |     "eslint-plugin-vue": "^5.2.3",
 60 |     "firebase-tools": "^7.6.2",
 61 |     "inquirer": "^7.0.0",
 62 |     "node-sass": "^4.12.0",
 63 |     "ora": "^4.0.2",
 64 |     "prerender-spa-plugin": "^3.4.0",
 65 |     "read-pkg": "^5.1.1",
 66 |     "rimraf": "^3.0.0",
 67 |     "sass-loader": "^8.0.0",
 68 |     "shelljs": "^0.8.3",
 69 |     "vue-template-compiler": "^2.6.10",
 70 |     "webpack-bundle-analyzer": "^3.3.2",
 71 |     "webpack-merge": "^4.2.1",
 72 |     "write-pkg": "^4.0.0"
 73 |   },
 74 |   "bundlesize": [
 75 |     {
 76 |       "path": "./dist/js/chunk-vendors*.js",
 77 |       "maxSize": "125 kB"
 78 |     },
 79 |     {
 80 |       "path": "./dist/js/chunk-firestore*.js",
 81 |       "maxSize": "95 kB"
 82 |     },
 83 |     {
 84 |       "path": "./dist/js/app*.js",
 85 |       "maxSize": "15 kB"
 86 |     },
 87 |     {
 88 |       "path": "./dist/js/client-chunk-*.js",
 89 |       "maxSize": "6 kB"
 90 |     }
 91 |   ],
 92 |   "eslintConfig": {
 93 |     "root": true,
 94 |     "env": {
 95 |       "node": true
 96 |     },
 97 |     "extends": [
 98 |       "plugin:vue/essential",
 99 |       "@vue/prettier"
100 |     ],
101 |     "rules": {},
102 |     "parserOptions": {
103 |       "parser": "babel-eslint"
104 |     }
105 |   },
106 |   "postcss": {
107 |     "plugins": {
108 |       "autoprefixer": {}
109 |     }
110 |   },
111 |   "browserslist": [
112 |     "> 1%",
113 |     "last 2 versions",
114 |     "not ie <= 8"
115 |   ],
116 |   "jest": {
117 |     "moduleFileExtensions": [
118 |       "js",
119 |       "jsx",
120 |       "json",
121 |       "vue"
122 |     ],
123 |     "transform": {
124 |       "^.+\\.vue$": "vue-jest",
125 |       ".+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$": "jest-transform-stub",
126 |       "^.+\\.jsx?$": "babel-jest"
127 |     },
128 |     "moduleNameMapper": {
129 |       "^@/(.*)$": "<rootDir>/src/$1"
130 |     },
131 |     "snapshotSerializers": [
132 |       "jest-serializer-vue"
133 |     ],
134 |     "testMatch": [
135 |       "**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"
136 |     ],
137 |     "testURL": "http://localhost/",
138 |     "setupFilesAfterEnv": [
139 |       "<rootDir>/tests/unit/setup.js"
140 |     ]
141 |   }
142 | }
143 | 


--------------------------------------------------------------------------------
/src/components/NavBar.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <header class="navbar" :class="{ offline: !networkOnLine }">
  3 |     <router-link to="/home">
  4 |       <img alt="logo-bento" class="logo" src="@/assets/img/bento-starter.svg" />
  5 |       <span class="site-name title-desktop">{{ appTitle }}</span>
  6 |       <span class="site-name title-mobile">{{ appShortTitle }}</span>
  7 |     </router-link>
  8 |     <div class="links">
  9 |       <nav class="nav-links">
 10 |         <div class="nav-item">
 11 |           <router-link to="/products">Products</router-link>
 12 |         </div>
 13 |         <div v-if="!isUserLoggedIn && networkOnLine" class="nav-item">
 14 |           <router-link to="/login">Login</router-link>
 15 |         </div>
 16 |         <div
 17 |           v-if="isUserLoggedIn && networkOnLine"
 18 |           class="nav-item logout-item"
 19 |           @click="logout"
 20 |         >
 21 |           <a>Logout</a>
 22 |         </div>
 23 |         <div v-if="!networkOnLine" class="nav-item offline-label">Offline</div>
 24 |       </nav>
 25 | 
 26 |       <img
 27 |         v-if="isUserLoggedIn && networkOnLine"
 28 |         class="user-picture can-hide"
 29 |         :src="user.photoURL"
 30 |         alt="Avatar"
 31 |       />
 32 |     </div>
 33 |   </header>
 34 | </template>
 35 | 
 36 | <script>
 37 | import firebase from 'firebase/app'
 38 | import { mapGetters, mapState } from 'vuex'
 39 | 
 40 | export default {
 41 |   computed: {
 42 |     ...mapGetters('authentication', ['isUserLoggedIn']),
 43 |     ...mapState('authentication', ['user']),
 44 |     ...mapState('app', ['networkOnLine', 'appTitle', 'appShortTitle'])
 45 |   },
 46 |   methods: {
 47 |     async logout() {
 48 |       await firebase.auth().signOut()
 49 |     }
 50 |   }
 51 | }
 52 | </script>
 53 | 
 54 | <style lang="scss" scoped>
 55 | @import '@/theme/variables.scss';
 56 | 
 57 | .navbar {
 58 |   position: absolute;
 59 |   top: 0;
 60 |   left: 0;
 61 |   z-index: 20;
 62 |   right: 0;
 63 |   height: $navbar-height;
 64 |   background-color: $navbar-color;
 65 |   box-sizing: border-box;
 66 |   border-bottom: 1px solid #eaecef;
 67 |   padding: 0.7rem 1.5rem;
 68 |   line-height: 2.2rem;
 69 | 
 70 |   a {
 71 |     display: flex;
 72 |     align-items: center;
 73 |   }
 74 | 
 75 |   .title-desktop {
 76 |     display: inline;
 77 |   }
 78 | 
 79 |   .title-mobile {
 80 |     display: none;
 81 |   }
 82 | 
 83 |   @media (max-width: 500px) {
 84 |     padding: 0.7rem 0.7rem;
 85 | 
 86 |     .can-hide {
 87 |       display: none;
 88 |     }
 89 | 
 90 |     .title-desktop {
 91 |       display: none;
 92 |     }
 93 | 
 94 |     .title-mobile {
 95 |       display: block;
 96 |     }
 97 |   }
 98 | 
 99 |   .site-name {
100 |     font-size: 1.3rem;
101 |     font-weight: 600;
102 |     color: #2c3e50;
103 |     position: relative;
104 |   }
105 | 
106 |   .logo {
107 |     height: 24px;
108 |     padding-right: 8px;
109 |   }
110 | 
111 |   .links {
112 |     padding-left: 1.5rem;
113 |     box-sizing: border-box;
114 |     white-space: nowrap;
115 |     font-size: 0.9rem;
116 |     position: absolute;
117 |     right: 1.5rem;
118 |     top: 0.7rem;
119 |     display: flex;
120 | 
121 |     .nav-links {
122 |       display: flex;
123 |       align-items: center;
124 |       justify-content: center;
125 | 
126 |       .nav-item {
127 |         position: relative;
128 |         display: inline-block;
129 |         margin-left: 1.5rem;
130 |         line-height: 2.2rem;
131 | 
132 |         &:first-child {
133 |           margin-left: 0;
134 |         }
135 | 
136 |         a {
137 |           font-weight: 500;
138 |           font-size: 0.9rem;
139 |           text-decoration: none;
140 |           color: $navbar-link-color;
141 |           border-color: #2c3e50;
142 |           line-height: 1.4rem;
143 |           display: inline-block;
144 |           cursor: pointer;
145 |         }
146 | 
147 |         @mixin activatedLink() {
148 |           margin-bottom: -2px;
149 |           border-bottom: 2px solid $vue-color;
150 |         }
151 | 
152 |         .router-link-active {
153 |           @include activatedLink;
154 |         }
155 | 
156 |         @media (hover) {
157 |           :hover {
158 |             @include activatedLink;
159 |           }
160 |         }
161 |       }
162 |     }
163 |   }
164 | 
165 |   &.offline {
166 |     background: $navbar-offline-color;
167 |     .links .nav-links .nav-item a,
168 |     .site-name {
169 |       color: white;
170 |     }
171 |   }
172 | 
173 |   .user-picture {
174 |     max-height: 32px;
175 |     margin-left: 1.5rem;
176 |     border-radius: 50%;
177 |   }
178 | 
179 |   .offline-label {
180 |     padding: 0px 10px;
181 |     border: 1px solid white;
182 |     border-radius: 5px;
183 |     color: white;
184 |     margin-left: 1.5rem;
185 |   }
186 | }
187 | </style>
188 | 


--------------------------------------------------------------------------------
/tests/unit/views/Login.spec.js:
--------------------------------------------------------------------------------
  1 | import Vuex from 'vuex'
  2 | import { cloneDeep } from 'lodash'
  3 | import { createLocalVue, shallowMount } from '@vue/test-utils'
  4 | import LoginView from '@/views/Login.vue'
  5 | 
  6 | const defaultStoreStructure = {
  7 |   modules: {
  8 |     app: {
  9 |       namespaced: true,
 10 |       state: {
 11 |         networkOnLine: true
 12 |       }
 13 |     },
 14 |     authentication: {
 15 |       namespaced: true,
 16 |       state: {
 17 |         user: undefined
 18 |       },
 19 |       mutations: {
 20 |         setUser: jest.fn()
 21 |       }
 22 |     }
 23 |   }
 24 | }
 25 | 
 26 | const localVue = createLocalVue()
 27 | localVue.use(Vuex)
 28 | 
 29 | const $router = {
 30 |   push: jest.fn()
 31 | }
 32 | 
 33 | describe('LoginView', () => {
 34 |   describe('when user is defined', () => {
 35 |     let storeStructure
 36 | 
 37 |     beforeEach(() => {
 38 |       storeStructure = cloneDeep(defaultStoreStructure)
 39 |       storeStructure.modules.authentication.state.user = 'Evan'
 40 |     })
 41 | 
 42 |     describe('and redirectUrl is defined', () => {
 43 |       it('should redirect to redirectUrl', () => {
 44 |         const store = new Vuex.Store(storeStructure)
 45 |         const redirectUrl = '/redirectUrl'
 46 |         shallowMount(LoginView, {
 47 |           store,
 48 |           localVue,
 49 |           mocks: {
 50 |             $route: {
 51 |               query: {
 52 |                 redirectUrl
 53 |               }
 54 |             },
 55 |             $router
 56 |           }
 57 |         })
 58 |         expect($router.push).toHaveBeenCalledWith(redirectUrl)
 59 |       })
 60 |     })
 61 | 
 62 |     describe('but redirectUrl not defined', () => {
 63 |       it('should redirect to /products', () => {
 64 |         const store = new Vuex.Store(storeStructure)
 65 |         shallowMount(LoginView, {
 66 |           store,
 67 |           localVue,
 68 |           mocks: {
 69 |             $route: {
 70 |               query: {}
 71 |             },
 72 |             $router
 73 |           }
 74 |         })
 75 |         expect($router.push).toHaveBeenCalledWith('/products')
 76 |       })
 77 |     })
 78 |   })
 79 | 
 80 |   describe('when user is null', () => {
 81 |     let storeStructure
 82 |     beforeEach(() => {
 83 |       storeStructure = cloneDeep(defaultStoreStructure)
 84 |       storeStructure.modules.authentication.state.user = null
 85 |     })
 86 | 
 87 |     it('should not display loader if user is null', () => {
 88 |       const store = new Vuex.Store(storeStructure)
 89 |       const wrapper = shallowMount(LoginView, { store, localVue })
 90 |       const loader = wrapper.find('[data-test="loader"]')
 91 |       expect(loader.isVisible()).toBeFalsy()
 92 |     })
 93 | 
 94 |     it('should display login button', () => {
 95 |       const store = new Vuex.Store(storeStructure)
 96 |       const wrapper = shallowMount(LoginView, { store, localVue })
 97 |       const loginButton = wrapper.find('[data-test="login-btn"]')
 98 |       expect(loginButton.isVisible()).toBeTruthy()
 99 |     })
100 | 
101 |     it('should not display offline message', () => {
102 |       const store = new Vuex.Store(storeStructure)
103 |       const wrapper = shallowMount(LoginView, { store, localVue })
104 |       const offlineInstruction = wrapper.find(
105 |         '[data-test="offline-instruction"]'
106 |       )
107 |       expect(offlineInstruction.isVisible()).toBeFalsy()
108 |     })
109 | 
110 |     describe('when app is offline', () => {
111 |       beforeEach(() => {
112 |         storeStructure.modules.app.state.networkOnLine = false
113 |       })
114 | 
115 |       it('should not display login button if app is offline', () => {
116 |         const store = new Vuex.Store(storeStructure)
117 |         const wrapper = shallowMount(LoginView, { store, localVue })
118 |         const loginButton = wrapper.find('[data-test="login-btn"]')
119 |         expect(loginButton.isVisible()).toBeFalsy()
120 |       })
121 | 
122 |       it('should display offline message', () => {
123 |         const store = new Vuex.Store(storeStructure)
124 |         const wrapper = shallowMount(LoginView, { store, localVue })
125 |         const offlineInstruction = wrapper.find(
126 |           '[data-test="offline-instruction"]'
127 |         )
128 |         expect(offlineInstruction.isVisible()).toBeTruthy()
129 |       })
130 |     })
131 |   })
132 | 
133 |   describe('when user is undefined', () => {
134 |     it('should display loader', () => {
135 |       const store = new Vuex.Store(defaultStoreStructure)
136 |       const wrapper = shallowMount(LoginView, { store, localVue })
137 |       const loader = wrapper.find('[data-test="loader"]')
138 |       expect(loader.isVisible()).toBeTruthy()
139 |     })
140 | 
141 |     it('should not display login button', () => {
142 |       const store = new Vuex.Store(defaultStoreStructure)
143 |       const wrapper = shallowMount(LoginView, { store, localVue })
144 |       const loginButton = wrapper.find('[data-test="login-btn"]')
145 |       expect(loginButton.isVisible()).toBeFalsy()
146 |     })
147 | 
148 |     it('should not display offline message', () => {
149 |       const store = new Vuex.Store(defaultStoreStructure)
150 |       const wrapper = shallowMount(LoginView, { store, localVue })
151 |       const offlineInstruction = wrapper.find(
152 |         '[data-test="offline-instruction"]'
153 |       )
154 |       expect(offlineInstruction.isVisible()).toBeFalsy()
155 |     })
156 |   })
157 | })
158 | 


--------------------------------------------------------------------------------
/tests/unit/store/products/products.actions.spec.js:
--------------------------------------------------------------------------------
  1 | import actions from '@/store/products/products.actions'
  2 | 
  3 | jest.mock('@/firebase/user-products-db', () => ({
  4 |   UserProductsDB: jest.mock()
  5 | }))
  6 | 
  7 | const mockUsersDbReadAll = jest.fn()
  8 | const mockUsersDbCreate = jest.fn()
  9 | const mockUsersDbDelete = jest.fn()
 10 | jest.mock('@/firebase/user-products-db', () =>
 11 |   jest.fn().mockImplementation(() => ({
 12 |     readAll: mockUsersDbReadAll,
 13 |     create: mockUsersDbCreate,
 14 |     delete: mockUsersDbDelete
 15 |   }))
 16 | )
 17 | 
 18 | const commit = jest.fn()
 19 | const dispatch = jest.fn()
 20 | const isProductDeletionPending = jest.fn()
 21 | const userId = 11
 22 | const user = { id: userId }
 23 | const product1 = { id: 1, name: 'product1' }
 24 | const product2 = { id: 2, name: 'product2' }
 25 | const rootState = {
 26 |   authentication: {
 27 |     user
 28 |   }
 29 | }
 30 | const getters = {
 31 |   isProductDeletionPending
 32 | }
 33 | 
 34 | afterEach(() => {
 35 |   commit.mockReset()
 36 |   dispatch.mockReset()
 37 |   mockUsersDbReadAll.mockReset()
 38 |   mockUsersDbCreate.mockReset()
 39 |   mockUsersDbDelete.mockReset()
 40 |   isProductDeletionPending.mockReset()
 41 | })
 42 | 
 43 | describe('products module action', () => {
 44 |   describe('getUserProducts', () => {
 45 |     it('should set products with ones owned by the current user', async () => {
 46 |       mockUsersDbReadAll.mockResolvedValue([product1, product2])
 47 |       await actions.getUserProducts({ commit, rootState })
 48 |       expect(commit).toHaveBeenCalledWith('setProducts', [product1, product2])
 49 |     })
 50 |   })
 51 | 
 52 |   describe('createUserProduct', () => {
 53 |     it('should set product creation as pending first', async () => {
 54 |       mockUsersDbCreate.mockResolvedValue(product2)
 55 |       await actions.createUserProduct({ commit, rootState })
 56 |       expect(commit).toHaveBeenNthCalledWith(
 57 |         1,
 58 |         'setProductCreationPending',
 59 |         true
 60 |       )
 61 |     })
 62 | 
 63 |     it('should add product', async () => {
 64 |       mockUsersDbCreate.mockResolvedValue(product2)
 65 |       await actions.createUserProduct({ commit, rootState }, product1)
 66 |       expect(commit).toHaveBeenNthCalledWith(2, 'addProduct', product2)
 67 |     })
 68 | 
 69 |     it('should set product creation as not pending after adding product', async () => {
 70 |       mockUsersDbCreate.mockResolvedValue(product2)
 71 |       await actions.createUserProduct({ commit, rootState }, product1)
 72 |       expect(commit).toHaveBeenNthCalledWith(
 73 |         3,
 74 |         'setProductCreationPending',
 75 |         false
 76 |       )
 77 |     })
 78 |   })
 79 | 
 80 |   describe('triggerAddProductAction', () => {
 81 |     describe('when the name of the product is empty', () => {
 82 |       const state = {
 83 |         productNameToCreate: ''
 84 |       }
 85 | 
 86 |       it('should not set input name to empty', () => {
 87 |         actions.triggerAddProductAction({ dispatch, state, commit })
 88 |         expect(commit).not.toHaveBeenCalled()
 89 |       })
 90 | 
 91 |       it('should not dispatch create product action', () => {
 92 |         actions.triggerAddProductAction({ dispatch, state, commit })
 93 |         expect(dispatch).not.toHaveBeenCalled()
 94 |       })
 95 |     })
 96 | 
 97 |     describe('when the name of the product is not empty', () => {
 98 |       const state = {
 99 |         productNameToCreate: 'todo'
100 |       }
101 | 
102 |       it('should set input name to empty', () => {
103 |         actions.triggerAddProductAction({ dispatch, state, commit })
104 |         expect(commit).toHaveBeenCalledWith('setProductNameToCreate', '')
105 |       })
106 | 
107 |       it('should dispatch create product action', () => {
108 |         actions.triggerAddProductAction({ dispatch, state, commit })
109 |         expect(dispatch).toHaveBeenCalledWith('createUserProduct', {
110 |           name: 'todo'
111 |         })
112 |       })
113 |     })
114 |   })
115 | 
116 |   describe('deleteUserProduct', () => {
117 |     describe('when the product is currently being deleted', () => {
118 |       it('should not do anything', async () => {
119 |         isProductDeletionPending.mockReturnValue(true)
120 |         await actions.deleteUserProduct({ commit, rootState, getters }, 1)
121 |         expect(commit).not.toHaveBeenCalled()
122 |       })
123 |     })
124 | 
125 |     describe('when the product is not currently being deleted', () => {
126 |       it('should set product as deletion pending first', async () => {
127 |         getters.isProductDeletionPending.mockReturnValue(false)
128 |         await actions.deleteUserProduct({ commit, rootState, getters }, 1)
129 |         expect(commit).toHaveBeenNthCalledWith(
130 |           1,
131 |           'addProductDeletionPending',
132 |           1
133 |         )
134 |       })
135 | 
136 |       it('should remove product in store', async () => {
137 |         await actions.deleteUserProduct({ commit, rootState, getters }, 1)
138 |         expect(commit).toHaveBeenNthCalledWith(2, 'removeProductById', 1)
139 |       })
140 | 
141 |       it('should remove product in db', async () => {
142 |         await actions.deleteUserProduct({ commit, rootState, getters }, 1)
143 |         expect(mockUsersDbDelete).toHaveBeenCalledWith(1)
144 |       })
145 | 
146 |       it('should set product as not deletion pending after having removed the product', async () => {
147 |         await actions.deleteUserProduct({ commit, rootState, getters }, 1)
148 |         expect(commit).toHaveBeenNthCalledWith(
149 |           3,
150 |           'removeProductDeletionPending',
151 |           1
152 |         )
153 |       })
154 |     })
155 |   })
156 | })
157 | 


--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
 1 | # Changelog
 2 | 
 3 | <a name="next"></a>
 4 | ## next
 5 | 
 6 | ### Miscellaneous
 7 | 
 8 | - 📝 Update README description format [[73423bc](https://github.com/kefranabg/bento-starter/commit/73423bc3130fe6393b0522af9f70af0e828bd11a)]
 9 | 
10 | 
11 | <a name="1.0.0"></a>
12 | ## 1.0.0 (2019-06-06)
13 | 
14 | ### Added
15 | 
16 | - ✨ Update service worker skipWaiting workflow ([#137](https://github.com/kefranabg/bento-starter/issues/137)) [[f1eb09d](https://github.com/kefranabg/bento-starter/commit/f1eb09d41da9b53f97de02c17787e4914c70f9b8)]
17 | - ✨ Add assetlinks file for android apk check [[7476d95](https://github.com/kefranabg/bento-starter/commit/7476d95a5531b2e2339e8638f4d0a2e9d9b54a66)]
18 | - ✨ Add setup command to npm scripts ([#140](https://github.com/kefranabg/bento-starter/issues/140)) [[6705d3b](https://github.com/kefranabg/bento-starter/commit/6705d3b00f2c32f388d42426d2e83be7896fc773)]
19 | - ✨ Improve setup command ([#173](https://github.com/kefranabg/bento-starter/issues/173)) [[1afb74a](https://github.com/kefranabg/bento-starter/commit/1afb74a8be89405399744b4f442a6c5432ec5975)]
20 | - ✨ Update license link in README ([#184](https://github.com/kefranabg/bento-starter/issues/184)) [[f2e102e](https://github.com/kefranabg/bento-starter/commit/f2e102e86567b25d313cf1ad12a0a25b1d2d0dda)]
21 | - ✨ Enable hashcontent name for generated files ([#145](https://github.com/kefranabg/bento-starter/issues/145)) [[82335b3](https://github.com/kefranabg/bento-starter/commit/82335b3ecd6eaa7f82088358a1558c08f49cd8c3)]
22 | 
23 | ### Changed
24 | 
25 | - ⬆️ Upgrade dependencies ([#153](https://github.com/kefranabg/bento-starter/issues/153)) [[9abf4a1](https://github.com/kefranabg/bento-starter/commit/9abf4a1e3afc1910da33fcf4403f922077924613)]
26 | - ⬆️ Upgrade dependencies ([#169](https://github.com/kefranabg/bento-starter/issues/169)) [[e5c821d](https://github.com/kefranabg/bento-starter/commit/e5c821ddfb5bc9d42fd35a554eeb85199ede0747)]
27 | - ⬆️ Upgrade dependencies ([#178](https://github.com/kefranabg/bento-starter/issues/178)) [[88d2e20](https://github.com/kefranabg/bento-starter/commit/88d2e204f8a5b96b624864ddcc0048aa11058085)]
28 | - ⬆️ Upgrade bundlesize dependencies ([#186](https://github.com/kefranabg/bento-starter/issues/186)) [[a201305](https://github.com/kefranabg/bento-starter/commit/a201305ffd9a4f91c56db74555e1000301b611e3)]
29 | - 🎨 Improve lodash imports with babel-plugin-lodash ([#172](https://github.com/kefranabg/bento-starter/issues/172)) [[902eab7](https://github.com/kefranabg/bento-starter/commit/902eab784487272783b1446bc6dd917d7409c9f8)]
30 | - 🍱 Add missing browsers icons ([#146](https://github.com/kefranabg/bento-starter/issues/146)) [[d968470](https://github.com/kefranabg/bento-starter/commit/d968470b675234fb5db1213d7b5ed01e0aa244f6)]
31 | - 💄 Fix the activate link into navbar ([#162](https://github.com/kefranabg/bento-starter/issues/162)) [[a51f651](https://github.com/kefranabg/bento-starter/commit/a51f6515f6d1741b39eb72e7c083cc19600c08a9)]
32 | - ♻️ Setup command refactoring ([#175](https://github.com/kefranabg/bento-starter/issues/175)) [[11cdca8](https://github.com/kefranabg/bento-starter/commit/11cdca859d9c7979d86d321bde44fe271991f746)]
33 | - ♻️ Setup command refactoring ([#180](https://github.com/kefranabg/bento-starter/issues/180)) [[dc0e280](https://github.com/kefranabg/bento-starter/commit/dc0e28045b2cacbde13df9f5bc48c0d8abc41a0f)]
34 | - 💬 Fix typo: replace &#x27;Optionnal&#x27; by &#x27;Optional&#x27; in README ([#124](https://github.com/kefranabg/bento-starter/issues/124)) [[1194e26](https://github.com/kefranabg/bento-starter/commit/1194e26e24c6e7cdd191b615e7e52c7c29aa8d7f)]
35 | - 💬 Fixed typo errors [[831102a](https://github.com/kefranabg/bento-starter/commit/831102ade2fcaa47fabf0219f65acfc6e5d2a107)]
36 | - 💬 Adding slack link to README ([#133](https://github.com/kefranabg/bento-starter/issues/133)) [[4f2a9de](https://github.com/kefranabg/bento-starter/commit/4f2a9de267d473034d61717fccc503c188273269)]
37 | - 🔧 Update SHA-256 cert fingerprint to match playstore key [[1f003a3](https://github.com/kefranabg/bento-starter/commit/1f003a3ee76a087a60e0a27b11f515d11c0bdc08)]
38 | - ⚡ Reduce js vendor bundle size with better lodash imports ([#148](https://github.com/kefranabg/bento-starter/issues/148)) [[4a0ffd8](https://github.com/kefranabg/bento-starter/commit/4a0ffd8ed4959719e896c4e02e40f2cbd6ca3134)]
39 | 
40 | ### Removed
41 | 
42 | - 🔥 Remove README setup section ([#129](https://github.com/kefranabg/bento-starter/issues/129)) [[fd26145](https://github.com/kefranabg/bento-starter/commit/fd261456282a28ce1da62d6a1dd21ee7e8dbf799)]
43 | - 🔥 Remove known issues from README ([#183](https://github.com/kefranabg/bento-starter/issues/183)) [[755786f](https://github.com/kefranabg/bento-starter/commit/755786f435d168fefc3b448a6f5b694b886ec112)]
44 | - ➖ Set brotli-size dependency as optional ([#152](https://github.com/kefranabg/bento-starter/issues/152)) [[d35fa9f](https://github.com/kefranabg/bento-starter/commit/d35fa9f268c710f0e9e311131a3181ccb2001dee)]
45 | 
46 | ### Fixed
47 | 
48 | - 🐛 Fix async firestore import ([#154](https://github.com/kefranabg/bento-starter/issues/154)) [[178e617](https://github.com/kefranabg/bento-starter/commit/178e617457c8814d8b724cba7661391c4690f672)]
49 | - 🐛 Fix prettier commands execution for windows ([#156](https://github.com/kefranabg/bento-starter/issues/156)) [[909799a](https://github.com/kefranabg/bento-starter/commit/909799aa4d7d770995e318f3997a624799c17fdc)]
50 | - ✏️ Fix contributing typo ([#135](https://github.com/kefranabg/bento-starter/issues/135)) [[0efdc24](https://github.com/kefranabg/bento-starter/commit/0efdc24a69b4c8f0973ab91ebcc89d0fe588f39b)]
51 | 
52 | ### Miscellaneous
53 | 
54 | - 📝 Add setup in README ([#123](https://github.com/kefranabg/bento-starter/issues/123)) [[cb0486c](https://github.com/kefranabg/bento-starter/commit/cb0486c24688bdc9ae8a820a6df9ae15711abd6e)]
55 | - 📝 Add code owner and code of conduct ([#130](https://github.com/kefranabg/bento-starter/issues/130)) [[44fa7d0](https://github.com/kefranabg/bento-starter/commit/44fa7d000e657e1c4a50b6b93220ffea2105d1de)]
56 | - 📝 Add slack in contributing documentation ([#136](https://github.com/kefranabg/bento-starter/issues/136)) [[12b688e](https://github.com/kefranabg/bento-starter/commit/12b688e3121bcfb4c4e34c07b8dca894cae587ff)]
57 | - 📝 Add bento-starter demo Play Store link in README ([#167](https://github.com/kefranabg/bento-starter/issues/167)) [[17b0ac6](https://github.com/kefranabg/bento-starter/commit/17b0ac6dd26cd489bdc81bd4d0c72e69bae5fc11)]
58 | - 📝 Align title and images in README ([#121](https://github.com/kefranabg/bento-starter/issues/121)) [[e084399](https://github.com/kefranabg/bento-starter/commit/e084399b514ffab6328223fead89a1da5a59df3c)]
59 | 
60 | 
61 | <a name="0.1.0"></a>
62 | ## 0.1.0 (2019-04-22)
63 | 
64 | ### Added
65 | 
66 | - 🎉 First release [[9129ff7](https://github.com/kefranabg/bento-starter/commit/9129ff7dcb4378db4d38dc6e2649394e2da91f63)]
67 | 
68 | 
69 | 


--------------------------------------------------------------------------------
/internals/setup.js:
--------------------------------------------------------------------------------
  1 | #!/usr/bin/env node
  2 | /* eslint-disable import/no-extraneous-dependencies */
  3 | 
  4 | const inquirer = require('inquirer')
  5 | const ora = require('ora')
  6 | const compareVersions = require('compare-versions')
  7 | const chalk = require('chalk')
  8 | const boxen = require('boxen')
  9 | const util = require('util')
 10 | const exec = util.promisify(require('child_process').exec)
 11 | 
 12 | const npmConfig = require('./helpers/get-npm-config')
 13 | const cleanUselessScripts = require('./helpers/clean-useless-scripts')
 14 | const cleanUselessResources = require('./helpers/clean-useless-resources')
 15 | const cleanUselessDependencies = require('./helpers/clean-useless-dependencies')
 16 | const cleanReadmeContent = require('./helpers/clean-readme-content')
 17 | const setLocalEnvFile = require('./helpers/set-local-env-file')
 18 | const changeProjectName = require('./helpers/change-project-name')
 19 | const gitHelper = require('./helpers/git-helper')
 20 | 
 21 | process.stdin.resume()
 22 | process.stdin.setEncoding('utf8')
 23 | 
 24 | process.stdout.write('\n')
 25 | 
 26 | /**
 27 |  * Ask user if he wants to start with a new repository
 28 |  * @returns {Promise<boolean>}
 29 |  */
 30 | async function askUserIfWeShouldCreateNewRepo() {
 31 |   const NEW_REPOSITORY = 'NEW_REPOSITORY'
 32 |   const answers = await inquirer.prompt([
 33 |     {
 34 |       type: 'confirm',
 35 |       message: 'Do you want to start with a new repository ?',
 36 |       name: NEW_REPOSITORY
 37 |     }
 38 |   ])
 39 |   return !!answers[NEW_REPOSITORY]
 40 | }
 41 | 
 42 | /**
 43 |  * Ask user for new origin for this repository. If provided, call git remote add origin
 44 |  * @returns {Promise<any>}
 45 |  */
 46 | async function askUserForNewRemote() {
 47 |   const NEW_REMOTE = 'NEW_REMOTE'
 48 | 
 49 |   const answers = await inquirer.prompt([
 50 |     {
 51 |       type: 'input',
 52 |       message:
 53 |         'Enter new remote origin (ex: https://github.com/user/my-repo.git) for this repository [Enter to cancel]:  ',
 54 |       name: NEW_REMOTE
 55 |     }
 56 |   ])
 57 | 
 58 |   const origin = answers[NEW_REMOTE]
 59 |   if (origin) {
 60 |     const spinner = ora('Adding new remote to repository').start()
 61 |     try {
 62 |       await gitHelper.changeOrigin(origin)
 63 |       spinner.succeed(`New remote added ${printOk()}`)
 64 |       return true
 65 |     } catch (error) {
 66 |       spinner.fail(`Add remote failed ${printFail()}`)
 67 |       return false
 68 |     }
 69 |   }
 70 |   return false
 71 | }
 72 | 
 73 | /**
 74 |  * Ask user for new project name. If provided, change project name
 75 |  * @returns {Promise<any>}
 76 |  */
 77 | async function askUserForNewProjectName() {
 78 |   const NEW_PROJECT_NAME = 'NEW_PROJECT_NAME'
 79 |   const NEW_PROJECT_SHORT_NAME = 'NEW_PROJECT_SHORT_NAME'
 80 | 
 81 |   const answers = await inquirer.prompt([
 82 |     {
 83 |       type: 'input',
 84 |       message:
 85 |         'Enter new project name (ex: Bento Starter) [Use empty value to skip]:',
 86 |       name: NEW_PROJECT_NAME
 87 |     },
 88 |     {
 89 |       type: 'input',
 90 |       message:
 91 |         'Enter new project short name (used for mobile) [max 12 characters] :',
 92 |       name: NEW_PROJECT_SHORT_NAME,
 93 |       when: answers => answers[NEW_PROJECT_NAME],
 94 |       default: answers =>
 95 |         answers[NEW_PROJECT_NAME].length <= 12
 96 |           ? answers[NEW_PROJECT_NAME]
 97 |           : undefined,
 98 |       validate: input =>
 99 |         input && input.length <= 12
100 |           ? true
101 |           : 'Your project short name must have a maximum of 12 characters'
102 |     }
103 |   ])
104 | 
105 |   return {
106 |     projectName: answers[NEW_PROJECT_NAME],
107 |     projectShortName: answers[NEW_PROJECT_SHORT_NAME]
108 |   }
109 | }
110 | 
111 | /**
112 |  * Check Node.js version
113 |  * @param {!number} minimalNodeVersion
114 |  * @returns {Promise<any>}
115 |  */
116 | async function checkNodeVersion(minimalNodeVersion) {
117 |   const spinner = ora('Checking node version').start()
118 | 
119 |   let nodeVersion
120 |   try {
121 |     const { stdout } = await exec('node --version')
122 |     nodeVersion = stdout.trim()
123 |   } catch (err) {
124 |     spinner.fail(`node version check failed\n${err}`)
125 |     throw new Error(err)
126 |   }
127 | 
128 |   if (compareVersions(nodeVersion, minimalNodeVersion) === -1) {
129 |     spinner.fail(
130 |       `You need Node.js v${minimalNodeVersion} or above but you have v${nodeVersion}`
131 |     )
132 |     throw new Error()
133 |   }
134 | 
135 |   spinner.succeed(`Node version ${nodeVersion} ${printOk()}`)
136 | }
137 | 
138 | /**
139 |  * Check NPM version
140 |  * @param {!number} minimalNpmVersion
141 |  * @returns {Promise<any>}
142 |  */
143 | async function checkNpmVersion(minimalNpmVersion) {
144 |   const spinner = ora('Checking npm version').start()
145 |   let npmVersion
146 |   try {
147 |     const { stdout } = await exec('npm --version')
148 |     npmVersion = stdout.trim()
149 |   } catch (err) {
150 |     spinner.fail(`npm version check failed\n${err}`)
151 |     throw new Error(err)
152 |   }
153 | 
154 |   if (compareVersions(npmVersion, minimalNpmVersion) === -1) {
155 |     spinner.fail(
156 |       `You need NPM v${minimalNpmVersion} or above but you have v${npmVersion}`
157 |     )
158 |     throw new Error()
159 |   }
160 | 
161 |   spinner.succeed(`npm version ${npmVersion} ${printOk()}`)
162 | }
163 | 
164 | async function doCommand(command, commandLog, ...args) {
165 |   const spinner = ora(commandLog).start()
166 |   try {
167 |     await command(...args)
168 |     spinner.succeed(`${commandLog} ${printOk()}`)
169 |   } catch (err) {
170 |     spinner.fail(`${commandLog} ${printFail()}`)
171 |     throw new Error(err)
172 |   }
173 | }
174 | 
175 | /**
176 |  * End the setup process
177 |  */
178 | function endProcess() {
179 |   process.stdout.write(
180 |     boxen(
181 |       `
182 | Thank you for using bento-starter !
183 | 
184 | Do not hesitate to share your project with 
185 | the community on slack : 
186 | 
187 | https://tinyurl.com/yxzrc7fq
188 | 
189 | You can also contact us on twitter
190 | ${chalk.blue('@FranckAbgrall')} or ${chalk.blue('@tbetous')}.
191 | 
192 | We hope to hear about your project soon !
193 | `,
194 |       {
195 |         padding: 1,
196 |         margin: { top: 3, bottom: 3 },
197 |         borderColor: 'cyan',
198 |         align: 'center',
199 |         borderStyle: 'double'
200 |       }
201 |     )
202 |   )
203 |   process.exit(0)
204 | }
205 | 
206 | /**
207 |  * End the setup process with an error
208 |  */
209 | function onError(e) {
210 |   console.error('\n\nExiting setup script with the following error :\n', e)
211 |   process.exit(1)
212 | }
213 | 
214 | function printOk() {
215 |   return chalk.green('[OK]')
216 | }
217 | 
218 | function printFail() {
219 |   return chalk.green('[FAIL]')
220 | }
221 | 
222 | /**
223 |  * Run
224 |  */
225 | ;(async () => {
226 |   let isNewOrigin
227 |   let isNewRepositoryWanted
228 | 
229 |   if (await gitHelper.checkIfRepositoryIsCleanable()) {
230 |     isNewRepositoryWanted = await askUserIfWeShouldCreateNewRepo()
231 |   }
232 | 
233 |   // Take the required Node and NPM version from package.json
234 |   const {
235 |     engines: { node, npm }
236 |   } = npmConfig
237 | 
238 |   const requiredNodeVersion = node.match(/([0-9.]+)/g)[0]
239 |   await checkNodeVersion(requiredNodeVersion).catch(onError)
240 | 
241 |   const requiredNpmVersion = npm.match(/([0-9.]+)/g)[0]
242 |   await checkNpmVersion(requiredNpmVersion).catch(onError)
243 | 
244 |   const { projectName, projectShortName } = await askUserForNewProjectName()
245 |   if (projectName) {
246 |     await doCommand(
247 |       changeProjectName,
248 |       'Changing project name',
249 |       projectName,
250 |       projectShortName
251 |     ).catch(onError)
252 |   }
253 | 
254 |   await doCommand(setLocalEnvFile, 'Creating env local file').catch(onError)
255 | 
256 |   await doCommand(
257 |     cleanUselessDependencies,
258 |     'Cleaning extraneous dependencies'
259 |   ).catch(onError)
260 | 
261 |   await doCommand(
262 |     cleanUselessScripts,
263 |     'Cleaning useless scripts in package.json'
264 |   ).catch(onError)
265 | 
266 |   await doCommand(cleanReadmeContent, 'Cleaning README.md content').catch(
267 |     onError
268 |   )
269 | 
270 |   await doCommand(cleanUselessResources, 'Cleaning useless resources').catch(
271 |     onError
272 |   )
273 | 
274 |   if (isNewRepositoryWanted) {
275 |     await doCommand(
276 |       gitHelper.removeGitRepository,
277 |       'Removing current repository'
278 |     ).catch(onError)
279 | 
280 |     await doCommand(
281 |       gitHelper.initGitRepository,
282 |       'Creating new repository'
283 |     ).catch(onError)
284 | 
285 |     await doCommand(
286 |       gitHelper.doInitalCommit,
287 |       'Creating initial commit for new repository'
288 |     ).catch(onError)
289 | 
290 |     isNewOrigin = await askUserForNewRemote()
291 |   }
292 | 
293 |   if (isNewRepositoryWanted && isNewOrigin) {
294 |     process.stdout.write('\n')
295 |     process.stdout.write(
296 |       chalk.blue(
297 |         'ℹ Run `git push` to send initial commit to remote repository.'
298 |       )
299 |     )
300 |   } else if (isNewRepositoryWanted && !isNewOrigin) {
301 |     process.stdout.write('\n')
302 |     process.stdout.write(
303 |       chalk.blue(
304 |         'ℹ No remote added, run `git remote add origin <url>` to add one.'
305 |       )
306 |     )
307 |   } else {
308 |     process.stdout.write('\n')
309 |     process.stdout.write(
310 |       chalk.blue(
311 |         'ℹ No remote changed, run `git remote set-url origin <url>` to change it.'
312 |       )
313 |     )
314 |   }
315 | 
316 |   endProcess()
317 | })()
318 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | <p align="center">
  2 | <img src="https://img.shields.io/badge/version-1.0.0-blue.svg?cacheSeconds=2592000" alt="Npm version" target="_blank" />
  3 | <a href="https://circleci.com/gh/kefranabg/bento-starter/tree/master"><img alt="CircleCI" src="https://circleci.com/gh/kefranabg/bento-starter/tree/master.svg?style=svg&circle-token=f311e2320782a12321a769faa2ef1d3cdf5e1a10" target="_blank" /></a>
  4 | <a href="https://bento-starter.netlify.com/"><img alt="Documentation" src="https://img.shields.io/badge/documentation-yes-brightgreen.svg" target="_blank" /></a>
  5 | <a href="https://gitHub.com/kefranabg/bento-starter/graphs/commit-activity"><img alt="Maintenance" src="https://img.shields.io/badge/Maintained%3F-yes-green.svg" target="_blank" /></a>
  6 | <a href="https://david-dm.org/kefranabg/bento-starter"><img alt="Dependencies" src="https://img.shields.io/david/kefranabg/bento-starter.svg" target="_blank" /></a>
  7 | <a href="https://david-dm.org/kefranabg/bento-starter?type=dev"><img alt="DevDependencies" src="https://img.shields.io/david/dev/kefranabg/bento-starter.svg" target="_blank" /></a>
  8 | <a href="https://github.com/kefranabg/bento-starter/blob/master/LICENSE"><img alt="License: MIT" src="https://img.shields.io/badge/License-MIT-yellow.svg" target="_blank" /></a>
  9 | <a href="https://join.slack.com/t/bento-starter/shared_invite/enQtNjE5OTI5MzQyMTE3LTQ1N2M0NzAxYWM1OTJmYTA4YTIxMmM4MDhiNTI0MGNjZGIyNDFjY2UwNjE2Nzc3NzMzMzViOTYyOGViYjkxYzY" target="_blank"><img src="https://home-assistant.io/images/supported_brands/slack.png" height="20px" /></a>
 10 | </p>
 11 | 
 12 | <h1 align="center">Welcome to bento-starter :wave:</h1>
 13 | 
 14 | <p align="center">
 15 |   <img src="https://raw.githubusercontent.com/kefranabg/bento-starter/master/src/assets/img/bento-starter.svg?sanitize=true" alt="Bento-starter"/>
 16 | </p>
 17 | 
 18 | <br />
 19 | 
 20 | > :bento: **bento-starter** is an Open-Source Full-Stack solution that helps you to build fast and maintainable web applications using tools like Vue.js, Firebase, Progressive Web Apps support, dynamic offline support... The goal of this project is to provide a powerful and well configured stack (with CI/CD, hosting...) so you can focus on writing your web application very quickly.
 21 | 
 22 | > As this project is a template project and not a CLI, you have access to the entire app configuration so you can change it according to your needs.
 23 | 
 24 | ## :book: Documentation
 25 | 
 26 | Want to setup this stack ?
 27 | 
 28 | :point_right: The full documentation is available [here](https://bento-starter.netlify.com/)
 29 | 
 30 | ## Demo
 31 | 
 32 | :point_right: [https://bento-starter.firebaseapp.com](https://bento-starter.firebaseapp.com)
 33 | 
 34 | Install the PWA demo from Google Play Store :point_right: [bento-starter Google Play Store](https://play.google.com/store/apps/details?id=com.bentostarter.bentostarterdemo)
 35 | 
 36 | <br />
 37 | 
 38 | <p align="center">
 39 |   <img src="https://user-images.githubusercontent.com/9840435/56022522-30ba0980-5d0c-11e9-8c61-23a9f91a926f.gif" alt="demo"/>
 40 | </p>
 41 | 
 42 | <br />
 43 | 
 44 | **Lighthouse score :**
 45 | 
 46 | ![Lighthouse score](https://raw.githubusercontent.com/kefranabg/bento-starter/master/resources/lighthouse-score-report.jpg)
 47 | 
 48 | **Optional preconfigured Github Actions workflow :**
 49 | 
 50 | - :heavy_check_mark: Check tests and quality
 51 | - :gear: Build the project
 52 | - :rocket: Deploy to firebase hosting
 53 | 
 54 | 
 55 | **The stack is made up of :**
 56 | 
 57 | - :metal: [Vue.js](https://vuejs.org/) : front-end framework
 58 | - :wrench: [Vue-cli](https://cli.vuejs.org/) : standard tooling for vue.js development
 59 | - :repeat: [Vuex](https://vuex.vuejs.org/) : state management
 60 | - :floppy_disk: [Firestore](https://firebase.google.com/products/firestore/) : cloud NoSQL Database
 61 | - :house: [Firebase hosting](https://firebase.google.com/products/hosting/) : fast and secure web hosting
 62 | - :bust_in_silhouette: [Firebase authentication](https://firebase.google.com/products/firestore/) : for easy authentication
 63 | - :iphone: [PWA](https://www.npmjs.com/package/@vue/cli-plugin-pwa) : progressive web app support
 64 | - :lipstick: [Prettier](https://prettier.io/) : code formatting rules
 65 | - :rotating_light: [Eslint](https://eslint.org/) : control code quality
 66 | - :white_check_mark: [Jest](https://jestjs.io/) : unit testing
 67 | - :white_check_mark: [Cypress](https://www.cypress.io/) : e2e testing
 68 | - :mag: [Vue head](https://github.com/ktquez/vue-head) : meta description per page
 69 | - :page_facing_up: [Optional][prerender spa plugin](https://github.com/chrisvfritz/prerender-spa-plugin) : pages prerendering
 70 | - :green_heart: [Optional][circleci](https://circleci.com/) : continuous integration/deployment
 71 | - :package: [Optional][bundlesize](https://github.com/siddharthkp/bundlesize) : control your js bundles sizes
 72 | 
 73 | **App embedded features :**
 74 | 
 75 | - :bust_in_silhouette: Google authentication
 76 | - :mobile_phone_off: Offline support (dynamic & static caching)
 77 | - :new: `New version available` prompt on new app deployments
 78 | - :heavy_plus_sign: `Add to home screen` prompt for ios & android
 79 | - :leftwards_arrow_with_hook: Smart redirection for auth protected routes
 80 | - :sparkles: Products page example to demonstrate app data management with firestore and vuex
 81 | - :muscle: Better PWA support for all browsers with [PWACompat](https://github.com/GoogleChromeLabs/pwacompat)
 82 | 
 83 | ## ✨ Contributors
 84 | 
 85 | <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
 86 | <!-- prettier-ignore -->
 87 | <table>
 88 |   <tr>
 89 |     <td align="center"><a href="https://github.com/tbetous"><img src="https://avatars3.githubusercontent.com/u/4435536?v=4" width="75px;" alt="Thomas Betous"/><br /><sub><b>Thomas Betous</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=tbetous" title="Code">💻</a> <a href="https://github.com/kefranabg/bento-starter/commits?author=tbetous" title="Documentation">📖</a> <a href="#question-tbetous" title="Answering Questions">💬</a> <a href="#ideas-tbetous" title="Ideas, Planning, & Feedback">🤔</a> <a href="#review-tbetous" title="Reviewed Pull Requests">👀</a> <a href="#maintenance-tbetous" title="Maintenance">🚧</a></td>
 90 |     <td align="center"><a href="https://www.franck-abgrall.me/"><img src="https://avatars3.githubusercontent.com/u/9840435?v=4" width="75px;" alt="Franck Abgrall"/><br /><sub><b>Franck Abgrall</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=kefranabg" title="Code">💻</a> <a href="https://github.com/kefranabg/bento-starter/commits?author=kefranabg" title="Documentation">📖</a> <a href="#question-kefranabg" title="Answering Questions">💬</a> <a href="#ideas-kefranabg" title="Ideas, Planning, & Feedback">🤔</a> <a href="#review-kefranabg" title="Reviewed Pull Requests">👀</a> <a href="#maintenance-kefranabg" title="Maintenance">🚧</a></td>
 91 |     <td align="center"><a href="https://errorna.me"><img src="https://avatars2.githubusercontent.com/u/6669733?v=4" width="75px;" alt="Thibaud Courtoison"/><br /><sub><b>Thibaud Courtoison</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=Errorname" title="Documentation">📖</a></td>
 92 |     <td align="center"><a href="https://github.com/mbernardeau"><img src="https://avatars0.githubusercontent.com/u/7049049?v=4" width="75px;" alt="Mathias Bernardeau"/><br /><sub><b>Mathias Bernardeau</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=mbernardeau" title="Code">💻</a> <a href="#ideas-mbernardeau" title="Ideas, Planning, & Feedback">🤔</a></td>
 93 |     <td align="center"><a href="https://jamesperkins.io/"><img src="https://avatars3.githubusercontent.com/u/45409975?v=4" width="75px;" alt="James Perkins"/><br /><sub><b>James Perkins</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=perkinsjr" title="Code">💻</a> <a href="https://github.com/kefranabg/bento-starter/issues?q=author%3Aperkinsjr" title="Bug reports">🐛</a> <a href="#question-perkinsjr" title="Answering Questions">💬</a></td>
 94 |     <td align="center"><a href="https://github.com/antoinecellier"><img src="https://avatars0.githubusercontent.com/u/5922848?v=4" width="75px;" alt="Antoine CELLIER"/><br /><sub><b>Antoine CELLIER</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=antoinecellier" title="Code">💻</a></td>
 95 |     <td align="center"><a href="https://github.com/0xflotus"><img src="https://avatars3.githubusercontent.com/u/26602940?v=4" width="75px;" alt="0xflotus"/><br /><sub><b>0xflotus</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=0xflotus" title="Documentation">📖</a></td>
 96 |   </tr>
 97 |   <tr>
 98 |     <td align="center"><a href="https://github.com/GregoryBevan"><img src="https://avatars1.githubusercontent.com/u/4266007?v=4" width="75px;" alt="Gr3gory B3van"/><br /><sub><b>Gr3gory B3van</b></sub></a><br /><a href="#ideas-GregoryBevan" title="Ideas, Planning, & Feedback">🤔</a></td>
 99 |     <td align="center"><a href="https://www.linkedin.com/pub/roy-bakker/41/aa7/335"><img src="https://avatars2.githubusercontent.com/u/10207274?v=4" width="75px;" alt="Roy Bakker"/><br /><sub><b>Roy Bakker</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/issues?q=author%3ARoyBkker" title="Bug reports">🐛</a></td>
100 |     <td align="center"><a href="https://adambar.pl"><img src="https://avatars0.githubusercontent.com/u/1309057?v=4" width="75px;" alt="Adam Bar"/><br /><sub><b>Adam Bar</b></sub></a><br /><a href="#ideas-NOtherDev" title="Ideas, Planning, & Feedback">🤔</a></td>
101 |     <td align="center"><a href="https://github.com/6ones"><img src="https://avatars3.githubusercontent.com/u/25098427?v=4" width="75px;" alt="Chidindu Ogbonna "/><br /><sub><b>Chidindu Ogbonna </b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=6ones" title="Code">💻</a></td>
102 |     <td align="center"><a href="https://github.com/VincentBourdeau"><img src="https://avatars1.githubusercontent.com/u/8518122?v=4" width="75px;" alt="Vincent Bourdeau"/><br /><sub><b>Vincent Bourdeau</b></sub></a><br /><a href="https://github.com/kefranabg/bento-starter/commits?author=VincentBourdeau" title="Code">💻</a></td>
103 |   </tr>
104 | </table>
105 | 
106 | <!-- ALL-CONTRIBUTORS-LIST:END -->
107 | 
108 | 
109 | ## Show your support
110 | 
111 | ⭐️ this repo
112 | 
113 | ## 💬 Chat
114 | 
115 | Want to chat with us  ? 👉 [join bento-starter slack](https://join.slack.com/t/bento-starter/shared_invite/enQtNjE5OTI5MzQyMTE3LTQ1N2M0NzAxYWM1OTJmYTA4YTIxMmM4MDhiNTI0MGNjZGIyNDFjY2UwNjE2Nzc3NzMzMzViOTYyOGViYjkxYzY)
116 | 
117 | ## License
118 | 
119 | This project is [MIT](https://github.com/kefranabg/bento-starter/blob/master/LICENSE) licensed.
120 | 


--------------------------------------------------------------------------------