refactor: switch from Fetch API to Axios (#1520)

* refactor: switch from Fetch API to Axios

* fix: remove unwanted changes

* fix: rewrite error handling for Axios and remove IPv4 first setting

* style: run prettier

* style: run prettier

* fix: add back custom proxy agent

* fix: add back custom proxy agent

* fix: correct rebase issue

* fix: resolve review comments

src/components/IssueDetails/IssueComment/index.tsx

@@ -6,6 +6,7 @@ import defineMessages from '@app/utils/defineMessages';
 import { Menu, Transition } from '@headlessui/react';
 import { EllipsisVerticalIcon } from '@heroicons/react/24/solid';
 import type { default as IssueCommentType } from '@server/entity/IssueComment';
+import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import Link from 'next/link';
 import { Fragment, useState } from 'react';
@@ -48,10 +49,7 @@ const IssueComment = ({
 
   const deleteComment = async () => {
     try {
-      const res = await fetch(`/api/v1/issueComment/${comment.id}`, {
-        method: 'DELETE',
-      });
-      if (!res.ok) throw new Error();
+      await axios.delete(`/api/v1/issueComment/${comment.id}`);
     } catch (e) {
       // something went wrong deleting the comment
     } finally {
@@ -178,17 +176,9 @@ const IssueComment = ({
               <Formik
                 initialValues={{ newMessage: comment.message }}
                 onSubmit={async (values) => {
-                  const res = await fetch(
-                    `/api/v1/issueComment/${comment.id}`,
-                    {
-                      method: 'PUT',
-                      headers: {
-                        'Content-Type': 'application/json',
-                      },
-                      body: JSON.stringify({ message: values.newMessage }),
-                    }
-                  );
-                  if (!res.ok) throw new Error();
+                  await axios.put(`/api/v1/issueComment/${comment.id}`, {
+                    message: values.newMessage,
+                  });
 
                   if (onUpdate) {
                     onUpdate();

src/components/IssueDetails/index.tsx

@@ -27,6 +27,7 @@ import { MediaServerType } from '@server/constants/server';
 import type Issue from '@server/entity/Issue';
 import type { MovieDetails } from '@server/models/Movie';
 import type { TvDetails } from '@server/models/Tv';
+import axios from 'axios';
 import { Field, Form, Formik } from 'formik';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
@@ -121,14 +122,9 @@ const IssueDetails = () => {
 
   const editFirstComment = async (newMessage: string) => {
     try {
-      const res = await fetch(`/api/v1/issueComment/${firstComment.id}`, {
-        method: 'PUT',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({ message: newMessage }),
+      await axios.put(`/api/v1/issueComment/${firstComment.id}`, {
+        message: newMessage,
       });
-      if (!res.ok) throw new Error();
 
       addToast(intl.formatMessage(messages.toasteditdescriptionsuccess), {
         appearance: 'success',
@@ -145,10 +141,7 @@ const IssueDetails = () => {
 
   const updateIssueStatus = async (newStatus: 'open' | 'resolved') => {
     try {
-      const res = await fetch(`/api/v1/issue/${issueData.id}/${newStatus}`, {
-        method: 'POST',
-      });
-      if (!res.ok) throw new Error();
+      await axios.post(`/api/v1/issue/${issueData.id}/${newStatus}`);
 
       addToast(intl.formatMessage(messages.toaststatusupdated), {
         appearance: 'success',
@@ -166,10 +159,7 @@ const IssueDetails = () => {
 
   const deleteIssue = async () => {
     try {
-      const res = await fetch(`/api/v1/issue/${issueData.id}`, {
-        method: 'DELETE',
-      });
-      if (!res.ok) throw new Error();
+      await axios.delete(`/api/v1/issue/${issueData.id}`);
       mutate('/api/v1/issue/count');
 
       addToast(intl.formatMessage(messages.toastissuedeleted), {
@@ -504,17 +494,9 @@ const IssueDetails = () => {
                 }}
                 validationSchema={CommentSchema}
                 onSubmit={async (values, { resetForm }) => {
-                  const res = await fetch(
-                    `/api/v1/issue/${issueData?.id}/comment`,
-                    {
-                      method: 'POST',
-                      headers: {
-                        'Content-Type': 'application/json',
-                      },
-                      body: JSON.stringify({ message: values.message }),
-                    }
-                  );
-                  if (!res.ok) throw new Error();
+                  await axios.post(`/api/v1/issue/${issueData?.id}/comment`, {
+                    message: values.message,
+                  });
                   revalidateIssue();
                   resetForm();
                 }}