@hed-hog/operations 0.0.300 → 0.0.302

package/hedhog/frontend/app/_components/section-card.tsx.ejs

@@ -1,10 +1,11 @@
+import { CardDescription, CardTitle } from '@/components/ui/card';
 import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardHeader,
-  CardTitle,
-} from '@/components/ui/card';
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from '@/components/ui/tooltip';
+import { cn } from '@/lib/utils';
+import { Info } from 'lucide-react';
 import { ReactNode } from 'react';
 
 interface SectionCardProps {
@@ -12,6 +13,8 @@ interface SectionCardProps {
   description?: string;
   children: ReactNode;
   className?: string;
+  compact?: boolean;
+  descriptionMode?: 'inline' | 'tooltip';
 }
 
 export function SectionCard({
@@ -19,14 +22,46 @@ export function SectionCard({
   description,
   children,
   className,
+  compact = false,
+  descriptionMode = 'inline',
 }: SectionCardProps) {
   return (
-    <Card className={className}>
-      <CardHeader>
-        <CardTitle>{title}</CardTitle>
-        {description ? <CardDescription>{description}</CardDescription> : null}
-      </CardHeader>
-      <CardContent>{children}</CardContent>
-    </Card>
+    <div className={cn(className, '')}>
+      <div className={compact ? 'space-y-1 px-0 py-2.5' : undefined}>
+        <div className="flex items-start justify-between gap-2">
+          <div className="flex items-center gap-2">
+            <CardTitle
+              className={compact ? 'text-sm font-semibold' : undefined}
+            >
+              {title}
+            </CardTitle>
+            {description && descriptionMode === 'tooltip' ? (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <button
+                    type="button"
+                    className="cursor-help text-muted-foreground transition-colors hover:text-foreground"
+                    aria-label={description}
+                  >
+                    <Info className="size-4" />
+                  </button>
+                </TooltipTrigger>
+                <TooltipContent className="max-w-xs text-sm leading-relaxed">
+                  {description}
+                </TooltipContent>
+              </Tooltip>
+            ) : null}
+          </div>
+        </div>
+        {description && descriptionMode !== 'tooltip' ? (
+          <CardDescription
+            className={compact ? 'text-[11px] leading-relaxed' : undefined}
+          >
+            {description}
+          </CardDescription>
+        ) : null}
+      </div>
+      <div className={compact ? 'px-0 pb-3 pt-0' : undefined}>{children}</div>
+    </div>
   );
 }

package/hedhog/frontend/app/_lib/api.ts.ejs

@@ -2,12 +2,9 @@ type RequestFn = (input: {
   url: string;
   method: string;
   data?: unknown;
-}) => Promise<{ data: any }>;
+}) => Promise<{ data: unknown }>;
 
-export async function fetchOperations<T>(
-  request: RequestFn,
-  url: string
-) {
+export async function fetchOperations<T>(request: RequestFn, url: string) {
   const response = await request({
     url,
     method: 'GET',

package/hedhog/frontend/app/_lib/types.ts.ejs

@@ -26,10 +26,14 @@ export type OperationsDashboard = {
 
 export type OperationsCollaborator = {
   id: number;
-  userId?: number;
+  userId?: number | null;
+  personId?: number | null;
+  personName?: string | null;
+  personAvatarId?: number | null;
   code: string;
   collaboratorType?: string;
   displayName: string;
+  departmentId?: number | null;
   department?: string | null;
   title?: string | null;
   levelLabel?: string | null;
@@ -48,6 +52,18 @@ export type OperationsCollaborator = {
   pendingScheduleAdjustmentRequests?: number;
 };
 
+export type OperationsDepartment = {
+  id: number;
+  slug: string;
+  code?: string | null;
+  name: string;
+  description?: string | null;
+  status: 'active' | 'inactive';
+  collaboratorCount?: number;
+  createdAt?: string | null;
+  updatedAt?: string | null;
+};
+
 export type OperationsProject = {
   id: number;
   contractId?: number | null;
@@ -71,41 +87,65 @@ export type OperationsProject = {
   teamSize?: number;
 };
 
-export type OperationsContract = {
-  id: number;
-  code: string;
-  name: string;
-  contractCategory?: string;
-  contractType?: string;
-  clientName: string;
-  signatureStatus?: string;
-  isActive?: boolean;
-  billingModel: string;
+export type OperationsContract = {
+  id: number;
+  code: string;
+  name?: string | null;
+  contractCategory?: string;
+  contractType?: string;
+  clientName?: string | null;
+  signatureStatus?: string;
+  isActive?: boolean;
+  billingModel: string;
   accountManagerCollaboratorId?: number | null;
   accountManagerName?: string | null;
   relatedCollaboratorId?: number | null;
   relatedCollaboratorName?: string | null;
-  mainRelatedPartyName?: string | null;
-  originType?: string | null;
-  originId?: number | null;
-  startDate: string;
-  endDate?: string | null;
-  signedAt?: string | null;
-  effectiveDate?: string | null;
+  contractTemplateId?: number | null;
+  contractTemplateName?: string | null;
+  contractTemplateSlug?: string | null;
+  contractTemplateCode?: string | null;
+  mainRelatedPartyName?: string | null;
+  originType?: string | null;
+  originId?: number | null;
+  startDate?: string | null;
+  endDate?: string | null;
+  signedAt?: string | null;
+  effectiveDate?: string | null;
   budgetAmount?: number | null;
   monthlyHourCap?: number | null;
   valueAmount?: number | null;
   paymentAmount?: number | null;
   revenueAmount?: number | null;
-  fineAmount?: number | null;
-  status: string;
-  description?: string | null;
-  contentHtml?: string | null;
-  projectCount?: number;
+  fineAmount?: number | null;
+  status: string;
+  creationMode?: 'blank' | 'template' | 'upload' | 'duplicate' | null;
+  wizardStep?: number | null;
+  description?: string | null;
+  contentHtml?: string | null;
+  projectCount?: number;
   currentPdfFileName?: string | null;
   scheduleSummary?: OperationsWeeklyScheduleDay[];
 };
 
+export type OperationsContractTemplate = {
+  id: number;
+  slug: string;
+  code?: string | null;
+  name: string;
+  description?: string | null;
+  contractCategory?: string | null;
+  contractType?: string | null;
+  billingModel?: string | null;
+  signatureStatus?: string | null;
+  isActive?: boolean;
+  status: string;
+  contentHtml?: string | null;
+  usageCount?: number;
+  createdAt?: string | null;
+  updatedAt?: string | null;
+};
+
 export type OperationsWeeklyScheduleDay = {
   weekday: string;
   isWorkingDay: boolean;
@@ -331,16 +371,19 @@ export type OperationsContractDetails = OperationsContract & {
     dueDay?: number | null;
     notes?: string | null;
   }>;
-  documents: Array<{
-    id: number;
-    documentType: string;
-    fileName: string;
-    mimeType: string;
-    fileContentBase64?: string | null;
-    isCurrent: boolean;
-    notes?: string | null;
-    createdAt: string;
-  }>;
+  documents: Array<{
+    id: number;
+    documentType: string;
+    fileId?: number | null;
+    fileName: string;
+    mimeType: string;
+    fileContentBase64?: string | null;
+    isCurrent: boolean;
+    extractionStatus?: string | null;
+    extractionSummary?: string | null;
+    notes?: string | null;
+    createdAt: string;
+  }>;
   revisions: Array<{
     id: number;
     revisionType: string;

package/hedhog/frontend/app/_lib/utils/format.ts.ejs

@@ -1,3 +1,8 @@
+import {
+  formatDateTime as formatDateTimeWithSettings,
+  formatDate as formatDateWithSettings,
+} from '@/lib/format-date';
+
 export const operationsCurrency = new Intl.NumberFormat('en-US', {
   style: 'currency',
   currency: 'USD',
@@ -8,24 +13,74 @@ export function formatCurrency(value: number) {
   return operationsCurrency.format(value);
 }
 
-export function formatDate(value?: string | null) {
+function resolveLocale(currentLocaleCode: string) {
+  return currentLocaleCode.startsWith('pt') ? 'pt-BR' : 'en-US';
+}
+
+export function formatDate(
+  value?: string | null,
+  getSettingValue?: ((key: string) => unknown) | null,
+  currentLocaleCode = 'en-US'
+) {
   if (!value) {
     return '-';
   }
 
-  return new Date(`${value}T00:00:00`).toLocaleDateString('en-US', {
+  const parsedDate = new Date(
+    value.includes('T') ? value : `${value}T00:00:00`
+  );
+
+  if (Number.isNaN(parsedDate.getTime())) {
+    return '-';
+  }
+
+  if (getSettingValue) {
+    try {
+      return formatDateWithSettings(
+        parsedDate,
+        getSettingValue,
+        currentLocaleCode
+      );
+    } catch {
+      // Fall back to a locale-based format below.
+    }
+  }
+
+  return parsedDate.toLocaleDateString(resolveLocale(currentLocaleCode), {
     month: 'short',
     day: 'numeric',
     year: 'numeric',
   });
 }
 
-export function formatDateTime(value?: string | null) {
+export function formatDateTime(
+  value?: string | null,
+  getSettingValue?: ((key: string) => unknown) | null,
+  currentLocaleCode = 'en-US'
+) {
   if (!value) {
     return '-';
   }
 
-  return new Date(value).toLocaleString('en-US', {
+  const parsedDate = new Date(value);
+
+  if (Number.isNaN(parsedDate.getTime())) {
+    return '-';
+  }
+
+  if (getSettingValue) {
+    try {
+      return formatDateTimeWithSettings(
+        parsedDate,
+        getSettingValue,
+        currentLocaleCode
+      );
+    } catch {
+      // Fall back to a locale-based format below.
+    }
+  }
+
+  return parsedDate.toLocaleString(resolveLocale(currentLocaleCode), {
     month: 'short',
     day: 'numeric',
     year: 'numeric',
@@ -50,6 +105,26 @@ export function formatHours(value?: number | null) {
   return `${Number(value).toFixed(1)}h`;
 }
 
+function formatTimeValue(value?: string | null) {
+  if (!value) {
+    return '-';
+  }
+
+  const directMatch = String(value).match(/(\d{2}:\d{2})(?::\d{2})?/);
+
+  if (directMatch?.[1]) {
+    return directMatch[1];
+  }
+
+  const parsedDate = new Date(value);
+
+  if (!Number.isNaN(parsedDate.getTime())) {
+    return parsedDate.toISOString().slice(11, 16);
+  }
+
+  return String(value);
+}
+
 export function formatEnumLabel(value?: string | null) {
   if (!value) {
     return '-';
@@ -62,17 +137,19 @@ export function formatEnumLabel(value?: string | null) {
 
 export function formatDateRange(
   startDate?: string | null,
-  endDate?: string | null
+  endDate?: string | null,
+  getSettingValue?: ((key: string) => unknown) | null,
+  currentLocaleCode = 'en-US'
 ) {
   if (!startDate && !endDate) {
     return '-';
   }
 
   if (!endDate || startDate === endDate) {
-    return formatDate(startDate);
+    return formatDate(startDate, getSettingValue, currentLocaleCode);
   }
 
-  return `${formatDate(startDate)} to ${formatDate(endDate)}`;
+  return `${formatDate(startDate, getSettingValue, currentLocaleCode)} to ${formatDate(endDate, getSettingValue, currentLocaleCode)}`;
 }
 
 export function getStatusBadgeClass(value?: string | null) {
@@ -120,7 +197,7 @@ export function summarizeScheduleDays(
     .map((day) => {
       const label = formatEnumLabel(day.weekday);
       if (day.startTime && day.endTime) {
-        return `${label}: ${day.startTime}-${day.endTime}`;
+        return `${label}: ${formatTimeValue(day.startTime)}-${formatTimeValue(day.endTime)}`;
       }
 
       return label;

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

@@ -37,34 +37,12 @@ import {
   getStatusBadgeClass,
 } from '../_lib/utils/format';
 
-type PendingDecision = {
-  approval: OperationsApproval;
-  action: 'approve' | 'reject';
-};
-
-function getTargetLabel(approval: OperationsApproval) {
-  switch (approval.targetType) {
-    case 'timesheet':
-      return `Timesheet ${formatDateRange(
-        approval.timesheetWeekStartDate,
-        approval.timesheetWeekEndDate
-      )}`;
-    case 'time_off_request':
-      return `${formatEnumLabel(approval.timeOffType)} ${formatDateRange(
-        approval.timeOffStartDate,
-        approval.timeOffEndDate
-      )}`;
-    case 'schedule_adjustment_request':
-      return `${formatEnumLabel(approval.scheduleRequestScope)} ${formatDateRange(
-        approval.scheduleStartDate,
-        approval.scheduleEndDate
-      )}`;
-    default:
-      return formatEnumLabel(approval.targetType);
-  }
-}
-
-export default function OperationsApprovalsPage() {
+type PendingDecision = {
+  approval: OperationsApproval;
+  action: 'approve' | 'reject';
+};
+
+export default function OperationsApprovalsPage() {
   const t = useTranslations('operations.ApprovalsPage');
   const commonT = useTranslations('operations.Common');
   const { request, showToastHandler, currentLocaleCode } = useApp();
@@ -72,10 +50,68 @@ export default function OperationsApprovalsPage() {
   const [search, setSearch] = useState('');
   const [statusFilter, setStatusFilter] = useState('all');
   const [targetFilter, setTargetFilter] = useState('all');
-  const [decisionNote, setDecisionNote] = useState('');
-  const [pendingDecision, setPendingDecision] = useState<PendingDecision | null>(
-    null
-  );
+  const [decisionNote, setDecisionNote] = useState('');
+  const [pendingDecision, setPendingDecision] = useState<PendingDecision | null>(
+    null
+  );
+
+  const getStatusLabel = (value?: string | null) => {
+    if (!value) {
+      return '-';
+    }
+
+    const key = `options.statuses.${value}`;
+    return t.has(key) ? t(key) : formatEnumLabel(value);
+  };
+
+  const getTargetTypeLabel = (value?: string | null) => {
+    if (!value) {
+      return '-';
+    }
+
+    const key = `options.targetTypes.${value}`;
+    return t.has(key) ? t(key) : formatEnumLabel(value);
+  };
+
+  const getTimeOffTypeLabel = (value?: string | null) => {
+    if (!value) {
+      return '-';
+    }
+
+    const key = `options.timeOffTypes.${value}`;
+    return t.has(key) ? t(key) : formatEnumLabel(value);
+  };
+
+  const getScheduleScopeLabel = (value?: string | null) => {
+    if (!value) {
+      return '-';
+    }
+
+    const key = `options.scheduleScopes.${value}`;
+    return t.has(key) ? t(key) : formatEnumLabel(value);
+  };
+
+  const getTargetLabel = (approval: OperationsApproval) => {
+    switch (approval.targetType) {
+      case 'timesheet':
+        return `${getTargetTypeLabel('timesheet')} ${formatDateRange(
+          approval.timesheetWeekStartDate,
+          approval.timesheetWeekEndDate
+        )}`;
+      case 'time_off_request':
+        return `${getTimeOffTypeLabel(approval.timeOffType)} ${formatDateRange(
+          approval.timeOffStartDate,
+          approval.timeOffEndDate
+        )}`;
+      case 'schedule_adjustment_request':
+        return `${getScheduleScopeLabel(approval.scheduleRequestScope)} ${formatDateRange(
+          approval.scheduleStartDate,
+          approval.scheduleEndDate
+        )}`;
+      default:
+        return getTargetTypeLabel(approval.targetType);
+    }
+  };
 
   const { data: approvals = [], refetch } = useQuery<OperationsApproval[]>({
     queryKey: ['operations-approvals', currentLocaleCode],
@@ -194,12 +230,12 @@ export default function OperationsApprovalsPage() {
             value: statusFilter,
             onChange: setStatusFilter,
             placeholder: commonT('labels.status'),
-            options: [
-              { value: 'all', label: commonT('filters.allStatuses') },
-              { value: 'pending', label: formatEnumLabel('pending') },
-              { value: 'approved', label: formatEnumLabel('approved') },
-              { value: 'rejected', label: formatEnumLabel('rejected') },
-            ],
+            options: [
+              { value: 'all', label: commonT('filters.allStatuses') },
+              { value: 'pending', label: getStatusLabel('pending') },
+              { value: 'approved', label: getStatusLabel('approved') },
+              { value: 'rejected', label: getStatusLabel('rejected') },
+            ],
           },
           {
             id: 'target',
@@ -207,18 +243,18 @@ export default function OperationsApprovalsPage() {
             value: targetFilter,
             onChange: setTargetFilter,
             placeholder: commonT('labels.requestType'),
-            options: [
-              { value: 'all', label: commonT('filters.allTypes') },
-              { value: 'timesheet', label: formatEnumLabel('timesheet') },
-              {
-                value: 'time_off_request',
-                label: formatEnumLabel('time_off_request'),
-              },
-              {
-                value: 'schedule_adjustment_request',
-                label: formatEnumLabel('schedule_adjustment_request'),
-              },
-            ],
+            options: [
+              { value: 'all', label: commonT('filters.allTypes') },
+              { value: 'timesheet', label: getTargetTypeLabel('timesheet') },
+              {
+                value: 'time_off_request',
+                label: getTargetTypeLabel('time_off_request'),
+              },
+              {
+                value: 'schedule_adjustment_request',
+                label: getTargetTypeLabel('schedule_adjustment_request'),
+              },
+            ],
           },
         ]}
       />
@@ -272,10 +308,10 @@ export default function OperationsApprovalsPage() {
                     </div>
                   </TableCell>
                   <TableCell>
-                    <StatusBadge
-                      label={formatEnumLabel(approval.status)}
-                      className={getStatusBadgeClass(approval.status)}
-                    />
+                    <StatusBadge
+                      label={getStatusLabel(approval.status)}
+                      className={getStatusBadgeClass(approval.status)}
+                    />
                   </TableCell>
                   <TableCell>
                     {approval.status === 'pending' ? (

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

@@ -1,4 +1,4 @@
-import { CollaboratorFormScreen } from '../../../_components/collaborator-form-screen';
+import { redirect } from 'next/navigation';
 
 export default async function EditCollaboratorPage({
   params,
@@ -7,5 +7,5 @@ export default async function EditCollaboratorPage({
 }) {
   const { id } = await params;
 
-  return <CollaboratorFormScreen collaboratorId={Number(id)} />;
+  redirect(`/operations/collaborators?edit=${id}`);
 }

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

@@ -1,4 +1,4 @@
-import { CollaboratorDetailsScreen } from '../../_components/collaborator-details-screen';
+import { redirect } from 'next/navigation';
 
 export default async function CollaboratorDetailsPage({
   params,
@@ -7,5 +7,5 @@ export default async function CollaboratorDetailsPage({
 }) {
   const { id } = await params;
 
-  return <CollaboratorDetailsScreen collaboratorId={Number(id)} />;
+  redirect(`/operations/collaborators?edit=${id}`);
 }