Do a separate api call to check if an item is requested already

src/api.js

@@ -137,6 +137,28 @@ const request = (id, type, authorization_token=undefined) => {
     .catch(error => { console.error(`api error requesting: ${id}, type: ${type}`); throw error })
 }
 
+/**
+ * Check request status by tmdb id and type
+ * @param {number} tmdb id
+ * @param {string} type
+ * @returns {object} Success/Failure response
+ */
+const getRequestStatus = (id, type, authorization_token=undefined) => {
+  const url = new URL('v2/request', SEASONED_URL)
+  url.pathname = path.join(url.pathname, id.toString())
+  url.searchParams.append('type', type)
+
+  return fetch(url.href)
+    .then(resp => {
+      const status = resp.status;
+      if (status === 200) { return true }
+      else if (status === 404) { return false }
+      else {
+        console.error(`api error getting request status for id ${id} and type ${type}`)
+      }
+    })
+    .catch(err => Promise.reject(err))
+}
 
 // - - - Authenticate with plex - - -
 
@@ -210,4 +232,4 @@ const elasticSearchMoviesAndShows = (query) => {
 
 
 
-export { getMovie, getShow, getTmdbListByPath, searchTmdb, searchTorrents, addMagnet, request, plexAuthenticate, getEmoji, elasticSearchMoviesAndShows }
+export { getMovie, getShow, getTmdbListByPath, searchTmdb, searchTorrents, addMagnet, request, getRequestStatus, plexAuthenticate, getEmoji, elasticSearchMoviesAndShows }

src/components/Movie.vue

@@ -129,7 +129,7 @@ import Person from './Person.vue'
 
 import LoadingPlaceholder from './ui/LoadingPlaceholder.vue'
 
-import { getMovie, getShow, request } from '@/api.js'
+import { getMovie, getShow, request, getRequestStatus } from '@/api.js'
 
 export default {
   props: ['id', 'type'],
@@ -157,13 +157,15 @@ export default {
       this.title = movie.title
       this.poster = movie.poster
       this.backdrop = movie.backdrop
-      this.matched = movie.existsInPlex;
-      // TODO should get a request response, used /plex/:id before
-      // this.requested = movie.requested;
-      this.requested = true
+      this.matched = movie.existsInPlex
+      this.checkIfRequested(movie)
+        .then(status => this.requested = status )
 
       document.title = movie.title + storage.pageTitlePostfix;
     },
+    async checkIfRequested(movie) {
+      return await getRequestStatus(movie.id, movie.type)
+    },
     nestedDataToString(data) {
       let nestedArray = []
       data.forEach(item => nestedArray.push(item));