Proper clientId/secret/token caching, MastoAPI registration

src/services/api/api.service.js

@@ -1,6 +1,5 @@
 /* eslint-env browser */
 const LOGIN_URL = '/api/account/verify_credentials.json'
-const REGISTRATION_URL = '/api/account/register.json'
 const BG_UPDATE_URL = '/api/qvitter/update_background_image.json'
 const EXTERNAL_PROFILE_URL = '/api/externalprofile/show.json'
 const QVITTER_USER_NOTIFICATIONS_READ_URL = '/api/qvitter/statuses/notifications/read.json'
@@ -17,6 +16,7 @@ const ACTIVATION_STATUS_URL = screenName => `/api/pleroma/admin/users/${screenNa
 const ADMIN_USERS_URL = '/api/pleroma/admin/users'
 const SUGGESTIONS_URL = '/api/v1/suggestions'
 
+const MASTODON_REGISTRATION_URL = '/api/v1/accounts'
 const MASTODON_USER_FAVORITES_TIMELINE_URL = '/api/v1/favourites'
 const MASTODON_USER_NOTIFICATIONS_URL = '/api/v1/notifications'
 const MASTODON_FAVORITE_URL = id => `/api/v1/statuses/${id}/favourite`
@@ -161,19 +161,29 @@ const updateProfile = ({credentials, params}) => {
 // homepage
 // location
 // token
-const register = (params) => {
-  const form = new FormData()
-
-  each(params, (value, key) => {
-    if (value) {
-      form.append(key, value)
-    }
-  })
-
-  return fetch(REGISTRATION_URL, {
+const register = ({ params, credentials }) => {
+  const { nickname, ...rest } = params
+  return fetch(MASTODON_REGISTRATION_URL, {
     method: 'POST',
-    body: form
+    headers: {
+      ...authHeaders(credentials),
+      'Content-Type': 'application/json'
+    },
+    body: JSON.stringify({
+      nickname,
+      locale: 'xx_XX',
+      agreement: true,
+      ...rest
+    })
   })
+    .then((response) => [response.ok, response])
+    .then(([ok, response]) => {
+      if (ok) {
+        return response.json()
+      } else {
+        return response.json().then((error) => { throw new Error(error) })
+      }
+    })
 }
 
 const getCaptcha = () => fetch('/api/pleroma/captcha').then(resp => resp.json())

src/services/backend_interactor_service/backend_interactor_service.js

@@ -99,7 +99,7 @@ const backendInteractorService = (credentials) => {
   const unpinOwnStatus = (id) => apiService.unpinOwnStatus({credentials, id})
 
   const getCaptcha = () => apiService.getCaptcha()
-  const register = (params) => apiService.register(params)
+  const register = (params) => apiService.register({ credentials, params })
   const updateAvatar = ({avatar}) => apiService.updateAvatar({credentials, avatar})
   const updateBg = ({params}) => apiService.updateBg({credentials, params})
   const updateBanner = ({banner}) => apiService.updateBanner({credentials, banner})

src/services/new_api/oauth.js

@@ -1,51 +1,57 @@
-import {reduce} from 'lodash'
+import { reduce } from 'lodash'
+
+const REDIRECT_URI = `${window.location.origin}/oauth-callback`
+
+export const getOrCreateApp = ({ clientId, clientSecret, instance, commit }) => {
+  if (clientId && clientSecret) {
+    return Promise.resolve({ clientId, clientSecret })
+  }
 
-const getOrCreateApp = ({oauth, instance}) => {
   const url = `${instance}/api/v1/apps`
   const form = new window.FormData()
 
-  form.append('client_name', `PleromaFE_${Math.random()}`)
-  form.append('redirect_uris', `${window.location.origin}/oauth-callback`)
+  form.append('client_name', `PleromaFE_${window.___pleromafe_commit_hash}_${(new Date()).toISOString()}`)
+  form.append('redirect_uris', REDIRECT_URI)
   form.append('scopes', 'read write follow')
 
   return window.fetch(url, {
     method: 'POST',
     body: form
-  }).then((data) => data.json())
-}
-const login = (args) => {
-  getOrCreateApp(args).then((app) => {
-    args.commit('setClientData', app)
-
-    const data = {
-      response_type: 'code',
-      client_id: app.client_id,
-      redirect_uri: app.redirect_uri,
-      scope: 'read write follow'
-    }
-
-    const dataString = reduce(data, (acc, v, k) => {
-      const encoded = `${k}=${encodeURIComponent(v)}`
-      if (!acc) {
-        return encoded
-      } else {
-        return `${acc}&${encoded}`
-      }
-    }, false)
-
-    // Do the redirect...
-    const url = `${args.instance}/oauth/authorize?${dataString}`
-
-    window.location.href = url
   })
+    .then((data) => data.json())
+    .then((app) => ({ clientId: app.client_id, clientSecret: app.client_secret }))
+    .then((app) => commit('setClientData', app) || app)
 }
 
-const getTokenWithCredentials = ({app, instance, username, password}) => {
+const login = ({ instance, clientId }) => {
+  const data = {
+    response_type: 'code',
+    client_id: clientId,
+    redirect_uri: REDIRECT_URI,
+    scope: 'read write follow'
+  }
+
+  const dataString = reduce(data, (acc, v, k) => {
+    const encoded = `${k}=${encodeURIComponent(v)}`
+    if (!acc) {
+      return encoded
+    } else {
+      return `${acc}&${encoded}`
+    }
+  }, false)
+
+  // Do the redirect...
+  const url = `${instance}/oauth/authorize?${dataString}`
+
+  window.location.href = url
+}
+
+const getTokenWithCredentials = ({ clientId, clientSecret, instance, username, password }) => {
   const url = `${instance}/oauth/token`
   const form = new window.FormData()
 
-  form.append('client_id', app.client_id)
-  form.append('client_secret', app.client_secret)
+  form.append('client_id', clientId)
+  form.append('client_secret', clientSecret)
   form.append('grant_type', 'password')
   form.append('username', username)
   form.append('password', password)
@@ -56,16 +62,32 @@ const getTokenWithCredentials = ({app, instance, username, password}) => {
   }).then((data) => data.json())
 }
 
-const getToken = ({app, instance, code}) => {
+const getToken = ({ clientId, clientSecret, instance, code }) => {
   const url = `${instance}/oauth/token`
   const form = new window.FormData()
 
-  form.append('client_id', app.client_id)
-  form.append('client_secret', app.client_secret)
+  form.append('client_id', clientId)
+  form.append('client_secret', clientSecret)
   form.append('grant_type', 'authorization_code')
   form.append('code', code)
   form.append('redirect_uri', `${window.location.origin}/oauth-callback`)
 
+  return window.fetch(url, {
+    method: 'POST',
+    body: form
+  })
+    .then((data) => data.json())
+}
+
+export const getClientToken = ({ clientId, clientSecret, instance }) => {
+  const url = `${instance}/oauth/token`
+  const form = new window.FormData()
+
+  form.append('client_id', clientId)
+  form.append('client_secret', clientSecret)
+  form.append('grant_type', 'client_credentials')
+  form.append('redirect_uri', `${window.location.origin}/oauth-callback`)
+
   return window.fetch(url, {
     method: 'POST',
     body: form

src/services/new_api/utils.js

@@ -5,9 +5,9 @@ const queryParams = (params) => {
 }
 
 const headers = (store) => {
-  const accessToken = store.state.oauth.token
+  const accessToken = store.getters.getToken()
   if (accessToken) {
-    return {'Authorization': `Bearer ${accessToken}`}
+    return { 'Authorization': `Bearer ${accessToken}` }
   } else {
     return {}
   }