Moved register and login requests to api.js.

src/api.js

@@ -211,6 +211,43 @@ const getRequestStatus = (id, type, authorization_token=undefined) => {
     .catch(err => Promise.reject(err))
 }
 
+// - - - Seasoned user endpoints - - -
+
+const register = (username, password) => {
+  const url = new URL('v1/user', SEASONED_URL)
+  const options = {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ username, password })
+  }
+
+  return fetch(url.href, options)
+    .then(resp => resp.json())
+    .catch(error => {
+      console.error('Unexpected error occured before receiving response. Error:', error)
+      // TODO log to sentry the issue here
+      throw error
+    })
+}
+
+const login = (username, password) => {
+  const url = new URL('v1/user/login', SEASONED_URL)
+  const options = {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ username, password })
+  }
+
+  return fetch(url.href, options)
+    .then(resp => checkStatus)
+    .then(resp => resp.json())
+    .catch(error => {
+      console.error('Unexpected error occured before receiving response. Error:', error)
+      // TODO log to sentry the issue here
+      throw error
+    })
+}
+
 // - - - Authenticate with plex - - -
 
 const plexAuthenticate = (username, password) => {
@@ -303,6 +340,8 @@ export {
   request,
   getRequestStatus,
   plexAuthenticate,
+  register,
+  login,
   getEmoji,
   elasticSearchMoviesAndShows
 }

src/components/Register.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import axios from 'axios'
+import { register } from '@/api'
 import SeasonedButton from '@/components/ui/SeasonedButton'
 import SeasonedInput from '@/components/ui/SeasonedInput'
 import SeasonedMessages from '@/components/ui/SeasonedMessages'
@@ -40,23 +40,20 @@ export default {
       let verifyCredentials = this.checkCredentials(username, password, passwordRepeat);
 
       if (verifyCredentials.verified) {
-        axios.post(`https://api.kevinmidboe.com/api/v1/user`, {
-          username: username,
-          password: password
-        })
-        .then(resp => {
-          let data = resp.data;
-          if (data.success){
-            localStorage.setItem('token', data.token);
-            localStorage.setItem('username', username);
-            localStorage.setItem('admin', data.admin)
 
-            eventHub.$emit('setUserStatus');
+        register(username, password)
-            this.$router.push({ name: 'profile' })
+          .then(data => {
-          }
+            if (data.success){
+              localStorage.setItem('token', data.token);
+              localStorage.setItem('username', username);
+              localStorage.setItem('admin', data.admin)
+
+              eventHub.$emit('setUserStatus');
+              this.$router.push({ name: 'profile' })
+            }
         })
         .catch(error => {
-          this.messages.push({ type: 'error', title: 'Unexpected error', message: error.response.data.error })
+          this.messages.push({ type: 'error', title: 'Unexpected error', message: error.message })
         });
       } 
       else {

src/components/Signin.vue

@@ -16,7 +16,7 @@
 
 
 <script>
-import axios from 'axios'
+import { login } from '@/api'
 import storage from '../storage'
 import SeasonedInput from '@/components/ui/SeasonedInput'
 import SeasonedButton from '@/components/ui/SeasonedButton'
@@ -39,29 +39,25 @@ export default {
       let username = this.username;
       let password = this.password;
 
-      axios.post(`https://api.kevinmidboe.com/api/v1/user/login`, {
+      login(username, password)
-        username: username,
+        .then(data => {
-        password: password
+          if (data.success){
-      })
+            localStorage.setItem('token', data.token);
-      .then(resp => {
+            localStorage.setItem('username', username);
-        let data = resp.data;
+            localStorage.setItem('admin', data.admin || false);
-        if (data.success){
-          localStorage.setItem('token', data.token);
-          localStorage.setItem('username', username);
-          localStorage.setItem('admin', data.admin);
 
-          eventHub.$emit('setUserStatus');
+            eventHub.$emit('setUserStatus');
-          this.$router.push({ name: 'profile' })
+            this.$router.push({ name: 'profile' })
-        }
+          }
-      })
+        })
-      .catch(error => {
+        .catch(error => {
-        if (error.message.endsWith('401')) {
+          if (error.status === 401) {
-          this.messages.push({ type: 'warning', title: 'Access denied', message: 'Incorrect username or password' })
+            this.messages.push({ type: 'warning', title: 'Access denied', message: 'Incorrect username or password' })
-        }
+          }
-        else {
+          else {
-          this.messages.push({ type: 'error', title: 'Unexpected error', message: error.message })
+            this.messages.push({ type: 'error', title: 'Unexpected error', message: error.message })
-        }
+          }
-      });
+        });
     }
   },
   created(){