@hed-hog/lms 0.0.331 → 0.0.347

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

@@ -8,6 +8,7 @@ import {
   SearchBar,
   type SearchBarControl,
 } from '@/components/entity-list';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent } from '@/components/ui/card';
@@ -246,6 +247,21 @@ export default function EnterprisePage() {
   const accounts = enterpriseList?.data ?? [];
   const totalItems = enterpriseList?.total ?? 0;
 
+  function getPersonAvatarUrl(avatarId?: number | null) {
+    return typeof avatarId === 'number' && avatarId > 0
+      ? `${process.env.NEXT_PUBLIC_API_BASE_URL}/person/avatar/${avatarId}`
+      : undefined;
+  }
+
+  function getInitials(name: string) {
+    const parts = name.trim().split(/\s+/).filter(Boolean);
+    if (parts.length === 0) return '?';
+    if (parts.length === 1) return (parts[0] ?? '').slice(0, 2).toUpperCase();
+    return (
+      ((parts[0] ?? '')[0] ?? '') + ((parts[1] ?? '')[0] ?? '')
+    ).toUpperCase();
+  }
+
   function handleSearch(v: string) {
     setSearch(v);
     setPage(1);
@@ -386,9 +402,7 @@ export default function EnterprisePage() {
                 <TableHead>{t('table.name')}</TableHead>
                 <TableHead>{t('table.status')}</TableHead>
                 <TableHead>
-                  {t.has('table.crmAccount')
-                    ? t('table.crmAccount')
-                    : 'CRM Account'}
+                  {t.has('table.client') ? t('table.client') : 'Cliente'}
                 </TableHead>
                 <TableHead className="text-center">
                   {t.has('table.classes') ? t('table.classes') : 'Classes'}
@@ -410,7 +424,7 @@ export default function EnterprisePage() {
                 <TableRow
                   key={account.id}
                   className="cursor-pointer"
-                  onClick={() => handleViewDetails(account)}
+                  onDoubleClick={() => handleViewDetails(account)}
                 >
                   <TableCell>
                     <p className="font-medium">{account.name}</p>
@@ -437,7 +451,25 @@ export default function EnterprisePage() {
                     </Badge>
                   </TableCell>
                   <TableCell className="text-sm text-muted-foreground">
-                    {account.crmAccountName ?? '—'}
+                    {account.crmAccountName ? (
+                      <div className="flex items-center gap-2">
+                        <Avatar className="h-7 w-7">
+                          <AvatarImage
+                            src={getPersonAvatarUrl(
+                              account.crmAccount?.avatarId ?? null
+                            )}
+                          />
+                          <AvatarFallback className="text-[10px] font-semibold">
+                            {getInitials(account.crmAccountName)}
+                          </AvatarFallback>
+                        </Avatar>
+                        <span className="truncate text-sm text-foreground">
+                          {account.crmAccountName}
+                        </span>
+                      </div>
+                    ) : (
+                      '—'
+                    )}
                   </TableCell>
                   <TableCell className="text-center text-sm tabular-nums">
                     {account.classesCount}
@@ -490,7 +522,7 @@ export default function EnterprisePage() {
             <Card
               key={account.id}
               className="group cursor-pointer overflow-hidden border-border/70 py-0 transition-colors hover:border-border hover:shadow-md"
-              onClick={() => handleViewDetails(account)}
+              onDoubleClick={() => handleViewDetails(account)}
             >
               <CardContent className="flex flex-col gap-3 p-4">
                 {/* Header */}
@@ -616,7 +648,7 @@ export default function EnterprisePage() {
         pageSize={PAGE_SIZE}
         totalItems={totalItems}
         onPageChange={setPage}
-        onPageSizeChange={function (pageSize: number): void {
+        onPageSizeChange={function (): void {
           throw new Error('Function not implemented.');
         }}
       />

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

@@ -104,6 +104,7 @@ import {
 import { useTranslations } from 'next-intl';
 import { useParams, useRouter } from 'next/navigation';
 import { useEffect, useMemo, useState } from 'react';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { useForm } from 'react-hook-form';
 import { toast } from 'sonner';
 import { z } from 'zod';
@@ -588,6 +589,7 @@ export default function QuestoesPage() {
   const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
   const [questaoToDelete, setQuestaoToDelete] = useState<Questao | null>(null);
   const [hasChanges, setHasChanges] = useState(false);
+  const [saving, setSaving] = useState(false);
   const [buscaInput, setBuscaInput] = useState('');
   const [debouncedBuscaInput, setDebouncedBuscaInput] = useState('');
   const [filtroTipoInput, setFiltroTipoInput] = useState<
@@ -599,7 +601,11 @@ export default function QuestoesPage() {
     allowedValues: ['cards', 'list'],
   });
   const [currentPage, setCurrentPage] = useState(1);
-  const [pageSize, setPageSize] = useState(12);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 12,
+    allowedValues: PAGE_SIZE_OPTIONS,
+  });
 
   const questaoSchema = z.object({
     enunciado: z.string().min(5, t('sheet.validation.statementMin')),
@@ -988,24 +994,29 @@ export default function QuestoesPage() {
       }),
     };
 
-    if (editingQuestao) {
-      await request({
-        url: `/lms/exams/${examId}/questions/${editingQuestao.id}`,
-        method: 'PATCH',
-        data: payload,
-      });
-      toast.success(t('toasts.questionUpdated'));
-    } else {
-      await request({
-        url: `/lms/exams/${examId}/questions`,
-        method: 'POST',
-        data: payload,
-      });
-      toast.success(t('toasts.questionCreated'));
-    }
+    setSaving(true);
+    try {
+      if (editingQuestao) {
+        await request({
+          url: `/lms/exams/${examId}/questions/${editingQuestao.id}`,
+          method: 'PATCH',
+          data: payload,
+        });
+        toast.success(t('toasts.questionUpdated'));
+      } else {
+        await request({
+          url: `/lms/exams/${examId}/questions`,
+          method: 'POST',
+          data: payload,
+        });
+        toast.success(t('toasts.questionCreated'));
+      }
 
-    await refetchQuestions();
-    setSheetOpen(false);
+      await refetchQuestions();
+      setSheetOpen(false);
+    } finally {
+      setSaving(false);
+    }
   }
 
   async function confirmDelete() {
@@ -1796,7 +1807,8 @@ export default function QuestoesPage() {
               )}
 
               <SheetFooter className="mt-auto gap-2 p-0 pt-4">
-                <Button type="submit" className="w-full">
+                <Button type="submit" className="w-full" disabled={saving}>
+                  {saving && <Loader2 className="mr-2 size-4 animate-spin" />}
                   {editingQuestao
                     ? t('sheet.actions.update')
                     : t('sheet.actions.create')}

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

@@ -83,6 +83,7 @@ import {
 import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/navigation';
 import { useEffect, useMemo, useRef, useState } from 'react';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { Controller, useForm, useWatch } from 'react-hook-form';
 import { toast } from 'sonner';
 import { z } from 'zod';
@@ -261,7 +262,11 @@ export default function ExamesPage() {
 
   // 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>>>(

package/hedhog/frontend/app/instructor-skills/page.tsx.ejs

@@ -56,6 +56,7 @@ import {
   TableHeader,
   TableRow,
 } from '@/components/ui/table';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { cn } from '@/lib/utils';
 import { useApp, useQuery } from '@hed-hog/next-app-provider';
 import { zodResolver } from '@hookform/resolvers/zod';
@@ -71,8 +72,6 @@ import * as z from 'zod';
 type InstructorSkill = {
   id: number;
   slug: string;
-  namePt: string;
-  nameEn?: string | null;
   status: 'active' | 'inactive';
 };
 
@@ -93,16 +92,7 @@ const createSkillSchema = (t: ReturnType<typeof useTranslations>) =>
       .min(1, t('form.validation.required'))
       .max(100, t('form.validation.max100'))
       .regex(/^[a-z0-9-]+$/, t('form.validation.slugPattern')),
-    namePt: z
-      .string()
-      .min(1, t('form.validation.required'))
-      .max(255, t('form.validation.max255')),
-    nameEn: z
-      .string()
-      .max(255, t('form.validation.max255'))
-      .optional()
-      .or(z.literal('')),
-    status: z.enum(['active', 'inactive']).default('active'),
+    status: z.enum(['active', 'inactive']),
   });
 
 type SkillFormValues = z.infer<ReturnType<typeof createSkillSchema>>;
@@ -130,8 +120,6 @@ function SkillFormSheet({
     resolver: zodResolver(createSkillSchema(t)),
     defaultValues: {
       slug: '',
-      namePt: '',
-      nameEn: '',
       status: 'active',
     },
   });
@@ -142,15 +130,11 @@ function SkillFormSheet({
       if (skillToEdit) {
         form.reset({
           slug: skillToEdit.slug,
-          namePt: skillToEdit.namePt,
-          nameEn: skillToEdit.nameEn ?? '',
           status: skillToEdit.status,
         });
       } else {
         form.reset({
           slug: '',
-          namePt: '',
-          nameEn: '',
           status: 'active',
         });
       }
@@ -162,8 +146,6 @@ function SkillFormSheet({
       setIsSaving(true);
       const payload = {
         slug: values.slug,
-        namePt: values.namePt,
-        nameEn: values.nameEn || undefined,
         status: values.status,
       };
 
@@ -206,81 +188,52 @@ function SkillFormSheet({
             onSubmit={form.handleSubmit(onSubmit)}
             className="flex flex-col gap-4 px-4 py-4"
           >
-            <FormField
-              control={form.control}
-              name="slug"
-              render={({ field }) => (
-                <FormItem>
-                  <FormLabel>{t('form.slug')}</FormLabel>
-                  <FormControl>
-                    <Input placeholder={t('form.slugPlaceholder')} {...field} />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-
-            <FormField
-              control={form.control}
-              name="namePt"
-              render={({ field }) => (
-                <FormItem>
-                  <FormLabel>{t('form.namePt')}</FormLabel>
-                  <FormControl>
-                    <Input
-                      placeholder={t('form.namePtPlaceholder')}
-                      {...field}
-                    />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-
-            <FormField
-              control={form.control}
-              name="nameEn"
-              render={({ field }) => (
-                <FormItem>
-                  <FormLabel>{t('form.nameEn')}</FormLabel>
-                  <FormControl>
-                    <Input
-                      placeholder={t('form.nameEnPlaceholder')}
-                      {...field}
-                    />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-
-            <FormField
-              control={form.control}
-              name="status"
-              render={({ field }) => (
-                <FormItem>
-                  <FormLabel>{t('form.status')}</FormLabel>
-                  <Select onValueChange={field.onChange} value={field.value}>
+            <div className="grid grid-cols-2 gap-4">
+              <FormField
+                control={form.control}
+                name="slug"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t('form.slug')}</FormLabel>
                     <FormControl>
-                      <SelectTrigger className="w-full">
-                        <SelectValue
-                          placeholder={t('form.statusPlaceholder')}
-                        />
-                      </SelectTrigger>
+                      <Input
+                        placeholder={t('form.slugPlaceholder')}
+                        {...field}
+                      />
                     </FormControl>
-                    <SelectContent>
-                      <SelectItem value="active">
-                        {t('status.active')}
-                      </SelectItem>
-                      <SelectItem value="inactive">
-                        {t('status.inactive')}
-                      </SelectItem>
-                    </SelectContent>
-                  </Select>
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <FormField
+                control={form.control}
+                name="status"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>{t('form.status')}</FormLabel>
+                    <Select onValueChange={field.onChange} value={field.value}>
+                      <FormControl>
+                        <SelectTrigger className="w-full">
+                          <SelectValue
+                            placeholder={t('form.statusPlaceholder')}
+                          />
+                        </SelectTrigger>
+                      </FormControl>
+                      <SelectContent>
+                        <SelectItem value="active">
+                          {t('status.active')}
+                        </SelectItem>
+                        <SelectItem value="inactive">
+                          {t('status.inactive')}
+                        </SelectItem>
+                      </SelectContent>
+                    </Select>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+            </div>
 
             <div className="flex justify-end gap-2 pt-2">
               <Button
@@ -309,7 +262,11 @@ export default function InstructorSkillsPage() {
   const t = useTranslations('lms.InstructorSkillsPage');
 
   const [page, setPage] = useState(1);
-  const [pageSize, setPageSize] = useState(15);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 6,
+    allowedValues: [6, 12, 24, 48],
+  });
   const [searchInput, setSearchInput] = useState('');
   const [debouncedSearch, setDebouncedSearch] = useState('');
   const [sheetOpen, setSheetOpen] = useState(false);
@@ -448,8 +405,6 @@ export default function InstructorSkillsPage() {
             <TableHeader>
               <TableRow>
                 <TableHead>{t('table.slug')}</TableHead>
-                <TableHead>{t('table.namePt')}</TableHead>
-                <TableHead>{t('table.nameEn')}</TableHead>
                 <TableHead>{t('table.status')}</TableHead>
                 <TableHead className="w-10" />
               </TableRow>
@@ -464,14 +419,6 @@ export default function InstructorSkillsPage() {
                   <TableCell>
                     <span className="font-mono text-sm">{skill.slug}</span>
                   </TableCell>
-                  <TableCell>
-                    <span className="font-medium">{skill.namePt}</span>
-                  </TableCell>
-                  <TableCell>
-                    <span className="text-sm text-muted-foreground">
-                      {skill.nameEn ?? '—'}
-                    </span>
-                  </TableCell>
                   <TableCell>
                     <Badge
                       variant="outline"