diff --git a/.env.local b/.env.local index 36c838d..508031d 100644 --- a/.env.local +++ b/.env.local @@ -1,2 +1,3 @@ -VUE_APP_SPECKLE_ID=e5ae7168fd -VUE_APP_SPECKLE_SECRET=8438ffe22e \ No newline at end of file +VUE_APP_SPECKLE_ID=720cce4c99 +VUE_APP_SPECKLE_SECRET=d26ea2c5c0 +VUE_APP_SERVER_URL=https://latest.speckle.dev \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index c84a7d7..7736421 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4148,12 +4148,22 @@ "assert-plus": "^1.0.0" } }, + "date-fns": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz", + "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==" + }, "de-indent": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz", "integrity": "sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=", "dev": true }, + "debounce": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz", + "integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug==" + }, "debug": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", @@ -5777,6 +5787,12 @@ "integrity": "sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ==", "dev": true }, + "graphql-tag": { + "version": "2.11.0", + "resolved": "https://registry.npmjs.org/graphql-tag/-/graphql-tag-2.11.0.tgz", + "integrity": "sha512-VmsD5pJqWJnQZMUeRwrDhfgoyqcfwEkvtpANqcoUG8/tOLkwNgU9mzub/Mc78OJMhHjx7gfAMTxzdG43VGg3bA==", + "dev": true + }, "gzip-size": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz", @@ -11523,6 +11539,14 @@ "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", "dev": true }, + "vue-timeago": { + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/vue-timeago/-/vue-timeago-5.1.3.tgz", + "integrity": "sha512-lHTRuOXhQzQXa6SC52IlO6UyWBZ5eIyD819QGIep++D61HeCV15h/WZ7M1iEsOWttjztMpg+3wYWHO3i2Ijdzw==", + "requires": { + "date-fns": "^1.29.0" + } + }, "vuetify": { "version": "2.4.11", "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-2.4.11.tgz", diff --git a/package.json b/package.json index 5fdf606..2d8e730 100644 --- a/package.json +++ b/package.json @@ -11,9 +11,11 @@ "@speckle/objectloader": "^2.0.0", "@speckle/viewer": "^2.0.1", "core-js": "^3.6.5", + "debounce": "^1.2.1", "register-service-worker": "^1.7.1", "vue": "^2.6.11", "vue-router": "^3.2.0", + "vue-timeago": "^5.1.3", "vuetify": "^2.4.11", "vuex": "^3.4.0" }, @@ -28,6 +30,7 @@ "babel-eslint": "^10.1.0", "eslint": "^6.7.2", "eslint-plugin-vue": "^6.2.2", + "graphql-tag": "^2.11.0", "sass": "^1.32.0", "sass-loader": "^10.0.0", "vue-cli-plugin-vuetify": "~2.3.1", diff --git a/src/App.vue b/src/App.vue index 0993689..cd7f391 100644 --- a/src/App.vue +++ b/src/App.vue @@ -40,21 +40,14 @@ - + diff --git a/src/components/StreamSearch.vue b/src/components/StreamSearch.vue new file mode 100644 index 0000000..13d4331 --- /dev/null +++ b/src/components/StreamSearch.vue @@ -0,0 +1,103 @@ + + + + + \ No newline at end of file diff --git a/src/main.js b/src/main.js index 896991e..c59f092 100644 --- a/src/main.js +++ b/src/main.js @@ -5,6 +5,9 @@ import router from './router' import store from './store' import vuetify from './plugins/vuetify' +import VueTimeago from 'vue-timeago' +Vue.use(VueTimeago, { locale: 'en' }) + Vue.config.productionTip = false diff --git a/src/store/index.js b/src/store/index.js index 3f521fd..ff2783e 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,8 +1,9 @@ import Vue from 'vue' import Vuex from 'vuex' + Vue.use(Vuex) -const TOKEN='SpeckleDemo.AuthToken' +const TOKEN = 'SpeckleDemo.AuthToken' const REFRESH_TOKEN = 'SpeckleDemo.RefreshToken' const CHALLENGE = 'SpeckleDemo.Challenge' const SERVER_URL = process.env.VUE_APP_SERVER_URL @@ -43,10 +44,10 @@ export default new Vuex.Store({ isAuthenticated: (state) => state.user != null }, mutations: { - setUser(state, user){ + setUser(state, user) { state.user = user }, - setServerInfo(state, info){ + setServerInfo(state, info) { state.serverInfo = info }, setToken(state, token) { @@ -62,65 +63,70 @@ export default new Vuex.Store({ context.commit("setServerInfo", null) context.commit("setToken", null) context.commit("setRefreshToken", null) - localStorage.removeItem( TOKEN ) - localStorage.removeItem( REFRESH_TOKEN ) + localStorage.removeItem(TOKEN) + localStorage.removeItem(REFRESH_TOKEN) }, async exchangeAccessCode(context, accessCode) { - console.log('VUEX - Access code exchange', accessCode) - let response = await fetch( `${SERVER_URL}/auth/token/`, { + let response = await fetch(`${SERVER_URL}/auth/token/`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, - body: JSON.stringify( { + body: JSON.stringify({ accessCode: accessCode, appId: 'explorer', appSecret: 'explorer', - challenge: localStorage.getItem( CHALLENGE ) - } ) - } ) + challenge: localStorage.getItem(CHALLENGE) + }) + }) - let data = await response.json( ) + let data = await response.json() console.log("data", data.token) - if ( data.token ) { - localStorage.removeItem( CHALLENGE ) + if (data.token) { + localStorage.removeItem(CHALLENGE) context.commit("setToken", data.token) context.commit("setRefreshToken", data.refreshToken) - localStorage.setItem( TOKEN, data.token ) - localStorage.setItem( REFRESH_TOKEN, data.refreshToken ) + localStorage.setItem(TOKEN, data.token) + localStorage.setItem(REFRESH_TOKEN, data.refreshToken) } }, - async getUser(context) { - console.log("Getting user!") + getUser(context) { let token = localStorage.getItem(TOKEN) if (token) { - let testResponse = await fetch(`${SERVER_URL}/graphql`, { - method: 'POST', - headers: { - 'Authorization': 'Bearer ' + token, - 'Content-Type': 'application/json' - }, - body: JSON.stringify({query: userInfoQuery}) - }) - - let data = (await testResponse.json()).data - // if res.data.user is non null, means the ping was ok & token is valid - if (data.user) { - console.log("Got user!", data.user) - context.commit("setUser", data.user) - } - if (data.serverInfo){ - context.commit("setServerInfo", data.serverInfo) - } + fetch(`${SERVER_URL}/graphql`, { + method: 'POST', + headers: { + 'Authorization': 'Bearer ' + token, + 'Content-Type': 'application/json' + }, + body: JSON.stringify({query: userInfoQuery}) + } + ) + .then(res => res.json()) + .then(json => { + var data = json.data + if (data.user) { + console.log("Got user!", data.user) + context.commit("setUser", data.user) + console.log("User logged in as " + data.user.name) + } + if (data.serverInfo) { + context.commit("setServerInfo", data.serverInfo) + } + }) + } else { + console.log("User is not logged in") } }, - redirectToAuth( ) { - var challenge = Math.random( ).toString( 36 ).substring( 2, 15 ) + Math.random( ).toString( 36 ).substring( 2, 15 ) + redirectToAuth() { + // Generate random challenge + var challenge = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15) + // Save challenge in localStorage localStorage.setItem(CHALLENGE, challenge) + // Send user to auth page window.location = `${SERVER_URL}/authn/verify/${process.env.VUE_APP_SPECKLE_ID}/${challenge}` } }, - modules: { - } + modules: {} }) diff --git a/src/views/Home.vue b/src/views/Home.vue index 2de57c7..17ded10 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -8,14 +8,7 @@ sm="6" offset="3" > - + @@ -33,8 +26,7 @@ @@ -46,18 +38,19 @@