From e46577fb0230e038ec56ff97b4a4b84e1b8ca9c4 Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Mon, 19 Jul 2021 13:55:00 -0700 Subject: [PATCH 01/13] add blank file rocket.js --- src/store/rocket.js | 0 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 src/store/rocket.js diff --git a/src/store/rocket.js b/src/store/rocket.js new file mode 100644 index 0000000..e69de29 From 34f56155c43d104e090874cecc61f3f9f53177b9 Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Mon, 19 Jul 2021 16:20:29 -0700 Subject: [PATCH 02/13] WIP call to placeholder API --- nuxt.config.js | 5 ++++- src/pages/index.vue | 9 +++++++-- src/store/rocket.js | 25 +++++++++++++++++++++++++ 3 files changed, 36 insertions(+), 3 deletions(-) diff --git a/nuxt.config.js b/nuxt.config.js index 2882877..0a47884 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -79,7 +79,10 @@ export default { /* ** Nuxt.js modules */ - modules: ['@nuxtjs/firebase'], + modules: ['@nuxtjs/firebase', '@nuxt/http'], + http: { + // proxyHeaders: false + }, firebase: { config: { apiKey: process.env.FIREBASE_API_KEY, diff --git a/src/pages/index.vue b/src/pages/index.vue index cde48c0..deeb6f7 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -28,13 +28,18 @@ export default { components: { FileUploader }, computed: { ...mapGetters({ - byStudio: 'movies/byStudio' + byStudio: 'movies/byStudio', + showEmployees: 'rocket/showEmployees' }), ...mapState({ - user: ({ auth }) => auth.user + user: ({ auth }) => auth.user, + employees: ({ rocket }) => rocket.employees }), disneyMovies () { return this.byStudio('Disney') + }, + apiEmployees () { + return this.showEmployees() } }, methods: { diff --git a/src/store/rocket.js b/src/store/rocket.js index e69de29..6a1f5b4 100644 --- a/src/store/rocket.js +++ b/src/store/rocket.js @@ -0,0 +1,25 @@ +const state = () => { + return {employees: null} + }; + + const mutations = { + setEmployees(state, employees) { + state.employees = employees; + } + }; + + const actions = { + async getEmployees ({ commit }) { + employees = await this.$http.$get('https://jsonplaceholder.typicode.com/users') + + commit('setEmployees', employees) + }} + + const getters = { + showEmployees(state) { + return state.employees + } + }; + + export default { state, mutations, actions, getters }; + \ No newline at end of file From 63f828b8e166f5303bae8147e2b562d532dbdbb0 Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Tue, 20 Jul 2021 08:54:31 -0700 Subject: [PATCH 03/13] update rocket.js store with placeholder API, tests --- package.json | 4 ++++ src/pages/index.vue | 9 +++++---- src/store/rocket.js | 13 +++++++++---- src/store/rocket.test.js | 38 ++++++++++++++++++++++++++++++++++++++ 4 files changed, 56 insertions(+), 8 deletions(-) create mode 100644 src/store/rocket.test.js diff --git a/package.json b/package.json index b4a9a81..c6e7f3f 100644 --- a/package.json +++ b/package.json @@ -11,12 +11,16 @@ "test": "jest" }, "dependencies": { + "@headlessui/vue": "^1.3.0", + "@heroicons/vue": "^1.0.2", "@mux/mux-node": "^3.1.0", + "@nuxt/http": "^0.6.4", "@nuxtjs/firebase": "^7.3.0", "@nuxtjs/style-resources": "^1.0.0", "body-parser": "^1.19.0", "cors": "^2.8.5", "dotenv": "^8.2.0", + "express": "^4.17.1", "firebase": "^8.0.1", "gsap": "^3.3.4", "lodash": "^4.17.15", diff --git a/src/pages/index.vue b/src/pages/index.vue index deeb6f7..07fde82 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -37,15 +37,16 @@ export default { }), disneyMovies () { return this.byStudio('Disney') - }, - apiEmployees () { - return this.showEmployees() } }, + mounted() { + this.getEmployees() + }, methods: { ...mapActions({ signInWithRedirect: 'auth/signInWithRedirect', - signOut: 'auth/signOut' + signOut: 'auth/signOut', + getEmployees: 'rocket/getEmployees' }) } } diff --git a/src/store/rocket.js b/src/store/rocket.js index 6a1f5b4..cc2c305 100644 --- a/src/store/rocket.js +++ b/src/store/rocket.js @@ -10,13 +10,18 @@ const state = () => { const actions = { async getEmployees ({ commit }) { - employees = await this.$http.$get('https://jsonplaceholder.typicode.com/users') - - commit('setEmployees', employees) + try{ + const employees = await this.$http.$get('https://jsonplaceholder.typicode.com/users') + console.log(employees) + commit('setEmployees', employees) + } catch(error) { + console.error(error.message) + } + }} const getters = { - showEmployees(state) { + employees(state) { return state.employees } }; diff --git a/src/store/rocket.test.js b/src/store/rocket.test.js new file mode 100644 index 0000000..5ea2609 --- /dev/null +++ b/src/store/rocket.test.js @@ -0,0 +1,38 @@ +import _ from "lodash" +import Vuex from "vuex" +import { createLocalVue } from "@vue/test-utils" + +describe("store/rocket", () => { + const localVue = createLocalVue() + localVue.use(Vuex) + let NuxtStore + let store + + beforeAll(async () => { + // note the store will mutate across tests + const storePath = `${process.env.buildDir}/store.js` + NuxtStore = await import(storePath) + }) + + beforeEach(async () => { + store = await NuxtStore.createStore() + }) + + describe("getEmployees", () => { + let employees + + beforeEach(() => { + console.log(_.keys(store)) + store.dispatch("rocket/getEmployees") + employees = store.getters['rocket/employees'] + }) + + test("service returns list as expected", () => { + expect(_.isArray(employees)).toBe(true) + }) + + // test("should be 6 movies total", () => { + // expect(disney.length).toBe(6) + // }) + }) +}) From 67c876776c969e771ddb51f11988e94798fd6e7a Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Tue, 20 Jul 2021 15:09:10 -0700 Subject: [PATCH 04/13] remove placeholder, insert live URL, WIP env vars --- nuxt.config.js | 5 +++++ src/pages/index.vue | 17 ++++++++++++----- src/store/rocket.js | 10 ++++++++-- 3 files changed, 25 insertions(+), 7 deletions(-) diff --git a/nuxt.config.js b/nuxt.config.js index 0a47884..c4e970d 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -135,5 +135,10 @@ export default { */ extend (config, ctx) { } + }, + publicRuntimeConfig: { + spacesId: process.env.CONTENTFUL_SPACES_ID, + contentfulAccessToken: process.env.CONTENTFUL_ACCESS_TOKEN, + contentfulFullURL: process.env.CONTENTFUL_FULL_URL } } diff --git a/src/pages/index.vue b/src/pages/index.vue index 07fde82..1175fbe 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -9,11 +9,17 @@ Sign Out -

Disney Movies

-
    -
  • - {{movie.title}} +

    Rocket Employees

    +
      +
    • + Name: {{employee.fields.name}}
      • +
    • + Position: {{employee.fields.position}} +
      • +
    @@ -29,7 +35,8 @@ export default { computed: { ...mapGetters({ byStudio: 'movies/byStudio', - showEmployees: 'rocket/showEmployees' + showEmployees: 'rocket/showEmployees', + filteredEmployeesData:'rocket/filteredEmployeesData' }), ...mapState({ user: ({ auth }) => auth.user, diff --git a/src/store/rocket.js b/src/store/rocket.js index cc2c305..47f7e6c 100644 --- a/src/store/rocket.js +++ b/src/store/rocket.js @@ -1,3 +1,4 @@ +import _ from 'lodash' const state = () => { return {employees: null} }; @@ -11,9 +12,9 @@ const state = () => { const actions = { async getEmployees ({ commit }) { try{ - const employees = await this.$http.$get('https://jsonplaceholder.typicode.com/users') + const employees = await this.$http.$get(this.$config.contentfulFullURL) console.log(employees) - commit('setEmployees', employees) + commit('setEmployees', employees.items) } catch(error) { console.error(error.message) } @@ -23,6 +24,11 @@ const state = () => { const getters = { employees(state) { return state.employees + }, + filteredEmployeesData(state){ + const fields = ['fields.name', 'fields.position', 'fields.profilePic.sys.id','sys.id'] + return _.map(state.employees, e => _.pick(e, fields)) + } }; From 378a0d79c6e4cd525a183f0c79cf47207a634d38 Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Wed, 21 Jul 2021 15:21:09 -0700 Subject: [PATCH 05/13] replace envs, format API response, update UI --- nuxt.config.js | 1 - src/pages/index.vue | 27 +++++++-------------------- src/store/rocket.js | 25 +++++++++++++++++-------- 3 files changed, 24 insertions(+), 29 deletions(-) diff --git a/nuxt.config.js b/nuxt.config.js index c4e970d..e5e9743 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -139,6 +139,5 @@ export default { publicRuntimeConfig: { spacesId: process.env.CONTENTFUL_SPACES_ID, contentfulAccessToken: process.env.CONTENTFUL_ACCESS_TOKEN, - contentfulFullURL: process.env.CONTENTFUL_FULL_URL } } diff --git a/src/pages/index.vue b/src/pages/index.vue index 1175fbe..f19c236 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -1,28 +1,20 @@ @@ -34,17 +26,12 @@ export default { components: { FileUploader }, computed: { ...mapGetters({ - byStudio: 'movies/byStudio', showEmployees: 'rocket/showEmployees', - filteredEmployeesData:'rocket/filteredEmployeesData' }), ...mapState({ user: ({ auth }) => auth.user, employees: ({ rocket }) => rocket.employees - }), - disneyMovies () { - return this.byStudio('Disney') - } + }) }, mounted() { this.getEmployees() diff --git a/src/store/rocket.js b/src/store/rocket.js index 47f7e6c..4eb4ca4 100644 --- a/src/store/rocket.js +++ b/src/store/rocket.js @@ -12,9 +12,23 @@ const state = () => { const actions = { async getEmployees ({ commit }) { try{ - const employees = await this.$http.$get(this.$config.contentfulFullURL) - console.log(employees) - commit('setEmployees', employees.items) + const employees = await this.$http.$get("https://cdn.contentful.com/spaces/"+this.$config.spacesId+"/entries?access_token="+this.$config.contentfulAccessToken+"&content_type=team") + const itemsFields = ['fields.name', 'fields.position', 'fields.profilePic.sys.id','sys.id'] + const itemsFilteredEmployees = _.map(employees.items, e => _.pick(e, itemsFields)) + const includesFields = ['fields.file.fileName', 'fields.file.url', 'sys.id'] + const includesFilteredEmployees = _.map(employees.includes.Asset, e => _.pick(e, includesFields)) + const mergedFilteredEmployees = _.values(_.merge(_.keyBy(includesFilteredEmployees,'sys.id'), _.keyBy(itemsFilteredEmployees,'fields.profilePic.sys.id' ) )) + const formattedFinalFilteredEmployees = mergedFilteredEmployees.map(function(item){ + return {id:item.sys.id, + name:item.fields.name, + position:item.fields.position, + imageId:item.fields.profilePic.sys.id, + imageName:item.fields.file.fileName, + imageUrl:"http:"+ (item.fields.file.url) + } + } + ) + commit('setEmployees', formattedFinalFilteredEmployees) } catch(error) { console.error(error.message) } @@ -25,11 +39,6 @@ const state = () => { employees(state) { return state.employees }, - filteredEmployeesData(state){ - const fields = ['fields.name', 'fields.position', 'fields.profilePic.sys.id','sys.id'] - return _.map(state.employees, e => _.pick(e, fields)) - - } }; export default { state, mutations, actions, getters }; From 379c12f86506ce8005bef1bd8a12845aafb26c1f Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Wed, 21 Jul 2021 15:23:38 -0700 Subject: [PATCH 06/13] update getters --- src/pages/index.vue | 1 - src/store/rocket.js | 3 --- 2 files changed, 4 deletions(-) diff --git a/src/pages/index.vue b/src/pages/index.vue index f19c236..afd733d 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -26,7 +26,6 @@ export default { components: { FileUploader }, computed: { ...mapGetters({ - showEmployees: 'rocket/showEmployees', }), ...mapState({ user: ({ auth }) => auth.user, diff --git a/src/store/rocket.js b/src/store/rocket.js index 4eb4ca4..39ba863 100644 --- a/src/store/rocket.js +++ b/src/store/rocket.js @@ -36,9 +36,6 @@ const state = () => { }} const getters = { - employees(state) { - return state.employees - }, }; export default { state, mutations, actions, getters }; From 40acb9f1f1e5a4a41561ba6955a553118ba9acce Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Wed, 21 Jul 2021 15:29:55 -0700 Subject: [PATCH 07/13] remove old dependencies --- package.json | 2 -- 1 file changed, 2 deletions(-) diff --git a/package.json b/package.json index c6e7f3f..8d3def0 100644 --- a/package.json +++ b/package.json @@ -11,8 +11,6 @@ "test": "jest" }, "dependencies": { - "@headlessui/vue": "^1.3.0", - "@heroicons/vue": "^1.0.2", "@mux/mux-node": "^3.1.0", "@nuxt/http": "^0.6.4", "@nuxtjs/firebase": "^7.3.0", From 08324c7915d724358645fbe3fba80c891420ba39 Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Thu, 22 Jul 2021 10:22:09 -0700 Subject: [PATCH 08/13] updates from first PR review --- nuxt.config.js | 1 + src/store/rocket.js | 9 +++++---- src/store/rocket.test.js | 38 -------------------------------------- 3 files changed, 6 insertions(+), 42 deletions(-) delete mode 100644 src/store/rocket.test.js diff --git a/nuxt.config.js b/nuxt.config.js index e5e9743..08980ed 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -139,5 +139,6 @@ export default { publicRuntimeConfig: { spacesId: process.env.CONTENTFUL_SPACES_ID, contentfulAccessToken: process.env.CONTENTFUL_ACCESS_TOKEN, + contentfulFullUrl: process.env.CONTENTFUL_FULL_URL } } diff --git a/src/store/rocket.js b/src/store/rocket.js index 39ba863..d75b04a 100644 --- a/src/store/rocket.js +++ b/src/store/rocket.js @@ -12,19 +12,20 @@ const state = () => { const actions = { async getEmployees ({ commit }) { try{ - const employees = await this.$http.$get("https://cdn.contentful.com/spaces/"+this.$config.spacesId+"/entries?access_token="+this.$config.contentfulAccessToken+"&content_type=team") + const employees = await this.$http.$get(this.$config.contentfulFullUrl) const itemsFields = ['fields.name', 'fields.position', 'fields.profilePic.sys.id','sys.id'] const itemsFilteredEmployees = _.map(employees.items, e => _.pick(e, itemsFields)) const includesFields = ['fields.file.fileName', 'fields.file.url', 'sys.id'] const includesFilteredEmployees = _.map(employees.includes.Asset, e => _.pick(e, includesFields)) const mergedFilteredEmployees = _.values(_.merge(_.keyBy(includesFilteredEmployees,'sys.id'), _.keyBy(itemsFilteredEmployees,'fields.profilePic.sys.id' ) )) - const formattedFinalFilteredEmployees = mergedFilteredEmployees.map(function(item){ - return {id:item.sys.id, + const formattedFinalFilteredEmployees = _.map(mergedFilteredEmployees, item => { + return { + id:item.sys.id, name:item.fields.name, position:item.fields.position, imageId:item.fields.profilePic.sys.id, imageName:item.fields.file.fileName, - imageUrl:"http:"+ (item.fields.file.url) + imageUrl:item.fields.file.url } } ) diff --git a/src/store/rocket.test.js b/src/store/rocket.test.js deleted file mode 100644 index 5ea2609..0000000 --- a/src/store/rocket.test.js +++ /dev/null @@ -1,38 +0,0 @@ -import _ from "lodash" -import Vuex from "vuex" -import { createLocalVue } from "@vue/test-utils" - -describe("store/rocket", () => { - const localVue = createLocalVue() - localVue.use(Vuex) - let NuxtStore - let store - - beforeAll(async () => { - // note the store will mutate across tests - const storePath = `${process.env.buildDir}/store.js` - NuxtStore = await import(storePath) - }) - - beforeEach(async () => { - store = await NuxtStore.createStore() - }) - - describe("getEmployees", () => { - let employees - - beforeEach(() => { - console.log(_.keys(store)) - store.dispatch("rocket/getEmployees") - employees = store.getters['rocket/employees'] - }) - - test("service returns list as expected", () => { - expect(_.isArray(employees)).toBe(true) - }) - - // test("should be 6 movies total", () => { - // expect(disney.length).toBe(6) - // }) - }) -}) From b25cd21d58a4515743fb52f7848c1fef9530dc4b Mon Sep 17 00:00:00 2001 From: Rudy Becker Date: Fri, 23 Jul 2021 13:41:17 -0700 Subject: [PATCH 09/13] add Slack employees API call --- src/pages/index.vue | 11 +++++++---- src/store/rocket.js | 40 ++++++++++++++++++++++++++++++++++------ 2 files changed, 41 insertions(+), 10 deletions(-) diff --git a/src/pages/index.vue b/src/pages/index.vue index afd733d..96d94d5 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -1,7 +1,7 @@