@hed-hog/lms 0.0.331 → 0.0.347

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

@@ -56,6 +56,7 @@ import {
 } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useEffect, useState } from 'react';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { toast } from 'sonner';
 import { InstructorFormSheet } from './_components/instructor-form-sheet';
 import type {
@@ -102,7 +103,11 @@ export default function InstructorsPage() {
   const t = useTranslations('lms.InstructorsPage');
 
   const [page, setPage] = useState(1);
-  const [pageSize, setPageSize] = useState(12);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 12,
+    allowedValues: [6, 12, 24, 48],
+  });
   const [searchInput, setSearchInput] = useState('');
   const [debouncedSearch, setDebouncedSearch] = useState('');
   const [statusFilter, setStatusFilter] = useState('all');

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

@@ -64,6 +64,7 @@ import {
   TableRow,
 } from '@/components/ui/table';
 import { Textarea } from '@/components/ui/textarea';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { usePersistedViewMode } from '@/hooks/use-persisted-view-mode';
 import {
   DndContext,
@@ -113,6 +114,7 @@ interface Formacao {
   id: number;
   nome: string;
   descricao: string;
+  progressionMode: 'sequencial' | 'livre';
   area: string;
   nivel: string;
   prerequisitos: string;
@@ -134,6 +136,9 @@ type TrainingColorPayload = {
   secondaryColor?: string | null;
   primary_color?: string | null;
   secondary_color?: string | null;
+  progressionMode?: string | null;
+  progressMode?: string | null;
+  progress_mode?: string | null;
 };
 
 interface CursoOption {
@@ -339,6 +344,14 @@ function normalizeLevelValue(value: string) {
   return 'Iniciante';
 }
 
+function normalizeProgressModeValue(value?: string) {
+  const normalized = normalizeText(value ?? '');
+
+  if (['livre', 'free'].includes(normalized)) return 'livre';
+
+  return 'sequencial';
+}
+
 function normalizeStatusValue(value: string) {
   const normalized = normalizeText(value);
 
@@ -390,6 +403,12 @@ function normalizeTrainingColorPayload<T extends TrainingColorPayload>(
 
   return {
     ...payload,
+    progressionMode: normalizeProgressModeValue(
+      payload.progressionMode ??
+        payload.progressMode ??
+        payload.progress_mode ??
+        undefined
+    ),
     primaryColor: primaryColor ?? undefined,
     secondaryColor: secondaryColor ?? undefined,
   };
@@ -421,7 +440,8 @@ function buildCourseCodeFromTitle(title: string) {
 
 const formacaoSchema = z.object({
   nome: z.string().min(3, 'Minimo 3 caracteres'),
-  descricao: z.string().min(10, 'Minimo 10 caracteres'),
+  descricao: z.string().optional(),
+  progressionMode: z.enum(['sequencial', 'livre']),
   area: z.enum(['Tecnologia', 'Design', 'Gestao', 'Marketing', 'Financas']),
   nivel: z.enum(['Iniciante', 'Intermediario', 'Avancado']),
   prerequisitos: z.string().optional(),
@@ -565,7 +585,11 @@ export default function TrainingPage() {
 
   // Pagination
   const [currentPage, setCurrentPage] = useState(1);
-  const [pageSize, setPageSize] = useState(12);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 12,
+    allowedValues: PAGE_SIZES,
+  });
 
   // Double-click tracking
   const clickTimers = useRef<Map<number, ReturnType<typeof setTimeout>>>(
@@ -723,6 +747,7 @@ export default function TrainingPage() {
     defaultValues: {
       nome: '',
       descricao: '',
+      progressionMode: 'sequencial' as const,
       area: 'Tecnologia',
       nivel: 'Iniciante',
       prerequisitos: '',
@@ -962,6 +987,7 @@ export default function TrainingPage() {
     form.reset({
       nome: '',
       descricao: '',
+      progressionMode: 'sequencial',
       area: 'Tecnologia',
       nivel: 'Iniciante',
       prerequisitos: '',
@@ -1017,6 +1043,9 @@ export default function TrainingPage() {
       form.reset({
         nome: fullFormacao.nome,
         descricao: fullFormacao.descricao,
+        progressionMode: normalizeProgressModeValue(
+          fullFormacao.progressionMode
+        ),
         area: normalizeAreaValue(fullFormacao.area),
         nivel: normalizeLevelValue(fullFormacao.nivel),
         prerequisitos: fullFormacao.prerequisitos,
@@ -1166,6 +1195,9 @@ export default function TrainingPage() {
   }
 
   async function onSubmit(data: FormacaoForm) {
+    const toApiProgressMode = (value: FormacaoForm['progressionMode']) =>
+      value === 'livre' ? 'free' : 'sequential';
+
     try {
       const orderedItems = normalizeTrailOrder(
         [...learningPathItems].sort((a, b) => a.order - b.order)
@@ -1191,6 +1223,7 @@ export default function TrainingPage() {
           shortDescription?: string;
           level?: 'beginner' | 'intermediate' | 'advanced';
           status?: 'draft' | 'active' | 'archived';
+          progressMode?: 'sequential' | 'free';
           primaryColor?: string;
           secondaryColor?: string;
           items?: Array<{
@@ -1210,6 +1243,7 @@ export default function TrainingPage() {
         if (dirty.status) {
           payload.status = ptStatusToApi(data.status as Formacao['status']);
         }
+        payload.progressMode = toApiProgressMode(data.progressionMode);
         if (dirty.primaryColor) payload.primaryColor = data.primaryColor;
         if (dirty.secondaryColor) payload.secondaryColor = data.secondaryColor;
         if (itemsChanged) {
@@ -1239,6 +1273,7 @@ export default function TrainingPage() {
           shortDescription: data.prerequisitos?.trim() || undefined,
           level: ptLevelToApi(data.nivel),
           status: ptStatusToApi(data.status as Formacao['status']),
+          progressMode: toApiProgressMode(data.progressionMode),
           primaryColor: data.primaryColor,
           secondaryColor: data.secondaryColor,
           items: orderedItems.map((item, index) => ({
@@ -1893,18 +1928,51 @@ export default function TrainingPage() {
               <FieldError>{form.formState.errors.nome?.message}</FieldError>
             </Field>
             <Field>
-              <FieldLabel htmlFor="descricao">
-                {t('form.fields.description.label')}{' '}
-                <span className="text-destructive">*</span>
+              <FieldLabel htmlFor="descricao">
+                {t('form.fields.description.label')}
               </FieldLabel>
               <Textarea
-                id="descricao"
+                id="descricao"
                 rows={3}
                 placeholder={t('form.fields.description.placeholder')}
-                {...form.register('descricao')}
+                {...form.register('descricao')}
+              />
+            </Field>
+            <Field>
+              <FieldLabel>
+                {t('form.fields.progressionMode.label')}{' '}
+                <span className="text-destructive">*</span>
+              </FieldLabel>
+              <Controller
+                name="progressionMode"
+                control={form.control}
+                render={({ field }) => (
+                  <Select onValueChange={field.onChange} value={field.value}>
+                    <SelectTrigger>
+                      <SelectValue
+                        placeholder={t(
+                          'form.fields.progressionMode.placeholder'
+                        )}
+                      />
+                    </SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value="sequencial">
+                        {t('form.fields.progressionMode.options.sequential')}
+                      </SelectItem>
+                      <SelectItem value="livre">
+                        {t('form.fields.progressionMode.options.free')}
+                      </SelectItem>
+                    </SelectContent>
+                  </Select>
+                )}
               />
+              <p className="text-xs text-muted-foreground">
+                {watchedFormValues.progressionMode === 'livre'
+                  ? t('form.fields.progressionMode.help.free')
+                  : t('form.fields.progressionMode.help.sequential')}
+              </p>
               <FieldError>
-                {form.formState.errors.descricao?.message}
+                {form.formState.errors.progressionMode?.message}
               </FieldError>
             </Field>
             <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">

package/hedhog/frontend/app/reports/evaluations/page.tsx.ejs

@@ -61,6 +61,7 @@ import {
 import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/navigation';
 import { useEffect, useMemo, useRef, useState, type ReactNode } from 'react';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import type { DateRange } from 'react-day-picker';
 
 // ── Types ─────────────────────────────────────────────────────────────────────
@@ -360,7 +361,11 @@ export default function EvaluationsReportPage() {
 
   // Pagination
   const [currentPage, setCurrentPage] = useState(1);
-  const [pageSize, setPageSize] = useState(12);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 12,
+    allowedValues: PAGE_SIZES,
+  });
 
   // Reset page when filters change
   useEffect(() => {

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

@@ -63,6 +63,7 @@ import {
   TableRow,
 } from '@/components/ui/table';
 import { Textarea } from '@/components/ui/textarea';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { usePersistedViewMode } from '@/hooks/use-persisted-view-mode';
 import {
   DndContext,
@@ -112,6 +113,7 @@ interface Formacao {
   id: number;
   nome: string;
   descricao: string;
+  progressionMode: 'sequencial' | 'livre';
   area: string;
   nivel: string;
   prerequisitos: string;
@@ -343,6 +345,14 @@ function normalizeStatusValue(value: string) {
   return 'rascunho';
 }
 
+function normalizeProgressModeValue(value?: string) {
+  const normalized = normalizeText(value ?? '');
+
+  if (['livre', 'free'].includes(normalized)) return 'livre';
+
+  return 'sequencial';
+}
+
 function slugifyText(value: string) {
   return normalizeText(value)
     .replace(/[^a-z0-9\s-]/g, '')
@@ -416,7 +426,8 @@ function buildCourseCodeFromTitle(title: string) {
 
 const formacaoSchema = z.object({
   nome: z.string().min(3, 'Minimo 3 caracteres'),
-  descricao: z.string().min(10, 'Minimo 10 caracteres'),
+  descricao: z.string().optional(),
+  progressionMode: z.enum(['sequencial', 'livre']),
   area: z.enum(['Tecnologia', 'Design', 'Gestao', 'Marketing', 'Financas']),
   nivel: z.enum(['Iniciante', 'Intermediario', 'Avancado']),
   prerequisitos: z.string().optional(),
@@ -560,7 +571,11 @@ export default function TrainingPage() {
 
   // Pagination
   const [currentPage, setCurrentPage] = useState(1);
-  const [pageSize, setPageSize] = useState(12);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 12,
+    allowedValues: PAGE_SIZES,
+  });
 
   // Double-click tracking
   const clickTimers = useRef<Map<number, ReturnType<typeof setTimeout>>>(
@@ -716,6 +731,7 @@ export default function TrainingPage() {
     defaultValues: {
       nome: '',
       descricao: '',
+      progressionMode: 'sequencial',
       area: 'Tecnologia',
       nivel: 'Iniciante',
       prerequisitos: '',
@@ -867,6 +883,8 @@ export default function TrainingPage() {
         ...formacao,
         nome: watchedFormValues.nome ?? formacao.nome,
         descricao: watchedFormValues.descricao ?? formacao.descricao,
+        progressionMode:
+          watchedFormValues.progressionMode ?? formacao.progressionMode,
         nivel: watchedFormValues.nivel ?? formacao.nivel,
         status: watchedFormValues.status ?? formacao.status,
         prerequisitos:
@@ -955,6 +973,7 @@ export default function TrainingPage() {
     form.reset({
       nome: '',
       descricao: '',
+      progressionMode: 'sequencial',
       area: 'Tecnologia',
       nivel: 'Iniciante',
       prerequisitos: '',
@@ -1010,6 +1029,9 @@ export default function TrainingPage() {
       form.reset({
         nome: fullFormacao.nome,
         descricao: fullFormacao.descricao,
+        progressionMode: normalizeProgressModeValue(
+          fullFormacao.progressionMode
+        ),
         area: normalizeAreaValue(fullFormacao.area),
         nivel: normalizeLevelValue(fullFormacao.nivel),
         prerequisitos: fullFormacao.prerequisitos,
@@ -1159,6 +1181,9 @@ export default function TrainingPage() {
   }
 
   async function onSubmit(data: FormacaoForm) {
+    const toApiProgressMode = (value: FormacaoForm['progressionMode']) =>
+      value === 'livre' ? 'free' : 'sequential';
+
     try {
       const orderedItems = normalizeTrailOrder(
         [...learningPathItems].sort((a, b) => a.order - b.order)
@@ -1184,6 +1209,7 @@ export default function TrainingPage() {
           shortDescription?: string;
           level?: 'beginner' | 'intermediate' | 'advanced';
           status?: 'draft' | 'active' | 'archived';
+          progressMode?: 'sequential' | 'free';
           primaryColor?: string;
           secondaryColor?: string;
           items?: Array<{
@@ -1195,7 +1221,9 @@ export default function TrainingPage() {
         } = {};
 
         if (dirty.nome) payload.title = data.nome;
-        if (dirty.descricao) payload.description = data.descricao;
+        if (dirty.descricao) {
+          payload.description = data.descricao?.trim() || undefined;
+        }
         if (dirty.prerequisitos) {
           payload.shortDescription = data.prerequisitos?.trim() || undefined;
         }
@@ -1203,6 +1231,9 @@ export default function TrainingPage() {
         if (dirty.status) {
           payload.status = ptStatusToApi(data.status as Formacao['status']);
         }
+        if (dirty.progressionMode) {
+          payload.progressMode = toApiProgressMode(data.progressionMode);
+        }
         if (dirty.primaryColor) payload.primaryColor = data.primaryColor;
         if (dirty.secondaryColor) payload.secondaryColor = data.secondaryColor;
         if (itemsChanged) {
@@ -1228,10 +1259,11 @@ export default function TrainingPage() {
       } else {
         const payload = {
           title: data.nome,
-          description: data.descricao,
+          description: data.descricao?.trim() || undefined,
           shortDescription: data.prerequisitos?.trim() || undefined,
           level: ptLevelToApi(data.nivel),
           status: ptStatusToApi(data.status as Formacao['status']),
+          progressMode: toApiProgressMode(data.progressionMode),
           primaryColor: data.primaryColor,
           secondaryColor: data.secondaryColor,
           items: orderedItems.map((item, index) => ({
@@ -1886,20 +1918,57 @@ export default function TrainingPage() {
               <FieldError>{form.formState.errors.nome?.message}</FieldError>
             </Field>
             <Field>
-              <FieldLabel htmlFor="descricao">
-                {t('form.fields.description.label')}{' '}
-                <span className="text-destructive">*</span>
+              <FieldLabel htmlFor="descricao">
+                {t('form.fields.description.label')}
               </FieldLabel>
               <Textarea
-                id="descricao"
+                id="descricao"
                 rows={3}
+                required={false}
                 placeholder={t('form.fields.description.placeholder')}
-                {...form.register('descricao')}
+                {...form.register('descricao')}
               />
               <FieldError>
                 {form.formState.errors.descricao?.message}
               </FieldError>
             </Field>
+            <Field>
+              <FieldLabel>
+                {t('form.fields.progressionMode.label')}{' '}
+                <span className="text-destructive">*</span>
+              </FieldLabel>
+              <Controller
+                name="progressionMode"
+                control={form.control}
+                render={({ field }) => (
+                  <Select onValueChange={field.onChange} value={field.value}>
+                    <SelectTrigger>
+                      <SelectValue
+                        placeholder={t(
+                          'form.fields.progressionMode.placeholder'
+                        )}
+                      />
+                    </SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value="sequencial">
+                        {t('form.fields.progressionMode.options.sequential')}
+                      </SelectItem>
+                      <SelectItem value="livre">
+                        {t('form.fields.progressionMode.options.free')}
+                      </SelectItem>
+                    </SelectContent>
+                  </Select>
+                )}
+              />
+              <p className="text-xs text-muted-foreground">
+                {watchedFormValues.progressionMode === 'livre'
+                  ? t('form.fields.progressionMode.help.free')
+                  : t('form.fields.progressionMode.help.sequential')}
+              </p>
+              <FieldError>
+                {form.formState.errors.progressionMode?.message}
+              </FieldError>
+            </Field>
             <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
               <Field>
                 <FieldLabel>

package/hedhog/frontend/messages/en.json

@@ -2907,6 +2907,11 @@
           "subFree": "{count} spots available",
           "subFull": "Full"
         },
+        "nextClass": "Next Class",
+        "noClass": "No class",
+        "createNext": "Create next class",
+        "calendar": "Calendar",
+        "completed": "{count} completed",
         "avgAttendance": {
           "label": "Average Attendance",
           "sub": "overall attendance"
@@ -3538,10 +3543,92 @@
       "studentRemoveError": "Failed to remove student."
     },
     "form": {
+      "title": {
+        "create": "Create New Course",
+        "edit": "Edit Course"
+      },
+      "description": {
+        "create": "Fill in the details to create a new course. After creating, you will be redirected to the course page.",
+        "edit": "Update the course information below."
+      },
+      "fields": {
+        "internalName": {
+          "label": "Internal Name",
+          "placeholder": "Ex: Advanced React",
+          "description": "Internal course name for administrative use"
+        },
+        "slug": {
+          "label": "Slug",
+          "placeholder": "Ex: advanced-react",
+          "description": "Unique URL identifier (lowercase letters, numbers, and hyphens)"
+        },
+        "commercialTitle": {
+          "label": "Commercial Title",
+          "placeholder": "Ex: Advanced React"
+        },
+        "description": {
+          "label": "Description",
+          "placeholder": "Describe the course content and objectives..."
+        },
+        "level": {
+          "label": "Level",
+          "placeholder": "Select"
+        },
+        "status": {
+          "label": "Status",
+          "placeholder": "Select"
+        },
+        "categories": {
+          "label": "Categories",
+          "description": "Select one or more categories",
+          "createAction": "Create category",
+          "selectPlaceholder": "Select a category",
+          "removeAction": "Remove category",
+          "searchPlaceholder": "Type to search category...",
+          "noResults": "No categories found",
+          "selectedCount": "selected category(ies)"
+        },
+        "primaryColor": {
+          "label": "Primary Color",
+          "placeholder": "#1D4ED8"
+        },
+        "secondaryColor": {
+          "label": "Secondary Color",
+          "placeholder": "#111827"
+        },
+        "logo": {
+          "label": "Course Logo",
+          "alt": "Course logo",
+          "upload": "Upload logo",
+          "replace": "Replace logo",
+          "remove": "Remove",
+          "description": "Optional image to identify the course"
+        }
+      },
+      "validation": {
+        "internalNameMinLength": "Internal name must have at least 3 characters",
+        "slugPattern": "Slug must contain only lowercase letters, numbers and hyphens"
+      },
+      "actions": {
+        "cancel": "Cancel",
+        "save": "Save Changes",
+        "create": "Create Course"
+      },
       "toasts": {
         "courseCreated": "Course created successfully! Redirecting...",
         "courseCreateError": "Failed to create the course."
       }
+    },
+    "levels": {
+      "beginner": "Beginner",
+      "intermediate": "Intermediate",
+      "advanced": "Advanced"
+    },
+    "status": {
+      "active": "Active",
+      "inactive": "Inactive",
+      "draft": "Draft",
+      "archived": "Archived"
     }
   },
   "InstructorsPage": {
@@ -3652,9 +3739,17 @@
       "classes": {
         "emptyTitle": "No classes found",
         "emptyDescription": "This instructor is not linked to any classes yet.",
+        "searchPlaceholder": "Search class by name, code or course...",
+        "statusFilterPlaceholder": "Filter by status",
+        "allStatuses": "All statuses",
         "start": "Start:",
         "end": "End:",
-        "students": "{count} student(s)"
+        "students": "{count} student(s)",
+        "studentsOfCapacity": "{count} / {total} student(s)",
+        "actions": {
+          "editAriaLabel": "Edit class",
+          "openAriaLabel": "Open class page"
+        }
       },
       "evaluations": {
         "comingSoonTitle": "Evaluations — feature coming soon",
@@ -3704,23 +3799,17 @@
       "current": "Instructor Skills"
     },
     "filters": {
-      "searchPlaceholder": "Search by slug or name..."
+      "searchPlaceholder": "Search by slug..."
     },
     "table": {
       "slug": "Slug",
-      "namePt": "Name (PT)",
-      "nameEn": "Name (EN)",
       "status": "Status"
     },
     "form": {
       "slug": "Slug",
       "slugPlaceholder": "e.g. javascript, react-js",
-      "namePt": "Name (PT)",
-      "namePtPlaceholder": "Portuguese name",
-      "nameEn": "Name (EN)",
-      "nameEnPlaceholder": "Name in English (optional)",
       "status": "Status",
-      "statusPlaceholder": "Select status",
+      "statusPlaceholder": "Select a status",
       "validation": {
         "required": "Required",
         "max100": "Maximum 100 characters",
@@ -3933,7 +4022,8 @@
       },
       "actions": {
         "create": "Create new class",
-        "add": "Add"
+        "add": "Add",
+        "edit": "Edit"
       },
       "empty": {
         "title": "No classes found.",
@@ -3941,6 +4031,7 @@
       },
       "table": {
         "class": "Class",
+        "instructor": "Instructor",
         "status": "Status",
         "period": "Period",
         "capacity": "Capacity"