Feature/attachments projects month

src/components/project/controls/AttachmentPreviewButton.tsx

@@ -8,7 +8,7 @@ import {t} from '../../utils';
 type AttachmentPreviewButtonProps = {
   downloadUrl: string;
   /** Specifies translation key for the tooltip  */
-  toolTipTransString: string;
+  tooltip: string;
 }
 
 export const AttachmentPreviewButton = (props: AttachmentPreviewButtonProps) => {
@@ -18,7 +18,7 @@ export const AttachmentPreviewButton = (props: AttachmentPreviewButtonProps) =>
 
   return (
     <Button size="md" onClick={() => viewAttachment()} variant="outline-dark">
-      <Icon fa="fa fa-eye" size={1} title={t(props.toolTipTransString)} />
+      <Icon fa="fa fa-eye" size={1} title={t(props.tooltip)} />
     </Button>
   );
 };

src/components/project/project-month-list/ProjectMonthInboundCell.tsx

@@ -81,7 +81,7 @@ type InboundActionsMap = {
 /** Switch between statusses and dropzone for uploading the inbound invoice */
 const InboundActionButtons = ({projectMonth, onChange}: InboundActionButtonsProps) => {
   const dispatch = useDispatch();
-  const {inbound, attachments} = projectMonth.details;
+  const {details: {attachments, inbound}, invoice} = projectMonth;
 
   const buttons: InboundActionsMap[] = [{
     status: 'validated',
@@ -106,29 +106,34 @@ const InboundActionButtons = ({projectMonth, onChange}: InboundActionButtonsProp
     ),
   }];
 
-  const hasInboundInvoiceBeenUploaded = attachments.some(attachment => attachment.type === 'inbound');
+  const hasInboundInvoiceBeenUploaded = invoice
+    ? invoice.attachments.some(a => a.type === 'inbound') : attachments.some(a => a.type === 'inbound');
 
   const getInboundInvoiceDownloadUrl = () => {
     const projectMonthId = projectMonth._id;
-    const inboundInvoiceDetails = attachments.find(attachment => attachment.type === 'inbound');
+    const inboundInvoiceDetails = invoice
+      ? invoice.attachments.find(a => a.type === 'inbound')
+      : attachments.find(a => a.type === 'inbound');
 
     const {fileName} = inboundInvoiceDetails!;
 
-    return getDownloadUrl('project_month', projectMonthId, 'inbound', fileName, 'preview');
+    return getDownloadUrl('project_month', invoice ? invoice._id : projectMonthId, 'inbound', fileName, 'preview');
   };
 
   return (
     <div className="inbound-actions">
       {buttons.filter(b => b.status !== inbound.status).map(b => b.component)}
 
 
-      <UploadFileButton
-        onUpload={f => dispatch(projectMonthUpload(f, 'inbound', projectMonth._id))}
-        icon="fa fa-upload"
-        title={t('projectMonth.inboundUpload')}
-      />
+      {!invoice && (
+        <UploadFileButton
+          onUpload={f => dispatch(projectMonthUpload(f, 'inbound', projectMonth._id))}
+          icon="fa fa-upload"
+          title={t('projectMonth.inboundUpload')}
+        />
+      )}
       {hasInboundInvoiceBeenUploaded && (
-        <AttachmentPreviewButton toolTipTransString="projectMonth.viewInboundInvoice" downloadUrl={getInboundInvoiceDownloadUrl()} />
+        <AttachmentPreviewButton tooltip="projectMonth.viewInboundInvoice" downloadUrl={getInboundInvoiceDownloadUrl()} />
       )}
     </div>
   );

src/components/project/project-month-list/ProjectMonthTimesheetCell.tsx

@@ -58,15 +58,20 @@ export const ProjectMonthTimesheetCell = ({projectMonth}: ProjectMonthTimesheetC
     && (timesheet.timesheet === timesheet.check || timesheet.note || !projectConfig.timesheetCheck)
   );
 
-  const hasTimesheetBeenUploaded = projectMonth.details.attachments.some(attachment => attachment.type === 'timesheet');
+  const hasTimesheetBeenUploaded = projectMonth.invoice
+    ? projectMonth.invoice.attachments.some(a => a.type === 'timesheet')
+    : projectMonth.details.attachments.some(a => a.type === 'timesheet');
 
   const getTimesheetDownloadUrl = () => {
+    const {details, invoice} = projectMonth;
     const projectMonthId = projectMonth._id;
-    const timesheetDetails = projectMonth.details.attachments.find(attachment => attachment.type === 'timesheet');
+    const timesheetDetails = invoice
+      ? invoice.attachments.find(a => a.type === 'timesheet')
+      : details.attachments.find(a => a.type === 'timesheet');
 
     const {fileName} = timesheetDetails!;
 
-    return getDownloadUrl('project_month', projectMonthId, 'timesheet', fileName, 'preview');
+    return getDownloadUrl('project_month', invoice ? invoice._id : projectMonthId, 'timesheet', fileName, 'preview');
   };
 
   return (
@@ -102,13 +107,15 @@ export const ProjectMonthTimesheetCell = ({projectMonth}: ProjectMonthTimesheetC
           onChange={val => saveTimesheet({...timesheet, note: val})}
           title={t('projectMonth.timesheetNote', {name: `${projectMonth.consultant.firstName} ${projectMonth.consultant.name}`})}
         />
-        <UploadFileButton
-          onUpload={f => dispatch(projectMonthUpload(f, 'timesheet', projectMonth._id))}
-          icon="fa fa-upload"
-          title={t('projectMonth.timesheetUpload')}
-        />
+        {!projectMonth.invoice && (
+          <UploadFileButton
+            onUpload={f => dispatch(projectMonthUpload(f, 'timesheet', projectMonth._id))}
+            icon="fa fa-upload"
+            title={t('projectMonth.timesheetUpload')}
+          />
+        )}
         {hasTimesheetBeenUploaded && (
-          <AttachmentPreviewButton toolTipTransString="projectMonth.viewTimesheet" downloadUrl={getTimesheetDownloadUrl()} />
+          <AttachmentPreviewButton tooltip="projectMonth.viewTimesheet" downloadUrl={getTimesheetDownloadUrl()} />
         )}
       </div>
     </div>

src/trans.ts

@@ -361,7 +361,7 @@ export const trans = {
     note: 'Facturatie perikelen',
     forceVerified: 'Forceer afgehandeld zonder een factuur op te maken',
     viewTimesheet: 'Timesheet bekijken',
-    viewInboundInvoice: 'Inbound factuur bekijken',
+    viewInboundInvoice: 'Ontvangen factuur bekijken',
   },
   controls: {
     // browser