Merge branch 'master' of...

Merge branch 'master' of gitlab.rlp.net:motionbank/applications/systems-frontend into 23-mosys---mobile-add-cells-(frontend-systems)

CHANGELOG.md

@@ -31,6 +31,7 @@ under `media/create` (playback possible using forked
 - Mobile compatiblity for MoSys Editor
 - The file `statics/env.js` can be overwritten to configure
 the frontend at runtime
+- Authentication service attempts silent login when token expires
 
 ### Changed
 
@@ -54,6 +55,8 @@ for YouTube sources to be GDPR compliant
   to version 1.2.4
 - [mbjs-quasar](https://gitlab.rlp.net/motionbank/mbjs/quasar)
   to version 2.2.0
+- [mbjs-api-client](https://gitlab.rlp.net/motionbank/mbjs/api-client)
+  to version 2.1.3
 
 ### Fixed
 

package.json

@@ -51,7 +51,7 @@
     "keytar": "^4.10.0",
     "luxon": "1.8.2",
     "marked": "^0.7.0",
-    "mbjs-api-client": "2.0.0",
+    "mbjs-api-client": "2.1.3",
     "mbjs-archive": "1.0.0",
     "mbjs-data-models": "1.3.2",
     "mbjs-media": "0.2.0",
@@ -86,7 +86,7 @@
     "cross-env": "^5.1.6",
     "devtron": "^1.4.0",
     "electron": "^4.0.0",
-    "electron-builder": "^20.39.0",
+    "electron-builder": "^21.2.0",
     "electron-debug": "^1.5.0",
     "electron-devtools-installer": "^2.2.4",
     "electron-rebuild": "^1.8.5",

quasar.conf.js

@@ -62,11 +62,11 @@ module.exports = function (ctx) {
         //
         // Hosts
         //
-        API_HOST: JSON.stringify(process.env.API_HOST || 'https://api.motionbank.org'),
-        SOCKETS_HOST: JSON.stringify(process.env.SOCKETS_HOST || 'https://sockets.motionbank.org'),
-        STORAGE_HOST: JSON.stringify(process.env.STORAGE_HOST || 'https://storage.motionbank.org'),
-        PACKAGER_HOST: JSON.stringify(process.env.PACKAGER_HOST || 'https://packager.motionbank.org'),
-        TRANSCODER_HOST: JSON.stringify(process.env.TRANSCODER_HOST || 'https://transcoder.motionbank.org'),
+        API_HOST: JSON.stringify(process.env.API_HOST),
+        SOCKETS_HOST: JSON.stringify(process.env.SOCKETS_HOST),
+        STORAGE_HOST: JSON.stringify(process.env.STORAGE_HOST),
+        PACKAGER_HOST: JSON.stringify(process.env.PACKAGER_HOST),
+        TRANSCODER_HOST: JSON.stringify(process.env.TRANSCODER_HOST),
         //
         // Resources
         //
@@ -76,16 +76,16 @@ module.exports = function (ctx) {
         //
         // Auth0
         //
-        AUTH0_DOMAIN: JSON.stringify(process.env.AUTH0_DOMAIN || 'auth.motionbank.org'),
-        AUTH0_CLIENT_ID: JSON.stringify(process.env.AUTH0_CLIENT_ID || '80t5TRU9MVhGDVnZ522CvX4hutBxDB6U'),
-        AUTH0_REDIRECT_URL: JSON.stringify(process.env.AUTH0_REDIRECT_URL || null),
-        AUTH0_AUDIENCE: JSON.stringify(process.env.AUTH0_AUDIENCE || 'https://api.motionbank.org'),
+        AUTH0_DOMAIN: JSON.stringify(process.env.AUTH0_DOMAIN),
+        AUTH0_CLIENT_ID: JSON.stringify(process.env.AUTH0_CLIENT_ID),
+        AUTH0_REDIRECT_URL: JSON.stringify(process.env.AUTH0_REDIRECT_URL),
+        AUTH0_AUDIENCE: JSON.stringify(process.env.AUTH0_AUDIENCE),
         //
         // API Keys
         //
-        SENTRY_DSN: JSON.stringify(process.env.SENTRY_DSN || null),
-        YOUTUBE_API_KEY: JSON.stringify(process.env.YOUTUBE_API_KEY || null),
-        VIMEO_ACCESS_TOKEN: JSON.stringify(process.env.VIMEO_ACCESS_TOKEN || null),
+        SENTRY_DSN: JSON.stringify(process.env.SENTRY_DSN),
+        YOUTUBE_API_KEY: JSON.stringify(process.env.YOUTUBE_API_KEYl),
+        VIMEO_ACCESS_TOKEN: JSON.stringify(process.env.VIMEO_ACCESS_TOKEN),
         //
         // App config
         //

src-electron/main-process/auth-service-electron.js

@@ -13,11 +13,11 @@ const
   keytarAccount = os.userInfo().username
 
 function getAuthenticationURL () {
-  return 'https://' + (window.AUTH0_DOMAIN || process.env.AUTH0_DOMAIN) + '/authorize?' +
-    'audience=' + (window.AUTH0_AUDIENCE || process.env.AUTH0_AUDIENCE) + '&' +
+  return 'https://' + (process.env.AUTH0_DOMAIN) + '/authorize?' +
+    'audience=' + (process.env.AUTH0_AUDIENCE) + '&' +
     'scope=openid profile offline_access&' +
     'response_type=code&' +
-    'client_id=' + (window.AUTH0_CLIENT_ID || process.env.AUTH0_CLIENT_ID) + '&' +
+    'client_id=' + (process.env.AUTH0_CLIENT_ID) + '&' +
     'redirect_uri=' + redirectUri
 }
 
@@ -25,9 +25,9 @@ async function refreshTokens () {
   const refreshToken = await keytar.getPassword(keytarService, keytarAccount)
   if (!refreshToken) return throw new Error('No refresh token found')
 
-  const result = await axios.post(`https://${window.AUTH0_DOMAIN || process.env.AUTH0_DOMAIN}/oauth/token`, {
+  const result = await axios.post(`https://${process.env.AUTH0_DOMAIN}/oauth/token`, {
     grant_type: 'refresh_token',
-    client_id: window.AUTH0_CLIENT_ID || process.env.AUTH0_CLIENT_ID,
+    client_id: process.env.AUTH0_CLIENT_ID,
     refresh_token: refreshToken
   }, {
     headers: {'Content-Type': 'application/json'}
@@ -43,12 +43,12 @@ async function loadTokens (callbackURL) {
 
   const exchangeOptions = {
     'grant_type': 'authorization_code',
-    'client_id': window.AUTH0_CLIENT_ID || process.env.AUTH0_CLIENT_ID,
+    'client_id': process.env.AUTH0_CLIENT_ID,
     'code': query.code,
     'redirect_uri': redirectUri
   }
 
-  const result = await axios.post(`https://${window.AUTH0_DOMAIN || process.env.AUTH0_DOMAIN}/oauth/token`, exchangeOptions, {
+  const result = await axios.post(`https://${process.env.AUTH0_DOMAIN}/oauth/token`, exchangeOptions, {
     headers: {
       'Content-Type': 'application/json'
     }
@@ -66,7 +66,7 @@ async function logout () {
 }
 
 function getLogOutUrl () {
-  return `https://${window.AUTH0_DOMAIN || process.env.AUTH0_DOMAIN}/v2/logout`
+  return `https://${process.env.AUTH0_DOMAIN}/v2/logout`
 }
 
 export {

src/plugins/api.js

@@ -3,14 +3,15 @@ import WebAuth from 'mbjs-api-client/src/web'
 export default ({ Vue }) => {
   const apiClient = new WebAuth({
     auth: {
-      domain: process.env.AUTH0_DOMAIN,
-      clientID: process.env.AUTH0_CLIENT_ID,
+      domain: process.env.AUTH0_DOMAIN || window.AUTH0_DOMAIN,
+      clientID: process.env.AUTH0_CLIENT_ID || window.AUTH0_CLIENT_ID,
       redirectUri: process.env.AUTH0_REDIRECT_URL || `${document.location.origin}/users/callback`,
-      audience: process.env.AUTH0_AUDIENCE,
+      audience: process.env.AUTH0_AUDIENCE || window.AUTH0_AUDIENCE,
       scope: 'openid profile read write',
-      responseType: 'token id_token'
+      responseType: 'token id_token',
+      prompt: 'none'
     },
-    host: process.env.API_HOST
+    host: process.env.API_HOST || window.API_HOST
   })
   Vue.prototype.$api = apiClient
 }

src/plugins/auth.js

-import AuthService from 'mbjs-quasar/src/lib/auth-service'
+import AuthServiceWeb from 'mbjs-api-client/src/auth-service-web'
 import AuthServiceElectron from 'mbjs-quasar/src/lib/auth-service-electron'
 
 export default ({ Vue }) => {
@@ -7,13 +7,14 @@ export default ({ Vue }) => {
     authService = new AuthServiceElectron()
   }
   else {
-    authService = new AuthService({
-      domain: window.AUTH0_DOMAIN || process.env.AUTH0_DOMAIN,
-      clientID: window.AUTH0_CLIENT_ID || process.env.AUTH0_CLIENT_ID,
-      redirectUri: `${document.location.origin}/users/callback`,
-      audience: window.AUTH0_AUDIENCE || process.env.AUTH0_AUDIENCE,
+    authService = new AuthServiceWeb({
+      domain: process.env.AUTH0_DOMAIN || window.AUTH0_DOMAIN,
+      clientID: process.env.AUTH0_CLIENT_ID || window.AUTH0_CLIENT_ID,
+      redirectUri: process.env.AUTH0_REDIRECT_URL || `${document.location.origin}/users/callback`,
+      audience: process.env.AUTH0_AUDIENCE || window.AUTH0_AUDIENCE,
       scope: 'openid profile read write',
-      responseType: 'token id_token'
+      responseType: 'token id_token',
+      prompt: 'none'
     })
   }
 

src/router/index.js

@@ -28,47 +28,38 @@ Router.beforeEach((to, from, next) => {
     else cb()
   }
   waitForStore(Router.app, () => {
-    if (!Router.app.$store.state.auth.user) {
-      Router.app.$auth.checkSession(Router.app.$store).catch(() => {
-        if (to.meta.private) {
-          Router.app.$store.commit('auth/setRedirect', to.fullPath)
-          Router.app.$auth.authenticate()
+    Router.app.$auth.checkSession(Router.app.$store).catch(() => {
+      if (to.meta.private) {
+        Router.app.$store.commit('auth/setRedirect', to.fullPath)
+        Router.app.$auth.authenticate()
+      }
+    }).then(result => {
+      if (result) {
+        const { user, first } = result
+        if (first) {
+          console.debug('Auth0 first login', user)
+          next({ name: 'users.manage', params: { isFirst: true, redirect: to } })
         }
-      }).then(result => {
-        if (result) {
-          const { user, first } = result
-          if (first) {
-            console.debug('Auth0 first login', user)
-            next({ name: 'users.manage', params: { isFirst: true, redirect: to } })
-          }
-          else {
-            if (to.meta.feature) {
-              if (userHasFeature(Router.app.$store.state.auth.user, to.meta.feature)) next()
-              else next({ name: 'site.welcome' })
-            }
-            next()
+        else {
+          if (to.meta.feature) {
+            if (userHasFeature(Router.app.$store.state.auth.user, to.meta.feature)) next()
+            else next({ name: 'site.welcome' })
           }
+          next()
         }
-        else if (to.meta.private) {
-          if (process.env.IS_ELECTRON) next()
-          else {
-            Router.app.$store.commit('auth/setRedirect', to.fullPath)
-            Router.app.$auth.authenticate()
-          }
+      }
+      else if (to.meta.private) {
+        if (process.env.IS_ELECTRON) next()
+        else {
+          Router.app.$store.commit('auth/setRedirect', to.fullPath)
+          Router.app.$auth.authenticate()
         }
-        else next()
-      }).catch(err => {
-        Router.app.$captureException(err)
-        Router.app.$auth.logout()
-      })
-    }
-    else {
-      if (to.meta.feature) {
-        if (userHasFeature(Router.app.$store.state.auth.user, to.meta.feature)) next()
-        else next({ name: 'site.welcome' })
       }
-      next()
-    }
+      else next()
+    }).catch(err => {
+      Router.app.$captureException(err)
+      Router.app.$auth.logout()
+    })
   })
 })
 

src/store/index.js

@@ -48,14 +48,15 @@ else {
   /** Instantiate Motion Bank API Client */
   apiClient = new WebAuth({
     auth: {
-      domain: process.env.AUTH0_DOMAIN,
-      clientID: process.env.AUTH0_CLIENT_ID,
+      domain: process.env.AUTH0_DOMAIN || window.AUTH0_DOMAIN,
+      clientID: process.env.AUTH0_CLIENT_ID || window.AUTH0_CLIENT_ID,
       redirectUri: process.env.AUTH0_REDIRECT_URL || `${document.location.origin}/users/callback`,
-      audience: process.env.AUTH0_AUDIENCE,
+      audience: process.env.AUTH0_AUDIENCE || window.AUTH0_AUDIENCE,
       scope: 'openid profile read write',
-      responseType: 'token id_token'
+      responseType: 'token id_token',
+      prompt: 'none'
     },
-    host: process.env.API_HOST
+    host: process.env.API_HOST || window.API_HOST
   })
 }
 

src/store/modules/metadata.js

@@ -45,19 +45,9 @@ const metadata = {
         }
       }
       if (payload.id) {
-        const titleQuery = {
-          'target.id': typeof payload === 'string' ? `${BASE_URI}/annotations/${payload}` : payload.id,
-          'body.purpose': 'describing',
-          'body.type': 'TextualBody'
-        }
-        const titleResult = await context.dispatch('annotations/find', titleQuery, {root: true})
-        if (titleResult && titleResult.items && titleResult.items.length) {
-          metadata.titleAnnotation = titleResult.items[0]
-          if (metadata.title) metadata.originalTitle = metadata.title
-          metadata.title = titleResult.items[0].body.value
-        }
+        metadata = await context.dispatch('fetchTitle', [metadata, payload])
       }
-      console.debug('metadata', metadata)
+      console.debug('metadata/get', metadata)
       return metadata
     },
     async getLocal (context, payload) {
@@ -67,8 +57,12 @@ const metadata = {
       if (typeof payload === 'string') {
         payload = await context.dispatch('annotations/get', payload, { root: true })
       }
-      let metadata
-      metadata = context.state.cache[payload.body.source.id] || {}
+      let metadata = context.state.cache[payload.body.source.id] || {}
+      metadata = await context.dispatch('fetchTitle', [metadata, payload])
+      console.debug('metadata/getLocal', metadata)
+      return metadata
+    },
+    async fetchTitle (context, [metadata, payload]) {
       const titleQuery = {
         'target.id': typeof payload === 'string' ? `${BASE_URI}/annotations/${payload}` : payload.id,
         'body.purpose': 'describing',
@@ -80,7 +74,7 @@ const metadata = {
         if (metadata.title) metadata.originalTitle = metadata.title
         metadata.title = titleResult.items[0].body.value
       }
-      console.debug('metadata', metadata)
+      console.debug('metadata/fetchTitle', metadata)
       return metadata
     }
   }

src/store/modules/vocabularies.js

@@ -24,9 +24,17 @@ const vocabularies = {
       const headers = {
         Authorization: `Bearer ${localStorage.getItem('access_token')}`
       }
-      const result = await axios.get(`${process.env.API_HOST}/pba/pieces`, { headers })
-      let pieces = result.data.sort((a, b) => a.label.replace(/\W/g, '').localeCompare(b.label.replace(/\W/g, '')))
-      if (limit) pieces = pieces.splice(0, limit)
+      let pieces = []
+      try {
+        const result = await axios.get(`${process.env.API_HOST}/pba/pieces`, {headers})
+        if (Array.isArray(result.data)) {
+          pieces = result.data.sort((a, b) => a.label.replace(/\W/g, '').localeCompare(b.label.replace(/\W/g, '')))
+          if (limit) pieces = pieces.splice(0, limit)
+        }
+      }
+      catch (err) {
+        console.error('Failed to load PBA vocabularies:', err.message || err.code)
+      }
       for (let piece of pieces) {
         const result = await axios.get(`${process.env.API_HOST}/pba/pieces/${piece.piece_id}/titles`, {headers})
         context.commit('addTermsForScope', [piece.piece_id, result.data.map(title => {