@hed-hog/lms 0.0.365 → 0.0.370

package/hedhog/frontend/app/courses/[id]/structure/_data/use-transcription-segments.ts.ejs

@@ -7,25 +7,44 @@ import type { TranscriptionSegment } from '../_components/types';
 
 type ApiTranscriptionSegment = {
   id?: number;
+  locale_id?: number | null;
   start_seconds?: number | string;
   end_seconds?: number | string;
   text?: string;
 };
 
-export function useTranscriptionSegmentsQuery(lessonId: string | null) {
+export type TranscriptionLocale = {
+  id: number | null;
+  code: string | null;
+  name: string | null;
+  region: string | null;
+};
+
+export function useTranscriptionSegmentsQuery(
+  lessonId: string | null,
+  localeId?: number | null,
+) {
   const { request } = useApp();
 
+  const localeParam =
+    localeId === undefined
+      ? ''
+      : localeId === null
+        ? '?locale_id=null'
+        : `?locale_id=${localeId}`;
+
   return useQuery<TranscriptionSegment[]>({
-    queryKey: ['lesson-transcription-segments', lessonId],
+    queryKey: ['lesson-transcription-segments', lessonId, localeId ?? 'all'],
     enabled: Boolean(lessonId),
     queryFn: async () => {
       const res = await request<ApiTranscriptionSegment[]>({
-        url: `/lms/lessons/${lessonId}/transcription-segments`,
+        url: `/lms/lessons/${lessonId}/transcription-segments${localeParam}`,
         method: 'GET',
       });
 
       return (res.data ?? []).map((segment) => ({
         id: Number(segment.id ?? 0),
+        localeId: segment.locale_id ?? null,
         startSeconds: Number(segment.start_seconds ?? 0),
         endSeconds: Number(segment.end_seconds ?? 0),
         text: String(segment.text ?? ''),
@@ -35,13 +54,38 @@ export function useTranscriptionSegmentsQuery(lessonId: string | null) {
   });
 }
 
+export function useTranscriptionLocalesQuery(lessonId: string | null) {
+  const { request } = useApp();
+
+  return useQuery<TranscriptionLocale[]>({
+    queryKey: ['lesson-transcription-locales', lessonId],
+    enabled: Boolean(lessonId),
+    queryFn: async () => {
+      const res = await request<TranscriptionLocale[]>({
+        url: `/lms/lessons/${lessonId}/transcription-locales`,
+        method: 'GET',
+      });
+      return res.data ?? [];
+    },
+    initialData: [],
+  });
+}
+
 export function useUpdateTranscriptionSegmentsMutation(
-  lessonId: string | null
+  lessonId: string | null,
+  localeId?: number | null,
 ) {
   const { request } = useApp();
   const [isPending, setIsPending] = useState(false);
   const [error, setError] = useState<Error | null>(null);
 
+  const localeParam =
+    localeId === undefined
+      ? ''
+      : localeId === null
+        ? '?locale_id=null'
+        : `?locale_id=${localeId}`;
+
   const mutate = useCallback(
     async (
       segments: Array<{
@@ -49,13 +93,13 @@ export function useUpdateTranscriptionSegmentsMutation(
         endSeconds: number;
         text: string;
       }>,
-      options?: { onSuccess?: () => void; onError?: (err: Error) => void }
+      options?: { onSuccess?: () => void; onError?: (err: Error) => void },
     ) => {
       setIsPending(true);
       setError(null);
       try {
         await request({
-          url: `/lms/lessons/${lessonId}/transcription-segments`,
+          url: `/lms/lessons/${lessonId}/transcription-segments${localeParam}`,
           method: 'PUT',
           data: { segments },
         });
@@ -69,7 +113,7 @@ export function useUpdateTranscriptionSegmentsMutation(
         setIsPending(false);
       }
     },
-    [lessonId, request]
+    [lessonId, localeParam, request],
   );
 
   return { mutate, isPending, error };
@@ -99,7 +143,112 @@ export function useStartTranscriptionMutation(lessonId: string | null) {
         setIsPending(false);
       }
     },
-    [lessonId, request]
+    [lessonId, request],
+  );
+
+  return { mutate, isPending, error };
+}
+
+export function useDeleteTranscriptionLocaleMutation(lessonId: string | null) {
+  const { request } = useApp();
+  const [isPending, setIsPending] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const mutate = useCallback(
+    async (
+      localeId: number | null,
+      options?: { onSuccess?: () => void; onError?: (err: Error) => void },
+    ) => {
+      const localeParam = localeId === null ? '?locale_id=null' : `?locale_id=${localeId}`;
+      setIsPending(true);
+      setError(null);
+      try {
+        await request({
+          url: `/lms/lessons/${lessonId}/transcription-segments${localeParam}`,
+          method: 'DELETE',
+        });
+        options?.onSuccess?.();
+      } catch (err) {
+        const e = err instanceof Error ? err : new Error(String(err));
+        setError(e);
+        options?.onError?.(e);
+        throw e;
+      } finally {
+        setIsPending(false);
+      }
+    },
+    [lessonId, request],
+  );
+
+  return { mutate, isPending, error };
+}
+
+export function useDeleteCourseTranscriptionsMutation(courseId: string | null) {
+  const { request } = useApp();
+  const [isPending, setIsPending] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const mutate = useCallback(
+    async (options?: {
+      onSuccess?: (result: { deleted: number }) => void;
+      onError?: (err: Error) => void;
+    }) => {
+      setIsPending(true);
+      setError(null);
+      try {
+        const res = await request<{ success: boolean; deleted: number }>({
+          url: `/lms/courses/${courseId}/structure/transcription-segments`,
+          method: 'DELETE',
+        });
+        options?.onSuccess?.(res.data ?? { deleted: 0 });
+      } catch (err) {
+        const e = err instanceof Error ? err : new Error(String(err));
+        setError(e);
+        options?.onError?.(e);
+        throw e;
+      } finally {
+        setIsPending(false);
+      }
+    },
+    [courseId, request],
+  );
+
+  return { mutate, isPending, error };
+}
+
+export function useTranslateTranscriptionMutation(lessonId: string | null) {
+  const { request } = useApp();
+  const [isPending, setIsPending] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const mutate = useCallback(
+    async (
+      targetLocaleId: number,
+      sourceLocaleId?: number | null,
+      options?: {
+        onSuccess?: (result: { queueJobId: number; status: string }) => void;
+        onError?: (err: Error) => void;
+      },
+    ) => {
+      setIsPending(true);
+      setError(null);
+      try {
+        const res = await request<{ queueJobId: number; status: string }>({
+          url: `/lms/lessons/${lessonId}/transcription/translate`,
+          method: 'POST',
+          data: { targetLocaleId, sourceLocaleId: sourceLocaleId ?? null },
+        });
+        options?.onSuccess?.(res.data ?? { queueJobId: 0, status: 'pending' });
+      } catch (err) {
+        const e = err instanceof Error ? err : new Error(String(err));
+        setError(e);
+        options?.onError?.(e);
+        throw e;
+      } finally {
+        setIsPending(false);
+      }
+    },
+    [lessonId, request],
   );
 
   return { mutate, isPending, error };

package/hedhog/frontend/app/courses/_components/CourseRowActions.tsx.ejs

@@ -8,26 +8,22 @@ import {
   TooltipTrigger,
 } from '@/components/ui/tooltip';
 import { cn } from '@/lib/utils';
-import { Eye, Pencil, Trash2 } from 'lucide-react';
+import { Eye, Trash2 } from 'lucide-react';
 import type { MouseEvent } from 'react';
 
 type CourseRowActionsProps = {
   className?: string;
   onView: () => void;
-  onEdit: () => void;
   onDelete: (event: MouseEvent<HTMLButtonElement>) => void;
   viewLabel: string;
-  editLabel: string;
   deleteLabel: string;
 };
 
 export function CourseRowActions({
   className,
   onView,
-  onEdit,
   onDelete,
   viewLabel,
-  editLabel,
   deleteLabel,
 }: CourseRowActionsProps) {
   return (
@@ -50,23 +46,6 @@ export function CourseRowActions({
           <TooltipContent>{viewLabel}</TooltipContent>
         </Tooltip>
 
-        <Tooltip>
-          <TooltipTrigger asChild>
-            <Button
-              type="button"
-              variant="ghost"
-              size="icon"
-              className="h-8 w-8"
-              onClick={onEdit}
-              aria-label={editLabel}
-            >
-              <Pencil className="size-4" />
-              <span className="sr-only">{editLabel}</span>
-            </Button>
-          </TooltipTrigger>
-          <TooltipContent>{editLabel}</TooltipContent>
-        </Tooltip>
-
         <Tooltip>
           <TooltipTrigger asChild>
             <Button

package/hedhog/frontend/app/courses/page.tsx.ejs

@@ -318,7 +318,7 @@ const OFFERING_TYPE_COLOR: Record<string, string> = {
   hibrido: 'bg-teal-50 text-teal-700 border-teal-200',
 };
 
-const PAGE_SIZES = [6, 12, 24] as const;
+const DEFAULT_PAGE_SIZES = [6, 12, 24, 48, 96] as const;
 
 // ── Seed Data ─────────────────────────────────────────────────────────────────
 
@@ -388,10 +388,44 @@ export default function CursosPage() {
 
   // Pagination
   const [currentPage, setCurrentPage] = useState(1);
+
+  const { data: generalSettings } = useQuery<{
+    data: Array<{ slug: string; value: string }>;
+  }>({
+    queryKey: ['setting-group-general'],
+    queryFn: async () => {
+      const response = await request<{
+        data: Array<{ slug: string; value: string }>;
+      }>({
+        url: '/setting/group/general',
+        method: 'GET',
+      });
+      return response.data;
+    },
+    staleTime: 5 * 60 * 1000,
+  });
+
+  const pageSizeOptions = useMemo(() => {
+    const setting = generalSettings?.data?.find(
+      (s) => s.slug === 'pagination-page-sizes'
+    );
+    if (!setting?.value) return DEFAULT_PAGE_SIZES;
+    try {
+      const parsed = JSON.parse(setting.value) as string[];
+      const sizes = parsed
+        .map(Number)
+        .filter((n) => !isNaN(n) && n > 0)
+        .sort((a, b) => a - b);
+      return sizes.length > 0 ? sizes : DEFAULT_PAGE_SIZES;
+    } catch {
+      return DEFAULT_PAGE_SIZES;
+    }
+  }, [generalSettings]);
+
   const [pageSize, setPageSize] = usePersistedPageSize({
     storageKey: 'pagination:global:pageSize',
     defaultValue: 12,
-    allowedValues: PAGE_SIZES,
+    allowedValues: pageSizeOptions,
   });
 
   const form = useForm<CourseSheetFormValues>({
@@ -1091,7 +1125,7 @@ export default function CursosPage() {
                 ],
               },
             ]}
-            afterSearchButton={
+            actions={
               <ViewModeToggle
                 viewMode={viewMode}
                 onViewModeChange={setViewMode}
@@ -1292,12 +1326,9 @@ export default function CursosPage() {
         />
       ) : (
         <div className="relative">
-          {cardsRefreshing && (
-            <div className="absolute inset-0 z-10 rounded-2xl bg-background/55 backdrop-blur-[1px]" />
-          )}
           {viewMode === 'cards' ? (
             <motion.div
-              className={`grid gap-4 sm:grid-cols-2 lg:grid-cols-3 ${cardsRefreshing ? 'pointer-events-none' : ''}`}
+              className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3"
               variants={stagger}
               initial="hidden"
               animate="show"
@@ -1366,12 +1397,10 @@ export default function CursosPage() {
                               <CourseRowActions
                                 className="ml-auto -mr-1"
                                 onView={() => goToCourseDetails(curso)}
-                                onEdit={() => goToCourseDetails(curso)}
                                 onDelete={(event) =>
                                   void openDeleteDialog(curso, event)
                                 }
                                 viewLabel={t('table.actions.viewDetails')}
-                                editLabel={t('table.actions.edit')}
                                 deleteLabel={t('table.actions.delete')}
                               />
                             </div>
@@ -1388,6 +1417,19 @@ export default function CursosPage() {
                               >
                                 {getStatusLabel(curso)}
                               </Badge>
+                              {curso.status === 'publicado' && (
+                                <span
+                                  className={`inline-flex items-center rounded-full border px-2 py-0.5 text-[10px] font-medium ${
+                                    curso.listado
+                                      ? 'border-emerald-200 bg-emerald-50 text-emerald-700'
+                                      : 'border-amber-200 bg-amber-50 text-amber-700'
+                                  }`}
+                                >
+                                  {curso.listado
+                                    ? t('status.listed')
+                                    : t('status.unlisted')}
+                                </span>
+                              )}
                               {deletingCourseIds.has(curso.id) && (
                                 <motion.div
                                   initial={{ opacity: 0, scale: 0.8 }}
@@ -1464,7 +1506,7 @@ export default function CursosPage() {
             </motion.div>
           ) : (
             <div
-              className={`overflow-hidden rounded-xl border border-border/70 ${cardsRefreshing ? 'pointer-events-none' : ''}`}
+              className="overflow-hidden rounded-xl border border-border/70"
             >
               <Table>
                 <TableHeader>
@@ -1558,6 +1600,19 @@ export default function CursosPage() {
                             >
                               {getStatusLabel(curso)}
                             </Badge>
+                            {curso.status === 'publicado' && (
+                              <span
+                                className={`inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] font-medium ${
+                                  curso.listado
+                                    ? 'border-emerald-200 bg-emerald-50 text-emerald-700'
+                                    : 'border-amber-200 bg-amber-50 text-amber-700'
+                                }`}
+                              >
+                                {curso.listado
+                                  ? t('status.listed')
+                                  : t('status.unlisted')}
+                              </span>
+                            )}
                             {deletingCourseIds.has(curso.id) && (
                               <motion.div
                                 initial={{ opacity: 0, scale: 0.8 }}
@@ -1641,12 +1696,10 @@ export default function CursosPage() {
                           <CourseRowActions
                             className="ml-auto"
                             onView={() => goToCourseDetails(curso)}
-                            onEdit={() => goToCourseDetails(curso)}
                             onDelete={(event) =>
                               void openDeleteDialog(curso, event)
                             }
                             viewLabel={t('table.actions.viewDetails')}
-                            editLabel={t('table.actions.edit')}
                             deleteLabel={t('table.actions.delete')}
                           />
                         </TableCell>
@@ -1672,7 +1725,7 @@ export default function CursosPage() {
               setPageSize(nextPageSize);
               setCurrentPage(1);
             }}
-            pageSizeOptions={PAGE_SIZES}
+            pageSizeOptions={pageSizeOptions}
             selectedCount={selectedIds.size}
           />
         </div>

package/hedhog/frontend/app/enterprise/[id]/page.tsx.ejs

@@ -25,6 +25,7 @@ import { notFound, useParams, useRouter } from 'next/navigation';
 import { useState } from 'react';
 import { AdministratorsTab } from '../_components/enterprise-administrators-tab';
 import { ClassesTab } from '../_components/enterprise-classes-tab';
+import { ClassesCalendarTab } from '../_components/enterprise-classes-calendar-tab';
 import { CoursesTab } from '../_components/enterprise-courses-tab';
 import { EnterpriseSheet } from '../_components/enterprise-sheet';
 import { StudentsTab } from '../_components/enterprise-students-tab';
@@ -265,6 +266,7 @@ export default function EnterpriseDetailPage() {
             <TabsTrigger value="overview">{t('tabs.overview')}</TabsTrigger>
             <TabsTrigger value="crm">{t('tabs.crm')}</TabsTrigger>
             <TabsTrigger value="classes">{t('tabs.classes')}</TabsTrigger>
+            <TabsTrigger value="classesCalendar">{t('tabs.classesCalendar')}</TabsTrigger>
             <TabsTrigger value="courses">{t('tabs.courses')}</TabsTrigger>
             <TabsTrigger value="students">{t('tabs.students')}</TabsTrigger>
             <TabsTrigger value="administrators">
@@ -288,6 +290,10 @@ export default function EnterpriseDetailPage() {
             <ClassesTab enterpriseId={account.id} />
           </TabsContent>
 
+          <TabsContent value="classesCalendar" className="mt-4 px-1">
+            <ClassesCalendarTab enterpriseId={account.id} />
+          </TabsContent>
+
           <TabsContent value="courses" className="mt-4">
             <CoursesTab enterpriseId={account.id} />
           </TabsContent>