fixed eslint bugs and used prettier

app/api/[roomcode]/route.ts

@@ -77,12 +77,10 @@ export async function GET(_request: Request, context: RoomCodeRouteContext) {
             ]
             // console.log(result);
 
-            await db
-                .collection('result')
-                .insertOne({
-                    roomcode: context.params.roomcode,
-                    result: result,
-                })
+            await db.collection('result').insertOne({
+                roomcode: context.params.roomcode,
+                result: result,
+            })
             console.log('Saved Successfully!')
         } else {
             result = await results[0].result

app/api/new-room/route.ts

@@ -7,13 +7,11 @@ export async function POST(request: Request) {
         const client = await clientPromise
         const db = client.db('get_interval')
 
-        await db
-            .collection('rooms')
-            .insertOne({
-                username: username,
-                roomcode: roomcode,
-                timeRanges: timeRanges,
-            })
+        await db.collection('rooms').insertOne({
+            username: username,
+            roomcode: roomcode,
+            timeRanges: timeRanges,
+        })
 
         return new Response(JSON.stringify(roomcode), { status: 200 })
     } catch (error) {

app/globals.css

@@ -7,14 +7,43 @@ input[type='time']::-webkit-calendar-picker-indicator {
     display: none;
 }
 
-@layer base {
-    ::-webkit-scrollbar {
-        @apply w-3 bg-[#16161a];
-    }
-    ::-webkit-scrollbar-thumb {
-        @apply w-3 rounded-lg bg-[#fff] hover:bg-[#fff] /*color trackbar*/;
-    }
-    html {
-        -webkit-tap-highlight-color: transparent;
-    }
+/* width */
+::-webkit-scrollbar {
+    width: 10px;
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+    background: #16161a;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+    background: #888;
+    border-radius: 5px;
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+    background: #fff;
+}
+
+.timeline::-webkit-scrollbar {
+    width: 10px;
+}
+
+/* Track */
+.timeline::-webkit-scrollbar-track {
+    background: #16161a;
+}
+
+/* Handle */
+.timeline::-webkit-scrollbar-thumb {
+    background: #888;
+    border-radius: 5px;
+}
+
+/* Handle on hover */
+.timeline::-webkit-scrollbar-thumb:hover {
+    background: #fff;
 }

components/GetForm.tsx

@@ -20,7 +20,7 @@ const GetForm = ({ roomCode }: RoomCode) => {
         if (formData.name === '') setShowError(true)
         else {
             setShowError(false)
-            API.postData(formData);
+            API.postData(formData)
             router.push(`/${roomCode}/result`)
         }
     }
@@ -35,7 +35,7 @@ const GetForm = ({ roomCode }: RoomCode) => {
                         Room Code: {roomCode}
                     </p>
 
-                    <Form {...{setFormData}} />                    
+                    <Form {...{ setFormData }} />
                 </div>
 
                 <div className="mt-[20px] ml-[20px] max-[985px]:hidden">

components/Results.tsx

@@ -47,12 +47,12 @@ const Results = ({ roomCode }: RoomCode) => {
             </p>
 
             {result.map((interval: number[], index: number) => (
-                <p className="text-3xl text-[#48d399] my-1">
+                <p className="text-3xl text-[#48d399] my-1" key={index}>
                     {NumToTime(interval[0])} - {NumToTime(interval[1])}
                 </p>
             ))}
 
-            <div className="px-4 flex items-center justify-start w-full overflow-auto">
+            <div className="timeline px-4 flex items-center justify-start w-full overflow-auto">
                 <Timeline timeRanges={result} />
             </div>
 

components/Timeline.tsx

@@ -1,10 +1,7 @@
 import { rajdhani } from '@/lib/fonts'
+import { TimeRange } from '@/lib/types'
 import { conditionMet, timeline } from '@/lib/utils'
 
-type TimeRange = {
-    timeRanges: number[][]
-}
-
 const Timeline = ({ timeRanges }: TimeRange) => {
     const blockLine = (result: boolean, time: number) => {
         if (result)

lib/api.ts

@@ -1,4 +1,4 @@
-import { FormData } from "./types"
+import { FormData } from './types'
 
 export const API = {
     postData: async (formData: FormData) => {
@@ -8,8 +8,8 @@ export const API = {
                 body: JSON.stringify({
                     username: formData.name,
                     roomcode: formData.roomCode,
-                    timeRanges: formData.intervals
-                })
+                    timeRanges: formData.intervals,
+                }),
             })
 
             return res.json()
@@ -20,8 +20,8 @@ export const API = {
 
     getInterval: async (roomCode: string) => {
         try {
-            const res =  await fetch(`/api/${roomCode}`, {
-                method: 'GET'
+            const res = await fetch(`/api/${roomCode}`, {
+                method: 'GET',
             })
 
             return res.json()
@@ -33,7 +33,7 @@ export const API = {
     getUsers: async (roomCode: string) => {
         try {
             const res = await fetch(`/api/${roomCode}/review`, {
-                method: 'GET'
+                method: 'GET',
             })
 
             return res.json()
@@ -45,12 +45,12 @@ export const API = {
     deleteRoom: async (roomCode: string) => {
         try {
             const res = await fetch(`/api/${roomCode}/delete`, {
-                method: 'DELETE'
+                method: 'DELETE',
             })
 
             return res.json()
         } catch (err: any) {
             console.log(err)
         }
     },
-}
+}

lib/types.ts

@@ -1,8 +1,8 @@
-import { Dispatch, SetStateAction } from "react"
+import { Dispatch, SetStateAction } from 'react'
 
 export interface SetUser {
-    username: string, 
-    roomcode: string, 
+    username: string
+    roomcode: string
     timeRanges: number[][]
 }
 
@@ -36,4 +36,8 @@ export interface MemberData {
 
 export interface SetFormData {
     setFormData: Dispatch<SetStateAction<FormData>>
-}
+}
+
+export type TimeRange = {
+    timeRanges: number[][]
+}

lib/utils.ts

@@ -93,9 +93,9 @@ for (let x = 0; x < 24 * 60; x++) {
 }
 
 export const conditionMet = (time: number, timeRanges: number[][]) => {
-        for(let x = 0; x < timeRanges.length; x++) {
-            let range = timeRanges[x]
-            if(time >= range[0] && time <= range[1]) return true;
-        }
-        return false
-    }
+    for (let x = 0; x < timeRanges.length; x++) {
+        let range = timeRanges[x]
+        if (time >= range[0] && time <= range[1]) return true
+    }
+    return false
+}