chore: formatted the code using prettier

avantifellows · Sep 3, 2024 · aa9b18a · aa9b18a
1 parent b3affa1
commit aa9b18a
Show file tree

Hide file tree

Showing 32 changed files with 445 additions and 446 deletions.
diff --git a/.github/ISSUE_TEMPLATE/c4gt_community.yml b/.github/ISSUE_TEMPLATE/c4gt_community.yml
diff --git a/jest.setup.ts b/jest.setup.ts
@@ -1,2 +1 @@
-import '@testing-library/jest-dom';
-
+import '@testing-library/jest-dom';
diff --git a/src/app/(home)/QuizColumns.tsx b/src/app/(home)/QuizColumns.tsx
@@ -21,7 +21,7 @@ export const columns: ColumnDef<Session>[] = [
   {
     accessorKey: 'platform',
     header: 'Platform',
-    cell: ({ row }) => <div className="capitalize">{row.getValue('platform')}</div>,
+    cell: ({ row }) => <div className='capitalize'>{row.getValue('platform')}</div>,
   },
   {
     id: 'group',
@@ -84,9 +84,9 @@ export const columns: ColumnDef<Session>[] = [
     header: 'Enabled',
     cell: ({ row }) =>
       row.getValue('isEnabled') ? (
-        <Check className="mx-auto" color="darkgreen" />
+        <Check className='mx-auto' color='darkgreen' />
       ) : (
-        <X className="mx-auto" color="darkred" />
+        <X className='mx-auto' color='darkred' />
       ),
   },
   {

diff --git a/src/app/(home)/Table/Actions.tsx b/src/app/(home)/Table/Actions.tsx
@@ -17,34 +17,34 @@ const TableActions = ({ session }: { session: Session }) => {
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
-        <Button variant="ghost" className="h-8 w-8 p-0">
-          <span className="sr-only">Open menu</span>
-          <MoreHorizontal className="h-4 w-4" />
+        <Button variant='ghost' className='h-8 w-8 p-0'>
+          <span className='sr-only'>Open menu</span>
+          <MoreHorizontal className='h-4 w-4' />
         </Button>
       </DropdownMenuTrigger>
       <DropdownMenuContent onClick={(e) => e.stopPropagation()}>
         <DropdownMenuItem
           asChild
-          className="cursor-pointer"
+          className='cursor-pointer'
           disabled={session.meta_data?.status === STATUS.PENDING}
         >
           <Link href={`/session/edit?id=${session.id}`} prefetch={false}>
             Edit
           </Link>
         </DropdownMenuItem>
-        <DropdownMenuItem asChild className="cursor-pointer">
+        <DropdownMenuItem asChild className='cursor-pointer'>
           <Link href={`/session/duplicate?id=${session.id}`} prefetch={false}>
             Duplicate
           </Link>
         </DropdownMenuItem>
         <DropdownMenuItem
           asChild
-          className="cursor-pointer"
+          className='cursor-pointer'
           disabled={session.meta_data?.status === STATUS.PENDING}
         >
           <Button
-            variant="ghost"
-            className="w-full focus-visible:ring-0 justify-start font-normal"
+            variant='ghost'
+            className='w-full focus-visible:ring-0 justify-start font-normal'
             onClick={async () => {
               await patchSession(
                 {
@@ -86,27 +86,27 @@ const LinkAction = ({ value, status = STATUS.SUCCESS }: { value: string; status?
   const memoLink = useMemo(() => absoluteLink(value), [value]);
 
   if (status === STATUS.PENDING) {
-    return <Loader className="size-4 mx-auto motion-safe:animate-spin-slow" />;
+    return <Loader className='size-4 mx-auto motion-safe:animate-spin-slow' />;
   }
 
   if (status === STATUS.FAILED) {
-    return <AlertTriangle className="size-4 mx-auto" />;
+    return <AlertTriangle className='size-4 mx-auto' />;
   }
 
   if (!memoLink) {
     return <>-</>;
   }
 
   return (
-    <div className="flex place-content-center gap-1" onClick={(e) => e.stopPropagation()}>
+    <div className='flex place-content-center gap-1' onClick={(e) => e.stopPropagation()}>
       <Link
         href={memoLink}
-        target="_blank"
-        rel="noopener noreferrer"
-        className="inline-flex p-1"
+        target='_blank'
+        rel='noopener noreferrer'
+        className='inline-flex p-1'
         prefetch={false}
       >
-        <LinkIcon className="size-4 mx-auto cursor-pointer" />
+        <LinkIcon className='size-4 mx-auto cursor-pointer' />
       </Link>
     </div>
   );
@@ -115,14 +115,14 @@ const LinkAction = ({ value, status = STATUS.SUCCESS }: { value: string; status?
 const CopyBtn = ({ value }: { value: string }) => {
   return (
     <Button
-      variant="ghost"
-      className="p-1 h-auto"
+      variant='ghost'
+      className='p-1 h-auto'
       onClick={(e) => {
         navigator.clipboard.writeText(value);
         toast.success('Copied Link to clipboard', { duration: 2000 });
       }}
     >
-      <Copy className="size-4" />
+      <Copy className='size-4' />
     </Button>
   );
 };

diff --git a/src/app/(home)/Table/Filters.tsx b/src/app/(home)/Table/Filters.tsx
@@ -79,30 +79,30 @@ const Filters = ({ table, apiOptions }: { table: Table<Session>; apiOptions: Api
   }, [table.getState().columnFilters]);
 
   return (
-    <div className="flex mb-4 gap-4 flex-wrap justify-between">
-      <div className="flex items-center justify-normal gap-2 md:gap-4 flex-1">
+    <div className='flex mb-4 gap-4 flex-wrap justify-between'>
+      <div className='flex items-center justify-normal gap-2 md:gap-4 flex-1'>
         {filterColumns.map((column) => {
           return (
             <DropdownMenu modal={false} key={column.name}>
               <DropdownMenuTrigger asChild>
-                <Button variant="outline" className="text-sm py-0 px-2 md:py-2 md:px-4">
-                  <Filter className="mr-1 size-3" />
+                <Button variant='outline' className='text-sm py-0 px-2 md:py-2 md:px-4'>
+                  <Filter className='mr-1 size-3' />
                   {column.label}
                 </Button>
               </DropdownMenuTrigger>
-              <DropdownMenuContent align="end">
-                <DropdownMenuLabel className="text-center">
+              <DropdownMenuContent align='end'>
+                <DropdownMenuLabel className='text-center'>
                   Filter By {column.label}
                 </DropdownMenuLabel>
                 <DropdownMenuSeparator />
                 <DropdownMenuRadioGroup
                   value={(table.getColumn(column.name)?.getFilterValue() as string) ?? ''}
                   onValueChange={column.onChange}
                 >
-                  <DropdownMenuRadioItem value="">All</DropdownMenuRadioItem>
+                  <DropdownMenuRadioItem value=''>All</DropdownMenuRadioItem>
                   {(column.options ?? []).map((option) => (
                     <DropdownMenuRadioItem
-                      className="capitalize"
+                      className='capitalize'
                       key={option.value.toString()}
                       value={option.value.toString()}
                     >
@@ -116,34 +116,34 @@ const Filters = ({ table, apiOptions }: { table: Table<Session>; apiOptions: Api
         })}
         {isFiltered && (
           <Button
-            aria-label="Reset filters"
-            variant="ghost"
-            className="text-sm py-0 px-2 md:py-2 md:px-4"
+            aria-label='Reset filters'
+            variant='ghost'
+            className='text-sm py-0 px-2 md:py-2 md:px-4'
             onClick={() => table.resetColumnFilters(true)}
           >
-            <span className="hidden md:inline">Reset</span>
-            <X className="md:ml-2 size-4" aria-hidden="true" />
+            <span className='hidden md:inline'>Reset</span>
+            <X className='md:ml-2 size-4' aria-hidden='true' />
           </Button>
         )}
       </div>
 
-      <div className="flex items-center justify-between gap-2 md:gap-4">
+      <div className='flex items-center justify-between gap-2 md:gap-4'>
         <DropdownMenu modal={false}>
           <DropdownMenuTrigger asChild>
-            <Button variant="outline">
-              <Settings2 className="mr-2 size-4" />
+            <Button variant='outline'>
+              <Settings2 className='mr-2 size-4' />
               View
             </Button>
           </DropdownMenuTrigger>
-          <DropdownMenuContent align="end">
+          <DropdownMenuContent align='end'>
             {table
               .getAllColumns()
               .filter((column) => column.getCanHide())
               .map((column) => {
                 return (
                   <DropdownMenuCheckboxItem
                     key={column.id}
-                    className="capitalize"
+                    className='capitalize'
                     checked={column.getIsVisible()}
                     onCheckedChange={(value) => column.toggleVisibility(!!value)}
                   >

diff --git a/src/app/(home)/Table/Pagination.tsx b/src/app/(home)/Table/Pagination.tsx
@@ -13,17 +13,17 @@ import { type Table } from '@tanstack/react-table';
 
 const Pagination = ({ table }: { table: Table<Session> }) => {
   return (
-    <div className="flex items-center justify-between space-x-2 py-4">
-      <div className="flex items-center space-x-2">
-        <p className="whitespace-nowrap text-sm font-medium">Rows per page</p>
+    <div className='flex items-center justify-between space-x-2 py-4'>
+      <div className='flex items-center space-x-2'>
+        <p className='whitespace-nowrap text-sm font-medium'>Rows per page</p>
         <Select
           value={table.getState().pagination.pageSize.toString()}
           onValueChange={(value) => table.setPageSize(Number(value))}
         >
-          <SelectTrigger className="h-8 w-16">
+          <SelectTrigger className='h-8 w-16'>
             <SelectValue placeholder={table.getState().pagination.pageSize} />
           </SelectTrigger>
-          <SelectContent side="top">
+          <SelectContent side='top'>
             {PAGE_SIZE_OPTIONS.map((pageSize) => (
               <SelectItem key={pageSize} value={pageSize.toString()}>
                 {pageSize}
@@ -32,7 +32,7 @@ const Pagination = ({ table }: { table: Table<Session> }) => {
           </SelectContent>
         </Select>
       </div>
-      <div className="flex flex-row gap-4">
+      <div className='flex flex-row gap-4'>
         <Button onClick={table.previousPage} disabled={!table.getCanPreviousPage()}>
           Previous
         </Button>

diff --git a/src/app/(home)/Table/Row.tsx b/src/app/(home)/Table/Row.tsx
@@ -27,14 +27,14 @@ export const SheetTableRow = ({
             )}
           >
             {row.getVisibleCells().map((cell) => (
-              <TableCell key={cell.id} className="p-2">
+              <TableCell key={cell.id} className='p-2'>
                 {flexRender(cell.column.columnDef.cell, cell.getContext())}
               </TableCell>
             ))}
           </TableRow>
         </SheetTrigger>
-        <SheetContent className="w-full md:w-1/2 sm:max-w-none overflow-x-auto">
-          <SheetHeader className="border-b space-y-0 flex-row justify-between items-center mr-6">
+        <SheetContent className='w-full md:w-1/2 sm:max-w-none overflow-x-auto'>
+          <SheetHeader className='border-b space-y-0 flex-row justify-between items-center mr-6'>
             <SheetTitle>Session Details</SheetTitle>
             <Link
               prefetch={false}
@@ -47,27 +47,27 @@ export const SheetTableRow = ({
             </Link>
           </SheetHeader>
           {displayData(row.original, formOptions).map((section, index) => (
-            <div key={section.title + index} className="flex flex-col gap-2 py-4">
-              <h4 className="font-bold text-lg underline">{section.title}</h4>
-              <ul className="flex justify-between flex-wrap gap-y-4">
+            <div key={section.title + index} className='flex flex-col gap-2 py-4'>
+              <h4 className='font-bold text-lg underline'>{section.title}</h4>
+              <ul className='flex justify-between flex-wrap gap-y-4'>
                 {section.data.map((item) => (
-                  <li key={item.label + index} className="w-1/2 lg:w-1/3 pr-4 break-words">
-                    <h4 className="font-semibold capitalize inline-flex items-center flex-nowrap gap-1">
+                  <li key={item.label + index} className='w-1/2 lg:w-1/3 pr-4 break-words'>
+                    <h4 className='font-semibold capitalize inline-flex items-center flex-nowrap gap-1'>
                       {item.label}
                       {item.isLink ? <CopyBtn value={item.value} /> : null}
                     </h4>
                     {item.isLink ? (
                       <Link
                         href={item.value}
-                        className="block truncate rounded-full border px-2.5 py-0.5 text-xs"
-                        target="_blank"
-                        rel="noopener noreferrer"
+                        className='block truncate rounded-full border px-2.5 py-0.5 text-xs'
+                        target='_blank'
+                        rel='noopener noreferrer'
                         prefetch={false}
                       >
                         {item.value}
                       </Link>
                     ) : (
-                      <p className="text-sm capitalize">{item.value || 'N/A'}</p>
+                      <p className='text-sm capitalize'>{item.value || 'N/A'}</p>
                     )}
                   </li>
                 ))}

diff --git a/src/app/(home)/Table/index.tsx b/src/app/(home)/Table/index.tsx
@@ -130,7 +130,7 @@ export default function DataTable({
             />
           ) : (
             <TableRow>
-              <TableCell colSpan={columns.length} className="h-24 text-center">
+              <TableCell colSpan={columns.length} className='h-24 text-center'>
                 No results.
               </TableCell>
             </TableRow>

diff --git a/src/app/(home)/live/LiveColumns.tsx b/src/app/(home)/live/LiveColumns.tsx
@@ -22,7 +22,7 @@ export const columns: ColumnDef<Session>[] = [
   {
     accessorKey: 'platform',
     header: 'Platform',
-    cell: ({ row }) => <div className="capitalize">{row.getValue('platform') || 'N/A'}</div>,
+    cell: ({ row }) => <div className='capitalize'>{row.getValue('platform') || 'N/A'}</div>,
   },
   {
     id: 'group',
@@ -82,9 +82,9 @@ export const columns: ColumnDef<Session>[] = [
     header: 'Enabled',
     cell: ({ row }) =>
       row.getValue('isEnabled') ? (
-        <Check className="mx-auto" color="darkgreen" />
+        <Check className='mx-auto' color='darkgreen' />
       ) : (
-        <X className="mx-auto" color="darkred" />
+        <X className='mx-auto' color='darkred' />
       ),
   },
   {

diff --git a/src/app/(home)/loading.tsx b/src/app/(home)/loading.tsx
@@ -2,8 +2,8 @@ import { Loader2 } from 'lucide-react';
 
 export default function Loading() {
   return (
-    <section className="w-full h-[60vh] overflow-hidden flex justify-center items-center gap-2">
-      <Loader2 className="size-6 animate-spin" /> <h3 className="md:text-lg">Loading...</h3>
+    <section className='w-full h-[60vh] overflow-hidden flex justify-center items-center gap-2'>
+      <Loader2 className='size-6 animate-spin' /> <h3 className='md:text-lg'>Loading...</h3>
     </section>
   );
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -6,10 +6,10 @@ import type { ReactNode } from 'react';
 
 export default function RootLayout({ children }: { children: ReactNode }) {
   return (
-    <html lang="en">
-      <body className="w-full min-h-screen">
+    <html lang='en'>
+      <body className='w-full min-h-screen'>
         <Navbar />
-        <main className="mx-4 my-8 md:mx-8">{children}</main>
+        <main className='mx-4 my-8 md:mx-8'>{children}</main>
         <Toaster />
       </body>
     </html>

diff --git a/src/app/loading.tsx b/src/app/loading.tsx
@@ -2,8 +2,8 @@ import { Loader2 } from 'lucide-react';
 
 export default function Loading() {
   return (
-    <section className="w-full h-[60vh] overflow-hidden flex justify-center items-center gap-2">
-      <Loader2 className="size-6 animate-spin" /> <h3 className="md:text-lg">Loading...</h3>
+    <section className='w-full h-[60vh] overflow-hidden flex justify-center items-center gap-2'>
+      <Loader2 className='size-6 animate-spin' /> <h3 className='md:text-lg'>Loading...</h3>
     </section>
   );
 }
diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx
@@ -7,7 +7,7 @@ export default function NotFound() {
       <h1>404</h1>
       <h3>Page not found</h3>
 
-      <Link href="/" prefetch={false}>
+      <Link href='/' prefetch={false}>
         GO BACK
       </Link>
     </main>

diff --git a/src/app/session/[type]/Steps/Timeline/index.tsx b/src/app/session/[type]/Steps/Timeline/index.tsx
@@ -83,8 +83,8 @@ const TimelineForm: FC = () => {
 
   return (
     <>
-      <p className="text-sm text-muted-foreground mb-4 text-pretty">
-        <Info className="inline-block size-3.5 md:size-4 mb-1 mr-2" />
+      <p className='text-sm text-muted-foreground mb-4 text-pretty'>
+        <Info className='inline-block size-3.5 md:size-4 mb-1 mr-2' />
         Select the time period for this session to be active for each day.
       </p>
       <FormBuilder

diff --git a/src/app/session/[type]/Steps/index.tsx b/src/app/session/[type]/Steps/index.tsx
@@ -39,9 +39,9 @@ const StepsController = ({ sessionData, options }: StepsControllerProps) => {
   const DynamicForm = useMemo(() => StepForms[activeStep].component ?? null, [activeStep]);
 
   return (
-    <main className="md:container mx-auto">
+    <main className='md:container mx-auto'>
       <Stepper steps={StepForms} activeStep={activeStep} />
-      <Card className="my-5">
+      <Card className='my-5'>
         <CardHeader />
         <CardContent>
           <FormDataProvider sessionData={sessionData} apiOptions={options}>

diff --git a/src/app/session/page.tsx b/src/app/session/page.tsx
@@ -14,7 +14,7 @@ export default async function ViewSession({ searchParams: { id } }: Props) {
   const sessionData = await getASession(Number(id) || null);
 
   return (
-    <main className="container text-center">
+    <main className='container text-center'>
       <h2>TO BE IMPLEMENTED {(sessionData as Session)?.name}</h2>
     </main>
   );