Merge pull request #53 from coderKrysio/dev-1

updated api endpoint

Author: coderKrysio

app/api/[roomcode]/route.ts

@@ -5,16 +5,20 @@ export async function GET(_request: Request, context: RoomCodeRouteContext) {
     try {
         const client = await clientPromise
         const db = client.db('get_interval')
-        let result: any[] = []
+        let result: number[][] = []
 
         const rooms = await db
             .collection('rooms')
             .find({ roomcode: context.params.roomcode })
             .limit(15)
             .toArray()
 
+        if (rooms.length === 0) {
+            return new Response(JSON.stringify(result), { status: 400 })
+        }
+
         //to get all the intervals in a single array
-        let intervals: any[] = [[]]
+        let intervals: number[][] = []
         let counter = 0
         for (let i = 0; i < rooms.length; i++) {
             var room = rooms[i].timeRanges
@@ -36,7 +40,7 @@ export async function GET(_request: Request, context: RoomCodeRouteContext) {
         }
 
         //to merge the intervals
-        let finalintervals: any[]
+        let finalintervals: number[][] = []
         finalintervals = [[intervals[0][0], intervals[0][1]]]
         for (let i = 0; i < intervals.length; i++) {
             if (

components/GetForm.tsx

@@ -40,7 +40,7 @@ const GetForm = ({ roomCode }: RoomCode) => {
                     ></iframe>
                 </div>
 
-                <div className="absolute bottom-0 right-0 m-8 mb-[42px] flex gap-6 max-[985px]:relative max-[985px]:my-0 max-[985px]:mx-auto">
+                <div className="absolute bottom-0 right-0 m-8 mb-[42px] flex gap-6 max-[985px]:relative max-[985px]:my-0 max-[985px]:mx-auto max-[500px]:mt-[20px]">
                     <button
                         className="py-2 px-5 border-[3px] border-white rounded-lg text-xl font-medium hover:font-semibold hover:border-[#48d399] hover:text-[#48d399]"
                         onClick={() => checkFields()}

components/ListIntervals.tsx

@@ -26,7 +26,7 @@ const ListIntervals = ({ addInterval, removeInterval, setFormData }: any) => {
                             defaultValue={'08:00'}
                             name="start"
                             onChange={(e: any) => updatedRange(e, index)}
-                            className={`border-2 border-white text-black text-[24px] font-semibold rounded-lg py-[3px] px-4 m-1 focus:outline focus:outline-2 focus:outline-[#48d399] focus:border-[#48d399] focus:bg-transparent focus:text-white ${rajdhani.className}`}
+                            className={`border-2 border-white text-black text-[24px] font-semibold rounded-lg py-[3px] px-4 m-1 focus:outline focus:outline-2 focus:outline-[#48d399] focus:border-[#48d399] focus:bg-transparent focus:text-white max-[500px]:w-fit ${rajdhani.className}`}
                         />
 
                         <span className="font-semibold text-2xl">-</span>
@@ -36,7 +36,7 @@ const ListIntervals = ({ addInterval, removeInterval, setFormData }: any) => {
                             defaultValue={'10:00'}
                             name="end"
                             onChange={(e: any) => updatedRange(e, index)}
-                            className={`border-2 border-white text-black text-[24px] font-semibold rounded-lg py-[3px] px-4 m-1 focus:outline focus:outline-2 focus:outline-[#48d399] focus:border-[#48d399] focus:bg-transparent focus:text-white ${rajdhani.className}`}
+                            className={`border-2 border-white text-black text-[24px] font-semibold rounded-lg py-[3px] px-4 m-1 focus:outline focus:outline-2 focus:outline-[#48d399] focus:border-[#48d399] focus:bg-transparent focus:text-white max-[500px]:w-fit ${rajdhani.className}`}
                         />
 
                         <div className="flex max-[500px]:absolute gap-[15px] max-[500px]:-bottom-full">

components/Results.tsx

@@ -38,11 +38,15 @@ const Results = ({ roomCode }: RoomCode) => {
                 Room Code: {roomCode}
             </p>
 
-            {result.map((interval: number[], index: number) => (
-                <p className="text-3xl text-[#48d399] my-1" key={index}>
-                    {NumToTime(interval[0])} - {NumToTime(interval[1])}
-                </p>
-            ))}
+            {result.length == 0 ? (
+                <p className="text-3xl text-[#db696d]">No data found</p>
+            ) : (
+                result.map((interval: number[], index: number) => (
+                    <p className="text-3xl text-[#48d399] my-1" key={index}>
+                        {NumToTime(interval[0])} - {NumToTime(interval[1])}
+                    </p>
+                ))
+            )}
 
             <div className="timeline px-4 flex items-center justify-start w-full overflow-auto">
                 <Timeline timeRanges={result} />
@@ -53,13 +57,17 @@ const Results = ({ roomCode }: RoomCode) => {
             </p>
 
             <div className="max-w[1200px] grid grid-flow-row grid-cols-1 md:grid-cols-2 lg:grid-cols-3 justify-center items-start gap-[70px]">
-                {membersData.map((values: MemberData, id: number) => (
-                    <MemberInfo
-                        name={values.username}
-                        intervals={values.timeRanges}
-                        key={id}
-                    />
-                ))}
+                {membersData.length == 0 ? (
+                    <p className="text-2xl text-[#db696d]">No Data Found</p>
+                ) : (
+                    membersData.map((values: MemberData, id: number) => (
+                        <MemberInfo
+                            name={values.username}
+                            intervals={values.timeRanges}
+                            key={id}
+                        />
+                    ))
+                )}
             </div>
         </div>
     )