feat: link pdf template to sales transactions

packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomize.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import * as R from 'ramda';
-import { Box } from '@/components';
-import { Classes } from '@blueprintjs/core';
+import { AppToaster, Box } from '@/components';
+import { Classes, Intent } from '@blueprintjs/core';
 import { useFormikContext } from 'formik';
 import {
   InvoicePaperTemplate,
@@ -12,9 +12,51 @@ import { InvoiceCustomizeGeneralField } from './InvoiceCustomizeGeneralFields';
 import { InvoiceCustomizeContentFields } from './InvoiceCutomizeContentFields';
 import { InvoiceCustomizeValues } from './types';
 import { initialValues } from './constants';
+import {
+  useCreatePdfTemplate,
+  useEditPdfTemplate,
+} from '@/hooks/query/pdf-templates';
+import { transformToEditRequest, transformToNewRequest } from './utils';
 
 export default function InvoiceCustomizeContent() {
-  const handleFormSubmit = (values: InvoiceCustomizeValues) => {};
+  const { mutateAsync: createPdfTemplate } = useCreatePdfTemplate();
+  const { mutateAsync: editPdfTemplate } = useEditPdfTemplate();
+
+  const templateId: number = 1;
+
+  const handleFormSubmit = (values: InvoiceCustomizeValues) => {
+    const handleSuccess = (message: string) => {
+      AppToaster.show({
+        intent: Intent.SUCCESS,
+        message,
+      });
+    };
+    const handleError = (message: string) => {
+      AppToaster.show({
+        intent: Intent.DANGER,
+        message,
+      });
+    };
+    if (templateId) {
+      const reqValues = transformToEditRequest(values, templateId);
+
+      // Edit existing template
+      editPdfTemplate({ ...reqValues })
+        .then(() => handleSuccess('PDF template updated successfully!'))
+        .catch(() =>
+          handleError('An error occurred while updating the PDF template.'),
+        );
+    } else {
+      const reqValues = transformToNewRequest(values);
+
+      // Create new template
+      createPdfTemplate(reqValues)
+        .then(() => handleSuccess('PDF template created successfully!'))
+        .catch(() =>
+          handleError('An error occurred while creating the PDF template.'),
+        );
+    }
+  };
 
   return (
     <Box className={Classes.DRAWER_BODY}>

packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/utils.ts

@@ -0,0 +1,24 @@
+import { omit } from 'lodash';
+import { InvoiceCustomizeValues } from './types';
+import { CreatePdfTemplateValues, EditPdfTemplateValues } from '@/hooks/query/pdf-templates';
+
+export const transformToEditRequest = (
+  values: InvoiceCustomizeValues,
+  templateId: number,
+): EditPdfTemplateValues => {
+  return {
+    templateId,
+    templateName: 'Template Name',
+    attributes: omit(values, ['templateName']),
+  };
+};
+
+export const transformToNewRequest = (
+  values: InvoiceCustomizeValues,
+): CreatePdfTemplateValues => {
+  return {
+    resource: 'SaleInvoice',
+    templateName: 'Template Name',
+    attributes: omit(values, ['templateName']),
+  };
+};

packages/webapp/src/hooks/query/pdf-templates.ts

@@ -0,0 +1,131 @@
+import {
+  useMutation,
+  useQuery,
+  UseMutationOptions,
+  UseQueryOptions,
+  UseMutationResult,
+  UseQueryResult,
+} from 'react-query';
+import useApiRequest from '../useRequest';
+
+export interface CreatePdfTemplateValues {
+  templateName: string;
+  resource: string;
+  attributes: Record<string, any>;
+}
+
+export interface CreatePdfTemplateResponse {}
+
+export interface EditPdfTemplateValues {
+  templateId: string | number;
+  templateName: string;
+  attributes: Record<string, any>;
+}
+
+export interface EditPdfTemplateResponse {}
+
+export interface DeletePdfTemplateValues {
+  templateId: number | string;
+}
+
+export interface DeletePdfTemplateResponse {}
+
+export interface GetPdfTemplateValues {}
+
+export interface GetPdfTemplateResponse {}
+
+export interface GetPdfTemplatesValues {}
+
+export interface GetPdfTemplatesResponse {}
+
+// Hook for creating a PDF template
+export const useCreatePdfTemplate = (
+  options?: UseMutationOptions<
+    CreatePdfTemplateResponse,
+    Error,
+    CreatePdfTemplateValues
+  >,
+): UseMutationResult<
+  CreatePdfTemplateResponse,
+  Error,
+  CreatePdfTemplateValues
+> => {
+  const apiRequest = useApiRequest();
+  return useMutation<CreatePdfTemplateResponse, Error, CreatePdfTemplateValues>(
+    (values) =>
+      apiRequest.post('/pdf-templates', values).then((res) => res.data),
+    options,
+  );
+};
+
+// Hook for editing a PDF template
+export const useEditPdfTemplate = (
+  options?: UseMutationOptions<
+    EditPdfTemplateResponse,
+    Error,
+    { templateId: number; values: EditPdfTemplateValues }
+  >,
+): UseMutationResult<
+  EditPdfTemplateResponse,
+  Error,
+  { templateId: number; values: EditPdfTemplateValues }
+> => {
+  const apiRequest = useApiRequest();
+  return useMutation<
+    EditPdfTemplateResponse,
+    Error,
+    { templateId: number; values: EditPdfTemplateValues }
+  >(
+    ({ templateId, values }) =>
+      apiRequest
+        .put(`/pdf-templates/${templateId}`, values)
+        .then((res) => res.data),
+    options,
+  );
+};
+
+// Hook for deleting a PDF template
+export const useDeletePdfTemplate = (
+  options?: UseMutationOptions<
+    DeletePdfTemplateResponse,
+    Error,
+    { templateId: number }
+  >,
+): UseMutationResult<
+  DeletePdfTemplateResponse,
+  Error,
+  { templateId: number }
+> => {
+  const apiRequest = useApiRequest();
+  return useMutation<DeletePdfTemplateResponse, Error, { templateId: number }>(
+    ({ templateId }) =>
+      apiRequest.delete(`/pdf-templates/${templateId}`).then((res) => res.data),
+    options,
+  );
+};
+
+// Hook for getting a single PDF template
+export const useGetPdfTemplate = (
+  templateId: number,
+  options?: UseQueryOptions<GetPdfTemplateResponse, Error>,
+): UseQueryResult<GetPdfTemplateResponse, Error> => {
+  const apiRequest = useApiRequest();
+  return useQuery<GetPdfTemplateResponse, Error>(
+    ['pdfTemplate', templateId],
+    () =>
+      apiRequest.get(`/pdf-templates/${templateId}`).then((res) => res.data),
+    options,
+  );
+};
+
+// Hook for getting multiple PDF templates
+export const useGetPdfTemplates = (
+  options?: UseQueryOptions<GetPdfTemplatesResponse, Error>,
+): UseQueryResult<GetPdfTemplatesResponse, Error> => {
+  const apiRequest = useApiRequest();
+  return useQuery<GetPdfTemplatesResponse, Error>(
+    'pdfTemplates',
+    () => apiRequest.get('/pdf-templates').then((res) => res.data),
+    options,
+  );
+};