From ef3988f734633fd1aa405f9af69aaa96250fcac3 Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Mon, 31 Aug 2026 14:59:21 +0700
Subject: [PATCH] feat: reorganize imports and enhance schedule index layout
 with additional instructions

---
 .../academic-classes/schedules/index.tsx      | 36 ++++++++++---------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/resources/js/pages/admin/academic-classes/schedules/index.tsx b/resources/js/pages/admin/academic-classes/schedules/index.tsx
index aca0193..759f99f 100644
--- a/resources/js/pages/admin/academic-classes/schedules/index.tsx
+++ b/resources/js/pages/admin/academic-classes/schedules/index.tsx
@@ -1,6 +1,3 @@
-import { Head, router } from '@inertiajs/react';
-import { Clock, MapPin, Pencil, Plus, Trash2, Video } from 'lucide-react';
-import { useState } from 'react';
 import { DeleteConfirmDialog } from '@/components/delete-confirm-dialog';
 import { FormDialog } from '@/components/form-dialog';
 import InputError from '@/components/input-error';
@@ -27,6 +24,9 @@ import {
 } from '@/routes/admin/academic-classes/schedules';
 import type { Schedule } from '@/types/schedule';
 import { DayOfWeekLabels, DaysOfWeek } from '@/types/schedule';
+import { Head, router } from '@inertiajs/react';
+import { Clock, MapPin, Pencil, Plus, Trash2, Video } from 'lucide-react';
+import { useState } from 'react';
 
 type CourseClassOption = {
     id: number;
@@ -108,6 +108,10 @@ export default function ScheduleIndex({
                     }
                 />
 
+                <p className="hidden text-xs text-muted-foreground md:block">
+                    Geser ke samping untuk melihat hari lainnya.
+                </p>
+
                 <CreateForm
                     open={createOpen}
                     onOpenChange={setCreateOpen}
@@ -163,8 +167,8 @@ export default function ScheduleIndex({
                                                     className={cn(
                                                         'gap-3 py-4',
                                                         highlight ===
-                                                            schedule.id &&
-                                                            'ring-2 ring-primary',
+                                                        schedule.id &&
+                                                        'ring-2 ring-primary',
                                                     )}
                                                 >
                                                     <CardHeader className="flex flex-row items-start justify-between gap-2 px-4">
@@ -209,17 +213,17 @@ export default function ScheduleIndex({
                                                     <CardContent className="flex flex-col gap-1.5 px-4 text-xs text-muted-foreground">
                                                         {(schedule.start_time ||
                                                             schedule.end_time) && (
-                                                            <span className="inline-flex items-center gap-1.5">
-                                                                <Clock className="h-3.5 w-3.5 shrink-0" />
-                                                                {toTimeInput(
-                                                                    schedule.start_time,
-                                                                ) || '-'}{' '}
-                                                                -{' '}
-                                                                {toTimeInput(
-                                                                    schedule.end_time,
-                                                                ) || '-'}
-                                                            </span>
-                                                        )}
+                                                                <span className="inline-flex items-center gap-1.5">
+                                                                    <Clock className="h-3.5 w-3.5 shrink-0" />
+                                                                    {toTimeInput(
+                                                                        schedule.start_time,
+                                                                    ) || '-'}{' '}
+                                                                    -{' '}
+                                                                    {toTimeInput(
+                                                                        schedule.end_time,
+                                                                    ) || '-'}
+                                                                </span>
+                                                            )}
                                                         {schedule.room && (
                                                             <span className="inline-flex items-center gap-1.5">
                                                                 <MapPin className="h-3.5 w-3.5 shrink-0" />