chore: [UIE-9926] - Bump jspdf to 4.0.0

packages/manager/.changeset/pr-13248-tech-stories-1767787781583.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Tech Stories
+---
+
+Bump jspdf to 4.0.0 ([#13248](https://github.com/linode/manager/pull/13248))

packages/manager/package.json

@@ -59,7 +59,7 @@
     "he": "^1.2.0",
     "immer": "^9.0.6",
     "ipaddr.js": "^1.9.1",
-    "jspdf": "^3.0.2",
+    "jspdf": "^4.0.0",
     "jspdf-autotable": "^5.0.2",
     "launchdarkly-react-client-sdk": "3.0.10",
     "libphonenumber-js": "^1.10.6",
@@ -140,7 +140,6 @@
     "@types/eslint-plugin-jsx-a11y": "^6.10.0",
     "@types/he": "^1.1.0",
     "@types/history": "4",
-    "@types/jspdf": "^1.3.3",
     "@types/luxon": "3.4.2",
     "@types/markdown-it": "^14.1.2",
     "@types/md5": "^2.1.32",

packages/manager/src/dev-tools/utils.ts

@@ -92,9 +92,9 @@ export const saveSeedsCountMap = (countMap: { [key: string]: number }) => {
 /**
  * Retrieves the presets map from local storage.
  */
-export const getExtraPresetsMap = (): {
+export const getExtraPresetsMap = (): Partial<{
   [K in MockPresetExtraId]: number;
-} => {
+}> => {
   const encodedPresetsMap = localStorage.getItem(LOCAL_STORAGE_PRESETS_MAP_KEY);
 
   return encodedPresetsMap ? JSON.parse(encodedPresetsMap) : {};

packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.tsx

@@ -282,7 +282,7 @@ export const BillingActivityPanel = React.memo((props: Props) => {
   );
 
   const downloadPaymentPDF = React.useCallback(
-    (paymentId: number) => {
+    async (paymentId: number) => {
       const payment = payments?.find(
         (thisPayment) => thisPayment.id === paymentId
       );
@@ -305,7 +305,7 @@ export const BillingActivityPanel = React.memo((props: Props) => {
         taxes?.date,
         taxes?.country_tax
       );
-      const result = printPayment(account, payment, countryTax);
+      const result = await printPayment(account, payment, countryTax);
 
       if (result.status === 'error') {
         pdfErrors.add(id);

packages/manager/src/features/Billing/PdfGenerator/PdfGenerator.test.ts

@@ -470,7 +470,12 @@ describe('PdfGenerator', () => {
         });
 
         // Call the printPayment function
-        const pdfResult = printPayment(account, payment, countryTax, timezone);
+        const pdfResult = await printPayment(
+          account,
+          payment,
+          countryTax,
+          timezone
+        );
 
         // Expect the PDF generation to be successful
         expect(pdfResult.status).toEqual('success');

packages/manager/src/features/Billing/PdfGenerator/PdfGenerator.ts

@@ -179,15 +179,15 @@ const addTitle = (doc: jsPDF, y: number, ...textStrings: Title[]) => {
 };
 
 // M3-6177 only make one request to get the logo
-const getAkamaiLogo = () => {
-  return axios
-    .get(AkamaiLogo, { responseType: 'blob' })
-    .then((res) => {
-      return URL.createObjectURL(res.data);
-    })
-    .catch(() => {
-      return AkamaiLogo;
-    });
+const getAkamaiLogo = async () => {
+  const response = await axios.get(AkamaiLogo, { responseType: 'blob' });
+
+  return new Promise<string>((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onloadend = () => resolve(reader.result as string);
+    reader.onerror = reject;
+    reader.readAsDataURL(response.data);
+  });
 };
 
 interface PrintInvoiceOptions {
@@ -324,12 +324,12 @@ export const printInvoice = async (
   }
 };
 
-export const printPayment = (
+export const printPayment = async (
   account: Account,
   payment: Payment,
   countryTax?: TaxDetail,
   timezone?: string
-): PdfResult => {
+): Promise<PdfResult> => {
   try {
     const date = formatDate(payment.date, {
       displayTime: true,
@@ -340,7 +340,8 @@ export const printPayment = (
     });
     doc.setFontSize(10);
 
-    doc.addImage(AkamaiLogo, 'JPEG', 160, 10, 120, 40, undefined, 'MEDIUM');
+    const AkamaiLogoURL = await getAkamaiLogo();
+    doc.addImage(AkamaiLogoURL, 'JPEG', 160, 10, 120, 40, undefined, 'MEDIUM');
 
     const leftHeaderYPosition = addLeftHeader(
       doc,