Upgrade to production Nuxt release (1.4.0) (#71)

* Jump to node 9.8.0

Use .nvmrc to indicate desired version for now. The `engines` object is
pretty much useless to anything outside of Heroku since it doesn't
enforce a strict requirement.

Investigated using the node package [1] to install a specific version of
the node binary as a requirement, but there's controversy over bloat
factor [2, 3] and it is not yet fully compatible with yarn [4].

[1] https://www.npmjs.com/package/node
[2] https://twitter.com/housecor/status/962347301456015360
[3] https://twitter.com/maybekatz/status/958157474397171712
[4] aredridel/node-bin-gen#44

* Bump to node-sass 4.7.2

Node 9.8.0 was not happy with previous version lock (4.5.3).

* Upgrade to Nuxt 1.4.0

Previously running pre-production release.

Includes following adjustments:

* Tweak Nuxt config for eslint (passing context)

* Swap in `eslint-plugin-vue` for `eslint-plugin-html` & use it along
  with standard for base rules

* Fix alias for components to align with Nuxt 1.x [1]

* Export state as function for Vuex store, since using modules mode [2]

[1] https://nuxtjs.org/guide/directory-structure#aliases
[2] https://nuxtjs.org/guide/vuex-store#modules-mode

* Replace nuxt-helpers/axios with axios module

As indicated in initial implementation of fetching data back in 42d0f7e.

Nuxt modules have come a long way in the past year. Basically follow
the documentation [1] to swap out the helper for the module.

The module makes axios widely available across the app:

* plugins
* vuex store
* pages
* middleware
* other modules

But notice this does not include external utility files, which is a
necessity here for `utils/libcal.js`. The workaround was to pass
`this.$axios` from the store to the util as a param. Not sure this will
be the longterm solution since there are ongoing discussions in the
module repo on potential options on better sharing the configured axios
instance with external files.

[1] https://axios.nuxtjs.org

* Drop add package

Never used. Mistakenly introduced in ca06ecd as part of #20.

* Upgrade packages to latest

And satisfy unmet peer dependencies.

* Bump app version to 0.2.0

.eslintrc.js

@@ -1,16 +1,22 @@
 module.exports = {
   root: true,
-  parser: 'babel-eslint',
   env: {
     browser: true,
     node: true
   },
-  extends: 'standard',
+  parserOptions: {
+    parser: 'babel-eslint'
+  },
+  extends: [
+    'standard',
+    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
+    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
+    'plugin:vue/essential'
+  ],
   // required to lint *.vue files
   plugins: [
-    'html'
+    'vue'
   ],
   // add your custom rules here
   rules: {},
-  globals: {}
 }

.gitignore

@@ -9,6 +9,3 @@ npm-debug.log
 
 # Nuxt generate
 dist
-
-# Nuxt helpers
-.nuxt-helpers

.nvmrc

@@ -0,0 +1 @@
+9.8.0

components/oku-circ.vue

@@ -21,13 +21,13 @@
     <device type="phoneCharger" model="iPhone 4" :count="phoneChargers[location].iphone4Available"/>
     <device type="phoneCharger" model="iPhone 5 &amp; up" :count="phoneChargers[location].iphoneAvailable"/>
     <device type="phoneCharger" model="Micro USB" :count="phoneChargers[location].microUsbAvailable"/>
-    <device type="phoneCharger" model="USB-C":count="phoneChargers[location].usbCAvailable"/>
+    <device type="phoneCharger" model="USB-C" :count="phoneChargers[location].usbCAvailable"/>
   </div>
 </div>
 </template>
 
 <script>
-import DEVICE from '~components/oku-device'
+import DEVICE from '~/components/oku-device'
 
 export default {
   components: {
@@ -47,7 +47,6 @@ export default {
 }
 </script>
 
-
 <style lang="scss">
 /**
  ** VARIABLES
@@ -380,7 +379,6 @@ time {
         padding-left: 50 * $ph;
         padding-top: 100 * $ph;
 
-
         h1 {
             text-transform: capitalize;
             font-weight: normal;

nuxt.config.js

@@ -1,8 +1,7 @@
-const NuxtHelpers = require('nuxt-helpers')
-
-module.exports = NuxtHelpers([
-  'axios'
-], {
+module.exports = {
+  modules: [
+    '@nuxtjs/axios'
+  ],
   /*
   ** Headers of the page
   */
@@ -29,8 +28,8 @@ module.exports = NuxtHelpers([
     /*
     ** Run ESLINT on save
     */
-    extend (config, ctx) {
-      if (ctx.isClient) {
+    extend (config, { isDev, isClient }) {
+      if (isDev && isClient) {
         config.module.rules.push({
           enforce: 'pre',
           test: /\.(js|vue)$/,
@@ -40,4 +39,4 @@ module.exports = NuxtHelpers([
       }
     }
   }
-})
+}

package.json

@@ -1,22 +1,20 @@
 {
   "name": "signage",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Cornell University Library - Digital Signage",
   "contributors": [
     "Manolo Bevia <manolo.bevia@cornell.edu>",
     "Nick Cappadona <nick.cappadona@cornell.edu>"
   ],
   "private": true,
   "engines": {
-    "node": "7.10.0"
+    "node": "9.8.0"
   },
   "dependencies": {
-    "add": "^2.0.6",
-    "axios": "^0.16.1",
+    "@nuxtjs/axios": "^5.1.1",
     "jsonp-promise": "^0.1.2",
     "lodash": "^4.17.4",
-    "nuxt": "latest",
-    "nuxt-helpers": "^0.10.0"
+    "nuxt": "^1.4.0"
   },
   "scripts": {
     "dev": "nuxt",
@@ -32,16 +30,19 @@
     "lint"
   ],
   "devDependencies": {
-    "babel-eslint": "^7.1.1",
-    "eslint": "^3.15.0",
-    "eslint-config-standard": "^6.2.1",
-    "eslint-loader": "^1.6.1",
-    "eslint-plugin-html": "^2.0.0",
+    "babel-eslint": "^8.2.2",
+    "eslint": "^4.19.0",
+    "eslint-config-standard": "^11.0.0",
+    "eslint-loader": "^2.0.0",
+    "eslint-plugin-import": "^2.9.0",
+    "eslint-plugin-node": "^6.0.1",
     "eslint-plugin-promise": "^3.4.1",
-    "eslint-plugin-standard": "^2.0.1",
+    "eslint-plugin-standard": "^3.0.1",
+    "eslint-plugin-vue": "^4.3.0",
     "moment": "^2.18.1",
     "node-sass": "^4.5.3",
     "pre-commit": "^1.2.2",
-    "sass-loader": "^6.0.5"
+    "sass-loader": "^6.0.5",
+    "webpack": "^4.1.1"
   }
 }

pages/oku/_location.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script>
-import OKU from '~components/oku-circ'
+import OKU from '~/components/oku-circ'
 import moment from 'moment'
 import { mapState } from 'vuex'
 

store/consultDesk.js

@@ -1,8 +1,8 @@
 import { assign, isEmpty } from 'lodash'
 import Robin from '~/utils/libcal'
 
-export const state = {
-}
+export const state = () => ({
+})
 
 export const mutations = {
   update (state, data) {
@@ -18,14 +18,14 @@ export const actions = {
     // -- c. the stored change in status has past
     // -- d. the clock has struck midnight (we've crossed over to the next day)
     if (isEmpty(state) || Robin.staleCache(state.updated) || Robin.pastChange(state.statusChange) || Robin.nextDay(state.updated)) {
-      let feed = await Robin.getHours(payload.desk, undefined, payload.jsonp)
+      let feed = await Robin.getHours(this.$axios, payload.desk, undefined, payload.jsonp)
 
       // Use bullet delimiter for multi-item description
       let description = Robin.api.desks[payload.desk].description.join(' \u2022 ')
 
       const libcalStatus = feed.locations[0].times.status
       const allHours = typeof feed.locations[0].times.hours === 'undefined' ? null : feed.locations[0].times.hours
-      const status = await Robin.openNow(payload.desk, libcalStatus, allHours, payload.jsonp)
+      const status = await Robin.openNow(this.$axios, payload.desk, libcalStatus, allHours, payload.jsonp)
 
       // Relabel status under certain circumstances
       let statusLabel = Robin.statusLabel(payload.desk, status.current)

store/laptops.js

@@ -1,9 +1,8 @@
-import { $get } from '~/.nuxt-helpers/axios'
 import Batman from '~/utils/libservices'
 
-export const state = {
+export const state = () => ({
   locations: {}
-}
+})
 
 export const mutations = {
   update (state, feed) {
@@ -18,7 +17,7 @@ export const mutations = {
 
 export const actions = {
   async fetchStatus ({ commit }, location) {
-    let feed = await $get(Batman.api.endpoints.laptops + Batman.api.locations[location])
+    let feed = await this.$axios.$get(Batman.api.endpoints.laptops + Batman.api.locations[location])
     feed['location'] = location
     commit('update', feed)
   }

store/phoneChargers.js

@@ -1,10 +1,9 @@
 import { assign } from 'lodash'
-import { $get } from '~/.nuxt-helpers/axios'
 import Batman from '~/utils/libservices'
 
-export const state = {
+export const state = () => ({
   locations: {}
-}
+})
 
 export const mutations = {
   update (state, feed) {
@@ -15,7 +14,7 @@ export const mutations = {
 
 export const actions = {
   async fetchStatus ({ commit }, location) {
-    let feed = await $get(Batman.api.endpoints.phoneChargers + Batman.api.locations[location])
+    let feed = await this.$axios.$get(Batman.api.endpoints.phoneChargers + Batman.api.locations[location])
     const list = feed.equipmentList
     const phoneChargers = {
       'availability': {

utils/libcal.js

@@ -1,4 +1,3 @@
-import { $get } from '~/.nuxt-helpers/axios'
 import moment from 'moment'
 import jsonpPromise from 'jsonp-promise'
 
@@ -100,7 +99,7 @@ export default {
   formatDate: function (date) {
     return moment(date).format('Y-MM-DD')
   },
-  getHours: function (desk, date, jsonp = false) {
+  getHours: function (axios, desk, date, jsonp = false) {
     const requestDate = typeof date === 'undefined' ? '' : '&date=' + this.formatDate(date)
     const url = this.api.endpoints.hours + this.api.desks[desk].id + requestDate
 
@@ -110,19 +109,19 @@ export default {
       return jsonpPromise(url).promise
     } else {
       // Non-issue when proxied through server on initial load (thanks Nuxt)
-      return $get(url)
+      return axios.$get(url)
     }
   },
   nextDay: function (lastUpdated) {
     return moment().isAfter(moment(lastUpdated), 'd')
   },
-  async nextOpening (desk, jsonp = false) {
+  async nextOpening (axios, desk, jsonp = false) {
     var bigWinner = null
 
     // Check today plus next 14 days
     for (var i = 0; i < 15; i++) {
       var dateToCheck = moment().add(i, 'days')
-      var openingTime = await this.openingTime(desk, this.formatDate(dateToCheck), jsonp)
+      var openingTime = await this.openingTime(axios, desk, this.formatDate(dateToCheck), jsonp)
 
       if (openingTime !== null) {
         // Use openingTime to update existing moment and set hours & mins
@@ -137,8 +136,8 @@ export default {
 
     return bigWinner
   },
-  async openingTime (desk, date, jsonp = false) {
-    let feed = await this.getHours(desk, date, jsonp)
+  async openingTime (axios, desk, date, jsonp = false) {
+    let feed = await this.getHours(axios, desk, date, jsonp)
     const hours = typeof feed.locations[0].times.hours === 'undefined' ? null : feed.locations[0].times.hours
 
     // Copy hours since it gets emptied after using as function param
@@ -152,7 +151,7 @@ export default {
 
     return hours !== null ? hours[0].from : null
   },
-  async openNow (desk, libcalStatus, hours, jsonp = false) {
+  async openNow (axios, desk, libcalStatus, hours, jsonp = false) {
     let status = {
       current: 'closed',
       timestamp: moment() // Use for caching results from LibCal API
@@ -171,7 +170,7 @@ export default {
       }
     }
 
-    let statusChange = await this.nextOpening(desk, jsonp)
+    let statusChange = await this.nextOpening(axios, desk, jsonp)
 
     status.change = statusChange