Verified Commit 8052c6da authored by Aral Balkan's avatar Aral Balkan
Browse files

Configure Feathers app in Vuex store for server-side & client-side

  * Also, in the store, we are now getting the owner’s settings data via a Feathers service call instead of importing the hardcoded data from within the project directory.
parent 6d39dcff
// @ts-check // @ts-check
/* global Primus, location */
const siteConfiguration = require('../assets/data.json') import feathers from '@feathersjs/feathers'
import primus from '@feathersjs/primus-client'
import auth from '@feathersjs/authentication-client'
import rest from '@feathersjs/rest-client'
import axios from 'axios'
// Mock: sign-in state export const state = () => {}
siteConfiguration.configured = true
siteConfiguration.signedIn = false
export const state = () => (siteConfiguration) // Configure the Feathers application differently based on whether we’re running
// on the server or the client. On the client, configure it with Primus for
// web socket connections to the domain the app is running on. On the server,
// use a HTTP REST transport to localhost.
//
// To use Feathers services from anywhere in Vue/the client, simply:
//
// import { app } from '~/store'
// app.service('…') // etc.
//
let _app = feathers().configure(auth())
if (process.browser) {
// Configure for client-side use.
const socket = new Primus(location.href)
_app.configure(primus(socket))
} else {
// Configure for server-side use.
const restViaAxios = rest('http://localhost:3030').axios(axios)
_app.configure(restViaAxios)
}
export const app = _app
export const mutations = { export const mutations = {
name (state, text) { name (state, text) {
...@@ -22,8 +46,13 @@ export const mutations = { ...@@ -22,8 +46,13 @@ export const mutations = {
state.backgroundImage = url state.backgroundImage = url
}, },
backgroundColour (state, colourValue) { backgroundColour (state, colourValue) {
console.log(colourValue) // The colour value could be a HEX string or an object as returned by
state.backgroundColour = colourValue.hex // colour picker. Handle accordingly.
if (typeof colourValue === 'string') {
state.backgroundColour = colourValue
} else {
state.backgroundColour = colourValue.hex
}
}, },
configured (state, value) { configured (state, value) {
console.log(`Store: state.configured = ${value}`) console.log(`Store: state.configured = ${value}`)
...@@ -35,11 +64,19 @@ export const mutations = { ...@@ -35,11 +64,19 @@ export const mutations = {
} }
} }
// export const actions = { export const actions = {
// async nuxtServerInit ({ commit }, { app }) { async nuxtServerInit ({ commit }, { app }) {
// const siteConfiguration = await app.$axios.$get('https://aral.eu.ngrok.io/site-configuration') const siteConfiguration = await _app.service('site-configuration').find()
// Mock: sign-in and site configuration state
commit('configured', true)
commit('signedIn', true)
// commit('name', siteConfiguration.name) // TODO: There must be a better way to do this; explore. []
// commit('bio', siteConfiguration.bio) commit('name', siteConfiguration.name)
// } commit('bio', siteConfiguration.bio)
// } commit('profileImage', siteConfiguration.profileImage)
commit('backgroundImage', siteConfiguration.backgroundImage)
commit('backgroundColour', siteConfiguration.backgroundColour)
}
}
...@@ -4,6 +4,16 @@ ...@@ -4,6 +4,16 @@
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
"dependencies": { "dependencies": {
"@feathersjs/authentication-client": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@feathersjs/authentication-client/-/authentication-client-1.0.2.tgz",
"integrity": "sha512-uZfWWMLqNkXcGi5bCuvQwLjBWvUhHtGjK4yZJh3KIHFAESBlQ4/TlqI/JRz2RuswfGfbyNtj9ARPam71YCGOpw==",
"requires": {
"@feathersjs/errors": "3.3.0",
"debug": "3.1.0",
"jwt-decode": "2.2.0"
}
},
"@feathersjs/commons": { "@feathersjs/commons": {
"version": "1.4.0", "version": "1.4.0",
"resolved": "https://registry.npmjs.org/@feathersjs/commons/-/commons-1.4.0.tgz", "resolved": "https://registry.npmjs.org/@feathersjs/commons/-/commons-1.4.0.tgz",
...@@ -67,6 +77,24 @@ ...@@ -67,6 +77,24 @@
"primus-emitter": "3.1.1" "primus-emitter": "3.1.1"
} }
}, },
"@feathersjs/primus-client": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@feathersjs/primus-client/-/primus-client-1.1.0.tgz",
"integrity": "sha512-a6zczmbHF7Rmm/KHNMIlD6CNEjdhbFkCHxdBaM+CaKMb9tkW8sNdR4Pc1VA/t8CRUqOSECPE9mk141MwoKwQRA==",
"requires": {
"@feathersjs/transport-commons": "4.0.0"
}
},
"@feathersjs/rest-client": {
"version": "1.3.4",
"resolved": "https://registry.npmjs.org/@feathersjs/rest-client/-/rest-client-1.3.4.tgz",
"integrity": "sha512-GIe4u6uLk/69A8qOee2Zz9XQBkO1C6jNWFjWYoKiiuOj3Gz294AHv5tMF7DzmnWOQyVosSrZOzgfH98yf2VNuw==",
"requires": {
"@feathersjs/commons": "1.4.0",
"@feathersjs/errors": "3.3.0",
"qs": "6.5.1"
}
},
"@feathersjs/transport-commons": { "@feathersjs/transport-commons": {
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npmjs.org/@feathersjs/transport-commons/-/transport-commons-4.0.0.tgz", "resolved": "https://registry.npmjs.org/@feathersjs/transport-commons/-/transport-commons-4.0.0.tgz",
...@@ -89,6 +117,17 @@ ...@@ -89,6 +117,17 @@
"axios-retry": "3.0.2", "axios-retry": "3.0.2",
"chalk": "2.3.0", "chalk": "2.3.0",
"debug": "3.1.0" "debug": "3.1.0"
},
"dependencies": {
"axios": {
"version": "0.17.1",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.17.1.tgz",
"integrity": "sha1-LY4+XQvb1zJ/kbyBT1xXZg+Bgk0=",
"requires": {
"follow-redirects": "1.4.1",
"is-buffer": "1.1.6"
}
}
} }
}, },
"@nuxtjs/proxy": { "@nuxtjs/proxy": {
...@@ -446,9 +485,9 @@ ...@@ -446,9 +485,9 @@
"integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=" "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
}, },
"axios": { "axios": {
"version": "0.17.1", "version": "0.18.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.17.1.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-0.18.0.tgz",
"integrity": "sha1-LY4+XQvb1zJ/kbyBT1xXZg+Bgk0=", "integrity": "sha1-MtU+SFHv3AoRmTts0AB4nXDAUQI=",
"requires": { "requires": {
"follow-redirects": "1.4.1", "follow-redirects": "1.4.1",
"is-buffer": "1.1.6" "is-buffer": "1.1.6"
...@@ -6532,6 +6571,11 @@ ...@@ -6532,6 +6571,11 @@
"integrity": "sha1-OGchPo3Xm/Ho8jAMDPwe+xgsDfE=", "integrity": "sha1-OGchPo3Xm/Ho8jAMDPwe+xgsDfE=",
"dev": true "dev": true
}, },
"jwt-decode": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-2.2.0.tgz",
"integrity": "sha1-fYa9VmefWM5qhHBKZX3TkruoGnk="
},
"kind-of": { "kind-of": {
"version": "6.0.2", "version": "6.0.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
......
...@@ -30,12 +30,16 @@ ...@@ -30,12 +30,16 @@
"mocha": "mocha server/test/ --recursive --exit" "mocha": "mocha server/test/ --recursive --exit"
}, },
"dependencies": { "dependencies": {
"@feathersjs/authentication-client": "^1.0.2",
"@feathersjs/configuration": "^1.0.1", "@feathersjs/configuration": "^1.0.1",
"@feathersjs/errors": "^3.3.0", "@feathersjs/errors": "^3.3.0",
"@feathersjs/express": "^1.2.0", "@feathersjs/express": "^1.2.0",
"@feathersjs/feathers": "^3.1.3", "@feathersjs/feathers": "^3.1.3",
"@feathersjs/primus": "^3.2.0", "@feathersjs/primus": "^3.2.0",
"@feathersjs/primus-client": "^1.1.0",
"@feathersjs/rest-client": "^1.3.4",
"@nuxtjs/axios": "^5.0.1", "@nuxtjs/axios": "^5.0.1",
"axios": "^0.18.0",
"buefy": "^0.6.3", "buefy": "^0.6.3",
"compression": "^1.7.2", "compression": "^1.7.2",
"cors": "^2.8.4", "cors": "^2.8.4",
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment