fix: pages that use fetchDataViaGET

app/collection/[id]/page.tsx

@@ -1,28 +1,36 @@
 import { ViewCollectionPage } from "#/pages/ViewCollection";
 import { fetchDataViaGet } from "#/api/utils";
 import type { Metadata, ResolvingMetadata } from "next";
-export const dynamic = 'force-static';
+export const dynamic = "force-static";
 
 export async function generateMetadata(
   { params },
   parent: ResolvingMetadata
 ): Promise<Metadata> {
   const id = params.id;
-  const collection = await fetchDataViaGet(
+  const { data, error } = await fetchDataViaGet(
     `https://api.anixart.tv/collection/${id}`
   );
   const previousOG = (await parent).openGraph;
 
+  if (error) {
     return {
-    title: collection.collection
+      title: "Ошибка",
-      ? "коллекция - " + collection.collection.title
+      description: "Ошибка",
+    };
+  }
+
+  return {
+    title:
+      data.collection ?
+        "коллекция - " + data.collection.title
       : "Приватная коллекция",
-    description: collection.collection && collection.collection.description,
+    description: data.collection && data.collection.description,
     openGraph: {
       ...previousOG,
       images: [
         {
-          url: collection.collection && collection.collection.image, // Must be an absolute URL
+          url: data.collection && data.collection.image, // Must be an absolute URL
           width: 600,
           height: 800,
         },

app/components/Comments/Comments.Main.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect, useCallback } from "react";
 import { ENDPOINTS } from "#/api/config";
 import useSWRInfinite from "swr/infinite";
 import { CommentsAddModal } from "./Comments.Add";
+import { useSWRfetcher } from "#/api/utils";
 
 export const CommentsMain = (props: {
   release_id: number;
@@ -82,20 +83,6 @@ export const CommentsMain = (props: {
   );
 };
 
-const fetcher = async (url: string) => {
-  const res = await fetch(url);
-
-  if (!res.ok) {
-    const error = new Error(
-      `An error occurred while fetching the data. status: ${res.status}`
-    );
-    error.message = await res.json();
-    throw error;
-  }
-
-  return res.json();
-};
-
 const CommentsAllModal = (props: {
   isOpen: boolean;
   setIsOpen: any;
@@ -103,7 +90,6 @@ const CommentsAllModal = (props: {
   token: string | null;
   type?: "release" | "collection";
 }) => {
-  const [isLoadingEnd, setIsLoadingEnd] = useState(false);
   const [currentRef, setCurrentRef] = useState<any>(null);
   const modalRef = useCallback((ref) => {
     setCurrentRef(ref);
@@ -127,7 +113,7 @@ const CommentsAllModal = (props: {
 
   const { data, error, isLoading, size, setSize } = useSWRInfinite(
     getKey,
-    fetcher,
+    useSWRfetcher,
     { initialSize: 2 }
   );
 
@@ -139,7 +125,6 @@ const CommentsAllModal = (props: {
         allReleases.push(...data[i].content);
       }
       setContent(allReleases);
-      setIsLoadingEnd(true);
     }
   }, [data]);
 
@@ -170,7 +155,7 @@ const CommentsAllModal = (props: {
             Все комментарии
           </h2>
           <p className="text-sm font-light text-gray-600 dark:text-gray-300">
-            всего: {!isLoadingEnd ? "загрузка..." : data[0].total_count}
+            всего: {isLoading ? "загрузка..." : data[0].total_count}
           </p>
         </div>
       </Modal.Header>
@@ -179,7 +164,7 @@ const CommentsAllModal = (props: {
         onScroll={handleScroll}
         ref={modalRef}
       >
-        {!isLoadingEnd ? (
+        {isLoading ? (
           <Spinner />
         ) : content ? (
           content.map((comment: any) => (

app/pages/CreateCollection.tsx

@@ -545,9 +545,9 @@ export const ReleasesEditModal = (props: {
           })}
           {content.length == 1 && <div></div>}
         </div>
-      </div>
         {isLoading && <Spinner />}
         {error && <div>Произошла ошибка</div>}
+      </div>
     </Modal>
   );
 };

app/pages/Release.tsx

@@ -2,8 +2,7 @@
 
 import useSWR from "swr";
 import { Spinner } from "#/components/Spinner/Spinner";
-const fetcher = (...args: any) =>
+import { useSWRfetcher } from "#/api/utils";
-  fetch([...args] as any).then((res) => res.json());
 import { useUserStore } from "#/store/auth";
 import { useEffect, useState } from "react";
 
@@ -33,7 +32,7 @@ export const ReleasePage = (props: any) => {
     if (userStore.token) {
       url += `?token=${userStore.token}`;
     }
-    const { data, isLoading, error } = useSWR(url, fetcher);
+    const { data, isLoading, error } = useSWR(url, useSWRfetcher);
     return [data, isLoading, error];
   }
   const [data, isLoading, error] = useFetch(props.id);
@@ -49,7 +48,29 @@ export const ReleasePage = (props: any) => {
     }
   }, [data]);
 
-  return data ? (
+  if (isLoading) {
+    return (
+      <main className="flex items-center justify-center min-h-screen">
+        <Spinner />
+      </main>
+    );
+  }
+
+  if (error) {
+    return (
+      <main className="flex items-center justify-center min-h-screen">
+        <div className="flex flex-col gap-2">
+          <h1 className="text-2xl font-bold">Ошибка</h1>
+          <p className="text-lg">
+            Произошла ошибка при загрузке релиза. Попробуйте обновить страницу
+            или зайдите позже.
+          </p>
+        </div>
+      </main>
+    );
+  }
+
+  return (
     <>
       <div className="flex flex-col lg:grid lg:grid-cols-[70%_30%] gap-2 grid-flow-row-dense">
         <div className="[grid-column:1] [grid-row:span_2]">
@@ -99,11 +120,9 @@ export const ReleasePage = (props: any) => {
         {data.release.status &&
           data.release.status.name.toLowerCase() != "анонс" && (
             <div className="[grid-column:1] [grid-row:span_12]">
-              {preferenceStore.params.experimental.newPlayer ? (
+              {preferenceStore.params.experimental.newPlayer ?
                 <ReleasePlayerCustom id={props.id} token={userStore.token} />
-              ) : (
+              : <ReleasePlayer id={props.id} />}
-                <ReleasePlayer id={props.id} />
-              )}
             </div>
           )}
         {data.release.status &&
@@ -160,9 +179,5 @@ export const ReleasePage = (props: any) => {
         </div>
       </div>
     </>
-  ) : (
-    <div className="flex h-[100dvh] w-full justify-center items-center">
-      <Spinner />
-    </div>
   );
 };

app/related/[id]/page.tsx

@@ -3,12 +3,31 @@ import { fetchDataViaGet } from "#/api/utils";
 import type { Metadata, ResolvingMetadata } from "next";
 export const dynamic = 'force-static';
 
+const _getData = async (url: string) => {
+  const { data, error } = await fetchDataViaGet(url);
+  return [data, error];
+}
+
 export async function generateMetadata({ params }, parent: ResolvingMetadata): Promise<Metadata> {
   const id:string = params.id;
-  const related: any = await fetchDataViaGet(`https://api.anixart.tv/related/${id}/0`);
-  const firstRelease: any = await fetchDataViaGet(`https://api.anixart.tv/release/${related.content[0].id}`);
   const previousOG = (await parent).openGraph;
 
+  const [ related, relatedError ] = await _getData(`https://api.anixart.tv/related/${id}/0`);
+  if (relatedError || related.content.length == 0) {
+    return {
+      title: "Ошибка",
+      description: "Ошибка",
+    };
+  };
+
+  const [ firstRelease, firstReleaseError ] = await _getData(`https://api.anixart.tv/release/${related.content[0].id}`);
+  if (firstReleaseError) {
+    return {
+      title: "Ошибка",
+      description: "Ошибка",
+    };
+  };
+
   return {
     title: "Франшиза - " + firstRelease.release.related.name_ru || firstRelease.release.related.name,
     description: firstRelease.release.description,
@@ -27,7 +46,25 @@ export async function generateMetadata({ params }, parent: ResolvingMetadata): P
 
 export default async function Related({ params }) {
   const id: string = params.id;
-  const related: any = await fetchDataViaGet(`https://api.anixart.tv/related/${id}/0`);
+  const [ related, relatedError ] = await _getData(`https://api.anixart.tv/related/${id}/0`);
-  const firstRelease: any = await fetchDataViaGet(`https://api.anixart.tv/release/${related.content[0].id}`);
+  if (relatedError || related.content.length == 0) {
+    return <main className="flex items-center justify-center min-h-screen">
+      <div className="flex flex-col gap-2">
+        <h1 className="text-2xl font-bold">Ошибка</h1>
+        <p className="text-lg">Произошла ошибка при загрузке франшизы. Попробуйте обновить страницу или зайдите позже.</p>
+      </div>
+    </main>
+  };
+
+  const [ firstRelease, firstReleaseError ] = await _getData(`https://api.anixart.tv/release/${related.content[0].id}`);
+  if (firstReleaseError) {
+    return <main className="flex items-center justify-center min-h-screen">
+      <div className="flex flex-col gap-2">
+        <h1 className="text-2xl font-bold">Ошибка</h1>
+        <p className="text-lg">Произошла ошибка при загрузке франшизы. Попробуйте обновить страницу или зайдите позже.</p>
+      </div>
+    </main>
+  };
+
   return <RelatedPage id={id} title={firstRelease.release.related.name_ru || firstRelease.release.related.name} />;
 }

app/release/[id]/collections/page.tsx

@@ -1,24 +1,33 @@
 import { CollectionsFullPage } from "#/pages/CollectionsFull";
 import { fetchDataViaGet } from "#/api/utils";
 import type { Metadata, ResolvingMetadata } from "next";
-export const dynamic = 'force-static';
+export const dynamic = "force-static";
 
 export async function generateMetadata(
   { params },
   parent: ResolvingMetadata
 ): Promise<Metadata> {
   const id = params.id;
-  const release = await fetchDataViaGet(`https://api.anixart.tv/release/${id}`);
+  const { data, error } = await fetchDataViaGet(
+    `https://api.anixart.tv/release/${id}`
+  );
   const previousOG = (await parent).openGraph;
 
+  if (error) {
     return {
-    title: release.release.title_ru + " - в коллекциях",
+      title: "Ошибка",
-    description: release.release.description,
+      description: "Ошибка",
+    };
+  }
+
+  return {
+    title: data.release.title_ru + " - в коллекциях",
+    description: data.release.description,
     openGraph: {
       ...previousOG,
       images: [
         {
-          url: release.release.image, // Must be an absolute URL
+          url: data.release.image, // Must be an absolute URL
           width: 600,
           height: 800,
         },
@@ -28,13 +37,26 @@ export async function generateMetadata(
 }
 
 export default async function Collections({ params }) {
-  const release: any = await fetchDataViaGet(
+  const { data, error } = await fetchDataViaGet(
     `https://api.anixart.tv/release/${params.id}`
   );
+
+  if (error) {
+    <main className="flex items-center justify-center min-h-screen">
+      <div className="flex flex-col gap-2">
+        <h1 className="text-2xl font-bold">Ошибка</h1>
+        <p className="text-lg">
+          Произошла ошибка при загрузке коллекций. Попробуйте обновить страницу
+          или зайдите позже.
+        </p>
+      </div>
+    </main>;
+  };
+
   return (
     <CollectionsFullPage
       type="release"
-      title={release.release.title_ru + " в коллекциях"}
+      title={data.release.title_ru + " в коллекциях"}
       release_id={params.id}
     />
   );

app/release/[id]/page.tsx

@@ -1,24 +1,33 @@
 import { ReleasePage } from "#/pages/Release";
 import { fetchDataViaGet } from "#/api/utils";
 import type { Metadata, ResolvingMetadata } from "next";
-export const dynamic = 'force-static';
+export const dynamic = "force-static";
 
 export async function generateMetadata(
   { params },
   parent: ResolvingMetadata
 ): Promise<Metadata> {
   const id = params.id;
-  const release = await fetchDataViaGet(`https://api.anixart.tv/release/${id}`);
+  const { data, error } = await fetchDataViaGet(
+    `https://api.anixart.tv/release/${id}`
+  );
   const previousOG = (await parent).openGraph;
 
+  if (error) {
     return {
-    title: release.release.title_ru,
+      title: "Ошибка",
-    description: release.release.description,
+      description: "Ошибка",
+    };
+  }
+
+  return {
+    title: data.release.title_ru,
+    description: data.release.description,
     openGraph: {
       ...previousOG,
       images: [
         {
-          url: release.release.image, // Must be an absolute URL
+          url: data.release.image, // Must be an absolute URL
           width: 600,
           height: 800,
         },