remove api usage

Author: DinoExho

src/app/api/cache/purge/schedule/route.ts

@@ -1,26 +1,27 @@
-import React from 'react';
-import { EventWithSessions } from '@/lib/events';
-import { useQuery } from '@tanstack/react-query';
+import React, { useMemo } from 'react';
+import { EventSession, EventWithSessions } from '@/lib/events';
 import EventCard from '@/app/events/[slug]/components/event-card';
 import { FloatingOverlay } from '@floating-ui/react';
 
 export default function EventPopup({
   selectedEventSlug,
+  eventSessions,
   onClose,
 }: {
   selectedEventSlug: string;
+  eventSessions: EventSession[];
   onClose: () => void;
 }) {
-  const query = useQuery<EventWithSessions>({
-    queryKey: ['event', selectedEventSlug],
-    queryFn: async () => {
-      const response = await fetch('/api/events/' + selectedEventSlug);
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
-      return response.json();
-    },
-  });
+  const eventData = useMemo<EventWithSessions | null>(() => {
+    const sessions = eventSessions.filter((s) => s.event.slug === selectedEventSlug);
+    if (sessions.length === 0) return null;
+
+    const firstSession = sessions[0];
+    return {
+      ...firstSession.event,
+      sessions,
+    };
+  }, [selectedEventSlug, eventSessions]);
 
   return (
     <>
@@ -33,12 +34,8 @@ export default function EventPopup({
           className="bg-white rounded-md max-w-full min-h-80 max-h-[calc(100vh-8rem)] overflow-y-auto cursor-default flex flex-col mx-2 mt-12"
           onClick={(e) => e.stopPropagation()}
         >
-          {query.data ? (
-            <EventCard event={query.data} onClose={onClose} />
-          ) : query.isLoading ? (
-            <div className="w-3xl max-w-full p-6 text-lg flex justify-center items-center grow mb-8">
-              Loading event...
-            </div>
+          {eventData ? (
+            <EventCard event={eventData} onClose={onClose} />
           ) : (
             <div className="w-3xl max-w-full p-6 text-lg flex flex-col gap-2 justify-center items-center grow mb-8">
               Could not find event

src/app/api/events/[slug]/route.ts

@@ -116,6 +116,7 @@ export default function EventSessionsList({
       {selectedFilters.selectedEvent && (
         <EventPopup
           selectedEventSlug={selectedFilters.selectedEvent}
+          eventSessions={eventSessions}
           onClose={() => setFilter({ selectedEvent: undefined })}
         />
       )}

src/app/api/random-image/route.ts

@@ -1,29 +1,21 @@
 'use client';
 
 import Image from 'next/image';
-import React, { useEffect, useState } from 'react';
+import React, { useMemo, useState } from 'react';
 
-const Gallery: React.FC = () => {
-  const [imageFilenames, setImageFilenames] = useState<string[]>([]);
+const Gallery: React.FC<{ files: string[] }> = ({ files }) => {
   const [selected, setSelected] = useState<number | null>(null);
 
   const shuffleArray = (array: string[]) => {
-    for (let i = array.length - 1; i > 0; i--) {
+    const arr = [...array];
+    for (let i = arr.length - 1; i > 0; i--) {
       const j = Math.floor(Math.random() * (i + 1));
-      [array[i], array[j]] = [array[j], array[i]];
+      [arr[i], arr[j]] = [arr[j], arr[i]];
     }
-    return array;
+    return arr;
   };
 
-  useEffect(() => {
-    fetch('/api/gallery')
-      .then((res) => res.json())
-      .then((data) => {
-        const shuffledFiles = shuffleArray(data.files);
-        setImageFilenames(shuffledFiles);
-      })
-      .catch((err) => console.error('Failed to load images:', err));
-  }, []);
+  const imageFilenames = useMemo(() => shuffleArray(files), [files]);
 
   return (
     <>
@@ -65,6 +57,6 @@ const Gallery: React.FC = () => {
       )}
     </>
   );
-};
+};;
 
 export default Gallery;

src/app/api/sendToDiscord/route.js

@@ -1,8 +1,5 @@
 import React, { useState } from 'react';
 import Image from 'next/image';
-import { FiSend } from 'react-icons/fi';
-import ActionButton from './ActionButton';
-import { sendToDiscord } from '../lib/sendToDiscord';
 
 interface SubmissionModalProps {
   caption: string;
@@ -20,16 +17,7 @@ const SubmissionModal: React.FC<SubmissionModalProps> = ({
   const [showModal, setShowModal] = useState(false);
   const [previewDataUrl, setPreviewDataUrl] = useState<string | null>(null);
 
-  const handleSendClick = () => {
-    const canvas = document.querySelector('canvas') as HTMLCanvasElement;
-    if (canvas) {
-      setPreviewDataUrl(canvas.toDataURL('image/png'));
-    }
-    setShowModal(true);
-  };
-
   const handleConfirm = () => {
-    sendToDiscord(caption, author);
     setShowModal(false);
   };
 

src/app/events/components/event-sessions-list/event-popup.tsx

@@ -38,7 +38,7 @@ const loadCanvasState = () => {
   }
 };
 
-const PaintApp = () => {
+const PaintApp = ({ galleryFiles }: { galleryFiles: string[] }) => {
   const [brushSettings, setBrushSettings] = useState({
     color: '#4f1d75',
     size: 40,
@@ -239,7 +239,7 @@ const PaintApp = () => {
         />
       </div>
       <h1 className="text-teal text-2xl font-semibold mb-2 mt-4">W-Gallery</h1>
-      <Gallery />
+      <Gallery files={galleryFiles} />
     </>
   );
 };

src/app/events/components/event-sessions-list/event-sessions-list.tsx

@@ -1,9 +1,8 @@
 import fs from 'fs';
 import path from 'path';
-import { NextResponse } from 'next/server';
 
-export async function GET() {
+export async function getGalleryFiles(): Promise<string[]> {
   const dir = path.join(process.cwd(), 'public/wpaint-gallery');
   const files = fs.readdirSync(dir).filter((file) => file.endsWith('.jpg'));
-  return NextResponse.json({ files });
+  return files;
 }