refactor: switch from Axios for Fetch API (#840)

* refactor: switch ExternalAPI to Fetch API * fix: add missing auth token in Plex request * fix: send proper URL params * ci: try to fix format checker * ci: ci: try to fix format checker * ci: try to fix format checker * refactor: make tautulli use the ExternalAPI class * refactor: add rate limit to fetch api * refactor: add rate limit to fetch api * refactor: switch server from axios to fetch api * refactor: switch frontend from axios to fetch api * fix: switch from URL objects to strings * fix: use the right search params for ExternalAPI * fix: better log for ExternalAPI errors * feat: add retry to external API requests * fix: try to fix network errors with IPv6 * fix: imageProxy rate limit * revert: remove retry to external API requests * feat: set IPv4 first as an option * fix(jellyfinapi): add missing argument in JellyfinAPI constructor * refactor: clean the rate limit utility
2026-01-06 14:47:54 -05:00 · 2024-07-14 19:04:36 +02:00
parent ae955e9e7c
commit b36bb3fa58
100 changed files with 5380 additions and 10870 deletions
--- a/src/components/RequestModal/CollectionRequestModal.tsx
+++ b/src/components/RequestModal/CollectionRequestModal.tsx
@@ -13,7 +13,6 @@ import type { MediaRequest } from '@server/entity/MediaRequest';
 import type { QuotaResponse } from '@server/interfaces/api/userInterfaces';
 import { Permission } from '@server/lib/permissions';
 import type { Collection } from '@server/models/Collection';
-import axios from 'axios';
 import { useCallback, useEffect, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
@@ -197,12 +196,19 @@ const CollectionRequestModal = ({
        (
          data?.parts.filter((part) => selectedParts.includes(part.id)) ?? []
        ).map(async (part) => {
-          await axios.post<MediaRequest>('/api/v1/request', {
-            mediaId: part.id,
-            mediaType: 'movie',
-            is4k,
-            ...overrideParams,
+          const res = await fetch('/api/v1/request', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+              mediaId: part.id,
+              mediaType: 'movie',
+              is4k,
+              ...overrideParams,
+            }),
          });
+          if (!res.ok) throw new Error();
        })
      );

--- a/src/components/RequestModal/MovieRequestModal.tsx
+++ b/src/components/RequestModal/MovieRequestModal.tsx
@@ -11,7 +11,6 @@ import type { MediaRequest } from '@server/entity/MediaRequest';
 import type { QuotaResponse } from '@server/interfaces/api/userInterfaces';
 import { Permission } from '@server/lib/permissions';
 import type { MovieDetails } from '@server/models/Movie';
-import axios from 'axios';
 import { useCallback, useEffect, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
@@ -89,15 +88,23 @@ const MovieRequestModal = ({
          tags: requestOverrides.tags,
        };
      }
-      const response = await axios.post<MediaRequest>('/api/v1/request', {
-        mediaId: data?.id,
-        mediaType: 'movie',
-        is4k,
-        ...overrideParams,
+      const res = await fetch('/api/v1/request', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          mediaId: data?.id,
+          mediaType: 'movie',
+          is4k,
+          ...overrideParams,
+        }),
      });
+      if (!res.ok) throw new Error();
+      const mediaRequest: MediaRequest = await res.json();
      mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');

-      if (response.data) {
+      if (mediaRequest) {
        if (onComplete) {
          onComplete(
            hasPermission(
@@ -136,12 +143,14 @@ const MovieRequestModal = ({
    setIsUpdating(true);

    try {
-      const response = await axios.delete<MediaRequest>(
-        `/api/v1/request/${editRequest?.id}`
-      );
+      const res = await fetch(`/api/v1/request/${editRequest?.id}`, {
+        method: 'DELETE',
+      });
+      if (!res.ok) throw new Error();
+
      mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');

-      if (response.status === 204) {
+      if (res.status === 204) {
        if (onComplete) {
          onComplete(MediaStatus.UNKNOWN);
        }
@@ -164,17 +173,27 @@ const MovieRequestModal = ({
    setIsUpdating(true);

    try {
-      await axios.put(`/api/v1/request/${editRequest?.id}`, {
-        mediaType: 'movie',
-        serverId: requestOverrides?.server,
-        profileId: requestOverrides?.profile,
-        rootFolder: requestOverrides?.folder,
-        userId: requestOverrides?.user?.id,
-        tags: requestOverrides?.tags,
+      const res = await fetch(`/api/v1/request/${editRequest?.id}`, {
+        method: 'PUT',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          mediaType: 'movie',
+          serverId: requestOverrides?.server,
+          profileId: requestOverrides?.profile,
+          rootFolder: requestOverrides?.folder,
+          userId: requestOverrides?.user?.id,
+          tags: requestOverrides?.tags,
+        }),
      });
+      if (!res.ok) throw new Error();

      if (alsoApproveRequest) {
-        await axios.post(`/api/v1/request/${editRequest?.id}/approve`);
+        const res = await fetch(`/api/v1/request/${editRequest?.id}/approve`, {
+          method: 'POST',
+        });
+        if (!res.ok) throw new Error();
      }
      mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');

--- a/src/components/RequestModal/TvRequestModal.tsx
+++ b/src/components/RequestModal/TvRequestModal.tsx
@@ -16,7 +16,6 @@ import type SeasonRequest from '@server/entity/SeasonRequest';
 import type { QuotaResponse } from '@server/interfaces/api/userInterfaces';
 import { Permission } from '@server/lib/permissions';
 import type { TvDetails } from '@server/models/Tv';
-import axios from 'axios';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
@@ -111,22 +110,35 @@ const TvRequestModal = ({

    try {
      if (selectedSeasons.length > 0) {
-        await axios.put(`/api/v1/request/${editRequest.id}`, {
-          mediaType: 'tv',
-          serverId: requestOverrides?.server,
-          profileId: requestOverrides?.profile,
-          rootFolder: requestOverrides?.folder,
-          languageProfileId: requestOverrides?.language,
-          userId: requestOverrides?.user?.id,
-          tags: requestOverrides?.tags,
-          seasons: selectedSeasons,
+        const res = await fetch(`/api/v1/request/${editRequest.id}`, {
+          method: 'PUT',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
+            mediaType: 'tv',
+            serverId: requestOverrides?.server,
+            profileId: requestOverrides?.profile,
+            rootFolder: requestOverrides?.folder,
+            languageProfileId: requestOverrides?.language,
+            userId: requestOverrides?.user?.id,
+            tags: requestOverrides?.tags,
+            seasons: selectedSeasons,
+          }),
        });
+        if (!res.ok) throw new Error();

        if (alsoApproveRequest) {
-          await axios.post(`/api/v1/request/${editRequest.id}/approve`);
+          const res = await fetch(`/api/v1/request/${editRequest.id}/approve`, {
+            method: 'POST',
+          });
+          if (!res.ok) throw new Error();
        }
      } else {
-        await axios.delete(`/api/v1/request/${editRequest.id}`);
+        const res = await fetch(`/api/v1/request/${editRequest.id}`, {
+          method: 'DELETE',
+        });
+        if (!res.ok) throw new Error();
      }
      mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');

@@ -191,23 +203,32 @@ const TvRequestModal = ({
          tags: requestOverrides.tags,
        };
      }
-      const response = await axios.post<MediaRequest>('/api/v1/request', {
-        mediaId: data?.id,
-        tvdbId: tvdbId ?? data?.externalIds.tvdbId,
-        mediaType: 'tv',
-        is4k,
-        seasons: settings.currentSettings.partialRequestsEnabled
-          ? selectedSeasons
-          : getAllSeasons().filter(
-              (season) => !getAllRequestedSeasons().includes(season)
-            ),
-        ...overrideParams,
+      const res = await fetch('/api/v1/request', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          mediaId: data?.id,
+          tvdbId: tvdbId ?? data?.externalIds.tvdbId,
+          mediaType: 'tv',
+          is4k,
+          seasons: settings.currentSettings.partialRequestsEnabled
+            ? selectedSeasons
+            : getAllSeasons().filter(
+                (season) => !getAllRequestedSeasons().includes(season)
+              ),
+          ...overrideParams,
+        }),
      });
+      if (!res.ok) throw new Error();
+      const mediaRequest: MediaRequest = await res.json();
+
      mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');

-      if (response.data) {
+      if (mediaRequest) {
        if (onComplete) {
-          onComplete(response.data.media.status);
+          onComplete(mediaRequest.media.status);
        }
        addToast(
          <span>