add margin, delay support

src/app/questions/page.tsx

@@ -1,12 +1,14 @@
 import { QuestionPageBody } from '@/components/questions/question-page-body';
+import { getDelayData } from '@/models/get-delay-data';
 import { getPresentationData } from '@/models/get-presentation-data';
 
 export default async function questionsPage() {
   const presentations = await getPresentationData();
+  const delay = await getDelayData();
   return (
     <div className='flex flex-col px-4 sm:px-6 xl:px-0 max-w-6xl w-full overflow-hidden'>
       <h1 className='mb-16 mt-8'>Kérdezz az elődóktól!</h1>
-      <QuestionPageBody presentations={presentations} />
+      <QuestionPageBody presentations={presentations} delay={delay ?? 0} />
     </div>
   );
 }

src/components/presentation/PresentationQuestion.tsx

@@ -39,6 +39,7 @@ export function PresentationQuestionForm({ slug }: PresentationQuestionFormProps
           setQuestionCount(questionCount + 1);
           setIsSuccessOpen(true);
           setQuestion('');
+          setError('');
           break;
         case 400:
           setError('Hibás formátum!');

src/components/questions/question-page-body.tsx

@@ -5,7 +5,13 @@ import { GoogleReCaptchaProvider } from 'react-google-recaptcha-v3';
 import { RoomQuestion } from '@/components/tiles/question-tile';
 import { PresentationWithDates } from '@/models/models';
 
-export function QuestionPageBody({ presentations }: { presentations: PresentationWithDates[] | undefined }) {
+export function QuestionPageBody({
+  presentations,
+  delay,
+}: {
+  presentations: PresentationWithDates[] | undefined;
+  delay: number;
+}) {
   return (
     <GoogleReCaptchaProvider reCaptchaKey={process.env.NEXT_PUBLIC_RECAPTCHA_SITE_KEY ?? ''}>
       <div className='grid grid-cols-1 sm:grid-cols-2 gap-6'>
@@ -16,10 +22,10 @@ export function QuestionPageBody({ presentations }: { presentations: Presentatio
           <h2 className='text-4xl text-center'>IB025</h2>
         </div>
         <div className='order-2 sm:order-3'>
-          <RoomQuestion presentations={presentations ?? []} room='IB028' />
+          <RoomQuestion presentations={presentations ?? []} room='IB028' delay={delay} />
         </div>
         <div className='order-4'>
-          <RoomQuestion presentations={presentations ?? []} room='IB025' />
+          <RoomQuestion presentations={presentations ?? []} room='IB025' delay={delay} />
         </div>
       </div>
     </GoogleReCaptchaProvider>

src/components/tiles/question-tile.tsx

@@ -6,15 +6,24 @@ import { PresentationTile } from '../presentation/PresentationGrid';
 type Props = {
   presentations: PresentationWithDates[];
   room: 'IB028' | 'IB025';
+  delay: number;
 };
+const MARGIN_MINUTES = 10;
 
-export function RoomQuestion({ presentations, room }: Props) {
+export function RoomQuestion({ presentations, room, delay }: Props) {
   const now = new Date();
-  const presentation = presentations.find(
-    (p) => p.room === room && !p.placeholder && p.startDate < now && p.endDate > now
-  );
-  return presentation ? (
-    <PresentationTile presentation={presentation} preview />
+  now.setMinutes(now.getMinutes() - delay);
+  const presentationInRoom = presentations.filter((p) => {
+    const endDateWithMargin = new Date(p.endDate);
+    endDateWithMargin.setMinutes(endDateWithMargin.getMinutes() + MARGIN_MINUTES);
+    return p.room === room && !p.placeholder && p.startDate < now && endDateWithMargin > now;
+  });
+  return presentationInRoom.length > 0 ? (
+    <div className='flex flex-col gap-4'>
+      {presentationInRoom.reverse().map((p) => (
+        <PresentationTile presentation={p} key={p.slug} preview />
+      ))}
+    </div>
   ) : (
     <p className='text-stone-200 text-base sm:text-[20px] text-center'>
       Jelenleg nincs előadás ebben a teremben, nézz vissza később!

src/models/get-delay-data.ts

@@ -0,0 +1,9 @@
+export async function getDelayData() {
+  const response = await fetch(`${process.env.BACKEND_URL}/proto/delay`, { cache: 'no-store' });
+  if (!response.ok) {
+    console.error(response);
+    return;
+  }
+  const data: { delay: number } = await response.json();
+  return data.delay;
+}