@hed-hog/contact 0.0.330 → 0.0.332

package/hedhog/frontend/app/_components/person-picker.tsx.ejs

@@ -41,7 +41,7 @@ import {
 } from '@/components/ui/sheet';
 import { useApp, useQuery } from '@hed-hog/next-app-provider';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { ChevronsUpDown, Loader2, Plus, X } from 'lucide-react';
+import { ChevronsUpDown, Loader2, Pencil, Plus, X } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import {
@@ -60,6 +60,10 @@ type PersonOption = {
   avatar_id?: number | null;
 };
 
+type PersonOptionApi = PersonOption & {
+  avatar_id?: number | null;
+};
+
 type CreatePersonValues = {
   name: string;
   type: 'individual' | 'company';
@@ -563,6 +567,8 @@ export function PersonPicker({
   entityLabel,
   value,
   onChange,
+  onEditSelection,
+  onCreateNew,
   selectPlaceholder,
   personTypeFilter = 'all',
   createType = 'individual',
@@ -570,11 +576,15 @@ export function PersonPicker({
   initialSelectedLabel = '',
   disabled = false,
   clearable = true,
+  showEditButton = false,
+  editAriaLabel,
 }: {
   label: string;
   entityLabel: string;
   value?: string | number | null;
   onChange: (personId: number | null, personName: string) => void;
+  onEditSelection?: (personId: number) => void;
+  onCreateNew?: (initialName?: string) => void;
   selectPlaceholder: string;
   personTypeFilter?: PersonTypeFilter;
   createType?: Exclude<PersonTypeFilter, 'all'>;
@@ -582,6 +592,8 @@ export function PersonPicker({
   initialSelectedLabel?: string;
   disabled?: boolean;
   clearable?: boolean;
+  showEditButton?: boolean;
+  editAriaLabel?: string;
 }) {
   const { request } = useApp();
   const t = usePersonPickerTranslations();
@@ -685,9 +697,11 @@ export function PersonPicker({
         }
 
         if (payload && 'data' in payload && Array.isArray(payload.data)) {
-          return payload.data.map((p) => ({
+          const options = payload.data as PersonOptionApi[];
+
+          return options.map((p) => ({
             ...p,
-            avatarId: (p as any).avatar_id ?? p.avatarId ?? null,
+            avatarId: p.avatar_id ?? p.avatarId ?? null,
           })) as PersonOption[];
         }
 
@@ -701,6 +715,9 @@ export function PersonPicker({
       ? String(value)
       : '';
   const hasValue = normalizedValue.length > 0;
+  const selectedPersonId = hasValue ? Number(normalizedValue) : Number.NaN;
+  const canEditSelection =
+    Number.isFinite(selectedPersonId) && selectedPersonId > 0;
 
   const selectedPersonFromList = personOptionsData.find(
     (p) => String(p.id) === normalizedValue
@@ -750,7 +767,7 @@ export function PersonPicker({
       <div className="grid min-w-0 gap-2">
         {label ? <Label>{label}</Label> : null}
 
-        <div className="grid min-w-0 grid-cols-[minmax(0,1fr)_auto] gap-2 sm:grid-cols-[minmax(0,1fr)_auto_auto]">
+        <div className="grid min-w-0 grid-cols-[minmax(0,1fr)_auto] gap-2 sm:grid-cols-[minmax(0,1fr)_auto_auto_auto]">
           <Popover
             open={!disabled && personOpen}
             onOpenChange={(open) => {
@@ -816,10 +833,15 @@ export function PersonPicker({
                       personOptionsData.length === 0
                     ) {
                       e.preventDefault();
-                      openCreateWithPrefill(
-                        e.currentTarget,
-                        personSearch.trim()
-                      );
+                      if (onCreateNew) {
+                        setPersonOpen(false);
+                        onCreateNew(personSearch.trim());
+                      } else {
+                        openCreateWithPrefill(
+                          e.currentTarget,
+                          personSearch.trim()
+                        );
+                      }
                     }
                   }}
                 />
@@ -837,10 +859,15 @@ export function PersonPicker({
                           variant="outline"
                           className="w-full"
                           onClick={(event) => {
-                            openCreateWithPrefill(
-                              event.currentTarget,
-                              personSearch.trim()
-                            );
+                            if (onCreateNew) {
+                              setPersonOpen(false);
+                              onCreateNew(personSearch.trim());
+                            } else {
+                              openCreateWithPrefill(
+                                event.currentTarget,
+                                personSearch.trim()
+                              );
+                            }
                           }}
                         >
                           {t('actions.createNew')}
@@ -914,6 +941,27 @@ export function PersonPicker({
             </Button>
           ) : null}
 
+          {showEditButton ? (
+            <Button
+              type="button"
+              variant="outline"
+              size="icon"
+              className="shrink-0"
+              disabled={disabled || !canEditSelection}
+              onClick={() => {
+                if (!canEditSelection || !onEditSelection) {
+                  return;
+                }
+                onEditSelection(selectedPersonId);
+              }}
+              aria-label={
+                editAriaLabel ?? t('actions.createEntityAria', { entityLabel })
+              }
+            >
+              <Pencil className="h-4 w-4" />
+            </Button>
+          ) : null}
+
           <Button
             type="button"
             variant="outline"
@@ -921,9 +969,14 @@ export function PersonPicker({
             className="shrink-0"
             disabled={disabled}
             onClick={(event) => {
-              captureParentScrollPosition(event.currentTarget);
-              setPersonOpen(false);
-              setCreatePersonOpen(true);
+              if (onCreateNew) {
+                setPersonOpen(false);
+                onCreateNew(personSearch.trim());
+              } else {
+                captureParentScrollPosition(event.currentTarget);
+                setPersonOpen(false);
+                setCreatePersonOpen(true);
+              }
             }}
             aria-label={t('actions.createEntityAria', { entityLabel })}
           >

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

@@ -801,7 +801,7 @@ export default function AccountsPage() {
     <Page>
       <PageHeader
         breadcrumbs={[
-          { label: 'Home', href: '/' },
+          { label: crmT('breadcrumbs.home'), href: '/' },
           { label: crmT('breadcrumbs.crm'), href: '/contact/dashboard' },
           { label: t('title') },
         ]}

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

@@ -311,7 +311,7 @@ export default function CrmActivitiesPage() {
     <Page>
       <PageHeader
         breadcrumbs={[
-          { label: 'Home', href: '/' },
+          { label: crmT('breadcrumbs.home'), href: '/' },
           { label: crmT('breadcrumbs.crm'), href: '/contact/dashboard' },
           { label: t('title') },
         ]}

package/hedhog/frontend/app/follow-ups/page.tsx.ejs

@@ -619,7 +619,7 @@ export default function CrmFollowupsPage() {
     <Page>
       <PageHeader
         breadcrumbs={[
-          { label: 'Home', href: '/' },
+          { label: crmT('breadcrumbs.home'), href: '/' },
           { label: crmT('breadcrumbs.crm'), href: '/contact/dashboard' },
           { label: t('title') },
         ]}

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

@@ -1146,6 +1146,11 @@ export function PersonFormSheet({
       ? `${process.env.NEXT_PUBLIC_API_BASE_URL}/person/avatar/${fileId}`
       : '/placeholder.png';
 
+  const getUserPhotoUrl = (photoId?: number | null) =>
+    typeof photoId === 'number' && photoId > 0
+      ? `${process.env.NEXT_PUBLIC_API_BASE_URL}/user/avatar/${photoId}`
+      : undefined;
+
   const resolveApiUrl = (url: string) =>
     /^https?:\/\//i.test(url)
       ? url
@@ -2508,6 +2513,15 @@ export function PersonFormSheet({
                               '')
                           : ''
                       );
+                      const userPhotoId = (
+                        opt as { photo_id?: number | null } | null
+                      )?.photo_id;
+                      if (val != null && userPhotoId && !avatarId) {
+                        setAvatarId(userPhotoId);
+                        setAvatarPreviewUrl(
+                          getUserPhotoUrl(userPhotoId) ?? '/placeholder.png'
+                        );
+                      }
                     }}
                     placeholder={t('selectLinkedUser')}
                     entityLabel={t('user')}
@@ -2518,7 +2532,12 @@ export function PersonFormSheet({
                       const params = new URLSearchParams();
                       if (search) params.set('search', search);
                       const response = await request<
-                        Array<{ id: number; name: string; email?: string }>
+                        Array<{
+                          id: number;
+                          name: string;
+                          email?: string;
+                          photo_id?: number | null;
+                        }>
                       >({
                         url: `/person/linked-user-options?${params.toString()}`,
                         method: 'GET',

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

@@ -791,7 +791,7 @@ export default function PeoplePage() {
     <Page>
       <PageHeader
         breadcrumbs={[
-          { label: 'Home', href: '/' },
+          { label: crmT('breadcrumbs.home'), href: '/' },
           { label: crmT('breadcrumbs.crm'), href: '/contact/dashboard' },
           {
             label: allowCompanyRegistration

package/hedhog/frontend/app/proposals/_components/proposals-management-page.tsx.ejs

@@ -1,50 +1,50 @@
 'use client';
 
 import {
-    EmptyState,
-    Page,
-    PageHeader,
-    PaginationFooter,
-    SearchBar,
-    type SearchBarControl,
+  EmptyState,
+  Page,
+  PageHeader,
+  PaginationFooter,
+  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';
 import {
-    DropdownMenu,
-    DropdownMenuContent,
-    DropdownMenuItem,
-    DropdownMenuSeparator,
-    DropdownMenuTrigger,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu';
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { KpiCardsGrid } from '@/components/ui/kpi-cards-grid';
 import { Skeleton } from '@/components/ui/skeleton';
 import {
-    Table,
-    TableBody,
-    TableCell,
-    TableHead,
-    TableHeader,
-    TableRow,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
 } from '@/components/ui/table';
 import { ToggleGroup, ToggleGroupItem } from '@/components/ui/toggle-group';
 import { cn } from '@/lib/utils';
 import { useApp, useQuery } from '@hed-hog/next-app-provider';
 import {
-    CheckCircle2,
-    Clock3,
-    FileCheck2,
-    FileText,
-    LayoutGrid,
-    List,
-    Loader2,
-    MoreHorizontal,
-    Pencil,
-    RefreshCcw,
-    Send,
-    XCircle,
+  CheckCircle2,
+  Clock3,
+  FileCheck2,
+  FileText,
+  LayoutGrid,
+  List,
+  Loader2,
+  MoreHorizontal,
+  Pencil,
+  RefreshCcw,
+  Send,
+  XCircle,
 } from 'lucide-react';
 import { useTranslations } from 'next-intl';
 import { useEffect, useMemo, useState } from 'react';
@@ -53,8 +53,8 @@ import { toast } from 'sonner';
 import type { PaginatedResult } from '../../person/_components/person-types';
 import { ProposalFormSheet } from './proposal-form-sheet';
 import {
-    openStoredFile,
-    type GenerateProposalDocumentResponse,
+  openStoredFile,
+  type GenerateProposalDocumentResponse,
 } from './proposal-types';
 
 type ProposalStatus =
@@ -161,7 +161,9 @@ function getAvatarInitials(name?: string | null) {
   if (!name) return '?';
   const parts = name.trim().split(/\s+/);
   if (parts.length === 1) return (parts[0] ?? '').slice(0, 2).toUpperCase();
-  return ((parts[0]?.[0] ?? '') + (parts[parts.length - 1]?.[0] ?? '')).toUpperCase();
+  return (
+    (parts[0]?.[0] ?? '') + (parts[parts.length - 1]?.[0] ?? '')
+  ).toUpperCase();
 }
 
 function canSubmitProposal(status?: ProposalStatus | null) {
@@ -199,7 +201,9 @@ export function ProposalsManagementPage({
   const [viewMode, setViewMode] = useState<ProposalViewMode>('table');
   const [actionKey, setActionKey] = useState<string | null>(null);
   const [editSheetOpen, setEditSheetOpen] = useState(false);
-  const [editingProposalId, setEditingProposalId] = useState<number | null>(null);
+  const [editingProposalId, setEditingProposalId] = useState<number | null>(
+    null
+  );
   const [editingPersonId, setEditingPersonId] = useState<number | null>(null);
 
   useEffect(() => {
@@ -452,7 +456,7 @@ export function ProposalsManagementPage({
     <Page>
       <PageHeader
         breadcrumbs={[
-          { label: 'Home', href: '/' },
+          { label: crmT('breadcrumbs.home'), href: '/' },
           { label: crmT('breadcrumbs.crm'), href: '/contact/dashboard' },
           { label: pageTitle },
         ]}
@@ -615,7 +619,9 @@ export function ProposalsManagementPage({
                     <TableCell>
                       <div className="flex items-center gap-3">
                         <Avatar className="h-8 w-8 shrink-0">
-                          <AvatarImage src={getPersonAvatarUrl(proposal.person?.avatar_id)} />
+                          <AvatarImage
+                            src={getPersonAvatarUrl(proposal.person?.avatar_id)}
+                          />
                           <AvatarFallback className="bg-primary/10 text-[11px] font-semibold text-primary">
                             {getAvatarInitials(customerName)}
                           </AvatarFallback>
@@ -671,66 +677,101 @@ export function ProposalsManagementPage({
                     </TableCell>
 
                     <TableCell className="text-right">
-                      <DropdownMenu>
-                        <DropdownMenuTrigger asChild>
-                          <Button variant="ghost" size="icon" className="h-8 w-8">
-                            {actionKey?.startsWith(`${proposal.id}-`) || actionKey === `generate-pdf-${proposal.id}` || actionKey === `submit-${proposal.id}` || actionKey === `approve-${proposal.id}` || actionKey === `reject-${proposal.id}` ? (
-                              <Loader2 className="h-4 w-4 animate-spin" />
-                            ) : (
-                              <MoreHorizontal className="h-4 w-4" />
-                            )}
+                      <div className="flex items-center justify-end gap-2">
+                        {canEditProposal(proposal.status) ? (
+                          <Button
+                            variant="outline"
+                            size="sm"
+                            className="gap-1.5"
+                            onClick={() => handleEdit(proposal)}
+                          >
+                            <Pencil className="h-3.5 w-3.5" />
+                            {proposalT('actions.edit')}
                           </Button>
-                        </DropdownMenuTrigger>
-                        <DropdownMenuContent align="end">
-                          {canEditProposal(proposal.status) ? (
-                            <DropdownMenuItem onClick={() => handleEdit(proposal)}>
-                              <Pencil className="mr-2 h-4 w-4" />
-                              {proposalT('actions.edit')}
-                            </DropdownMenuItem>
-                          ) : null}
-
-                          {canSubmitProposal(proposal.status) ? (
-                            <DropdownMenuItem
-                              disabled={actionKey === `submit-${proposal.id}`}
-                              onClick={() => void handleStatusAction(proposal, 'submit')}
+                        ) : null}
+                        <DropdownMenu>
+                          <DropdownMenuTrigger asChild>
+                            <Button
+                              variant="ghost"
+                              size="icon"
+                              className="h-8 w-8"
                             >
-                              <Send className="mr-2 h-4 w-4" />
-                              {proposalT('actions.submit')}
-                            </DropdownMenuItem>
-                          ) : null}
-
-                          {proposal.status === 'pending_approval' &&
-                          !proposal.current_user_has_approved ? (
-                            <>
+                              {actionKey?.startsWith(`${proposal.id}-`) ||
+                              actionKey === `generate-pdf-${proposal.id}` ||
+                              actionKey === `submit-${proposal.id}` ||
+                              actionKey === `approve-${proposal.id}` ||
+                              actionKey === `reject-${proposal.id}` ? (
+                                <Loader2 className="h-4 w-4 animate-spin" />
+                              ) : (
+                                <MoreHorizontal className="h-4 w-4" />
+                              )}
+                            </Button>
+                          </DropdownMenuTrigger>
+                          <DropdownMenuContent align="end">
+                            {canEditProposal(proposal.status) ? (
                               <DropdownMenuItem
-                                disabled={actionKey === `approve-${proposal.id}`}
-                                onClick={() => void handleStatusAction(proposal, 'approve')}
+                                onClick={() => handleEdit(proposal)}
                               >
-                                <CheckCircle2 className="mr-2 h-4 w-4" />
-                                {proposalT('actions.approve')}
+                                <Pencil className="mr-2 h-4 w-4" />
+                                {proposalT('actions.edit')}
                               </DropdownMenuItem>
+                            ) : null}
+
+                            {canSubmitProposal(proposal.status) ? (
                               <DropdownMenuItem
-                                disabled={actionKey === `reject-${proposal.id}`}
-                                className="text-destructive focus:text-destructive"
-                                onClick={() => void handleStatusAction(proposal, 'reject')}
+                                disabled={actionKey === `submit-${proposal.id}`}
+                                onClick={() =>
+                                  void handleStatusAction(proposal, 'submit')
+                                }
                               >
-                                <XCircle className="mr-2 h-4 w-4" />
-                                {proposalT('actions.reject')}
+                                <Send className="mr-2 h-4 w-4" />
+                                {proposalT('actions.submit')}
                               </DropdownMenuItem>
-                            </>
-                          ) : null}
-
-                          <DropdownMenuSeparator />
+                            ) : null}
+
+                            {proposal.status === 'pending_approval' &&
+                            !proposal.current_user_has_approved ? (
+                              <>
+                                <DropdownMenuItem
+                                  disabled={
+                                    actionKey === `approve-${proposal.id}`
+                                  }
+                                  onClick={() =>
+                                    void handleStatusAction(proposal, 'approve')
+                                  }
+                                >
+                                  <CheckCircle2 className="mr-2 h-4 w-4" />
+                                  {proposalT('actions.approve')}
+                                </DropdownMenuItem>
+                                <DropdownMenuItem
+                                  disabled={
+                                    actionKey === `reject-${proposal.id}`
+                                  }
+                                  className="text-destructive focus:text-destructive"
+                                  onClick={() =>
+                                    void handleStatusAction(proposal, 'reject')
+                                  }
+                                >
+                                  <XCircle className="mr-2 h-4 w-4" />
+                                  {proposalT('actions.reject')}
+                                </DropdownMenuItem>
+                              </>
+                            ) : null}
+
+                            <DropdownMenuSeparator />
 
-                          <DropdownMenuItem
-                            disabled={actionKey === `generate-pdf-${proposal.id}`}
-                            onClick={() => void handleGeneratePdf(proposal)}
-                          >
-                            <FileText className="mr-2 h-4 w-4" />
-                            {proposalT('actions.generatePdf')}
-                          </DropdownMenuItem>
-                        </DropdownMenuContent>
-                      </DropdownMenu>
+                            <DropdownMenuItem
+                              disabled={
+                                actionKey === `generate-pdf-${proposal.id}`
+                              }
+                              onClick={() => void handleGeneratePdf(proposal)}
+                            >
+                              <FileText className="mr-2 h-4 w-4" />
+                              {proposalT('actions.generatePdf')}
+                            </DropdownMenuItem>
+                          </DropdownMenuContent>
+                        </DropdownMenu>
+                      </div>
                     </TableCell>
                   </TableRow>
                 );
@@ -755,11 +796,13 @@ export function ProposalsManagementPage({
                   <div className="flex items-start justify-between gap-3">
                     <div className="flex min-w-0 items-start gap-2.5">
                       <Avatar className="mt-0.5 h-8 w-8 shrink-0">
-                          <AvatarImage src={getPersonAvatarUrl(proposal.person?.avatar_id)} />
-                          <AvatarFallback className="bg-primary/10 text-[11px] font-semibold text-primary">
-                            {getAvatarInitials(customerName)}
-                          </AvatarFallback>
-                        </Avatar>
+                        <AvatarImage
+                          src={getPersonAvatarUrl(proposal.person?.avatar_id)}
+                        />
+                        <AvatarFallback className="bg-primary/10 text-[11px] font-semibold text-primary">
+                          {getAvatarInitials(customerName)}
+                        </AvatarFallback>
+                      </Avatar>
                       <div className="min-w-0 space-y-1">
                         <p className="line-clamp-2 text-sm font-semibold text-foreground">
                           {proposal.title}
@@ -824,11 +867,25 @@ export function ProposalsManagementPage({
                     </div>
                   </div>
 
-                  <div className="mt-auto flex justify-end">
+                  <div className="mt-auto flex justify-end gap-2">
+                    {canEditProposal(proposal.status) ? (
+                      <Button
+                        variant="outline"
+                        size="sm"
+                        className="gap-1.5"
+                        onClick={() => handleEdit(proposal)}
+                      >
+                        <Pencil className="h-3.5 w-3.5" />
+                        {proposalT('actions.edit')}
+                      </Button>
+                    ) : null}
                     <DropdownMenu>
                       <DropdownMenuTrigger asChild>
                         <Button variant="outline" size="sm" className="gap-1.5">
-                          {actionKey === `generate-pdf-${proposal.id}` || actionKey === `submit-${proposal.id}` || actionKey === `approve-${proposal.id}` || actionKey === `reject-${proposal.id}` ? (
+                          {actionKey === `generate-pdf-${proposal.id}` ||
+                          actionKey === `submit-${proposal.id}` ||
+                          actionKey === `approve-${proposal.id}` ||
+                          actionKey === `reject-${proposal.id}` ? (
                             <Loader2 className="h-3.5 w-3.5 animate-spin" />
                           ) : (
                             <MoreHorizontal className="h-3.5 w-3.5" />
@@ -838,7 +895,9 @@ export function ProposalsManagementPage({
                       </DropdownMenuTrigger>
                       <DropdownMenuContent align="end">
                         {canEditProposal(proposal.status) ? (
-                          <DropdownMenuItem onClick={() => handleEdit(proposal)}>
+                          <DropdownMenuItem
+                            onClick={() => handleEdit(proposal)}
+                          >
                             <Pencil className="mr-2 h-4 w-4" />
                             {proposalT('actions.edit')}
                           </DropdownMenuItem>
@@ -847,7 +906,9 @@ export function ProposalsManagementPage({
                         {canSubmitProposal(proposal.status) ? (
                           <DropdownMenuItem
                             disabled={actionKey === `submit-${proposal.id}`}
-                            onClick={() => void handleStatusAction(proposal, 'submit')}
+                            onClick={() =>
+                              void handleStatusAction(proposal, 'submit')
+                            }
                           >
                             <Send className="mr-2 h-4 w-4" />
                             {proposalT('actions.submit')}
@@ -859,7 +920,9 @@ export function ProposalsManagementPage({
                           <>
                             <DropdownMenuItem
                               disabled={actionKey === `approve-${proposal.id}`}
-                              onClick={() => void handleStatusAction(proposal, 'approve')}
+                              onClick={() =>
+                                void handleStatusAction(proposal, 'approve')
+                              }
                             >
                               <CheckCircle2 className="mr-2 h-4 w-4" />
                               {proposalT('actions.approve')}
@@ -867,7 +930,9 @@ export function ProposalsManagementPage({
                             <DropdownMenuItem
                               disabled={actionKey === `reject-${proposal.id}`}
                               className="text-destructive focus:text-destructive"
-                              onClick={() => void handleStatusAction(proposal, 'reject')}
+                              onClick={() =>
+                                void handleStatusAction(proposal, 'reject')
+                              }
                             >
                               <XCircle className="mr-2 h-4 w-4" />
                               {proposalT('actions.reject')}

package/hedhog/frontend/messages/en.json

@@ -501,6 +501,7 @@
   },
   "CrmMenu": {
     "breadcrumbs": {
+      "home": "Home",
       "crm": "CRM"
     },
     "current": "Current",

package/hedhog/frontend/messages/pt.json

@@ -500,6 +500,7 @@
   },
   "CrmMenu": {
     "breadcrumbs": {
+      "home": "Home",
       "crm": "CRM"
     },
     "current": "Atual",