feat(api): decouple media requests from media info

src/components/TvDetails/index.tsx

@@ -17,6 +17,7 @@ import LoadingSpinner from '../Common/LoadingSpinner';
 import { useUser, Permission } from '../../hooks/useUser';
 import PendingRequest from '../PendingRequest';
 import { TvDetails as TvDetailsType } from '../../../server/models/Tv';
+import { MediaStatus } from '../../../server/constants/media';
 
 const messages = defineMessages({
   userrating: 'User Rating',
@@ -76,7 +77,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
   const request = async () => {
     const response = await axios.post<MediaRequest>('/api/v1/request', {
       mediaId: data?.id,
-      mediaType: 'movie',
+      mediaType: 'tv',
     });
 
     if (response.data) {
@@ -91,13 +92,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
   };
 
   const cancelRequest = async () => {
-    const response = await axios.delete<MediaRequest>(
-      `/api/v1/request/${data?.request?.id}`
-    );
-
-    if (response.data.id) {
-      revalidate();
-    }
+    // fix me
   };
 
   if (!data && !error) {
@@ -148,7 +143,8 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
           </span>
         </div>
         <div className="flex-1 flex justify-end mt-4 md:mt-0">
-          {!data.request && (
+          {(!data.mediaInfo ||
+            data.mediaInfo.status === MediaStatus.UNKNOWN) && (
             <Button
               buttonType="primary"
               onClick={() => setShowRequestModal(true)}
@@ -170,14 +166,8 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
               <FormattedMessage {...messages.request} />
             </Button>
           )}
-          {data.request?.status === MediaRequestStatus.PENDING && (
-            <Button
-              buttonType="warning"
-              onClick={() => {
-                if (data.request?.requestedBy.id === user?.id)
-                  setShowCancelModal(true);
-              }}
-            >
+          {data.mediaInfo?.status === MediaStatus.PENDING && (
+            <Button buttonType="warning">
               <svg
                 className="w-4 mr-2"
                 fill="none"
@@ -192,12 +182,10 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
                   d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"
                 />
               </svg>
-              {data.request?.requestedBy.id === user?.id
-                ? intl.formatMessage(messages.cancelrequest)
-                : intl.formatMessage(messages.pending)}
+              <FormattedMessage {...messages.pending} />
             </Button>
           )}
-          {data.request?.status === MediaRequestStatus.APPROVED && (
+          {data.mediaInfo?.status === MediaStatus.PROCESSING && (
             <Button buttonType="danger">
               <svg
                 className="w-5 mr-1"
@@ -216,7 +204,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
               <FormattedMessage {...messages.unavailable} />
             </Button>
           )}
-          {data.request?.status === MediaRequestStatus.AVAILABLE && (
+          {data.mediaInfo?.status === MediaStatus.AVAILABLE && (
             <Button buttonType="success">
               <svg
                 className="w-5 mr-1"
@@ -281,13 +269,13 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
       </div>
       <div className="flex pt-8 text-white flex-col md:flex-row pb-4">
         <div className="flex-1 md:mr-8">
-          {data.request?.status === MediaRequestStatus.PENDING &&
+          {/* {data.mediaInfo?.status === MediaStatus.PENDING &&
             hasPermission(Permission.MANAGE_REQUESTS) && (
               <PendingRequest
                 request={data.request}
                 onUpdate={() => revalidate()}
               />
-            )}
+            )} */}
           <h2 className="text-xl md:text-2xl">
             <FormattedMessage {...messages.overview} />
           </h2>
@@ -403,13 +391,12 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
             key={`recommended-${title.id}`}
             id={title.id}
             image={title.posterPath}
-            status={title.request?.status}
+            status={title.mediaInfo?.status}
             summary={title.overview}
             title={title.name}
             userScore={title.voteAverage}
             year={title.firstAirDate}
             mediaType={title.mediaType}
-            requestId={title.request?.id}
           />
         ))}
       />
@@ -447,13 +434,12 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
             key={`recommended-${title.id}`}
             id={title.id}
             image={title.posterPath}
-            status={title.request?.status}
+            status={title.mediaInfo?.status}
             summary={title.overview}
             title={title.name}
             userScore={title.voteAverage}
             year={title.firstAirDate}
             mediaType={title.mediaType}
-            requestId={title.request?.id}
           />
         ))}
       />