@hed-hog/contact 0.0.333 → 0.0.347

package/hedhog/frontend/app/person/_components/person-import-sheet.tsx.ejs

@@ -63,30 +63,30 @@ type ImportResult = {
 
 type ColumnMapping = Record<string, string>;
 
-type CompanyOption = {
-  id: number;
-  name: string;
-  trade_name?: string | null;
-};
-
-type WizardStep = 'upload' | 'preview' | 'mapping' | 'confirm' | 'result';
-
-function getImportErrorMessage(error: unknown, fallback: string) {
-  if (typeof error === 'object' && error !== null) {
-    const response = 'response' in error ? error.response : undefined;
-    if (typeof response === 'object' && response !== null && 'data' in response) {
-      const data = response.data;
-      if (typeof data === 'object' && data !== null && 'message' in data) {
-        const message = data.message;
-        if (typeof message === 'string') return message;
-      }
-    }
-    if ('message' in error && typeof error.message === 'string') {
-      return error.message;
-    }
-  }
-  return fallback;
-}
+type CompanyOption = {
+  id: number;
+  name: string;
+  trade_name?: string | null;
+};
+
+type WizardStep = 'upload' | 'preview' | 'mapping' | 'confirm' | 'result';
+
+function getImportErrorMessage(error: unknown, fallback: string) {
+  if (typeof error === 'object' && error !== null) {
+    const response = 'response' in error ? error.response : undefined;
+    if (typeof response === 'object' && response !== null && 'data' in response) {
+      const data = response.data;
+      if (typeof data === 'object' && data !== null && 'message' in data) {
+        const message = data.message;
+        if (typeof message === 'string') return message;
+      }
+    }
+    if ('message' in error && typeof error.message === 'string') {
+      return error.message;
+    }
+  }
+  return fallback;
+}
 
 // ─── CRM Field Definitions ───────────────────────────────────────────────────
 
@@ -164,7 +164,7 @@ function StepIndicator({ current }: { current: WizardStep }) {
               <Icon className="size-3.5" />
             )}
             <span className="text-[10px] font-medium leading-tight hidden sm:block">
-              {t(step.labelKey as never)}
+              {t(step.labelKey as never)}
             </span>
           </div>
         );
@@ -436,7 +436,7 @@ function MappingStep({
             {duplicateFields
               .map((field) => {
                 const fieldDef = CRM_FIELDS.find((f) => f.value === field);
-                const label = fieldDef ? t(fieldDef.labelKey as never) : field;
+                const label = fieldDef ? t(fieldDef.labelKey as never) : field;
                 return t('importMappingDuplicateWarning', { field: label });
               })
               .join(' ')}
@@ -498,7 +498,7 @@ function MappingStep({
                         value={field.value}
                         className="text-xs"
                       >
-                        {t(field.labelKey as never)}
+                        {t(field.labelKey as never)}
                       </SelectItem>
                     ))}
                   </SelectContent>
@@ -581,7 +581,7 @@ function ConfirmStep({
                   variant="outline"
                   className="text-[10px] border-primary/30 bg-primary/5 text-primary px-1.5 py-0"
                 >
-                  {fieldDef ? t(fieldDef.labelKey as never) : field}
+                  {fieldDef ? t(fieldDef.labelKey as never) : field}
                 </Badge>
               </div>
             );
@@ -605,11 +605,11 @@ function ConfirmStep({
           onChange={(val) => {
             onCompanyChange(val ? Number(val) : null);
           }}
-          getOptionValue={(opt) => (opt as CompanyOption).id}
-          getOptionLabel={(opt) => (opt as CompanyOption).name ?? ''}
-          getOptionDescription={(opt) =>
-            (opt as CompanyOption).trade_name ?? undefined
-          }
+          getOptionValue={(opt) => (opt as CompanyOption).id}
+          getOptionLabel={(opt) => (opt as CompanyOption).name ?? ''}
+          getOptionDescription={(opt) =>
+            (opt as CompanyOption).trade_name ?? undefined
+          }
           loadOptions={async ({ page, pageSize, search }) => {
             const params = new URLSearchParams({
               page: String(page),
@@ -816,29 +816,29 @@ function ResultStep({
 
 // ─── Main Sheet ──────────────────────────────────────────────────────────────
 
-export type PersonImportSheetProps = {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-  onSuccess: (result?: ImportResult) => void;
-  initialCompanyId?: number | null;
-  previewUrl?: string;
-  importUrl?: string;
-  title?: string;
-  description?: string;
-  nameRequired?: boolean;
-};
-
-export function PersonImportSheet({
-  open,
-  onOpenChange,
-  onSuccess,
-  initialCompanyId = null,
-  previewUrl = '/person/import/preview',
-  importUrl = '/person/import',
-  title,
-  description,
-  nameRequired = true,
-}: PersonImportSheetProps) {
+export type PersonImportSheetProps = {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  onSuccess: (result?: ImportResult) => void;
+  initialCompanyId?: number | null;
+  previewUrl?: string;
+  importUrl?: string;
+  title?: string;
+  description?: string;
+  nameRequired?: boolean;
+};
+
+export function PersonImportSheet({
+  open,
+  onOpenChange,
+  onSuccess,
+  initialCompanyId = null,
+  previewUrl = '/person/import/preview',
+  importUrl = '/person/import',
+  title,
+  description,
+  nameRequired = true,
+}: PersonImportSheetProps) {
   const t = useTranslations('contact.ContactPage');
   const { request } = useApp();
 
@@ -886,8 +886,8 @@ export function PersonImportSheet({
       }
       onOpenChange(nextOpen);
     },
-    [initialCompanyId, onOpenChange]
-  );
+    [initialCompanyId, onOpenChange]
+  );
 
   // ── Auto-initialise mapping from columns ──
   const initMapping = useCallback((columns: string[]) => {
@@ -899,16 +899,16 @@ export function PersonImportSheet({
   }, []);
 
   // ── Navigation ──
-  const canGoNext = (): boolean => {
-    if (step === 'upload') return !!file;
-    if (step === 'preview') return !!preview && !previewError;
-    if (step === 'mapping') {
-      const hasName = Object.values(mapping).includes('name');
-      const hasEmail = Object.values(mapping).includes('email');
-      return nameRequired ? hasName : hasEmail;
-    }
-    if (step === 'confirm') return true;
-    return false;
+  const canGoNext = (): boolean => {
+    if (step === 'upload') return !!file;
+    if (step === 'preview') return !!preview && !previewError;
+    if (step === 'mapping') {
+      const hasName = Object.values(mapping).includes('name');
+      const hasEmail = Object.values(mapping).includes('email');
+      return nameRequired ? hasName : hasEmail;
+    }
+    if (step === 'confirm') return true;
+    return false;
   };
 
   const handleNext = async () => {
@@ -926,19 +926,19 @@ export function PersonImportSheet({
       await fetchPreview();
     } else if (step === 'preview') {
       setStep('mapping');
-    } else if (step === 'mapping') {
-      const hasName = Object.values(mapping).includes('name');
-      const hasEmail = Object.values(mapping).includes('email');
-      if (nameRequired && !hasName) {
-        setMappingError(t('importMappingNameRequired'));
-        return;
-      }
-      if (!nameRequired && !hasEmail) {
-        setMappingError('Mapeie uma coluna para Email.');
-        return;
-      }
-      setMappingError(null);
-      setStep('confirm');
+    } else if (step === 'mapping') {
+      const hasName = Object.values(mapping).includes('name');
+      const hasEmail = Object.values(mapping).includes('email');
+      if (nameRequired && !hasName) {
+        setMappingError(t('importMappingNameRequired'));
+        return;
+      }
+      if (!nameRequired && !hasEmail) {
+        setMappingError('Mapeie uma coluna para Email.');
+        return;
+      }
+      setMappingError(null);
+      setStep('confirm');
     } else if (step === 'confirm') {
       await runImport();
     }
@@ -961,17 +961,17 @@ export function PersonImportSheet({
       const formData = new FormData();
       formData.append('file', file);
 
-      const res = await request<ImportPreview>({
-        url: previewUrl,
-        method: 'POST',
-        data: formData,
+      const res = await request<ImportPreview>({
+        url: previewUrl,
+        method: 'POST',
+        data: formData,
         headers: { 'Content-Type': 'multipart/form-data' },
       });
 
       setPreview(res.data);
       initMapping(res.data.columns);
-    } catch (err: unknown) {
-      setPreviewError(getImportErrorMessage(err, t('importErrorGeneric')));
+    } catch (err: unknown) {
+      setPreviewError(getImportErrorMessage(err, t('importErrorGeneric')));
     } finally {
       setPreviewLoading(false);
     }
@@ -990,17 +990,17 @@ export function PersonImportSheet({
       formData.append('mapping', JSON.stringify(mapping));
       if (companyId) formData.append('company_id', String(companyId));
 
-      const res = await request<ImportResult>({
-        url: importUrl,
-        method: 'POST',
-        data: formData,
+      const res = await request<ImportResult>({
+        url: importUrl,
+        method: 'POST',
+        data: formData,
         headers: { 'Content-Type': 'multipart/form-data' },
       });
-
-      setResult(res.data);
-      onSuccess(res.data);
-    } catch (err: unknown) {
-      setImportError(getImportErrorMessage(err, t('importErrorGeneric')));
+
+      setResult(res.data);
+      onSuccess(res.data);
+    } catch (err: unknown) {
+      setImportError(getImportErrorMessage(err, t('importErrorGeneric')));
     } finally {
       setImportLoading(false);
     }
@@ -1019,12 +1019,12 @@ export function PersonImportSheet({
               <Upload className="h-4 w-4 text-primary" />
             </div>
             <div>
-              <SheetTitle className="text-base">
-                {title ?? t('importSheetTitle')}
-              </SheetTitle>
-              <SheetDescription className="text-xs">
-                {description ?? t('importSheetDescription')}
-              </SheetDescription>
+              <SheetTitle className="text-base">
+                {title ?? t('importSheetTitle')}
+              </SheetTitle>
+              <SheetDescription className="text-xs">
+                {description ?? t('importSheetDescription')}
+              </SheetDescription>
             </div>
           </div>
         </SheetHeader>

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

@@ -33,6 +33,7 @@ import {
 import { ToggleGroup, ToggleGroupItem } from '@/components/ui/toggle-group';
 import { formatDate } from '@/lib/format-date';
 import { cn } from '@/lib/utils';
+import { usePersistedPageSize } from '@/hooks/use-persisted-page-size';
 import { useApp, useQuery } from '@hed-hog/next-app-provider';
 import {
   type ColumnDef,
@@ -328,7 +329,11 @@ export default function PeoplePage() {
 
   const [sorting, setSorting] = useState<SortingState>([]);
   const [page, setPage] = useState(1);
-  const [pageSize, setPageSize] = useState(12);
+  const [pageSize, setPageSize] = usePersistedPageSize({
+    storageKey: 'pagination:global:pageSize',
+    defaultValue: 12,
+    allowedValues: [12, 20, 30, 40, 50],
+  });
   const [searchInput, setSearchInput] = useState('');
   const [debouncedSearch, setDebouncedSearch] = useState('');
   const [typeFilter, setTypeFilter] = useState('all');