Merge branch 'main' of github.com:avantifellows/quiz-creator into fea…

…ture/ci

src/Constants/index.ts

@@ -74,6 +74,8 @@ export const PlatformPatterns = [
   /play\/([^/?]+)/,
   // Zoom Link
   /zoom\.us\/j\/([^/?]+)/,
-  // Google Drive Link
+  // Google Drive File Link
   /drive\.google\.com\/file\/d\/([^/?]+)/,
+  // Google Drive Folder Link
+  /drive\.google\.com\/drive\/folders\/([^/?]+)/,
 ];

src/app/globals.css

@@ -48,3 +48,30 @@
     --radius: 0.5rem;
   }
 }
+
+@layer utilities {
+  .scrollbar::-webkit-scrollbar {
+    @apply size-2;
+  }
+
+  .scrollbar::-webkit-scrollbar-track {
+    @apply bg-transparent;
+  }
+
+  .scrollbar::-webkit-scrollbar-thumb {
+    @apply bg-accent/80 rounded-full;
+  }
+
+  .scrollbar::-webkit-scrollbar-thumb:hover {
+    @apply bg-accent/80;
+  }
+}
+
+[data-radix-select-viewport] {
+  scrollbar-width: auto !important;
+  -ms-overflow-style: auto !important;
+  -webkit-overflow-scrolling: touch !important;
+}
+[data-radix-select-viewport]::-webkit-scrollbar {
+  display: unset !important;
+}

src/app/session/[type]/Steps/Basic/index.tsx

@@ -5,6 +5,7 @@ import { FormBuilder } from '@/components/FormBuilder';
 import { useFormContext } from '@/hooks/useFormContext';
 import {
   FieldSchema,
+  Platform,
   Session,
   SessionParams,
   SessionType,
@@ -43,6 +44,7 @@ const BasicForm: FC = () => {
         label: 'Platform',
         disabled: type === SessionType.EDIT,
         onValueChange: (value, form) => handleBatchFields(value, form, apiOptions, fieldsSchema),
+        helperText: `Sessions where the platform is anything other than '${Platform.Quiz}' are listed under the 'Live Classes' tab.`,
       },
       group: {
         type: 'select',
@@ -168,7 +170,7 @@ const BasicForm: FC = () => {
         parent_id: data.parentBatch ?? '',
         batch_id: data.subBatch ? data.subBatch.join(',') : '',
         grade: data.grade,
-        number_of_fields_in_popup_form: data.isPopupForm ? data.noOfFieldsInPopup ?? '' : '',
+        number_of_fields_in_popup_form: data.isPopupForm ? (data.noOfFieldsInPopup ?? '') : '',
       },
       signup_form_id: data.activateSignUp ? data.signupFormId || null : null,
       popup_form_id: data.isPopupForm ? data.popupFormId || null : null,

src/app/session/[type]/Steps/Timeline/index.tsx

@@ -85,14 +85,14 @@ const TimelineForm: FC = () => {
     <>
       <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" />
-        The start and end times of a session apply to every day from the start date to the end date.
+        Select the time period for this session to be active for each day.
       </p>
       <FormBuilder
         formSchema={fieldsSchema}
         zodSchema={timelineSchema}
         defaultValues={defaultValues}
         handleSubmit={onSubmit}
-        buttons={{ submit: { disabled: isSubmiting } }}
+        buttons={{ submit: { disabled: isSubmiting, text: 'Save & Submit' } }}
       />
     </>
   );

src/components/FormBuilder.tsx

@@ -110,7 +110,7 @@ export const FormBuilder = <T extends FieldValues>({
         <div className="flex gap-4 flex-col md:flex-row-reverse justify-between mt-4">
           {buttons?.submit?.hidden ? null : (
             <Button className="min-w-32" type="submit" disabled={buttons?.submit?.disabled}>
-              {buttons?.submit?.text || 'Next'}
+              {buttons?.submit?.text || 'Save & Next'}
             </Button>
           )}
           {buttons?.reset?.hidden ? null : (

src/components/ui/calendar.tsx

@@ -70,7 +70,7 @@ function Calendar({ className, classNames, showOutsideDays = true, ...props }: C
             >
               <SelectTrigger
                 id={`${props.id}-${name}-selector`}
-                className='h-fit w-fit border-none p-0 focus:bg-none focus:ring-0 focus:ring-offset-0'
+                className="h-fit w-fit border-none p-0 focus:bg-none focus:ring-0 focus:ring-offset-0"
               >
                 <SelectValue />
               </SelectTrigger>

src/components/ui/date-time.tsx

@@ -32,18 +32,18 @@ const DateTimePicker = forwardRef<
 
   return (
     <div
-      className='flex flex-col sm:flex-row gap-4 sm:gap-10 sm:items-center'
+      className="flex flex-col sm:flex-row gap-4 sm:gap-10 sm:items-center"
       id={restFieldProps.name}
     >
-      <div className='flex flex-col gap-4 flex-1'>
-        <FormLabel className='self-start'>{label?.date}</FormLabel>
+      <div className="flex flex-col gap-4 flex-1">
+        <FormLabel className="self-start">{label?.date}</FormLabel>
         <Popover>
           <FormControl>
             <PopoverTrigger asChild>
               <Button
                 {...restFieldProps}
                 id={`${restFieldProps.name}-button`}
-                variant='outline'
+                variant="outline"
                 className={cn('justify-start text-left font-normal')}
                 ref={refField}
                 disabled={disabled}
@@ -64,7 +64,7 @@ const DateTimePicker = forwardRef<
               {...restSchemaProps}
               {...restFieldProps}
               id={`${restFieldProps.name}-calendar`}
-              captionLayout='dropdown-buttons'
+              captionLayout="dropdown-buttons"
               fromYear={startOfToday().getFullYear()}
               toYear={addYears(startOfToday(), ALLOWED_YEARS).getFullYear()}
               mode='single'

src/components/ui/multi-select.tsx

@@ -249,7 +249,7 @@ const MultiSelectorList = forwardRef<
     <CommandList
       ref={ref}
       className={cn(
-        'p-2 flex flex-col gap-2 rounded-md transition-colors w-full absolute bg-background shadow-md z-10 border border-muted top-0',
+        'p-2 flex flex-col gap-2 rounded-md transition-colors w-full absolute bg-background shadow-md z-10 border border-muted top-0 scrollbar',
         className
       )}
     >

src/components/ui/select.tsx

@@ -83,7 +83,7 @@ const SelectContent = React.forwardRef<
       <SelectScrollUpButton />
       <SelectPrimitive.Viewport
         className={cn(
-          'p-1',
+          'p-1 scrollbar',
           position === 'popper' &&
             'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'
         )}
@@ -149,7 +149,7 @@ const ControlledSelectField = React.forwardRef<
 >(({ field, form, schema }, ref) => {
   const [key, setKey] = React.useState<number>(+new Date());
 
-  const { value, onChange, ...restFieldProps } = field;
+  const { value, onChange, ref: refField, ...restFieldProps } = field;
   const { label, disabled, options = [], onValueChange, helperText, ...restSchemaProps } = schema;
 
   React.useEffect(() => {
@@ -172,7 +172,7 @@ const ControlledSelectField = React.forwardRef<
         {...restFieldProps}
       >
         <FormControl ref={ref}>
-          <SelectTrigger>
+          <SelectTrigger ref={refField}>
             <SelectValue {...restSchemaProps} />
           </SelectTrigger>
         </FormControl>
@@ -224,5 +224,6 @@ export {
   SelectScrollUpButton,
   SelectSeparator,
   SelectTrigger,
-  SelectValue,
+  SelectValue
 };
+

src/components/ui/time-picker.tsx

@@ -162,10 +162,10 @@ const TimePeriodSelect = React.forwardRef<HTMLButtonElement, PeriodSelectorProps
     };
 
     return (
-      <div className='flex h-10 items-center'>
+      <div className="flex h-10 items-center">
         <Select
-          name='period'
-          value={period}
+          name="period"
+          defaultValue={period}
           onValueChange={(value: Period) => handleValueChange(value)}
         >
           <SelectTrigger

src/types/form.types.ts

@@ -2,7 +2,6 @@ import {
   ActiveDaysOptions,
   CourseOptions,
   GradeOptions,
-  MarkingSchemeOptions,
   OptionalLimitOptions,
   SessionTypeOptions,
   StreamOptions,
@@ -57,7 +56,7 @@ export const basicSchema = z
         (value) => TestPlatformOptions.some((option) => option.value === value),
         'Invalid option selected'
       ),
-    name: z.string({ required_error: 'This field is required' }),
+    name: z.string({ required_error: 'This field is required' }).min(1, 'This field is required'),
   })
   .superRefine((data, context) => {
     if (data.isPopupForm) {