Convert ky to fetch

RelistenNet · Sep 26, 2023 · 8ac1323 · 8ac1323
1 parent b65571d
commit 8ac1323
Show file tree

Hide file tree

Showing 7 changed files with 74 additions and 79 deletions.
diff --git a/src/app/(main)/(home)/[artistSlug]/[year]/[month]/[day]/layout.tsx b/src/app/(main)/(home)/[artistSlug]/[year]/[month]/[day]/layout.tsx
@@ -5,22 +5,23 @@ import TapesColumn from '@/components/TapesColumn';
 import { API_DOMAIN } from '@/lib/constants';
 import { createShowDate } from '@/lib/utils';
 import { Tape } from '@/types';
-import ky from 'ky-universal';
 import { notFound } from 'next/navigation';
 import React from 'react';
 
 export const fetchShow = async (
   slug?: string,
   year?: string,
   displayDate?: string
-): Promise<Partial<Tape>> => {
+): Promise<Partial<Tape> | undefined> => {
   if (!slug || !year || !displayDate) return { sources: [] };
 
-  const parsed = (await ky(`${API_DOMAIN}/api/v2/artists/${slug}/years/${year}/${displayDate}`, {
-    cache: 'no-cache',
-  }).json()) as Tape;
-
-  return parsed;
+  try {
+    const res = await fetch(`${API_DOMAIN}/api/v2/artists/${slug}/years/${year}/${displayDate}`);
+    const parsed = await res.json() as Tape;
+    return parsed;
+  } catch (err) {
+    console.error('fetch show error', err);
+  }
 };
 
 export default async function Page({ params, children }: MainLayoutProps) {

diff --git a/src/app/(main)/(home)/[artistSlug]/page.tsx b/src/app/(main)/(home)/[artistSlug]/page.tsx
@@ -4,19 +4,20 @@ import SongsColumn from '@/components/SongsColumn';
 import TapesColumn from '@/components/TapesColumn';
 import { API_DOMAIN } from '@/lib/constants';
 import { Tape } from '@/types';
-import ky from 'ky-universal';
 import { notFound } from 'next/navigation';
 import { useIsMobile } from '../page';
 import React from 'react';
 
 export const fetchRandomShow = async (slug?: string): Promise<Tape | undefined> => {
   if (!slug) return undefined;
 
-  const parsed: Tape = await ky(`${API_DOMAIN}/api/v2/artists/${slug}/shows/random`, {
-    cache: 'no-cache',
-  }).json();
-
-  return parsed;
+  try {
+    const res = await fetch(`${API_DOMAIN}/api/v2/artists/${slug}/shows/random`);
+    const parsed = await res.json();
+    return parsed;
+  } catch (err) {
+    console.error('fetch random show error', err);
+  }
 };
 
 export default async function Page({ params }) {

diff --git a/src/app/(main)/(secondary)/recently-played/RecentlyPlayed.tsx b/src/app/(main)/(secondary)/recently-played/RecentlyPlayed.tsx
@@ -3,7 +3,6 @@
 import { QueryClient, useQuery, useQueryClient } from '@tanstack/react-query';
 import LiveTrack from '../../../../components/LiveTrack';
 import { API_DOMAIN } from '../../../../lib/constants';
-import ky from 'ky';
 
 function uniqBy(a: any[], key: (item: any) => boolean) {
   const seen = new Set();
@@ -31,7 +30,8 @@ const fetchRecentlyPlayed = async (queryClient: QueryClient) => {
   if (lastSeenId) {
     paramsStr = `?lastSeenId=${lastSeenId}`;
   }
-  const parsed = await ky(`${API_DOMAIN}/api/v2/live/history${paramsStr}`).json();
+  const res = await fetch(`${API_DOMAIN}/api/v2/live/history${paramsStr}`)
+  const parsed = await res.json();
 
   if (Array.isArray(parsed)) {
     return parsed.concat(cache ?? []).slice(0, 100);

diff --git a/src/app/queries.tsx b/src/app/queries.tsx
@@ -1,15 +1,13 @@
-import ky from 'ky-universal';
 import { API_DOMAIN } from '../lib/constants';
 import { Artist } from '@/types';
 
 export const fetchArtists = async (): Promise<Artist[]> => {
-  const parsed = await ky(`${API_DOMAIN}/api/v2/artists`, {
-    next: { revalidate: 60 * 5 }, // leaving for now, should revisit cache (I dont think this works)
-  })
-    .json()
-    .catch((err) => {
-      console.error('artists fetch error', err);
-    });
-
-  return (parsed as Artist[]) ?? [];
+  try {
+    const res = await fetch(`${API_DOMAIN}/api/v2/artists`);
+    const parsed = await res.json();
+    return parsed as Artist[];
+  } catch (err) {
+    console.error('artists fetch error', err);
+    return [];
+  }
 };
diff --git a/src/components/ShowsColumn.tsx b/src/components/ShowsColumn.tsx
@@ -2,7 +2,6 @@ import sortActiveBands from '../lib/sortActiveBands';
 import { durationToHHMMSS, removeLeadingZero, simplePluralize, splitShowDate } from '../lib/utils';
 
 import { RawParams } from '@/app/(main)/(home)/layout';
-import ky from 'ky-universal';
 import React from 'react';
 import { API_DOMAIN } from '../lib/constants';
 import { ArtistShows } from '../types';
@@ -15,9 +14,8 @@ import Tag from './Tag';
 const fetchShows = async (slug?: string, year?: string): Promise<ArtistShows | undefined> => {
   if (!slug || !year) return undefined;
 
-  const parsed: ArtistShows = await ky(`${API_DOMAIN}/api/v2/artists/${slug}/years/${year}`, {
-    cache: 'no-cache',
-  }).json();
+  const res = await fetch(`${API_DOMAIN}/api/v2/artists/${slug}/years/${year}`);
+  const parsed: ArtistShows = await res.json();
 
   return parsed;
 };

diff --git a/src/components/SongsColumn.tsx b/src/components/SongsColumn.tsx
@@ -83,48 +83,49 @@ const SongsColumn = (props: Props) => {
       loadingAmount={12}
     >
       {activeSourceObj &&
-        activeSourceObj.sets?.map((set, setIdx) =>
-          set.tracks?.map((track, trackIdx) => {
-            const trackIsActive = track.id === activePlaybackTrackId && isActiveSourcePlaying;
+        activeSourceObj.sets?.map(
+          (set, setIdx) =>
+            set.tracks?.map((track, trackIdx) => {
+              const trackIsActive = track.id === activePlaybackTrackId && isActiveSourcePlaying;
 
-            const trackMetadata = isActiveSourcePlaying
-              ? gaplessTracksMetadata.find(
-                  (gaplessTrack) =>
-                    gaplessTrack.trackMetadata && gaplessTrack.trackMetadata.trackId === track.id
-                )
-              : null;
+              const trackMetadata = isActiveSourcePlaying
+                ? gaplessTracksMetadata.find(
+                    (gaplessTrack) =>
+                      gaplessTrack.trackMetadata && gaplessTrack.trackMetadata.trackId === track.id
+                  )
+                : null;
 
-            return (
-              <div key={track.id}>
-                {trackIdx === 0 && Number(activeSourceObj.sets?.length) > 1 && (
-                  <RowHeader>
-                    {set.name || `Set ${setIdx + 1}`} <div>{getSetTime(set)}</div>
-                  </RowHeader>
-                )}
-                <Row
-                  key={track.id}
-                  href={`/${props.artistSlug}/${props.year}/${props.month}/${props.day}/${track.slug}?source=${activeSourceObj.id}`}
-                  isActiveOverride={trackIsActive}
-                >
-                  <div>
-                    <div>{track.title}</div>
-                    {track.duration && (
-                      <div className="text-xxs text-gray-400">
-                        {durationToHHMMSS(track.duration)}
-                      </div>
-                    )}
-                  </div>
-                  <div className="text-xxs min-w-[20%] text-right text-gray-400">
+              return (
+                <div key={track.id}>
+                  {trackIdx === 0 && Number(activeSourceObj.sets?.length) > 1 && (
+                    <RowHeader>
+                      {set.name || `Set ${setIdx + 1}`} <div>{getSetTime(set)}</div>
+                    </RowHeader>
+                  )}
+                  <Row
+                    key={track.id}
+                    href={`/${props.artistSlug}/${props.year}/${props.month}/${props.day}/${track.slug}?source=${activeSourceObj.id}`}
+                    isActiveOverride={trackIsActive}
+                  >
                     <div>
-                      {trackMetadata && trackMetadata.webAudioLoadingState !== 'NONE'
-                        ? trackMetadata.webAudioLoadingState
-                        : ''}
+                      <div>{track.title}</div>
+                      {track.duration && (
+                        <div className="text-xxs text-gray-400">
+                          {durationToHHMMSS(track.duration)}
+                        </div>
+                      )}
+                    </div>
+                    <div className="min-w-[20%] text-right text-xxs text-gray-400">
+                      <div>
+                        {trackMetadata && trackMetadata.webAudioLoadingState !== 'NONE'
+                          ? trackMetadata.webAudioLoadingState
+                          : ''}
+                      </div>
                     </div>
-                  </div>
-                </Row>
-              </div>
-            );
-          })
+                  </Row>
+                </div>
+              );
+            })
         )}
       {activeSourceObj && <RowHeader>FIN</RowHeader>}
       {activeSourceObj &&

diff --git a/src/components/YearsColumn.tsx b/src/components/YearsColumn.tsx
@@ -3,7 +3,6 @@ import { simplePluralize } from '../lib/utils';
 
 import { RawParams } from '@/app/(main)/(home)/layout';
 import { fetchArtists } from '@/app/queries';
-import ky from 'ky-universal';
 import { API_DOMAIN } from '../lib/constants';
 import { Year } from '../types';
 import Column from './Column';
@@ -13,17 +12,14 @@ import { notFound } from 'next/navigation';
 const fetchYears = async (slug?: string): Promise<Year[]> => {
   if (!slug) return [];
 
-  const parsed = await ky(`${API_DOMAIN}/api/v2/artists/${slug}/years`, {
-    cache: 'no-cache',
-  })
-    .json<Year[]>()
-    .catch(() => {
-      notFound();
-
-      return [] as Year[];
-    });
-
-  return parsed ?? [];
+  try {
+    const res = await fetch(`${API_DOMAIN}/api/v2/artists/${slug}/years`);
+    const parsed = await res.json();
+    return parsed;
+  } catch (err) {
+    console.error('fetch years error', err);
+    notFound();
+  }
 };
 
 const YearsColumn = async ({ artistSlug }: Pick<RawParams, 'artistSlug'>) => {