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
2024-07-14 19:04:36 +02:00
parent ae955e9e7c
commit b36bb3fa58
100 changed files with 5380 additions and 10870 deletions
--- a/src/components/Settings/Notifications/NotificationsDiscord.tsx
+++ b/src/components/Settings/Notifications/NotificationsDiscord.tsx
@@ -5,7 +5,6 @@ import useSettings from '@app/hooks/useSettings';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -73,16 +72,23 @@ const NotificationsDiscord = () => {
      validationSchema={NotificationsDiscordSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/discord', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              botUsername: values.botUsername,
-              botAvatarUrl: values.botAvatarUrl,
-              webhookUrl: values.webhookUrl,
-              enableMentions: values.enableMentions,
+          const res = await fetch('/api/v1/settings/notifications/discord', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                botUsername: values.botUsername,
+                botAvatarUrl: values.botAvatarUrl,
+                webhookUrl: values.webhookUrl,
+                enableMentions: values.enableMentions,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();

          addToast(intl.formatMessage(messages.discordsettingssaved), {
            appearance: 'success',
@@ -121,16 +127,26 @@ const NotificationsDiscord = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/discord/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                botUsername: values.botUsername,
-                botAvatarUrl: values.botAvatarUrl,
-                webhookUrl: values.webhookUrl,
-                enableMentions: values.enableMentions,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/discord/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    botUsername: values.botUsername,
+                    botAvatarUrl: values.botAvatarUrl,
+                    webhookUrl: values.webhookUrl,
+                    enableMentions: values.enableMentions,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsEmail.tsx
+++ b/src/components/Settings/Notifications/NotificationsEmail.tsx
@@ -5,7 +5,6 @@ import SettingsBadge from '@app/components/Settings/SettingsBadge';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -148,24 +147,31 @@ const NotificationsEmail = () => {
      validationSchema={NotificationsEmailSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/email', {
-            enabled: values.enabled,
-            options: {
-              userEmailRequired: values.userEmailRequired,
-              emailFrom: values.emailFrom,
-              smtpHost: values.smtpHost,
-              smtpPort: Number(values.smtpPort),
-              secure: values.encryption === 'implicit',
-              ignoreTls: values.encryption === 'none',
-              requireTls: values.encryption === 'opportunistic',
-              authUser: values.authUser,
-              authPass: values.authPass,
-              allowSelfSigned: values.allowSelfSigned,
-              senderName: values.senderName,
-              pgpPrivateKey: values.pgpPrivateKey,
-              pgpPassword: values.pgpPassword,
+          const res = await fetch('/api/v1/settings/notifications/email', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              options: {
+                userEmailRequired: values.userEmailRequired,
+                emailFrom: values.emailFrom,
+                smtpHost: values.smtpHost,
+                smtpPort: Number(values.smtpPort),
+                secure: values.encryption === 'implicit',
+                ignoreTls: values.encryption === 'none',
+                requireTls: values.encryption === 'opportunistic',
+                authUser: values.authUser,
+                authPass: values.authPass,
+                allowSelfSigned: values.allowSelfSigned,
+                senderName: values.senderName,
+                pgpPrivateKey: values.pgpPrivateKey,
+                pgpPassword: values.pgpPassword,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          mutate('/api/v1/settings/public');

          addToast(intl.formatMessage(messages.emailsettingssaved), {
@@ -197,22 +203,32 @@ const NotificationsEmail = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/email/test', {
-              enabled: true,
-              options: {
-                emailFrom: values.emailFrom,
-                smtpHost: values.smtpHost,
-                smtpPort: Number(values.smtpPort),
-                secure: values.encryption === 'implicit',
-                ignoreTls: values.encryption === 'none',
-                requireTls: values.encryption === 'opportunistic',
-                authUser: values.authUser,
-                authPass: values.authPass,
-                senderName: values.senderName,
-                pgpPrivateKey: values.pgpPrivateKey,
-                pgpPassword: values.pgpPassword,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/email/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  options: {
+                    emailFrom: values.emailFrom,
+                    smtpHost: values.smtpHost,
+                    smtpPort: Number(values.smtpPort),
+                    secure: values.encryption === 'implicit',
+                    ignoreTls: values.encryption === 'none',
+                    requireTls: values.encryption === 'opportunistic',
+                    authUser: values.authUser,
+                    authPass: values.authPass,
+                    senderName: values.senderName,
+                    pgpPrivateKey: values.pgpPrivateKey,
+                    pgpPassword: values.pgpPassword,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsGotify/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsGotify/index.tsx
@@ -4,7 +4,6 @@ import NotificationTypeSelector from '@app/components/NotificationTypeSelector';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/solid';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -83,14 +82,21 @@ const NotificationsGotify = () => {
      validationSchema={NotificationsGotifySchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/gotify', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              url: values.url,
-              token: values.token,
+          const res = await fetch('/api/v1/settings/notifications/gotify', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                url: values.url,
+                token: values.token,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          addToast(intl.formatMessage(messages.gotifysettingssaved), {
            appearance: 'success',
            autoDismiss: true,
@@ -128,14 +134,24 @@ const NotificationsGotify = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/gotify/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                url: values.url,
-                token: values.token,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/gotify/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    url: values.url,
+                    token: values.token,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsLunaSea/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsLunaSea/index.tsx
@@ -4,7 +4,6 @@ import NotificationTypeSelector from '@app/components/NotificationTypeSelector';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -69,14 +68,21 @@ const NotificationsLunaSea = () => {
      validationSchema={NotificationsLunaSeaSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/lunasea', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              webhookUrl: values.webhookUrl,
-              profileName: values.profileName,
+          const res = await fetch('/api/v1/settings/notifications/lunasea', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                webhookUrl: values.webhookUrl,
+                profileName: values.profileName,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          addToast(intl.formatMessage(messages.settingsSaved), {
            appearance: 'success',
            autoDismiss: true,
@@ -114,14 +120,24 @@ const NotificationsLunaSea = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/lunasea/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                webhookUrl: values.webhookUrl,
-                profileName: values.profileName,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/lunasea/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    webhookUrl: values.webhookUrl,
+                    profileName: values.profileName,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsPushbullet/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsPushbullet/index.tsx
@@ -5,7 +5,6 @@ import NotificationTypeSelector from '@app/components/NotificationTypeSelector';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -68,14 +67,21 @@ const NotificationsPushbullet = () => {
      validationSchema={NotificationsPushbulletSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/pushbullet', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              accessToken: values.accessToken,
-              channelTag: values.channelTag,
+          const res = await fetch('/api/v1/settings/notifications/pushbullet', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                accessToken: values.accessToken,
+                channelTag: values.channelTag,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          addToast(intl.formatMessage(messages.pushbulletSettingsSaved), {
            appearance: 'success',
            autoDismiss: true,
@@ -113,14 +119,24 @@ const NotificationsPushbullet = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/pushbullet/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                accessToken: values.accessToken,
-                channelTag: values.channelTag,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/pushbullet/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    accessToken: values.accessToken,
+                    channelTag: values.channelTag,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsPushover/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsPushover/index.tsx
@@ -5,7 +5,6 @@ import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
 import type { PushoverSound } from '@server/api/pushover';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -94,14 +93,21 @@ const NotificationsPushover = () => {
      validationSchema={NotificationsPushoverSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/pushover', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              accessToken: values.accessToken,
-              userToken: values.userToken,
+          const res = await fetch('/api/v1/settings/notifications/pushover', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                accessToken: values.accessToken,
+                userToken: values.userToken,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          addToast(intl.formatMessage(messages.pushoversettingssaved), {
            appearance: 'success',
            autoDismiss: true,
@@ -139,16 +145,25 @@ const NotificationsPushover = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/pushover/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                accessToken: values.accessToken,
-                userToken: values.userToken,
-                sound: values.sound,
-              },
-            });
-
+            const res = await fetch(
+              '/api/v1/settings/notifications/pushover/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    accessToken: values.accessToken,
+                    userToken: values.userToken,
+                    sound: values.sound,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();
            if (toastId) {
              removeToast(toastId);
            }
--- a/src/components/Settings/Notifications/NotificationsSlack/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsSlack/index.tsx
@@ -4,7 +4,6 @@ import NotificationTypeSelector from '@app/components/NotificationTypeSelector';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -65,13 +64,20 @@ const NotificationsSlack = () => {
      validationSchema={NotificationsSlackSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/slack', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              webhookUrl: values.webhookUrl,
+          const res = await fetch('/api/v1/settings/notifications/slack', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                webhookUrl: values.webhookUrl,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          addToast(intl.formatMessage(messages.slacksettingssaved), {
            appearance: 'success',
            autoDismiss: true,
@@ -109,13 +115,23 @@ const NotificationsSlack = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/slack/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                webhookUrl: values.webhookUrl,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/slack/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    webhookUrl: values.webhookUrl,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsTelegram.tsx
+++ b/src/components/Settings/Notifications/NotificationsTelegram.tsx
@@ -5,7 +5,6 @@ import NotificationTypeSelector from '@app/components/NotificationTypeSelector';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -84,16 +83,23 @@ const NotificationsTelegram = () => {
      validationSchema={NotificationsTelegramSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/telegram', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              botAPI: values.botAPI,
-              chatId: values.chatId,
-              sendSilently: values.sendSilently,
-              botUsername: values.botUsername,
+          const res = await fetch('/api/v1/settings/notifications/telegram', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                botAPI: values.botAPI,
+                chatId: values.chatId,
+                sendSilently: values.sendSilently,
+                botUsername: values.botUsername,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();

          addToast(intl.formatMessage(messages.telegramsettingssaved), {
            appearance: 'success',
@@ -132,16 +138,26 @@ const NotificationsTelegram = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/telegram/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                botAPI: values.botAPI,
-                chatId: values.chatId,
-                sendSilently: values.sendSilently,
-                botUsername: values.botUsername,
-              },
-            });
+            const res = await fetch(
+              '/api/v1/settings/notifications/telegram/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    botAPI: values.botAPI,
+                    chatId: values.chatId,
+                    sendSilently: values.sendSilently,
+                    botUsername: values.botUsername,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();

            if (toastId) {
              removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsWebPush/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsWebPush/index.tsx
@@ -4,7 +4,6 @@ import LoadingSpinner from '@app/components/Common/LoadingSpinner';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useEffect, useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -58,10 +57,17 @@ const NotificationsWebPush = () => {
        }}
        onSubmit={async (values) => {
          try {
-            await axios.post('/api/v1/settings/notifications/webpush', {
-              enabled: values.enabled,
-              options: {},
+            const res = await fetch('/api/v1/settings/notifications/webpush', {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json',
+              },
+              body: JSON.stringify({
+                enabled: values.enabled,
+                options: {},
+              }),
            });
+            if (!res.ok) throw new Error();
            mutate('/api/v1/settings/public');
            addToast(intl.formatMessage(messages.webpushsettingssaved), {
              appearance: 'success',
@@ -92,10 +98,20 @@ const NotificationsWebPush = () => {
                  toastId = id;
                }
              );
-              await axios.post('/api/v1/settings/notifications/webpush/test', {
-                enabled: true,
-                options: {},
-              });
+              const res = await fetch(
+                '/api/v1/settings/notifications/webpush/test',
+                {
+                  method: 'POST',
+                  headers: {
+                    'Content-Type': 'application/json',
+                  },
+                  body: JSON.stringify({
+                    enabled: true,
+                    options: {},
+                  }),
+                }
+              );
+              if (!res.ok) throw new Error();

              if (toastId) {
                removeToast(toastId);
--- a/src/components/Settings/Notifications/NotificationsWebhook/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsWebhook/index.tsx
@@ -8,7 +8,6 @@ import {
  ArrowPathIcon,
  QuestionMarkCircleIcon,
 } from '@heroicons/react/24/solid';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import dynamic from 'next/dynamic';
 import Link from 'next/link';
@@ -150,15 +149,22 @@ const NotificationsWebhook = () => {
      validationSchema={NotificationsWebhookSchema}
      onSubmit={async (values) => {
        try {
-          await axios.post('/api/v1/settings/notifications/webhook', {
-            enabled: values.enabled,
-            types: values.types,
-            options: {
-              webhookUrl: values.webhookUrl,
-              jsonPayload: JSON.stringify(values.jsonPayload),
-              authHeader: values.authHeader,
+          const res = await fetch('/api/v1/settings/notifications/webhook', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
            },
+            body: JSON.stringify({
+              enabled: values.enabled,
+              types: values.types,
+              options: {
+                webhookUrl: values.webhookUrl,
+                jsonPayload: JSON.stringify(values.jsonPayload),
+                authHeader: values.authHeader,
+              },
+            }),
          });
+          if (!res.ok) throw new Error();
          addToast(intl.formatMessage(messages.webhooksettingssaved), {
            appearance: 'success',
            autoDismiss: true,
@@ -207,16 +213,25 @@ const NotificationsWebhook = () => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/notifications/webhook/test', {
-              enabled: true,
-              types: values.types,
-              options: {
-                webhookUrl: values.webhookUrl,
-                jsonPayload: JSON.stringify(values.jsonPayload),
-                authHeader: values.authHeader,
-              },
-            });
-
+            const res = await fetch(
+              '/api/v1/settings/notifications/webhook/test',
+              {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  enabled: true,
+                  types: values.types,
+                  options: {
+                    webhookUrl: values.webhookUrl,
+                    jsonPayload: JSON.stringify(values.jsonPayload),
+                    authHeader: values.authHeader,
+                  },
+                }),
+              }
+            );
+            if (!res.ok) throw new Error();
            if (toastId) {
              removeToast(toastId);
            }
--- a/src/components/Settings/RadarrModal/index.tsx
+++ b/src/components/Settings/RadarrModal/index.tsx
@@ -4,7 +4,6 @@ import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { Transition } from '@headlessui/react';
 import type { RadarrSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Field, Formik } from 'formik';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -166,19 +165,24 @@ const RadarrModal = ({ onClose, radarr, onSave }: RadarrModalProps) => {
    }) => {
      setIsTesting(true);
      try {
-        const response = await axios.post<TestResponse>(
-          '/api/v1/settings/radarr/test',
-          {
+        const res = await fetch('/api/v1/settings/radarr/test', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
            hostname,
            apiKey,
            port: Number(port),
            baseUrl,
            useSsl,
-          }
-        );
+          }),
+        });
+        if (!res.ok) throw new Error();
+        const data = await res.json();

        setIsValidated(true);
-        setTestResponse(response.data);
+        setTestResponse(data);
        if (initialLoad.current) {
          addToast(intl.formatMessage(messages.toastRadarrTestSuccess), {
            appearance: 'success',
@@ -271,12 +275,23 @@ const RadarrModal = ({ onClose, radarr, onSave }: RadarrModalProps) => {
              tagRequests: values.tagRequests,
            };
            if (!radarr) {
-              await axios.post('/api/v1/settings/radarr', submission);
+              const res = await fetch('/api/v1/settings/radarr', {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(submission),
+              });
+              if (!res.ok) throw new Error();
            } else {
-              await axios.put(
-                `/api/v1/settings/radarr/${radarr.id}`,
-                submission
-              );
+              const res = await fetch(`/api/v1/settings/radarr/${radarr.id}`, {
+                method: 'PUT',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(submission),
+              });
+              if (!res.ok) throw new Error();
            }

            onSave();
--- a/src/components/Settings/SettingsJellyfin.tsx
+++ b/src/components/Settings/SettingsJellyfin.tsx
@@ -7,7 +7,6 @@ import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon } from '@heroicons/react/24/outline';
 import { ApiErrorCode } from '@server/constants/error';
 import type { JellyfinSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Field, Formik } from 'formik';
 import getConfig from 'next/config';
 import { useState } from 'react';
@@ -167,9 +166,14 @@ const SettingsJellyfin: React.FC<SettingsJellyfinProps> = ({
    }

    try {
-      await axios.get('/api/v1/settings/jellyfin/library', {
-        params,
+      const searchParams = new URLSearchParams({
+        sync: params.sync ? 'true' : 'false',
+        ...(params.enable ? { enable: params.enable } : {}),
      });
+      const res = await fetch(
+        `/api/v1/settings/jellyfin/library?${searchParams.toString()}`
+      );
+      if (!res.ok) throw new Error();
      setIsSyncing(false);
      revalidate();
    } catch (e) {
@@ -206,16 +210,32 @@ const SettingsJellyfin: React.FC<SettingsJellyfinProps> = ({
  };

  const startScan = async () => {
-    await axios.post('/api/v1/settings/jellyfin/sync', {
-      start: true,
+    const res = await fetch('/api/v1/settings/jellyfin/sync', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        start: true,
+      }),
    });
+    if (!res.ok) throw new Error();
+
    revalidateSync();
  };

  const cancelScan = async () => {
-    await axios.post('/api/v1/settings/jellyfin/sync', {
-      cancel: true,
+    const res = await fetch('/api/v1/settings/jellyfin/sync', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        cancel: true,
+      }),
    });
+    if (!res.ok) throw new Error();
+
    revalidateSync();
  };

@@ -230,15 +250,19 @@ const SettingsJellyfin: React.FC<SettingsJellyfinProps> = ({
          .join(',');
      }

-      await axios.get('/api/v1/settings/jellyfin/library', {
-        params,
-      });
+      const searchParams = new URLSearchParams(params.enable ? params : {});
+      const res = await fetch(
+        `/api/v1/settings/jellyfin/library?${searchParams.toString}`
+      );
+      if (!res.ok) throw new Error();
    } else {
-      await axios.get('/api/v1/settings/jellyfin/library', {
-        params: {
-          enable: [...activeLibraries, libraryId].join(','),
-        },
+      const searchParams = new URLSearchParams({
+        enable: [...activeLibraries, libraryId].join(','),
      });
+      const res = await fetch(
+        `/api/v1/settings/jellyfin/library?${searchParams.toString()}`
+      );
+      if (!res.ok) throw new Error();
    }
    if (onComplete) {
      onComplete();
@@ -447,14 +471,21 @@ const SettingsJellyfin: React.FC<SettingsJellyfinProps> = ({
            validationSchema={JellyfinSettingsSchema}
            onSubmit={async (values) => {
              try {
-                await axios.post('/api/v1/settings/jellyfin', {
-                  ip: values.hostname,
-                  port: Number(values.port),
-                  useSsl: values.useSsl,
-                  urlBase: values.urlBase,
-                  externalHostname: values.jellyfinExternalUrl,
-                  jellyfinForgotPasswordUrl: values.jellyfinForgotPasswordUrl,
-                } as JellyfinSettings);
+                const res = await fetch('/api/v1/settings/jellyfin', {
+                  method: 'POST',
+                  headers: {
+                    'Content-Type': 'application/json',
+                  },
+                  body: JSON.stringify({
+                    ip: values.hostname,
+                    port: Number(values.port),
+                    useSsl: values.useSsl,
+                    urlBase: values.urlBase,
+                    externalHostname: values.jellyfinExternalUrl,
+                    jellyfinForgotPasswordUrl: values.jellyfinForgotPasswordUrl,
+                  } as JellyfinSettings),
+                });
+                if (!res.ok) throw new Error();

                addToast(
                  intl.formatMessage(messages.jellyfinSettingsSuccess, {
--- a/src/components/Settings/SettingsJobsCache/index.tsx
+++ b/src/components/Settings/SettingsJobsCache/index.tsx
@@ -19,7 +19,6 @@ import type {
  CacheResponse,
 } from '@server/interfaces/api/settingsInterfaces';
 import type { JobId } from '@server/lib/settings';
-import axios from 'axios';
 import cronstrue from 'cronstrue/i18n';
 import { Fragment, useReducer, useState } from 'react';
 import type { MessageDescriptor } from 'react-intl';
@@ -173,7 +172,10 @@ const SettingsJobs = () => {
  }

  const runJob = async (job: Job) => {
-    await axios.post(`/api/v1/settings/jobs/${job.id}/run`);
+    const res = await fetch(`/api/v1/settings/jobs/${job.id}/run`, {
+      method: 'POST',
+    });
+    if (!res.ok) throw new Error();
    addToast(
      intl.formatMessage(messages.jobstarted, {
        jobname: intl.formatMessage(messages[job.id] ?? messages.unknownJob),
@@ -187,7 +189,10 @@ const SettingsJobs = () => {
  };

  const cancelJob = async (job: Job) => {
-    await axios.post(`/api/v1/settings/jobs/${job.id}/cancel`);
+    const res = await fetch(`/api/v1/settings/jobs/${job.id}/cancel`, {
+      method: 'POST',
+    });
+    if (!res.ok) throw new Error();
    addToast(
      intl.formatMessage(messages.jobcancelled, {
        jobname: intl.formatMessage(messages[job.id] ?? messages.unknownJob),
@@ -201,7 +206,10 @@ const SettingsJobs = () => {
  };

  const flushCache = async (cache: CacheItem) => {
-    await axios.post(`/api/v1/settings/cache/${cache.id}/flush`);
+    const res = await fetch(`/api/v1/settings/cache/${cache.id}/flush`, {
+      method: 'POST',
+    });
+    if (!res.ok) throw new Error();
    addToast(
      intl.formatMessage(messages.cacheflushed, { cachename: cache.name }),
      {
@@ -228,12 +236,19 @@ const SettingsJobs = () => {
      }

      setIsSaving(true);
-      await axios.post(
+      const res = await fetch(
        `/api/v1/settings/jobs/${jobModalState.job.id}/schedule`,
        {
-          schedule: jobScheduleCron.join(' '),
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
+            schedule: jobScheduleCron.join(' '),
+          }),
        }
      );
+      if (!res.ok) throw new Error();

      addToast(intl.formatMessage(messages.jobScheduleEditSaved), {
        appearance: 'success',
--- a/src/components/Settings/SettingsMain/index.tsx
+++ b/src/components/Settings/SettingsMain/index.tsx
@@ -17,7 +17,6 @@ import { ArrowDownOnSquareIcon } from '@heroicons/react/24/outline';
 import { ArrowPathIcon } from '@heroicons/react/24/solid';
 import type { UserSettingsGeneralResponse } from '@server/interfaces/api/userSettingsInterfaces';
 import type { MainSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import { useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
@@ -87,7 +86,10 @@ const SettingsMain = () => {

  const regenerate = async () => {
    try {
-      await axios.post('/api/v1/settings/main/regenerate');
+      const res = await fetch('/api/v1/settings/main/regenerate', {
+        method: 'POST',
+      });
+      if (!res.ok) throw new Error();

      revalidate();
      addToast(intl.formatMessage(messages.toastApiKeySuccess), {
@@ -140,18 +142,25 @@ const SettingsMain = () => {
          validationSchema={MainSettingsSchema}
          onSubmit={async (values) => {
            try {
-              await axios.post('/api/v1/settings/main', {
-                applicationTitle: values.applicationTitle,
-                applicationUrl: values.applicationUrl,
-                csrfProtection: values.csrfProtection,
-                hideAvailable: values.hideAvailable,
-                locale: values.locale,
-                region: values.region,
-                originalLanguage: values.originalLanguage,
-                partialRequestsEnabled: values.partialRequestsEnabled,
-                trustProxy: values.trustProxy,
-                cacheImages: values.cacheImages,
+              const res = await fetch('/api/v1/settings/main', {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                  applicationTitle: values.applicationTitle,
+                  applicationUrl: values.applicationUrl,
+                  csrfProtection: values.csrfProtection,
+                  hideAvailable: values.hideAvailable,
+                  locale: values.locale,
+                  region: values.region,
+                  originalLanguage: values.originalLanguage,
+                  partialRequestsEnabled: values.partialRequestsEnabled,
+                  trustProxy: values.trustProxy,
+                  cacheImages: values.cacheImages,
+                }),
              });
+              if (!res.ok) throw new Error();
              mutate('/api/v1/settings/public');
              mutate('/api/v1/status');

--- a/src/components/Settings/SettingsPlex.tsx
+++ b/src/components/Settings/SettingsPlex.tsx
@@ -16,7 +16,6 @@ import {
 } from '@heroicons/react/24/solid';
 import type { PlexDevice } from '@server/interfaces/api/plexInterfaces';
 import type { PlexSettings, TautulliSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Field, Formik } from 'formik';
 import { orderBy } from 'lodash';
 import { useMemo, useState } from 'react';
@@ -241,9 +240,15 @@ const SettingsPlex = ({ onComplete }: SettingsPlexProps) => {
      params.enable = activeLibraries.join(',');
    }

-    await axios.get('/api/v1/settings/plex/library', {
-      params,
+    const searchParams = new URLSearchParams({
+      sync: params.sync ? 'true' : 'false',
+      ...(params.enable ? { enable: params.enable } : {}),
    });
+    const res = await fetch(
+      `/api/v1/settings/plex/library?${searchParams.toString()}`
+    );
+    if (!res.ok) throw new Error();
+
    setIsSyncing(false);
    revalidate();
  };
@@ -262,11 +267,12 @@ const SettingsPlex = ({ onComplete }: SettingsPlexProps) => {
          toastId = id;
        }
      );
-      const response = await axios.get<PlexDevice[]>(
-        '/api/v1/settings/plex/devices/servers'
-      );
-      if (response.data) {
-        setAvailableServers(response.data);
+      const res = await fetch('/api/v1/settings/plex/devices/servers');
+      if (!res.ok) throw new Error();
+      const data: PlexDevice[] = await res.json();
+
+      if (data) {
+        setAvailableServers(data);
      }
      if (toastId) {
        removeToast(toastId);
@@ -289,16 +295,30 @@ const SettingsPlex = ({ onComplete }: SettingsPlexProps) => {
  };

  const startScan = async () => {
-    await axios.post('/api/v1/settings/plex/sync', {
-      start: true,
+    const res = await fetch('/api/v1/settings/plex/sync', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        start: true,
+      }),
    });
+    if (!res.ok) throw new Error();
    revalidateSync();
  };

  const cancelScan = async () => {
-    await axios.post('/api/v1/settings/plex/sync', {
-      cancel: true,
+    const res = await fetch('/api/v1/settings/plex/sync', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        cancel: true,
+      }),
    });
+    if (!res.ok) throw new Error();
    revalidateSync();
  };

@@ -313,15 +333,19 @@ const SettingsPlex = ({ onComplete }: SettingsPlexProps) => {
          .join(',');
      }

-      await axios.get('/api/v1/settings/plex/library', {
-        params,
-      });
+      const searchParams = new URLSearchParams(params.enable ? params : {});
+      const res = await fetch(
+        `/api/v1/settings/plex/library?${searchParams.toString()}`
+      );
+      if (!res.ok) throw new Error();
    } else {
-      await axios.get('/api/v1/settings/plex/library', {
-        params: {
-          enable: [...activeLibraries, libraryId].join(','),
-        },
+      const searchParams = new URLSearchParams({
+        enable: [...activeLibraries, libraryId].join(','),
      });
+      const res = await fetch(
+        `/api/v1/settings/plex/library?${searchParams.toString()}`
+      );
+      if (!res.ok) throw new Error();
    }
    setIsSyncing(false);
    revalidate();
@@ -385,12 +409,19 @@ const SettingsPlex = ({ onComplete }: SettingsPlexProps) => {
                toastId = id;
              }
            );
-            await axios.post('/api/v1/settings/plex', {
-              ip: values.hostname,
-              port: Number(values.port),
-              useSsl: values.useSsl,
-              webAppUrl: values.webAppUrl,
-            } as PlexSettings);
+            const res = await fetch('/api/v1/settings/plex', {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json',
+              },
+              body: JSON.stringify({
+                ip: values.hostname,
+                port: Number(values.port),
+                useSsl: values.useSsl,
+                webAppUrl: values.webAppUrl,
+              } as PlexSettings),
+            });
+            if (!res.ok) throw new Error();

            syncLibraries();

@@ -748,14 +779,27 @@ const SettingsPlex = ({ onComplete }: SettingsPlexProps) => {
            validationSchema={TautulliSettingsSchema}
            onSubmit={async (values) => {
              try {
-                await axios.post('/api/v1/settings/tautulli', {
-                  hostname: values.tautulliHostname,
-                  port: Number(values.tautulliPort),
-                  useSsl: values.tautulliUseSsl,
-                  urlBase: values.tautulliUrlBase,
-                  apiKey: values.tautulliApiKey,
-                  externalUrl: values.tautulliExternalUrl,
-                } as TautulliSettings);
+                const res = await fetch('/api/v1/settings/tautulli', {
+                  method: 'POST',
+                  headers: {
+                    'Content-Type': 'application/json',
+                  },
+                  body: JSON.stringify({
+                    hostname: values.tautulliHostname,
+                    port: Number(values.tautulliPort),
+                    useSsl: values.tautulliUseSsl,
+                    urlBase: values.tautulliUrlBase,
+                    apiKey: values.tautulliApiKey,
+                    externalUrl: values.tautulliExternalUrl,
+                  } as TautulliSettings),
+                });
+                if (!res.ok) throw new Error();
+
+                if (!res.ok) {
+                  throw new Error('Failed to fetch');
+                }
+
+                // Continue with any necessary processing

                addToast(
                  intl.formatMessage(messages.toastTautulliSettingsSuccess),
--- a/src/components/Settings/SettingsServices.tsx
+++ b/src/components/Settings/SettingsServices.tsx
@@ -13,7 +13,6 @@ import defineMessages from '@app/utils/defineMessages';
 import { Transition } from '@headlessui/react';
 import { PencilIcon, PlusIcon, TrashIcon } from '@heroicons/react/24/solid';
 import type { RadarrSettings, SonarrSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Fragment, useState } from 'react';
 import { useIntl } from 'react-intl';
 import useSWR, { mutate } from 'swr';
@@ -196,9 +195,14 @@ const SettingsServices = () => {
  });

  const deleteServer = async () => {
-    await axios.delete(
-      `/api/v1/settings/${deleteServerModal.type}/${deleteServerModal.serverId}`
+    const res = await fetch(
+      `/api/v1/settings/${deleteServerModal.type}/${deleteServerModal.serverId}`,
+      {
+        method: 'DELETE',
+      }
    );
+    if (!res.ok) throw new Error();
+
    setDeleteServerModal({ open: false, serverId: null, type: 'radarr' });
    revalidateRadarr();
    revalidateSonarr();
--- a/src/components/Settings/SettingsUsers/index.tsx
+++ b/src/components/Settings/SettingsUsers/index.tsx
@@ -9,7 +9,6 @@ import defineMessages from '@app/utils/defineMessages';
 import { ArrowDownOnSquareIcon } from '@heroicons/react/24/outline';
 import { MediaServerType } from '@server/constants/server';
 import type { MainSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import getConfig from 'next/config';
 import { useIntl } from 'react-intl';
@@ -77,21 +76,28 @@ const SettingsUsers = () => {
          enableReinitialize
          onSubmit={async (values) => {
            try {
-              await axios.post('/api/v1/settings/main', {
-                localLogin: values.localLogin,
-                newPlexLogin: values.newPlexLogin,
-                defaultQuotas: {
-                  movie: {
-                    quotaLimit: values.movieQuotaLimit,
-                    quotaDays: values.movieQuotaDays,
-                  },
-                  tv: {
-                    quotaLimit: values.tvQuotaLimit,
-                    quotaDays: values.tvQuotaDays,
-                  },
+              const res = await fetch('/api/v1/settings/main', {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
                },
-                defaultPermissions: values.defaultPermissions,
+                body: JSON.stringify({
+                  localLogin: values.localLogin,
+                  newPlexLogin: values.newPlexLogin,
+                  defaultQuotas: {
+                    movie: {
+                      quotaLimit: values.movieQuotaLimit,
+                      quotaDays: values.movieQuotaDays,
+                    },
+                    tv: {
+                      quotaLimit: values.tvQuotaLimit,
+                      quotaDays: values.tvQuotaDays,
+                    },
+                  },
+                  defaultPermissions: values.defaultPermissions,
+                }),
              });
+              if (!res.ok) throw new Error();
              mutate('/api/v1/settings/public');

              addToast(intl.formatMessage(messages.toastSettingsSuccess), {
--- a/src/components/Settings/SonarrModal/index.tsx
+++ b/src/components/Settings/SonarrModal/index.tsx
@@ -4,7 +4,6 @@ import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import { Transition } from '@headlessui/react';
 import type { SonarrSettings } from '@server/lib/settings';
-import axios from 'axios';
 import { Field, Formik } from 'formik';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { useIntl } from 'react-intl';
@@ -177,19 +176,24 @@ const SonarrModal = ({ onClose, sonarr, onSave }: SonarrModalProps) => {
    }) => {
      setIsTesting(true);
      try {
-        const response = await axios.post<TestResponse>(
-          '/api/v1/settings/sonarr/test',
-          {
+        const res = await fetch('/api/v1/settings/sonarr/test', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
            hostname,
            apiKey,
            port: Number(port),
            baseUrl,
            useSsl,
-          }
-        );
+          }),
+        });
+        if (!res.ok) throw new Error();
+        const data: TestResponse = await res.json();

        setIsValidated(true);
-        setTestResponse(response.data);
+        setTestResponse(data);
        if (initialLoad.current) {
          addToast(intl.formatMessage(messages.toastSonarrTestSuccess), {
            appearance: 'success',
@@ -306,12 +310,23 @@ const SonarrModal = ({ onClose, sonarr, onSave }: SonarrModalProps) => {
              tagRequests: values.tagRequests,
            };
            if (!sonarr) {
-              await axios.post('/api/v1/settings/sonarr', submission);
+              const res = await fetch('/api/v1/settings/sonarr', {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(submission),
+              });
+              if (!res.ok) throw new Error();
            } else {
-              await axios.put(
-                `/api/v1/settings/sonarr/${sonarr.id}`,
-                submission
-              );
+              const res = await fetch(`/api/v1/settings/sonarr/${sonarr.id}`, {
+                method: 'PUT',
+                headers: {
+                  'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(submission),
+              });
+              if (!res.ok) throw new Error();
            }

            onSave();