@hed-hog/operations 0.0.332 → 0.0.338

package/hedhog/frontend/app/_components/project-form-screen.tsx.ejs

@@ -18,7 +18,6 @@ import {
   CommandItem,
   CommandList,
 } from '@/components/ui/command';
-import { EntityPicker } from '@/components/ui/entity-picker';
 import {
   Form,
   FormControl,
@@ -50,7 +49,12 @@ import {
   SheetHeader,
   SheetTitle,
 } from '@/components/ui/sheet';
-import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import {
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+} from '@/components/ui/tabs';
 import { Textarea } from '@/components/ui/textarea';
 import {
   Tooltip,
@@ -96,36 +100,12 @@ import {
   trimToNull,
 } from '../_lib/utils/forms';
 import { ContractFormScreen } from './contract-form-screen';
+import { DepartmentPicker } from './department-picker';
 import { OperationsHeader } from './operations-header';
+import { ProjectFileAttachments } from './project-file-attachments';
 
 const OPTION_PAGE_SIZE = 12;
 
-function getPersonAvatarUrl(avatarId?: number | null) {
-  return typeof avatarId === 'number' && avatarId > 0
-    ? `${process.env.NEXT_PUBLIC_API_BASE_URL}/person/avatar/${avatarId}`
-    : undefined;
-}
-
-function getUserPhotoUrl(photoId?: number | null) {
-  return typeof photoId === 'number' && photoId > 0
-    ? `${process.env.NEXT_PUBLIC_API_BASE_URL}/user/avatar/${photoId}`
-    : undefined;
-}
-
-function getInitials(value?: string | null) {
-  const parts = String(value ?? '')
-    .trim()
-    .split(/\s+/)
-    .filter(Boolean)
-    .slice(0, 2);
-
-  if (!parts.length) {
-    return '??';
-  }
-
-  return parts.map((part) => part[0]?.toUpperCase() ?? '').join('');
-}
-
 type TeamAssignmentState = {
   collaboratorId: number;
   selected: boolean;
@@ -665,7 +645,6 @@ export function ProjectFormScreen({
   const t = useTranslations('operations.ProjectFormPage');
   const commonT = useTranslations('operations.Common');
   const contractT = useTranslations('operations.ContractFormPage');
-  const collaboratorFormT = useTranslations('operations.CollaboratorFormPage');
   const { request, showToastHandler, currentLocaleCode } = useApp();
   const access = useOperationsAccess();
   const router = useRouter();
@@ -673,8 +652,6 @@ export function ProjectFormScreen({
   const personSheetModeRef = useRef<'create' | 'edit'>('edit');
   const [personSheetOpen, setPersonSheetOpen] = useState(false);
   const [personToEdit, setPersonToEdit] = useState<Person | null>(null);
-  const [createdManagerCollaborators, setCreatedManagerCollaborators] =
-    useState<OperationsCollaborator[]>([]);
   const isSheetMode = Boolean(onCancel);
   const isCreateMode = !projectId;
   const [codeAutoMode, setCodeAutoMode] = useState(isCreateMode);
@@ -769,37 +746,6 @@ export function ProjectFormScreen({
     [rawCollaborators]
   );
 
-  const createManagerCollaborator = async (values: Record<string, string>) => {
-    const displayName = values.displayName?.trim() ?? '';
-    const weeklyCapacityHours = parseNumberInput(
-      values.weeklyCapacityHours ?? ''
-    );
-
-    if (!displayName) {
-      return null;
-    }
-
-    const created = await mutateOperations<OperationsCollaborator>(
-      request,
-      '/operations/collaborators',
-      'POST',
-      {
-        displayName,
-        weeklyCapacityHours,
-        status: 'active',
-        autoGenerateContractDraft: false,
-      }
-    );
-
-    setCreatedManagerCollaborators((current) => {
-      const next = current.filter((item) => item.id !== created.id);
-      next.unshift(created);
-      return next;
-    });
-
-    return created;
-  };
-
   const { data: contracts = [], refetch: refetchContracts } = useQuery<
     OperationsContract[]
   >({
@@ -873,10 +819,6 @@ export function ProjectFormScreen({
       byId.set(collaborator.id, collaborator);
     }
 
-    for (const collaborator of createdManagerCollaborators) {
-      byId.set(collaborator.id, collaborator);
-    }
-
     if (
       project?.managerCollaboratorId &&
       !byId.has(project.managerCollaboratorId)
@@ -905,7 +847,7 @@ export function ProjectFormScreen({
     }
 
     return Array.from(byId.values());
-  }, [collaborators, createdManagerCollaborators, project]);
+  }, [collaborators, project]);
 
   const availableContracts = useMemo(() => {
     if (!project?.relatedContract) {
@@ -938,9 +880,10 @@ export function ProjectFormScreen({
           .filter(Boolean)
           .join(' • '),
         avatarUrl:
-          getUserPhotoUrl(collaborator.userPhotoId) ??
-          getPersonAvatarUrl(collaborator.personAvatarId) ??
-          null,
+          typeof collaborator.personAvatarId === 'number' &&
+          collaborator.personAvatarId > 0
+            ? `${process.env.NEXT_PUBLIC_API_BASE_URL}/person/avatar/${collaborator.personAvatarId}`
+            : null,
       })),
     [availableCollaborators]
   );
@@ -1321,100 +1264,20 @@ export function ProjectFormScreen({
               )}
             </p>
           </div>
-          <div className="grid min-w-0 gap-3 md:grid-cols-2 xl:grid-cols-3">
+          <div className="grid min-w-0 gap-3 md:grid-cols-2 xl:grid-cols-5">
             <div className="min-w-0 space-y-2">
               <FieldLabel label={commonT('labels.manager')} />
-              <EntityPicker
-                value={
-                  form.managerCollaboratorId === 'none'
-                    ? null
-                    : Number(form.managerCollaboratorId)
-                }
+              <SearchableSelect
+                label=""
+                value={form.managerCollaboratorId}
                 options={managerOptions}
-                getOptionValue={(option) => option.id}
-                getOptionLabel={(option) => option.title}
-                getOptionDescription={(option) =>
-                  option.description || undefined
-                }
-                renderOption={({ option }) => (
-                  <div className="flex min-w-0 items-center gap-2.5">
-                    <Avatar className="size-6 shrink-0">
-                      <AvatarImage
-                        src={option.avatarUrl ?? undefined}
-                        alt={option.title}
-                      />
-                      <AvatarFallback className="text-[10px]">
-                        {getInitials(option.title)}
-                      </AvatarFallback>
-                    </Avatar>
-                    <div className="min-w-0">
-                      <div className="truncate text-sm">{option.title}</div>
-                      {option.description ? (
-                        <div className="truncate text-xs text-muted-foreground">
-                          {option.description}
-                        </div>
-                      ) : null}
-                    </div>
-                  </div>
-                )}
-                renderSelectedValue={({ option, label }) =>
-                  option ? (
-                    <div className="flex min-w-0 items-center gap-2">
-                      <Avatar className="size-5 shrink-0">
-                        <AvatarImage
-                          src={option.avatarUrl ?? undefined}
-                          alt={option.title}
-                        />
-                        <AvatarFallback className="text-[10px]">
-                          {getInitials(option.title)}
-                        </AvatarFallback>
-                      </Avatar>
-                      <span className="truncate">{option.title}</span>
-                    </div>
-                  ) : (
-                    <span className="text-muted-foreground">{label}</span>
-                  )
-                }
                 placeholder={commonT('labels.notAssigned')}
                 searchPlaceholder={t('placeholders.managerSearch')}
-                emptySelectionLabel={commonT('labels.notAssigned')}
-                valueType="number"
-                clearable
-                allowEmptySelection
-                showCreateButton
-                entityLabel={commonT('labels.manager').toLowerCase()}
-                createActionLabel={`${commonT('actions.create')} ${commonT(
-                  'labels.manager'
-                ).toLowerCase()}`}
-                createTitle={`${commonT('actions.create')} ${commonT(
-                  'labels.manager'
-                ).toLowerCase()}`}
-                createDescription={collaboratorFormT(
-                  'sections.employmentInfoCreateDescription'
-                )}
-                createFields={[
-                  {
-                    name: 'displayName',
-                    label: collaboratorFormT('fields.displayName'),
-                    placeholder: collaboratorFormT('fields.displayName'),
-                    required: true,
-                  },
-                  {
-                    name: 'weeklyCapacityHours',
-                    label: collaboratorFormT('fields.weeklyCapacityHours'),
-                    placeholder: '40',
-                    type: 'number',
-                  },
-                ]}
-                mapSearchToCreateValues={(search) => ({
-                  displayName: search,
-                  weeklyCapacityHours: '40',
-                })}
-                onCreate={createManagerCollaborator}
+                emptyLabel={commonT('labels.notAssigned')}
                 onChange={(value) =>
                   setForm((current) => ({
                     ...current,
-                    managerCollaboratorId: value ? String(value) : 'none',
+                    managerCollaboratorId: value,
                   }))
                 }
               />
@@ -1509,11 +1372,12 @@ export function ProjectFormScreen({
         {!isCreateMode ? (
           <>
             <Tabs defaultValue="financials" className="space-y-3">
-              <TabsList className="grid w-full grid-cols-2">
+              <TabsList className="grid w-full grid-cols-3">
                 <TabsTrigger value="financials">
                   {t('sections.financials')}
                 </TabsTrigger>
                 <TabsTrigger value="team">{t('sections.team')}</TabsTrigger>
+                <TabsTrigger value="files">{t('sections.files')}</TabsTrigger>
               </TabsList>
 
               <TabsContent value="financials" className="space-y-3">
@@ -1623,7 +1487,9 @@ export function ProjectFormScreen({
                       }}
                       initialValues={{
                         code: form.code ? `PRJ-${form.code}` : '',
-                        name: form.name ? `${form.name} Service Agreement` : '',
+                        name: form.name
+                          ? `${form.name} Service Agreement`
+                          : '',
                         clientName: form.clientName,
                         contractCategory: 'client',
                         contractType: 'service_agreement',
@@ -1800,6 +1666,20 @@ export function ProjectFormScreen({
                   </div>
                 </div>
               </TabsContent>
+
+              <TabsContent value="files" className="space-y-3">
+                <div className="space-y-0.5">
+                  <h3 className="text-xs font-semibold uppercase tracking-wide text-muted-foreground">
+                    {t('sections.files')}
+                  </h3>
+                  <p className="text-[11px] text-muted-foreground/80">
+                    {t('sections.filesDescription')}
+                  </p>
+                </div>
+                {projectId ? (
+                  <ProjectFileAttachments projectId={projectId} />
+                ) : null}
+              </TabsContent>
             </Tabs>
           </>
         ) : (

package/hedhog/frontend/app/_components/task-detail-sheet.tsx.ejs

@@ -581,7 +581,6 @@ export function TaskDetailSheet({
   open,
   onOpenChange,
   statusLabel,
-  footer,
   defaultTab = 'comments',
 }: Props) {
   const detailT = useTranslations('operations.ProjectDetailsPage');
@@ -649,7 +648,7 @@ export function TaskDetailSheet({
                       <p className="mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground">
                         {detailT('taskForm.descriptionLabel')}
                       </p>
-                      <CommentContent content={task.description} />
+                      <p className="text-sm leading-relaxed">{task.description}</p>
                     </div>
                   ) : null}
 
@@ -789,9 +788,6 @@ export function TaskDetailSheet({
                   </div>
                 </aside>
               </div>
-              {footer ? (
-                <div className="shrink-0 border-t px-5 py-4">{footer}</div>
-              ) : null}
             </>
           ) : null}
         </SheetContent>