1

src/app/questions/page.tsx

@@ -0,0 +1,22 @@
+import { RoomQuestion } from '@/components/tiles/question-tile';
+import { getPresentationData } from '@/models/get-presentation-data';
+
+export default async function questionsPage() {
+  const presentations = await getPresentationData();
+  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>
+
+      <div className='grid grid-cols-1 sm:grid-cols-2 gap-6'>
+        <div className='sm:col-span-2 lg:col-span-1'>
+          <h2 className='sm:text-3xl md:text-4xl text-center'>IB028</h2>
+        </div>
+        <div className='sm:col-span-2 lg:col-span-1'>
+          <h2 className='sm:text-3xl md:text-4xl text-center'>IB025</h2>
+        </div>
+        <RoomQuestion presentations={presentations ?? []} room='IB028' />
+        <RoomQuestion presentations={presentations ?? []} room='IB025' />
+      </div>
+    </div>
+  );
+}

src/components/presentation/PresentationGrid.tsx

@@ -2,7 +2,7 @@
 
 import clsx from 'clsx';
 import Link from 'next/link';
-import { CSSProperties, useRef } from 'react';
+import { CSSProperties, useRef, useState } from 'react';
 
 import { Tile } from '@/components/tiles/tile';
 import { PresentationWithDates, SponsorCategory } from '@/models/models';
@@ -88,9 +88,16 @@ export function PresentationGrid({
   );
 }
 
-function PresentationTile({ presentation }: { presentation: PresentationWithDates }) {
+export function PresentationTile({
+  presentation,
+  preview = false,
+}: {
+  presentation: PresentationWithDates;
+  preview?: boolean;
+}) {
+  const [question, setQuestion] = useState('');
   return (
-    <Tile clickable={!presentation.placeholder} className='w-full h-full' disableMinHeight={true}>
+    <Tile clickable={!presentation.placeholder && !preview} className='w-full h-full' disableMinHeight={true}>
       <Tile.Body lessPadding='5' className='flex flex-col'>
         <span className='pb-2 text-xs'>
           {presentation.room !== 'BOTH' && `${presentation.room}  | `}
@@ -132,9 +139,18 @@ function PresentationTile({ presentation }: { presentation: PresentationWithDate
               </div>
             </div>
           )}
-          {presentation.presenter?.company?.category === SponsorCategory.MAIN_SPONSOR && (
+          {presentation.presenter?.company?.category === SponsorCategory.MAIN_SPONSOR && !preview && (
             <p className='mt-2 text-base whitespace-pre-line'>{presentation.description.split('\n')[0]}</p>
           )}
+          <div className='mt-10 w-full'>
+            <textarea
+              className='w-full rounded-md p-2 bg-transparent'
+              value={question}
+              onChange={(e) => setQuestion(e.target.value)}
+              rows={4}
+              placeholder='Ide írd a kérdésed!'
+            />
+          </div>
         </div>
       </Tile.Body>
     </Tile>

src/components/tiles/question-tile.tsx

@@ -0,0 +1,26 @@
+'use client';
+import { PresentationWithDates } from '@/models/models';
+import { getCurrentDate } from '@/utils/dateHelper';
+
+import { PresentationTile } from '../presentation/PresentationGrid';
+
+type Props = {
+  presentations: PresentationWithDates[];
+  room: 'IB028' | 'IB025';
+};
+
+export function RoomQuestion({ presentations, room }: Props) {
+  const now = getCurrentDate();
+  const presentation = presentations.find((p) => p.room === room && p.startDate < now && p.endDate > now);
+  return (
+    <div className='sm:col-span-2 lg:col-span-1'>
+      {presentation ? (
+        <PresentationTile presentation={presentation} preview />
+      ) : (
+        <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!
+        </p>
+      )}
+    </div>
+  );
+}

src/utils/dateHelper.ts

@@ -6,3 +6,8 @@ export function dateToHourAndMinuteString(date: Date): string {
     timeZone: 'Europe/Budapest',
   });
 }
+
+export function getCurrentDate() {
+  return new Date(2024, 2, 19, 14, 12);
+  // return new Date();
+}