download button for xml (wip)

itenium-be · Dec 4, 2023 · 33cd816 · 33cd816
1 parent ee79473
commit 33cd816
Show file tree

Hide file tree

Showing 6 changed files with 85 additions and 36 deletions.
diff --git a/frontend/src/actions/downloadActions.ts b/frontend/src/actions/downloadActions.ts
@@ -1,32 +1,52 @@
 import request from 'superagent-bluebird-promise';
 import moment from 'moment';
-import {catchHandler} from './utils/fetch';
-import {buildUrl} from './utils/buildUrl';
+import { catchHandler } from './utils/fetch';
+import { buildUrl } from './utils/buildUrl';
 import InvoiceModel from '../components/invoice/models/InvoiceModel';
-import {Attachment} from '../models';
-import {ClientModel} from '../components/client/models/ClientModels';
-import {getInvoiceFileName, getDownloadUrl, previewPdf, downloadAttachment} from './utils/download-helpers';
-import {ProjectMonthOverviewModel} from '../components/project/models/ProjectMonthModel';
-import {FullProjectMonthModel} from '../components/project/models/FullProjectMonthModel';
-import {authService} from '../components/users/authService';
+import { Attachment } from '../models';
+import { ClientModel } from '../components/client/models/ClientModels';
+import { getInvoiceFileName, getDownloadUrl, previewPdf, downloadAttachment, getMyInvoiceFileName } from './utils/download-helpers';
+import { ProjectMonthOverviewModel } from '../components/project/models/ProjectMonthModel';
+import { FullProjectMonthModel } from '../components/project/models/FullProjectMonthModel';
+import { authService } from '../components/users/authService';
 
 
 export function getInvoiceDownloadUrl(
   fileNameTemplate: string,
   invoice: InvoiceModel,
-  attachment: 'pdf' | Attachment = 'pdf',
+  attachment: string | Attachment = 'pdf',
   downloadType?: 'preview' | 'download',
   fullProjectMonth?: FullProjectMonthModel,
 ): string {
 
   const fileType = invoice.isQuotation ? 'quotation' : 'invoice';
-  const fileName = attachment === 'pdf' || attachment.type === 'pdf'
-    ? getInvoiceFileName(fileNameTemplate, invoice, fullProjectMonth)
-    : attachment.fileName;
-  const attachmentType = attachment === 'pdf' ? 'pdf' : attachment.type;
+/*   const fileName = typeof attachment === 'string' || attachment.type === 'pdf'
+    ? getMyInvoiceFileName(fileNameTemplate, invoice, 'pdf', fullProjectMonth)
+    : attachment.fileName; */
+
+  const filename = () => {
+    if (typeof attachment === 'string') {
+      return getMyInvoiceFileName(fileNameTemplate, invoice, attachment, fullProjectMonth);
+    }
+    if (attachment.type === 'pdf') {
+      return getMyInvoiceFileName(fileNameTemplate, invoice, 'pdf', fullProjectMonth);
+    }
+    return attachment.fileName;
+  }
+
+  const attachmentType = typeof attachment === 'string' ? attachment : attachment.type;
   // return buildUrl(`/attachments/${fileType}/${invoice._id}/${attachmentType}/${encodeURIComponent(fileName)}${query}`);
-
-  return getDownloadUrl(fileType, invoice._id, attachmentType, fileName, downloadType);
+/*   const myType = () => {
+    if (attachment === 'xml') {
+      return 'xml';
+    }
+    if (typeof attachment !== 'string') {
+      return attachment.type;
+    }
+    return 'pdf';
+  } */
+
+  return getDownloadUrl(fileType, invoice._id, attachmentType, filename(), downloadType);
 }
 
 

diff --git a/frontend/src/actions/utils/download-helpers.ts b/frontend/src/actions/utils/download-helpers.ts
@@ -1,8 +1,8 @@
 import InvoiceModel from '../../components/invoice/models/InvoiceModel';
-import {buildUrl} from './buildUrl';
-import {invoiceReplacements} from '../../components/invoice/invoice-replacements';
-import {FullProjectMonthModel} from '../../components/project/models/FullProjectMonthModel';
-import {authService} from '../../components/users/authService';
+import { buildUrl } from './buildUrl';
+import { invoiceReplacements } from '../../components/invoice/invoice-replacements';
+import { FullProjectMonthModel } from '../../components/project/models/FullProjectMonthModel';
+import { authService } from '../../components/users/authService';
 
 export type DownloadAttachmentModelTypes = {
   invoice: string;
@@ -36,6 +36,11 @@ export function downloadAttachment(fileName: string, content: Blob): void {
 
 
 
+export function getMyInvoiceFileName(fileName: string, invoice: InvoiceModel, extension: string, fullProjectMonth?: FullProjectMonthModel): string {
+  console.log(`${invoiceReplacements(fileName, invoice, fullProjectMonth)}.${extension}`);
+  return `${invoiceReplacements(fileName, invoice, fullProjectMonth)}.${extension}`;
+}
+
 export function getInvoiceFileName(fileName: string, invoice: InvoiceModel, fullProjectMonth?: FullProjectMonthModel): string {
   return `${invoiceReplacements(fileName, invoice, fullProjectMonth)}.pdf`;
 }

diff --git a/frontend/src/components/controls/attachments/AttachmentDownloadIcon.tsx b/frontend/src/components/controls/attachments/AttachmentDownloadIcon.tsx
@@ -1,15 +1,15 @@
 import React from 'react';
-import {useSelector} from 'react-redux';
-import {Icon, IconProps} from '../Icon';
-import {getInvoiceDownloadUrl} from '../../../actions/index';
+import { useSelector } from 'react-redux';
+import { Icon, IconProps } from '../Icon';
+import { getInvoiceDownloadUrl } from '../../../actions/index';
 import t from '../../../trans';
-import {InvoiceModelProps} from '../../invoice/models/InvoiceModel';
-import {Attachment} from '../../../models';
-import {getAwesomeFileType} from '../../invoice/models/getAwesomeFileType';
-import {ConfacState} from '../../../reducers/app-state';
+import { InvoiceModelProps } from '../../invoice/models/InvoiceModel';
+import { Attachment } from '../../../models';
+import { getAwesomeFileType } from '../../invoice/models/getAwesomeFileType';
+import { ConfacState } from '../../../reducers/app-state';
 
 
-export const InvoiceDownloadIcon = ({invoice, ...props}: InvoiceModelProps) => {
+export const InvoiceDownloadPdfIcon = ({ invoice, ...props }: InvoiceModelProps) => {
   const configInvoiceFileName = useSelector((state: ConfacState) => state.config.invoiceFileName);
 
   const defaultInvoiceFileName = invoice.client.invoiceFileName || configInvoiceFileName;
@@ -23,8 +23,24 @@ export const InvoiceDownloadIcon = ({invoice, ...props}: InvoiceModelProps) => {
   );
 };
 
+export const InvoiceDownloadXmlIcon = ({ invoice, ...props }: InvoiceModelProps) => {
+  const configInvoiceFileName = useSelector((state: ConfacState) => state.config.invoiceFileName);
+
+  const defaultInvoiceFileName = invoice.client.invoiceFileName || configInvoiceFileName;
+  const url = getInvoiceDownloadUrl(defaultInvoiceFileName, invoice, 'xml', 'download');
+  console.log('url: ' + url);
+  console.log('filename: ' + defaultInvoiceFileName);
+  return (
+    <AttachmentDownloadIcon
+      downloadUrl={url}
+      attachment={invoice.attachments.find(a => a.type === 'xml')}
+      {...props}
+    />
+  );
+};
+
 
-export const InvoicePreviewIcon = ({invoice, ...props}: InvoiceModelProps & IconProps) => {
+export const InvoicePreviewIcon = ({ invoice, ...props }: InvoiceModelProps & IconProps) => {
   const configInvoiceFileName = useSelector((state: ConfacState) => state.config.invoiceFileName);
   const defaultInvoiceFileName = invoice.client.invoiceFileName || configInvoiceFileName;
   const fileType = invoice.isQuotation ? 'quotation' : 'invoice';
@@ -46,7 +62,7 @@ type AttachmentPreviewIconProps = {
   title?: string,
 }
 
-export const AttachmentPreviewIcon = ({previewUrl, attachment, ...props}: AttachmentPreviewIconProps) => (
+export const AttachmentPreviewIcon = ({ previewUrl, attachment, ...props }: AttachmentPreviewIconProps) => (
   <Icon title={t(props.title || 'invoice.viewPdf')} href={previewUrl} size={1} fa="far fa-eye" {...props} />
 );
 
@@ -56,12 +72,12 @@ type AttachmentDownloadIconProps = IconProps & {
   downloadUrl: string;
 }
 
-export const AttachmentDownloadIcon = ({downloadUrl, attachment, ...props}: AttachmentDownloadIconProps) => (
+export const AttachmentDownloadIcon = ({ downloadUrl, attachment, ...props }: AttachmentDownloadIconProps) => (
   <Icon
     fa={`${getAwesomeFileType(attachment)} fa-2x`}
-    title={t('invoice.downloadAttachment', attachment && {type: attachment.fileName || attachment.type})}
+    title={t('invoice.downloadAttachment', attachment && { type: attachment.fileName || attachment.type })}
     {...props}
     href={downloadUrl}
-    labelStyle={{fontSize: 16}}
+    labelStyle={{ fontSize: 16 }}
   />
 );
diff --git a/frontend/src/components/invoice/invoice-table/InvoiceListRowActions.tsx b/frontend/src/components/invoice/invoice-table/InvoiceListRowActions.tsx
@@ -3,7 +3,7 @@ import {useDispatch} from 'react-redux';
 import InvoiceModel from '../models/InvoiceModel';
 import {EditIcon} from '../../controls/Icon';
 import {InvoiceVerifyIconToggle} from '../invoice-list/InvoiceVerifyIconToggle';
-import {InvoiceDownloadIcon, InvoicePreviewIcon} from '../../controls/attachments/AttachmentDownloadIcon';
+import { InvoiceDownloadPdfIcon, InvoiceDownloadXmlIcon, InvoicePreviewIcon} from '../../controls/attachments/AttachmentDownloadIcon';
 import {t} from '../../utils';
 import {deleteInvoice} from '../../../actions';
 import {ConfirmedDeleteIcon} from '../../controls/icons/DeleteIcon';
@@ -30,7 +30,8 @@ export const InvoiceListRowActions = ({invoice, toggleValid, small = false}: Inv
         />
       )}
       <InvoiceVerifyIconToggle claim={Claim.ValidateInvoices} invoice={invoice} toggleValid={toggleValid} />
-      {!small && <InvoiceDownloadIcon invoice={invoice} />}
+      {!small && <InvoiceDownloadPdfIcon invoice={invoice} />}
+      {!small && <InvoiceDownloadXmlIcon invoice={invoice} />}
       <InvoicePreviewIcon invoice={invoice} />
       {!small && (
         <ConfirmedDeleteIcon

diff --git a/frontend/src/components/invoice/models/getAwesomeFileType.ts b/frontend/src/components/invoice/models/getAwesomeFileType.ts
@@ -1,6 +1,7 @@
-import {Attachment} from '../../../models';
+import { Attachment } from '../../../models';
 
 export function getAwesomeFileType(att: Attachment | undefined): string {
+  console.log(att);
   if (!att) {
     return 'fa fa-file-upload';
   }
@@ -10,6 +11,9 @@ export function getAwesomeFileType(att: Attachment | undefined): string {
     // --> Looks too busy in the InvoiceList
     // return 'fa fa-file-invoice-dollar';
   }
+  if (att.type === 'xml') {
+    return 'far fa-file-invoice';
+  }
   if (att.fileType === 'application/pdf') {
     return 'far fa-file-pdf';
   }
@@ -46,6 +50,9 @@ export function getAwesomeFileType(att: Attachment | undefined): string {
     case 'application/x-zip-compressed':
       return 'far fa-file-archive';
 
+    case 'application/xml':
+      return 'far fa-file-invoice';
+
     default:
   }
 

diff --git a/frontend/src/components/invoice/models/getInvoiceFeature.tsx b/frontend/src/components/invoice/models/getInvoiceFeature.tsx
@@ -160,7 +160,7 @@ export function getInvoiceColumns(includeFields: string[], transPrefix: string):
   }, {
     key: 'buttons',
     header: '',
-    style: {width: 240},
+    style: {width: 270},
     className: 'icons-cell',
     value: (i: InvoiceModel) => <InvoiceListRowActions invoice={i} />,
   }];