@hed-hog/operations 0.0.332 → 0.0.347

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

@@ -97,6 +97,7 @@ import {
 } from '../_lib/utils/forms';
 import { ContractFormScreen } from './contract-form-screen';
 import { OperationsHeader } from './operations-header';
+import { ProjectFileAttachments } from './project-file-attachments';
 
 const OPTION_PAGE_SIZE = 12;
 
@@ -158,12 +159,33 @@ type ProjectFormState = {
   teamAssignments: TeamAssignmentState[];
 };
 
-type ProjectFormValues = ProjectFormState;
-
-function generateProjectCode(name: string): string {
-  const words = name.trim().split(/\s+/).filter(Boolean);
-  if (words.length === 0) return '';
-  if (words.length === 1) return words[0]!.slice(0, 5).toUpperCase();
+type ProjectFormValues = ProjectFormState;
+
+type ManagerOption = {
+  id: number;
+  title: string;
+  description: string;
+  avatarUrl: string | null;
+};
+
+function toManagerOption(collaborator: OperationsCollaborator): ManagerOption {
+  return {
+    id: collaborator.id,
+    title: collaborator.displayName,
+    description: [collaborator.department, collaborator.title]
+      .filter(Boolean)
+      .join(' • '),
+    avatarUrl:
+      getUserPhotoUrl(collaborator.userPhotoId) ??
+      getPersonAvatarUrl(collaborator.personAvatarId) ??
+      null,
+  };
+}
+
+function generateProjectCode(name: string): string {
+  const words = name.trim().split(/\s+/).filter(Boolean);
+  if (words.length === 0) return '';
+  if (words.length === 1) return words[0]!.slice(0, 5).toUpperCase();
   return words
     .map((w) => w[0]!.toUpperCase())
     .join('')
@@ -673,11 +695,11 @@ 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);
+  const [createdManagerCollaborators, setCreatedManagerCollaborators] =
+    useState<OperationsCollaborator[]>([]);
 
   const projectFormSchema = useMemo(
     () =>
@@ -769,7 +791,9 @@ export function ProjectFormScreen({
     [rawCollaborators]
   );
 
-  const createManagerCollaborator = async (values: Record<string, string>) => {
+  const createManagerCollaborator = async (
+    values: Record<string, string>
+  ): Promise<ManagerOption | null> => {
     const displayName = values.displayName?.trim() ?? '';
     const weeklyCapacityHours = parseNumberInput(
       values.weeklyCapacityHours ?? ''
@@ -797,8 +821,8 @@ export function ProjectFormScreen({
       return next;
     });
 
-    return created;
-  };
+    return toManagerOption(created);
+  };
 
   const { data: contracts = [], refetch: refetchContracts } = useQuery<
     OperationsContract[]
@@ -929,21 +953,13 @@ export function ProjectFormScreen({
     [availableContracts, form.contractId]
   );
 
-  const managerOptions = useMemo(
-    () =>
-      availableCollaborators.map((collaborator) => ({
-        id: collaborator.id,
-        title: collaborator.displayName,
-        description: [collaborator.department, collaborator.title]
-          .filter(Boolean)
-          .join(' • '),
-        avatarUrl:
-          getUserPhotoUrl(collaborator.userPhotoId) ??
-          getPersonAvatarUrl(collaborator.personAvatarId) ??
-          null,
-      })),
-    [availableCollaborators]
-  );
+  const managerOptions = useMemo(
+    () =>
+      availableCollaborators.map((collaborator) =>
+        toManagerOption(collaborator)
+      ),
+    [availableCollaborators]
+  );
 
   const selectedAssignmentsCount = useMemo(
     () =>
@@ -1233,6 +1249,9 @@ export function ProjectFormScreen({
                             : null
                         }
                         initialSelectedLabel={field.value}
+                        initialSelectedAvatarId={
+                          project?.clientAvatarId ?? null
+                        }
                         selectPlaceholder={t('placeholders.clientName')}
                         onChange={(personId, personName) => {
                           field.onChange(personName ?? '');
@@ -1321,7 +1340,7 @@ 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
@@ -1509,11 +1528,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">
@@ -1800,6 +1820,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

@@ -41,7 +41,11 @@ import type {
   OperationsTaskActivity,
   OperationsTaskComment,
 } from '../_lib/types';
-import { formatDate, formatDateTime, getStatusBadgeClass } from '../_lib/utils/format';
+import {
+  formatDate,
+  formatDateTime,
+  getStatusBadgeClass,
+} from '../_lib/utils/format';
 import {
   formatDurationMinutes,
   getElapsedDoingMinutes,
@@ -138,7 +142,10 @@ export type TaskCommentsSectionProps = {
   onChanged?: () => void;
 };
 
-export function TaskCommentsSection({ taskId, onChanged }: TaskCommentsSectionProps) {
+export function TaskCommentsSection({
+  taskId,
+  onChanged,
+}: TaskCommentsSectionProps) {
   const { request, showToastHandler, getSettingValue } = useApp();
   const ct = useTranslations('operations.ProjectDetailsPage.commentsSection');
   const editWindowMinutes = Number(
@@ -386,9 +393,13 @@ export function TaskCommentsSection({ taskId, onChanged }: TaskCommentsSectionPr
         />
         <div className="flex items-center justify-end gap-2">
           <span className="text-[10px] text-muted-foreground select-none">
-            <kbd className="rounded border bg-muted px-1 py-0.5 font-mono text-[10px]">Ctrl</kbd>
+            <kbd className="rounded border bg-muted px-1 py-0.5 font-mono text-[10px]">
+              Ctrl
+            </kbd>
             {' + '}
-            <kbd className="rounded border bg-muted px-1 py-0.5 font-mono text-[10px]">↵</kbd>
+            <kbd className="rounded border bg-muted px-1 py-0.5 font-mono text-[10px]">
+              ↵
+            </kbd>
           </span>
           <Button
             size="sm"
@@ -655,7 +666,9 @@ export function TaskDetailSheet({
 
                   <Tabs
                     value={tab}
-                    onValueChange={(v) => setTab(v as 'comments' | 'activities')}
+                    onValueChange={(v) =>
+                      setTab(v as 'comments' | 'activities')
+                    }
                     className="flex flex-1 min-h-0 flex-col"
                   >
                     <div className="shrink-0 border-b px-5 py-2">
@@ -745,7 +758,11 @@ export function TaskDetailSheet({
                       <div className="flex items-center gap-1.5 text-sm">
                         <Calendar className="size-3.5 shrink-0 text-muted-foreground" />
                         <span>
-                          {formatDate(task.dueDate, getSettingValue, currentLocaleCode)}
+                          {formatDate(
+                            task.dueDate,
+                            getSettingValue,
+                            currentLocaleCode
+                          )}
                         </span>
                       </div>
                     </div>